@teamix/pro 1.5.11-beta.1 → 1.5.11

package/es/actions/index.d.ts

@@ -77,8 +77,8 @@ export declare type ProActionGroupProps = {
     icon?: React.ReactNode;
 } & React.HTMLAttributes<HTMLElement>;
 export declare function ProActionGroup(props: ProActionGroupProps): JSX.Element;
-declare const _default: React.MemoExoticComponent<(props: ProActionProps) => JSX.Element>;
-export default _default;
+declare const ProAction: (props: ProActionProps) => JSX.Element;
+export default ProAction;
 export * from './quick';
 /**
  * @deprecated 建议使用 ProActionGroup 代替

package/es/actions/index.js

@@ -420,7 +420,7 @@ export function ProActionGroup(props) {
 var ProAction = function ProAction(props) {
   return renderCommonActionButton(props);
 };
-export default /*#__PURE__*/React.memo(ProAction);
+export default ProAction;
 export * from './quick';
 /**
  * @deprecated 建议使用 ProActionGroup 代替

package/es/index.d.ts

@@ -28,5 +28,5 @@ export * from './table';
 export * from './sidebar';
 export * from './utils';
 export * from './timeline';
-declare const version = "1.5.10";
+declare const version = "1.5.11";
 export { version, ProAction, ProCard, ProField, ProForm, ProInfo, ProPageContainer, ProPageHeader, ProSkeleton, ProTable, ProSidebar, ProTimeline, TeamixIcon, hooks, nocode, templates, utils, };

package/es/index.js

@@ -35,7 +35,7 @@ export * from './table';
 export * from './sidebar';
 export * from './utils';
 export * from './timeline';
-var version = '1.5.10';
+var version = '1.5.11';
 // By TeamixTest
 window.postMessage({
   source: 'teamix-test-devtools',

package/es/page-header/index.d.ts

@@ -54,8 +54,8 @@ export declare type ProPageHeaderProps = {
     /** 切换 tabs */
     tabs?: CapsuleTabType;
 } & Omit<React.HTMLAttributes<HTMLElement>, 'title'>;
-declare const _default: React.NamedExoticComponent<ProPageHeaderProps>;
-export default _default;
+declare const ProPageHeader: React.FC<ProPageHeaderProps>;
+export default ProPageHeader;
 /**
  * @deprecated 建议使用 ProPageHeaderBreadcrumbItem 代替
  */

package/es/page-header/index.js

@@ -215,4 +215,4 @@ var ProPageHeader = function ProPageHeader(props) {
     className: classnames(cls('section'), cls('info'))
   }, /*#__PURE__*/React.createElement(React.Fragment, null, !loading && renderInfo(info), loading && /*#__PURE__*/React.createElement(ProSkeletonRaw.Info.Header, null))), children);
 };
-export default /*#__PURE__*/React.memo(ProPageHeader);
+export default ProPageHeader;

package/es/sidebar/index.d.ts

@@ -4,6 +4,6 @@ import { ProSidebarProps } from './typing';
 export * from './typing';
 export * from './utils';
 import ProIconSwitch from './components/tree-node/components/IconSwitch';
-declare const _default: React.NamedExoticComponent<ProSidebarProps>;
-export default _default;
+declare const ProSidebar: React.FC<ProSidebarProps>;
+export default ProSidebar;
 export { ProIconSwitch };

package/es/sidebar/index.js

@@ -179,5 +179,5 @@ var ProSidebar = function ProSidebar(props) {
     onDataSourceChange: onDataSourceChange
   }, treeProps))));
 };
-export default /*#__PURE__*/React.memo(ProSidebar);
+export default ProSidebar;
 export { ProIconSwitch };

package/es/sidebar/utils/index.d.ts

