@ant-design/pro-components 3.0.2-0 → 3.1.1-0

package/lib/table/components/ListToolBar/style.js

@@ -1,135 +1,144 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useStyle = useStyle;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _provider = require("../../../provider");
-var genProListStyle = function genProListStyle(token) {
-  return (0, _defineProperty2.default)({}, token.componentCls, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
-    lineHeight: '1',
-    '&-container': {
-      display: 'flex',
-      justifyContent: 'space-between',
-      paddingBlock: token.padding,
-      paddingInline: 0,
-      '&-mobile': {
-        flexDirection: 'column'
-      }
-    },
-    '&-title': {
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'flex-start',
-      color: token.colorTextHeading,
-      fontWeight: '500',
-      fontSize: token.fontSizeLG
-    },
-    '&-search:not(:last-child)': {
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'flex-start'
-    },
-    '&-setting-item': {
-      marginBlock: 0,
-      marginInline: 4,
-      color: token.colorIconHover,
-      fontSize: token.fontSizeLG,
-      cursor: 'pointer',
-      '> span': {
-        display: 'block',
-        width: '100%',
-        height: '100%'
+const genProListStyle = token => {
+  return {
+    [token.componentCls]: {
+      lineHeight: '1',
+      '&-container': {
+        display: 'flex',
+        justifyContent: 'space-between',
+        paddingBlock: token.padding,
+        paddingInline: 0,
+        '&-mobile': {
+          flexDirection: 'column'
+        }
       },
-      '&:hover': {
-        color: token.colorPrimary
-      }
-    },
-    '&-left': (0, _defineProperty2.default)((0, _defineProperty2.default)({
-      display: 'flex',
-      flexWrap: 'wrap',
-      alignItems: 'center',
-      gap: token.marginXS,
-      justifyContent: 'flex-start',
-      maxWidth: 'calc(100% - 200px)'
-    }, "".concat(token.antCls, "-tabs"), {
-      width: '100%'
-    }), '&-has-tabs', {
-      overflow: 'hidden'
-    }),
-    '&-right': {
-      flex: 1,
-      display: 'flex',
-      flexWrap: 'wrap',
-      justifyContent: 'flex-end',
-      gap: token.marginXS
-    },
-    '&-extra-line': {
-      marginBlockEnd: token.margin
-    },
-    '&-setting-items': {
-      display: 'flex',
-      gap: token.marginXS,
-      lineHeight: '32px',
-      alignItems: 'center'
-    },
-    '&-filter': (0, _defineProperty2.default)({
-      '&:not(:last-child)': {
-        marginInlineEnd: token.margin
+      '&-title': {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'flex-start',
+        color: token.colorTextHeading,
+        fontWeight: '500',
+        fontSize: token.fontSizeLG
+      },
+      '&-search:not(:last-child)': {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'flex-start'
+      },
+      '&-setting-item': {
+        marginBlock: 0,
+        marginInline: 4,
+        color: token.colorIconHover,
+        fontSize: token.fontSizeLG,
+        cursor: 'pointer',
+        '> span': {
+          display: 'block',
+          width: '100%',
+          height: '100%'
+        },
+        '&:hover': {
+          color: token.colorPrimary
+        }
+      },
+      '&-left': {
+        display: 'flex',
+        flexWrap: 'wrap',
+        alignItems: 'center',
+        gap: token.marginXS,
+        justifyContent: 'flex-start',
+        maxWidth: 'calc(100% - 200px)',
+        [`${token.antCls}-tabs`]: {
+          width: '100%'
+        },
+        '&-has-tabs': {
+          overflow: 'hidden'
+        }
+      },
+      '&-right': {
+        flex: 1,
+        display: 'flex',
+        flexWrap: 'wrap',
+        justifyContent: 'flex-end',
+        gap: token.marginXS
+      },
+      '&-extra-line': {
+        marginBlockEnd: token.margin
+      },
+      '&-setting-items': {
+        display: 'flex',
+        gap: token.marginXS,
+        lineHeight: '32px',
+        alignItems: 'center'
       },
-      display: 'flex',
-      alignItems: 'center'
-    }, "div$".concat(token.antCls, "-pro-table-search"), {
-      marginBlock: 0,
-      marginInline: 0,
-      paddingBlock: 0,
-      paddingInline: 0
-    }),
-    '&-inline-menu-item': {
-      display: 'inline-block',
-      marginInlineEnd: token.marginLG,
-      cursor: 'pointer',
-      opacity: '0.75',
-      '&-active': {
+      '&-filter': {
+        '&:not(:last-child)': {
+          marginInlineEnd: token.margin
+        },
+        display: 'flex',
+        alignItems: 'center',
+        [`div$${token.antCls}-pro-table-search`]: {
+          marginBlock: 0,
+          marginInline: 0,
+          paddingBlock: 0,
+          paddingInline: 0
+        }
+      },
+      '&-inline-menu-item': {
+        display: 'inline-block',
+        marginInlineEnd: token.marginLG,
+        cursor: 'pointer',
+        opacity: '0.75',
+        '&-active': {
+          fontWeight: 'bold',
+          opacity: '1'
+        }
+      },
+      [`${token.antCls}-tabs-top > ${token.antCls}-tabs-nav`]: {
+        marginBlockEnd: 0,
+        '&::before': {
+          borderBlockEnd: 0
+        },
+        [`${token.antCls}-tabs-nav-list`]: {
+          marginBlockStart: 0,
+          '${token.antCls}-tabs-tab': {
+            paddingBlockStart: 0
+          }
+        }
+      },
+      '&-dropdownmenu-label': {
         fontWeight: 'bold',
-        opacity: '1'
+        fontSize: token.fontSizeIcon,
+        textAlign: 'center',
+        cursor: 'pointer'
+      },
+      '@media (max-width: 768px)': {
+        [token.componentCls]: {
+          '&-container': {
+            display: 'flex',
+            flexWrap: 'wrap',
+            flexDirection: 'column'
+          },
+          '&-left': {
+            marginBlockEnd: '16px',
+            maxWidth: '100%'
+          }
+        }
       }
     }
-  }, "".concat(token.antCls, "-tabs-top > ").concat(token.antCls, "-tabs-nav"), (0, _defineProperty2.default)({
-    marginBlockEnd: 0,
-    '&::before': {
-      borderBlockEnd: 0
-    }
-  }, "".concat(token.antCls, "-tabs-nav-list"), {
-    marginBlockStart: 0,
-    '${token.antCls}-tabs-tab': {
-      paddingBlockStart: 0
-    }
-  })), '&-dropdownmenu-label', {
-    fontWeight: 'bold',
-    fontSize: token.fontSizeIcon,
-    textAlign: 'center',
-    cursor: 'pointer'
-  }), '@media (max-width: 768px)', (0, _defineProperty2.default)({}, token.componentCls, {
-    '&-container': {
-      display: 'flex',
-      flexWrap: 'wrap',
-      flexDirection: 'column'
-    },
-    '&-left': {
-      marginBlockEnd: '16px',
-      maxWidth: '100%'
-    }
-  })));
+  };
 };
 function useStyle(prefixCls) {
-  return (0, _provider.useStyle)('ProTableListToolBar', function (token) {
-    var proListToken = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, token), {}, {
-      componentCls: ".".concat(prefixCls)
-    });
+  return (0, _provider.useStyle)('ProTableListToolBar', token => {
+    const proListToken = {
+      ...token,
+      componentCls: `.${prefixCls}`
+    };
     return [genProListStyle(proListToken)];
   });
 }

package/lib/table/components/ToolBar/DensityIcon.js

@@ -11,18 +11,19 @@ var _react = _interopRequireWildcard(require("react"));
 var _provider = require("../../../provider");
 var _Provide = require("../../Store/Provide");
 var _jsxRuntime = require("react/jsx-runtime");
-var DensityIcon = function DensityIcon(props) {
-  var _props$icon = props.icon,
-    icon = _props$icon === void 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ColumnHeightOutlined, {}) : _props$icon;
-  var counter = (0, _react.useContext)(_Provide.TableContext);
-  var intl = (0, _provider.useIntl)();
+const DensityIcon = props => {
+  const {
+    icon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ColumnHeightOutlined, {})
+  } = props;
+  const counter = (0, _react.useContext)(_Provide.TableContext);
+  const intl = (0, _provider.useIntl)();
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Dropdown, {
     menu: {
       selectedKeys: [counter.tableSize],
-      onClick: function onClick(_ref) {
-        var _counter$setTableSize;
-        var key = _ref.key;
-        (_counter$setTableSize = counter.setTableSize) === null || _counter$setTableSize === void 0 || _counter$setTableSize.call(counter, key);
+      onClick: ({
+        key
+      }) => {
+        counter.setTableSize?.(key);
       },
       style: {
         width: 80

package/lib/table/components/ToolBar/FullscreenIcon.js

@@ -1,29 +1,24 @@
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _icons = require("@ant-design/icons");
 var _antd = require("antd");
 var _react = _interopRequireWildcard(require("react"));
 var _provider = require("../../../provider");
 var _utils = require("../../../utils");
 var _jsxRuntime = require("react/jsx-runtime");
-var FullScreenIcon = function FullScreenIcon() {
-  var intl = (0, _provider.useIntl)();
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    fullscreen = _useState2[0],
-    setFullscreen = _useState2[1];
-  (0, _react.useEffect)(function () {
+const FullScreenIcon = () => {
+  const intl = (0, _provider.useIntl)();
+  const [fullscreen, setFullscreen] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
     if (!(0, _utils.isBrowser)()) {
       return;
     }
-    document.onfullscreenchange = function () {
+    document.onfullscreenchange = () => {
       setFullscreen(!!document.fullscreenElement);
     };
   }, []);

package/lib/table/components/ToolBar/index.d.ts

@@ -58,11 +58,5 @@ export type ToolbarRenderProps<T> = {
     toolBarRender?: ToolBarProps<T>['toolBarRender'];
     actionRef: React.MutableRefObject<ActionType | undefined>;
 };
-/** 这里负责与table交互，并且减少 render次数 */
-declare class ToolbarRender<T> extends React.Component<ToolbarRenderProps<T>> {
-    onSearch: (keyword: string) => void;
-    isEquals: (next: ToolbarRenderProps<T>) => boolean;
-    shouldComponentUpdate: (next: ToolbarRenderProps<T>) => boolean;
-    render: () => import("react/jsx-runtime").JSX.Element | null;
-}
-export default ToolbarRender;
+declare const _default: <T>(props: ToolbarRenderProps<T>) => import("react/jsx-runtime").JSX.Element | null;
+export default _default;