@ant-design/pro-components 3.0.0-beta.1 → 3.0.0-beta.3

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

@@ -1,39 +1,15 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-
-// src/table/components/ToolBar/index.tsx
-import { ReloadOutlined } from "@ant-design/icons";
-import { Tooltip } from "antd";
-import React, { useContext, useEffect, useMemo } from "react";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+var _excluded = ["headerTitle", "tooltip", "toolBarRender", "action", "options", "selectedRowKeys", "selectedRows", "toolbar", "onSearch", "columns", "optionsRender"];
+import { ReloadOutlined } from '@ant-design/icons';
+import { Tooltip } from 'antd';
+import React, { useContext, useEffect, useMemo } from 'react';
 import { useIntl } from "../../../provider";
 import { isDeepEqualReact, omitUndefined } from "../../../utils";
 import { TableContext } from "../../Store/Provide";
@@ -41,289 +17,281 @@ import ColumnSetting from "../ColumnSetting";
 import ListToolBar from "../ListToolBar";
 import DensityIcon from "./DensityIcon";
 import FullScreenIcon from "./FullscreenIcon";
-function getButtonText({
-  intl
-}, options) {
-  var _a;
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createElement as _createElement } from "react";
+function getButtonText(_ref, options) {
+  var _options$reloadIcon;
+  var intl = _ref.intl;
   return {
     reload: {
-      text: intl.getMessage("tableToolBar.reload", "刷新"),
-      icon: (_a = options.reloadIcon) != null ? _a : /* @__PURE__ */ React.createElement(ReloadOutlined, null)
+      text: intl.getMessage('tableToolBar.reload', '刷新'),
+      icon: (_options$reloadIcon = options.reloadIcon) !== null && _options$reloadIcon !== void 0 ? _options$reloadIcon : /*#__PURE__*/_jsx(ReloadOutlined, {})
     },
     density: {
-      text: intl.getMessage("tableToolBar.density", "表格密度"),
-      icon: /* @__PURE__ */ React.createElement(DensityIcon, { icon: options.densityIcon })
+      text: intl.getMessage('tableToolBar.density', '表格密度'),
+      icon: /*#__PURE__*/_jsx(DensityIcon, {
+        icon: options.densityIcon
+      })
     },
     fullScreen: {
-      text: intl.getMessage("tableToolBar.fullScreen", "全屏"),
-      icon: /* @__PURE__ */ React.createElement(FullScreenIcon, null)
+      text: intl.getMessage('tableToolBar.fullScreen', '全屏'),
+      icon: /*#__PURE__*/_jsx(FullScreenIcon, {})
     }
   };
 }