@@ -118,7 +118,7 @@ export declare function getTreeNodeProps(item: ProSidebarDataSourceItem): {
         style?: import("react").CSSProperties | undefined;
         tabIndex?: number | undefined;
         title?: string | undefined;
-        translate?: "no" | "yes" | undefined;
+        translate?: "yes" | "no" | undefined;
         radioGroup?: string | undefined;
         role?: import("react").AriaRole | undefined;
         about?: string | undefined;
@@ -141,7 +141,7 @@ export declare function getTreeNodeProps(item: ProSidebarDataSourceItem): {
         results?: number | undefined;
         security?: string | undefined;
         unselectable?: "on" | "off" | undefined;
-        inputMode?: "url" | "none" | "text" | "search" | "email" | "tel" | "numeric" | "decimal" | undefined;
+        inputMode?: "url" | "none" | "text" | "search" | "tel" | "email" | "numeric" | "decimal" | undefined;
         is?: string | undefined;
         'aria-activedescendant'?: string | undefined;
         'aria-atomic'?: (boolean | "false" | "true") | undefined;

package/es/skeleton/index.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
+import ProSkeleton from '@teamix/pro-skeleton';
 export * from '@teamix/pro-skeleton';
-declare const _default: React.MemoExoticComponent<(props: import("@teamix/pro-skeleton").ProSkeletonProps) => JSX.Element>;
-export default _default;
+export default ProSkeleton;

package/es/skeleton/index.js

@@ -1,4 +1,3 @@
 import ProSkeleton from '@teamix/pro-skeleton';
-import React from 'react';
 export * from '@teamix/pro-skeleton';
-export default /*#__PURE__*/React.memo(ProSkeleton);
+export default ProSkeleton;

package/es/table/components/ToolBar/FilterColumnIcon.js

@@ -18,7 +18,7 @@ import { Button, Dropdown, Menu, Dialog, Grid, Checkbox } from '@alicloudfe/comp
 import TeamixIcon from '@teamix/icon';
 import { usePrefixCls, getMessage, getGlobalConfig } from '@teamix/utils';
 import React, { useState, useEffect } from 'react';
-import { cloneDeep, off, on } from '../../utils';
+import { off, on } from '../../utils';
 import { Ellipsis } from '../../../field';
 import './index.scss';
 var CheckboxItem = Menu.CheckboxItem;
@@ -80,9 +80,11 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
         var showDataIndex = stateFilterColumns.map(function (item) {
           return item.dataIndex;
         });
-        var stateColumns = cloneDeep(processColumns(columns)).map(function (item) {
+        var stateColumns = processColumns(columns).map(function (item) {
           if (!showDataIndex.includes(item.dataIndex)) {
-            item.columnFilters = false;
+            return _objectSpread(_objectSpread({}, item), {}, {
+              columnFilters: false
+            });
           }
           return item;
         });
@@ -103,11 +105,11 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
   // 全选
   var onChangeAllColumns = function onChangeAllColumns(check) {
     setAllVisible(check);
-    var keyNewColumns = cloneDeep(newColumns);
-    keyNewColumns.map(function (item) {
+    var keyNewColumns = newColumns.map(function (item) {
       var _item$columnFiltersDi;
-      item.columnFilters = (_item$columnFiltersDi = item.columnFiltersDisabled) !== null && _item$columnFiltersDi !== void 0 ? _item$columnFiltersDi : check;
-      return item;
+      return _objectSpread(_objectSpread({}, item), {}, {
+        columnFilters: (_item$columnFiltersDi = item.columnFiltersDisabled) !== null && _item$columnFiltersDi !== void 0 ? _item$columnFiltersDi : check
+      });
     });
     notifyTableRender(keyNewColumns);
   };
@@ -119,10 +121,12 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
   };
   // 修改
   var onChangeColumns = function onChangeColumns(check, dataIndex) {
-    var keyNewColumns = cloneDeep(newColumns);
-    keyNewColumns.map(function (item) {
+    var keyNewColumns = newColumns.map(function (item) {
       if (item.dataIndex === dataIndex) {
         item.columnFilters = check;
+        return _objectSpread(_objectSpread({}, item), {}, {
+          columnFilters: check
+        });
       }
       return item;
     });
@@ -130,26 +134,25 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
   };
   // 修改：dialog
   var onChangeColumnsForDialog = function onChangeColumnsForDialog() {
-    var keyNewColumns = cloneDeep(newColumns);
-    notifyTableRender(keyNewColumns);
+    notifyTableRender(newColumns);
     setDropdownVisible(false);
   };
   // 向上
   var moveUp = function moveUp(e, dataIndex) {
     var _newColumns$filter, _newColumns$filter2;
     e.stopPropagation();
-    var keyNewColumns = cloneDeep(newColumns).filter(function (_ref) {
+    var keyNewColumns = _toConsumableArray(newColumns).filter(function (_ref) {
       var lock = _ref.lock;
       return !lock;
     });
-    var headLock = cloneDeep((_newColumns$filter = newColumns.filter(function (_ref2) {
+    var headLock = (_newColumns$filter = newColumns.filter(function (_ref2) {
       var lock = _ref2.lock;
       return lock === true || lock === 'left';
-    })) !== null && _newColumns$filter !== void 0 ? _newColumns$filter : []);
-    var tailLock = cloneDeep((_newColumns$filter2 = newColumns.filter(function (_ref3) {
+    })) !== null && _newColumns$filter !== void 0 ? _newColumns$filter : [];
+    var tailLock = (_newColumns$filter2 = newColumns.filter(function (_ref3) {
       var lock = _ref3.lock;
       return lock === 'right';
-    })) !== null && _newColumns$filter2 !== void 0 ? _newColumns$filter2 : []);
+    })) !== null && _newColumns$filter2 !== void 0 ? _newColumns$filter2 : [];
     var index = keyNewColumns.findIndex(function (_ref4) {
       var index = _ref4.dataIndex;
       return index === dataIndex;
@@ -165,18 +168,18 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
   var moveDown = function moveDown(e, dataIndex) {
     var _newColumns$filter3, _newColumns$filter4;
     e.stopPropagation();
-    var keyNewColumns = cloneDeep(newColumns).filter(function (_ref5) {
+    var keyNewColumns = _toConsumableArray(newColumns).filter(function (_ref5) {
       var lock = _ref5.lock;
       return !lock;
     });
-    var headLock = cloneDeep((_newColumns$filter3 = newColumns.filter(function (_ref6) {
+    var headLock = (_newColumns$filter3 = newColumns.filter(function (_ref6) {
       var lock = _ref6.lock;
       return lock === true || lock === 'left';
-    })) !== null && _newColumns$filter3 !== void 0 ? _newColumns$filter3 : []);
-    var tailLock = cloneDeep((_newColumns$filter4 = newColumns.filter(function (_ref7) {
+    })) !== null && _newColumns$filter3 !== void 0 ? _newColumns$filter3 : [];
+    var tailLock = (_newColumns$filter4 = newColumns.filter(function (_ref7) {
       var lock = _ref7.lock;
       return lock === 'right';
-    })) !== null && _newColumns$filter4 !== void 0 ? _newColumns$filter4 : []);
+    })) !== null && _newColumns$filter4 !== void 0 ? _newColumns$filter4 : [];
     var index = keyNewColumns.findIndex(function (_ref8) {
       var index = _ref8.dataIndex;
       return index === dataIndex;
@@ -329,9 +332,11 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
           return key === dataIndex;
         })) === null || _newColumns$find2 === void 0 ? void 0 : _newColumns$find2.columnFilters,
         onChange: function onChange(check) {
-          var columnsList = cloneDeep(newColumns).map(function (item) {
+          var columnsList = newColumns.map(function (item) {
             if (item.dataIndex === dataIndex) {
-              item.columnFilters = check;
+              return _objectSpread(_objectSpread({}, item), {}, {
+                columnFilters: check
+              });
             }
             return item;
           });

package/es/table/components/ToolBar/RefreshIcon.js

@@ -1,41 +1,179 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 /**
  * 刷新
  */
-import { Button, Balloon } from '@alicloudfe/components';
+import { Button, Balloon, Menu, Dropdown } from '@alicloudfe/components';
 import TeamixIcon from '@teamix/icon';
 import { usePrefixCls, getMessage } from '@teamix/utils';
-import React from 'react';
+import React, { useEffect, useRef, useState } from 'react';
+import { on } from '../../utils';
 import './index.scss';
 var cls = usePrefixCls('teamix-pro-table-toolbar-icon');
 var LayoutIcon = function LayoutIcon(props) {
-  var actionRef = props.actionRef;
-  // const [fullscreen, setFullscreen] = useState<boolean>(false);
-  // // 销毁监听函数
-  // useEffect(() => {
-  //   return () => {
-  //     actionRef.current?.off?.('refreshIcon');
-  //   };
-  // }, []);
-  // // 监听全屏变化
-  // actionRef.current?.on?.(
-  //   (state: boolean) => {
-  //     setFullscreen(state);
-  //   },
-  //   'fullScreenState',
-  //   'refreshIcon',
-  // );
+  var _autoRefreshProps$dat;
+  var actionRef = props.actionRef,
+    autoRefresh = props.autoRefresh,
+    autoRefreshProps = props.autoRefreshProps;
+  var autoRefreshRadio = (_autoRefreshProps$dat = autoRefreshProps === null || autoRefreshProps === void 0 ? void 0 : autoRefreshProps.dataSource) !== null && _autoRefreshProps$dat !== void 0 ? _autoRefreshProps$dat : [{
+    label: '每 1 分钟',
+    value: 60000
+  }, {
+    label: '每 3 分钟',
+    value: 180000
+  }, {
+    label: '每 5 分钟',
+    value: 300000
+  }];
+  // dropdown 开关
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    dropdownVisible = _useState2[0],
+    setDropdownVisible = _useState2[1];
+  // 自动刷新状态
+  var _useState3 = useState(!!autoRefresh),
+    _useState4 = _slicedToArray(_useState3, 2),
+    autoRefreshVisible = _useState4[0],
+    setAutoRefreshVisible = _useState4[1];
+  // 间隔时间 ms
+  var _useState5 = useState(60000),
+    _useState6 = _slicedToArray(_useState5, 2),
+    times = _useState6[0],
+    setTimes = _useState6[1];
+  // 展示计时器时间 s
+  var _useState7 = useState(60),
+    _useState8 = _slicedToArray(_useState7, 2),
+    remainTime = _useState8[0],
+    setRemainTime = _useState8[1];
+  // 循环计时器
+  var timerRef = useRef({
+    timer: undefined,
+    remain: 60
+  });
+  useEffect(function () {
+    on(function (timer) {
+      setTimes(timer);
+      timerRef.current.remain = timer / 1000;
+      if (timerRef.current.timer) {
+        clearInterval(timerRef.current.timer);
+        timerRef.current.timer = undefined;
+      }
+      timerRef.current.timer = setInterval(function () {
+        var remainTime = timerRef.current.remain - 1;
+        if (remainTime >= 0) {
+          setRemainTime(remainTime);
+          timerRef.current.remain = remainTime;
+        }
+      }, 1000);
+    }, 'PRO_TABLE_REFRESH_TIMER_FLAG');
+  }, []);
+  // 下拉菜单显示隐藏回调
+  var onDropdownVisibleChange = function onDropdownVisibleChange(state) {
+    setDropdownVisible(state);
+  };
+  // 自动刷新开启关闭回调
+  var onAutoRefreshChange = function onAutoRefreshChange(visible) {
+    if (visible) {
+      var _actionRef$current, _actionRef$current$se;
+      (_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 ? void 0 : (_actionRef$current$se = _actionRef$current.setAutoRefreshTimers) === null || _actionRef$current$se === void 0 ? void 0 : _actionRef$current$se.call(_actionRef$current, times);
+    } else {
+      var _actionRef$current2, _actionRef$current2$c;
+      (_actionRef$current2 = actionRef.current) === null || _actionRef$current2 === void 0 ? void 0 : (_actionRef$current2$c = _actionRef$current2.clearAutoRefreshTimers) === null || _actionRef$current2$c === void 0 ? void 0 : _actionRef$current2$c.call(_actionRef$current2);
+      if (timerRef.current.timer) {
+        clearInterval(timerRef.current.timer);
+        timerRef.current.timer = undefined;
+        timerRef.current.remain = times / 1000;
+        setRemainTime(times / 1000);
+      }
+    }
+    setAutoRefreshVisible(visible);
+  };
+  // 手动刷新回调
+  var onManualRefresh = function onManualRefresh() {
+    var _actionRef$current3, _actionRef$current3$r;
+    (_actionRef$current3 = actionRef.current) === null || _actionRef$current3 === void 0 ? void 0 : (_actionRef$current3$r = _actionRef$current3.refresh) === null || _actionRef$current3$r === void 0 ? void 0 : _actionRef$current3$r.call(_actionRef$current3);
+    onDropdownVisibleChange(false);
+  };
+  // 选择间隔时间回调
+  var onTimeRadioChange = function onTimeRadioChange(timer) {
+    var _actionRef$current4, _actionRef$current4$s;
+    setTimes(timer);
+    (_actionRef$current4 = actionRef.current) === null || _actionRef$current4 === void 0 ? void 0 : (_actionRef$current4$s = _actionRef$current4.setAutoRefreshTimers) === null || _actionRef$current4$s === void 0 ? void 0 : _actionRef$current4$s.call(_actionRef$current4, timer);
+  };
+  // 渲染刷新图标
+  var renderRefreshIcon = function renderRefreshIcon() {
+    if (!!autoRefresh && autoRefreshVisible && typeof autoRefresh !== 'function') {
+      return /*#__PURE__*/React.createElement(TeamixIcon, {
+        size: "small",
+        type: "auto-refresh-on-line"
+      });
+    }
+    if (!!autoRefresh && !autoRefreshVisible && typeof autoRefresh !== 'function') {
+      return /*#__PURE__*/React.createElement(TeamixIcon, {
+        size: "small",
+        type: "auto-refresh-off-line"
+      });
+    }
+    return /*#__PURE__*/React.createElement(TeamixIcon, {
+      size: "small",
+      type: "refresh-line"
+    });
+  };
+  // 渲染 Radio
+  var renderRadio = autoRefreshRadio.map(function (item) {
+    return /*#__PURE__*/React.createElement(Menu.RadioItem, {
+      className: cls('time-radio'),
+      key: item.value,
+      disabled: !autoRefreshVisible,
+      checked: times === item.value,
+      onChange: function onChange() {
+        var _item$value;
+        return onTimeRadioChange((_item$value = item === null || item === void 0 ? void 0 : item.value) !== null && _item$value !== void 0 ? _item$value : 0);
+      }
+    }, item.label);
+  });
+  if (autoRefresh && typeof autoRefresh !== 'function') {
+    return /*#__PURE__*/React.createElement(Dropdown, {
+      trigger: /*#__PURE__*/React.createElement(Button, {
+        iconSize: "small",
+        className: cls()
+      }, renderRefreshIcon()),
+      visible: dropdownVisible,
+      onVisibleChange: onDropdownVisibleChange,
+      followTrigger: true,
+      cache: true,
+      triggerType: ['click'],
+      align: "tr br"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: cls()
+    }, /*#__PURE__*/React.createElement(Menu, {
+      className: cls('auto-refresh')
+    }, /*#__PURE__*/React.createElement(Menu.CheckboxItem, {
+      checked: autoRefreshVisible,
+      onChange: onAutoRefreshChange
+    }, getMessage('autoRefresh'), autoRefreshVisible && /*#__PURE__*/React.createElement("span", null, "\uFF08", remainTime, "s\uFF09")), renderRadio, /*#__PURE__*/React.createElement(Menu.Divider, {
+      key: "divider"
+    }), /*#__PURE__*/React.createElement("div", {
+      className: cls('manual-refresh')
+    }, /*#__PURE__*/React.createElement(Button, {
+      type: "primary",
+      text: true,
+      onClick: onManualRefresh
+    }, getMessage('manualRefresh'))))));
+  }
   return /*#__PURE__*/React.createElement(Balloon.Tooltip, {
     trigger: /*#__PURE__*/React.createElement(Button, {
       iconSize: "small",
       className: cls(),
       onClick: function onClick() {
-        var _actionRef$current, _actionRef$current$re;
-        return (_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 ? void 0 : (_actionRef$current$re = _actionRef$current.refresh) === null || _actionRef$current$re === void 0 ? void 0 : _actionRef$current$re.call(_actionRef$current);
+        var _actionRef$current5, _actionRef$current5$r;
+        return (_actionRef$current5 = actionRef.current) === null || _actionRef$current5 === void 0 ? void 0 : (_actionRef$current5$r = _actionRef$current5.refresh) === null || _actionRef$current5$r === void 0 ? void 0 : _actionRef$current5$r.call(_actionRef$current5);
       }
-    }, /*#__PURE__*/React.createElement(TeamixIcon, {
-      size: "small",
-      type: "refresh-line"
-    })),
+    }, renderRefreshIcon()),
     align: "t"
   }, getMessage('refresh'));
 };

package/es/table/components/ToolBar/index.scss

@@ -158,3 +158,20 @@
     padding-right: 8px;
   }
 }
+
+// refresh
+.teamix-pro-table-toolbar-icon {
+  &-auto-refresh {
+    width: 145px;
+  }
+
+  &-manual-refresh {
+    text-align: center;
+    line-height: 1;
+    margin-bottom: 2px;
+  }
+
+  .teamix-pro-table-toolbar-icon-time-radio.teamix-pro-table-toolbar-icon-time-radio.teamix-pro-table-toolbar-icon-time-radio {
+    padding-left: 32px;
+  }
+}

package/es/table/index.d.ts

@@ -1,6 +1,5 @@
-import React from 'react';
 import { ProTableProps } from './typing';
 import './index.scss';
 export * from './typing';
-declare const _default: React.MemoExoticComponent<(props: ProTableProps) => JSX.Element>;
-export default _default;
+declare const ProTable: (props: ProTableProps) => JSX.Element;
+export default ProTable;