+
+/**
+ * 渲染默认的 工具栏
+ *
+ * @param options
+ * @param className
+ */
 function renderDefaultOption(options, defaultOptions, actions, columns) {
-  return Object.keys(options).filter((item) => item).map((key) => {
-    const value = options[key];
+  return Object.keys(options).filter(function (item) {
+    return item;
+  }).map(function (key) {
+    var value = options[key];
     if (!value) {
       return null;
     }
-    let onClick = value === true ? defaultOptions[key] : (event) => {
-      value == null ? void 0 : value(event, actions.current);
+    var onClick = value === true ? defaultOptions[key] : function (event) {
+      value === null || value === void 0 || value(event, actions.current);
     };
-    if (typeof onClick !== "function") {
-      onClick = () => {
-      };
+    if (typeof onClick !== 'function') {
+      onClick = function onClick() {};
     }
-    if (key === "setting") {
-      return /* @__PURE__ */ React.createElement(
-        ColumnSetting,
-        __spreadProps(__spreadValues({}, options[key]), {
-          columns,
-          key
-        })
-      );
+    if (key === 'setting') {
+      return /*#__PURE__*/_createElement(ColumnSetting, _objectSpread(_objectSpread({}, options[key]), {}, {
+        columns: columns,
+        key: key
+      }));
     }
-    if (key === "fullScreen") {
-      return /* @__PURE__ */ React.createElement("span", { key, onClick }, /* @__PURE__ */ React.createElement(FullScreenIcon, null));
+    if (key === 'fullScreen') {
+      return /*#__PURE__*/_jsx("span", {
+        onClick: onClick,
+        children: /*#__PURE__*/_jsx(FullScreenIcon, {})
+      }, key);
     }
-    const optionItem = getButtonText(defaultOptions, options)[key];
+    var optionItem = getButtonText(defaultOptions, options)[key];
     if (optionItem) {
-      return /* @__PURE__ */ React.createElement("span", { key, onClick }, /* @__PURE__ */ React.createElement(Tooltip, { title: optionItem.text }, optionItem.icon));
+      return /*#__PURE__*/_jsx("span", {
+        onClick: onClick,
+        children: /*#__PURE__*/_jsx(Tooltip, {
+          title: optionItem.text,
+          children: optionItem.icon
+        })
+      }, key);
     }
     return null;
-  }).filter((item) => item);
+  }).filter(function (item) {
+    return item;
+  });
 }
-function ToolBar(_a) {
-  var _b = _a, {
-    headerTitle,
-    tooltip,
-    toolBarRender,
-    action,
-    options: propsOptions,
-    selectedRowKeys,
-    selectedRows,
-    toolbar,
-    onSearch,
-    columns,
-    optionsRender
-  } = _b, rest = __objRest(_b, [
-    "headerTitle",
-    "tooltip",
-    "toolBarRender",
-    "action",
-    "options",
-    "selectedRowKeys",
-    "selectedRows",
-    "toolbar",
-    "onSearch",
-    "columns",
-    "optionsRender"
-  ]);
-  const counter = useContext(TableContext);
-  const intl = useIntl();
-  const optionDom = useMemo(() => {
-    const defaultOptions = {
-      reload: () => {
-        var _a2;
-        return (_a2 = action == null ? void 0 : action.current) == null ? void 0 : _a2.reload();
+function ToolBar(_ref2) {
+  var headerTitle = _ref2.headerTitle,
+    tooltip = _ref2.tooltip,
+    toolBarRender = _ref2.toolBarRender,
+    action = _ref2.action,
+    propsOptions = _ref2.options,
+    selectedRowKeys = _ref2.selectedRowKeys,
+    selectedRows = _ref2.selectedRows,
+    toolbar = _ref2.toolbar,
+    onSearch = _ref2.onSearch,
+    columns = _ref2.columns,
+    optionsRender = _ref2.optionsRender,
+    rest = _objectWithoutProperties(_ref2, _excluded);
+  var counter = useContext(TableContext);
+  var intl = useIntl();
+  var optionDom = useMemo(function () {
+    var defaultOptions = {
+      reload: function reload() {
+        var _action$current;
+        return action === null || action === void 0 || (_action$current = action.current) === null || _action$current === void 0 ? void 0 : _action$current.reload();
       },
       density: true,
       setting: true,
       search: false,
-      fullScreen: () => {
-        var _a2, _b2;
-        return (_b2 = (_a2 = action == null ? void 0 : action.current) == null ? void 0 : _a2.fullScreen) == null ? void 0 : _b2.call(_a2);
+      fullScreen: function fullScreen() {
+        var _action$current2, _action$current2$full;
+        return action === null || action === void 0 || (_action$current2 = action.current) === null || _action$current2 === void 0 || (_action$current2$full = _action$current2.fullScreen) === null || _action$current2$full === void 0 ? void 0 : _action$current2$full.call(_action$current2);
       }
     };
     if (propsOptions === false) {
       return [];
     }
-    const options = __spreadValues(__spreadProps(__spreadValues({}, defaultOptions), {
+    var options = _objectSpread(_objectSpread({}, defaultOptions), {}, {
       fullScreen: false
-    }), propsOptions);
-    const settings = renderDefaultOption(
-      options,
-      __spreadProps(__spreadValues({}, defaultOptions), {
-        intl
-      }),
-      action,
-      columns
-    );
+    }, propsOptions);
+    var settings = renderDefaultOption(options, _objectSpread(_objectSpread({}, defaultOptions), {}, {
+      intl: intl
+    }), action, columns);
     if (optionsRender) {
-      return optionsRender(
-        __spreadValues({
-          headerTitle,
-          tooltip,
-          toolBarRender,
-          action,
-          options: propsOptions,
-          selectedRowKeys,
-          selectedRows,
-          toolbar,
-          onSearch,
-          columns,
-          optionsRender
-        }, rest),
-        settings
-      );
+      return optionsRender(_objectSpread({
+        headerTitle: headerTitle,
+        tooltip: tooltip,
+        toolBarRender: toolBarRender,
+        action: action,
+        options: propsOptions,
+        selectedRowKeys: selectedRowKeys,
+        selectedRows: selectedRows,
+        toolbar: toolbar,
+        onSearch: onSearch,
+        columns: columns,
+        optionsRender: optionsRender
+      }, rest), settings);
     }
     return settings;
-  }, [
-    action,
-    columns,
-    headerTitle,
-    intl,
-    onSearch,
-    optionsRender,
-    propsOptions,
-    rest,
-    selectedRowKeys,
-    selectedRows,
-    toolBarRender,
-    toolbar,
-    tooltip
-  ]);
-  const actions = toolBarRender ? toolBarRender(action == null ? void 0 : action.current, { selectedRowKeys, selectedRows }) : [];
-  const searchConfig = useMemo(() => {
+  }, [action, columns, headerTitle, intl, onSearch, optionsRender, propsOptions, rest, selectedRowKeys, selectedRows, toolBarRender, toolbar, tooltip]);
+  // 操作列表
+  var actions = toolBarRender ? toolBarRender(action === null || action === void 0 ? void 0 : action.current, {
+    selectedRowKeys: selectedRowKeys,
+    selectedRows: selectedRows
+  }) : [];
+  var searchConfig = useMemo(function () {
     if (!propsOptions) {
       return false;
     }
-    if (!propsOptions.search)
-      return false;
-    const defaultSearchConfig = {
+    if (!propsOptions.search) return false;
+
+    /** 受控的value 和 onChange */
+    var defaultSearchConfig = {
       value: counter.keyWords,
-      onChange: (e) => counter.setKeyWords(e.target.value)
+      onChange: function onChange(e) {
+        return counter.setKeyWords(e.target.value);
+      }
     };
-    if (propsOptions.search === true)
-      return defaultSearchConfig;
-    return __spreadValues(__spreadValues({}, defaultSearchConfig), propsOptions.search);
+    if (propsOptions.search === true) return defaultSearchConfig;
+    return _objectSpread(_objectSpread({}, defaultSearchConfig), propsOptions.search);
   }, [counter, propsOptions]);
-  useEffect(() => {
-    if (counter.keyWords === void 0) {
-      onSearch == null ? void 0 : onSearch("");
+  useEffect(function () {
+    if (counter.keyWords === undefined) {
+      onSearch === null || onSearch === void 0 || onSearch('');
     }
   }, [counter.keyWords, onSearch]);
-  return /* @__PURE__ */ React.createElement(
-    ListToolBar,
-    __spreadValues({
-      title: headerTitle,
-      tooltip,
-      search: searchConfig,
-      onSearch,
-      actions,
-      settings: optionDom
-    }, toolbar)
-  );
+  return /*#__PURE__*/_jsx(ListToolBar, _objectSpread({
+    title: headerTitle,
+    tooltip: tooltip,
+    search: searchConfig,
+    onSearch: onSearch,
+    actions: actions,
+    settings: optionDom
+  }, toolbar));
 }
-var ToolbarRender = class extends React.Component {
-  constructor() {
-    super(...arguments);
-    this.onSearch = (keyword) => {
-      var _a, _b, _c, _d;
-      const { options, onFormSearchSubmit, actionRef } = this.props;
+/** 这里负责与table交互，并且减少 render次数 */
+var ToolbarRender = /*#__PURE__*/function (_React$Component) {
+  _inherits(ToolbarRender, _React$Component);
+  var _super = _createSuper(ToolbarRender);
+  function ToolbarRender() {
+    var _this;
+    _classCallCheck(this, ToolbarRender);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "onSearch", function (keyword) {
+      var _options$search, _options$search$onSea, _actionRef$current, _actionRef$current$se;
+      var _this$props = _this.props,
+        options = _this$props.options,
+        onFormSearchSubmit = _this$props.onFormSearchSubmit,
+        actionRef = _this$props.actionRef;
       if (!options || !options.search) {
         return;
       }
-      const { name = "keyword" } = options.search === true ? {} : options.search;
-      const success = (_b = (_a = options.search) == null ? void 0 : _a.onSearch) == null ? void 0 : _b.call(_a, keyword);
-      if (success === false)
-        return;
-      (_d = (_c = actionRef == null ? void 0 : actionRef.current) == null ? void 0 : _c.setPageInfo) == null ? void 0 : _d.call(_c, {
+      var _ref3 = options.search === true ? {} : options.search,
+        _ref3$name = _ref3.name,
+        name = _ref3$name === void 0 ? 'keyword' : _ref3$name;
+
+      /** 如果传入的 onSearch 返回值为 false，应该直接拦截请求 */
+      var success = (_options$search = options.search) === null || _options$search === void 0 || (_options$search$onSea = _options$search.onSearch) === null || _options$search$onSea === void 0 ? void 0 : _options$search$onSea.call(_options$search, keyword);
+      if (success === false) return;
+
+      // 查询的时候的回到第一页
+      actionRef === null || actionRef === void 0 || (_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 || (_actionRef$current$se = _actionRef$current.setPageInfo) === null || _actionRef$current$se === void 0 || _actionRef$current$se.call(_actionRef$current, {
         current: 1
       });
-      onFormSearchSubmit(
-        omitUndefined({
-          _timestamp: Date.now(),
-          [name]: keyword
-        })
-      );
-    };
-    this.isEquals = (next) => {
-      const {
-        hideToolbar,
-        tableColumn,
-        options,
-        tooltip,
-        toolbar,
-        selectedRows,
-        selectedRowKeys,
-        headerTitle,
-        actionRef,
-        toolBarRender
-      } = this.props;
-      return isDeepEqualReact(
-        {
-          hideToolbar,
-          tableColumn,
-          options,
-          tooltip,
-          toolbar,
-          selectedRows,
-          selectedRowKeys,
-          headerTitle,
-          actionRef,
-          toolBarRender
-        },
-        {
-          hideToolbar: next.hideToolbar,
-          tableColumn: next.tableColumn,
-          options: next.options,
-          tooltip: next.tooltip,
-          toolbar: next.toolbar,
-          selectedRows: next.selectedRows,
-          selectedRowKeys: next.selectedRowKeys,
-          headerTitle: next.headerTitle,
-          actionRef: next.actionRef,
-          toolBarRender: next.toolBarRender
-        },
-        ["render", "formItemRender"]
-      );
-    };
-    this.shouldComponentUpdate = (next) => {
+      onFormSearchSubmit(omitUndefined(_defineProperty({
+        _timestamp: Date.now()
+      }, name, keyword)));
+    });
+    _defineProperty(_assertThisInitialized(_this), "isEquals", function (next) {
+      var _this$props2 = _this.props,
+        hideToolbar = _this$props2.hideToolbar,
+        tableColumn = _this$props2.tableColumn,
+        options = _this$props2.options,
+        tooltip = _this$props2.tooltip,
+        toolbar = _this$props2.toolbar,
+        selectedRows = _this$props2.selectedRows,
+        selectedRowKeys = _this$props2.selectedRowKeys,
+        headerTitle = _this$props2.headerTitle,
+        actionRef = _this$props2.actionRef,
+        toolBarRender = _this$props2.toolBarRender;
+      return isDeepEqualReact({
+        hideToolbar: hideToolbar,
+        tableColumn: tableColumn,
+        options: options,
+        tooltip: tooltip,
+        toolbar: toolbar,
+        selectedRows: selectedRows,
+        selectedRowKeys: selectedRowKeys,
+        headerTitle: headerTitle,
+        actionRef: actionRef,
+        toolBarRender: toolBarRender
+      }, {
+        hideToolbar: next.hideToolbar,
+        tableColumn: next.tableColumn,
+        options: next.options,
+        tooltip: next.tooltip,
+        toolbar: next.toolbar,
+        selectedRows: next.selectedRows,
+        selectedRowKeys: next.selectedRowKeys,
+        headerTitle: next.headerTitle,
+        actionRef: next.actionRef,
+        toolBarRender: next.toolBarRender
+      }, ['render', 'formItemRender']);
+    });
+    _defineProperty(_assertThisInitialized(_this), "shouldComponentUpdate", function (next) {
       if (next.searchNode) {
         return true;
       }
-      return !this.isEquals(next);
-    };
-    this.render = () => {
-      const {
-        hideToolbar,
-        tableColumn,
-        options,
-        searchNode,
-        tooltip,
-        toolbar,
-        selectedRows,
-        selectedRowKeys,
-        headerTitle,
-        actionRef,
-        toolBarRender,
-        optionsRender
-      } = this.props;
+      return !_this.isEquals(next);
+    });
+    _defineProperty(_assertThisInitialized(_this), "render", function () {
+      var _this$props3 = _this.props,
+        hideToolbar = _this$props3.hideToolbar,
+        tableColumn = _this$props3.tableColumn,
+        options = _this$props3.options,
+        searchNode = _this$props3.searchNode,
+        tooltip = _this$props3.tooltip,
+        toolbar = _this$props3.toolbar,
+        selectedRows = _this$props3.selectedRows,
+        selectedRowKeys = _this$props3.selectedRowKeys,
+        headerTitle = _this$props3.headerTitle,
+        actionRef = _this$props3.actionRef,
+        toolBarRender = _this$props3.toolBarRender,
+        optionsRender = _this$props3.optionsRender;
+
+      // 不展示 toolbar
       if (hideToolbar) {
         return null;
       }
-      return /* @__PURE__ */ React.createElement(
-        ToolBar,
-        {
-          tooltip,
-          columns: tableColumn,
-          options,
-          headerTitle,
-          action: actionRef,
-          onSearch: this.onSearch,
-          selectedRows,
-          selectedRowKeys,
-          toolBarRender,
-          toolbar: __spreadValues({
-            filter: searchNode
-          }, toolbar),
-          optionsRender
-        }
-      );
-    };
+      return /*#__PURE__*/_jsx(ToolBar, {
+        tooltip: tooltip,
+        columns: tableColumn,
+        options: options,
+        headerTitle: headerTitle,
+        action: actionRef,
+        onSearch: _this.onSearch,
+        selectedRows: selectedRows,
+        selectedRowKeys: selectedRowKeys,
+        toolBarRender: toolBarRender,
+        toolbar: _objectSpread({
+          filter: searchNode
+        }, toolbar),
+        optionsRender: optionsRender
+      });
+    });
+    return _this;
   }
-};
-var ToolBar_default = ToolbarRender;
-export {
-  ToolBar_default as default
-};
+  return _createClass(ToolbarRender);
+}(React.Component);
+export default ToolbarRender;

package/es/table/index.js

@@ -1,23 +1,5 @@
-// src/table/index.tsx
 import { FieldIndexColumn, FieldStatus } from "../field";
-import {
-  ConfigConsumer,
-  arEGIntl,
-  caESIntl,
-  createIntl,
-  enUSIntl,
-  esESIntl,
-  frFRIntl,
-  itITIntl,
-  jaJPIntl,
-  msMYIntl,
-  ptBRIntl,
-  ruRUIntl,
-  thTHIntl,
-  viVNIntl,
-  zhCNIntl,
-  zhTWIntl
-} from "../provider";
+import { ConfigConsumer, arEGIntl, caESIntl, createIntl, enUSIntl, esESIntl, frFRIntl, itITIntl, jaJPIntl, msMYIntl, ptBRIntl, ruRUIntl, thTHIntl, viVNIntl, zhCNIntl, zhTWIntl } from "../provider";
 import DragSortTable from "./components/DragSortTable";
 import TableDropdown from "./components/Dropdown";
 import EditableProTable from "./components/EditableTable";
@@ -26,34 +8,5 @@ import { RowEditorTable } from "./components/EditableTable/RowEditorTable";
 import Search from "./components/Form";
 import ListToolBar from "./components/ListToolBar";
 import ProTable from "./Table";
-var table_default = ProTable;
-export {
-  CellEditorTable,
-  ConfigConsumer,
-  DragSortTable,
-  EditableProTable,
-  FieldIndexColumn as IndexColumn,
-  ConfigConsumer as IntlConsumer,
-  ListToolBar,
-  ProTable,
-  RowEditorTable,
-  Search,
-  TableDropdown,
-  FieldStatus as TableStatus,
-  arEGIntl,
-  caESIntl,
-  createIntl,
-  table_default as default,
-  enUSIntl,
-  esESIntl,
-  frFRIntl,
-  itITIntl,
-  jaJPIntl,
-  msMYIntl,
-  ptBRIntl,
-  ruRUIntl,
-  thTHIntl,
-  viVNIntl,
-  zhCNIntl,
-  zhTWIntl
-};
+export { CellEditorTable, ConfigConsumer, DragSortTable, EditableProTable, FieldIndexColumn as IndexColumn, ConfigConsumer as IntlConsumer, ListToolBar, ProTable, RowEditorTable, Search, TableDropdown, FieldStatus as TableStatus, arEGIntl, caESIntl, createIntl, enUSIntl, esESIntl, frFRIntl, itITIntl, jaJPIntl, msMYIntl, ptBRIntl, ruRUIntl, thTHIntl, viVNIntl, zhCNIntl, zhTWIntl };
+export default ProTable;