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

package/es/field/components/TreeSelect/index.js

@@ -1,227 +1,221 @@
-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/field/components/TreeSelect/index.tsx
-import { ConfigProvider, Spin, TreeSelect } from "antd";
-import classNames from "classnames";
-import useMergedState from "rc-util/lib/hooks/useMergedState";
-import React, {
-  useContext,
-  useImperativeHandle,
-  useMemo,
-  useRef,
-  useState
-} from "react";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["radioType", "formItemRender", "mode", "light", "label", "render", "variant"],
+  _excluded2 = ["onSearch", "onClear", "onChange", "onBlur", "showSearch", "autoClearSearchValue", "treeData", "fetchDataOnSearch", "searchValue"];
+import { useMergedState } from '@rc-component/util';
+import { ConfigProvider, Spin, TreeSelect } from 'antd';
+import classNames from 'classnames';
+import React, { useContext, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { useIntl } from "../../../provider";
 import { FieldLabel, objectToMap, proFieldParsingText } from "../../../utils";
 import { useFieldFetchData } from "../Select";
-var FieldTreeSelect = (_a, ref) => {
-  var _b = _a, { radioType, formItemRender, mode, light, label, render, variant } = _b, rest = __objRest(_b, ["radioType", "formItemRender", "mode", "light", "label", "render", "variant"]);
-  var _b2, _c, _d, _e;
-  const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
-  const layoutClassName = getPrefixCls("pro-field-tree-select");
-  const treeSelectRef = useRef(null);
-  const [open, setOpen] = useState(false);
-  const _a2 = rest.fieldProps, {
-    onSearch,
-    onClear,
-    onChange: propsOnChange,
-    onBlur,
-    showSearch,
-    autoClearSearchValue,
-    treeData,
-    fetchDataOnSearch,
-    searchValue: propsSearchValue
-  } = _a2, fieldProps = __objRest(_a2, [
-    "onSearch",
-    "onClear",
-    "onChange",
-    "onBlur",
-    "showSearch",
-    "autoClearSearchValue",
-    "treeData",
-    "fetchDataOnSearch",
-    "searchValue"
-  ]);
-  const intl = useIntl();
-  const [loading, options, fetchData] = useFieldFetchData(__spreadProps(__spreadValues({}, rest), {
-    defaultKeyWords: propsSearchValue
-  }));
-  const [searchValue, setSearchValue] = useMergedState(
-    void 0,
-    {
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Tree select
+ * A function that returns a React component.
+ * @param ref
+ */
+var FieldTreeSelect = function FieldTreeSelect(_ref, ref) {
+  var radioType = _ref.radioType,
+    formItemRender = _ref.formItemRender,
+    mode = _ref.mode,
+    light = _ref.light,
+    label = _ref.label,
+    render = _ref.render,
+    variant = _ref.variant,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _useContext = useContext(ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var layoutClassName = getPrefixCls('pro-field-tree-select');
+  var treeSelectRef = useRef(null);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1];
+  var _ref2 = rest.fieldProps,
+    onSearch = _ref2.onSearch,
+    _onClear = _ref2.onClear,
+    propsOnChange = _ref2.onChange,
+    _onBlur = _ref2.onBlur,
+    showSearch = _ref2.showSearch,
+    autoClearSearchValue = _ref2.autoClearSearchValue,
+    treeData = _ref2.treeData,
+    fetchDataOnSearch = _ref2.fetchDataOnSearch,
+    propsSearchValue = _ref2.searchValue,
+    fieldProps = _objectWithoutProperties(_ref2, _excluded2);
+  var intl = useIntl();
+  var _useFieldFetchData = useFieldFetchData(_objectSpread(_objectSpread({}, rest), {}, {
+      defaultKeyWords: propsSearchValue
+    })),
+    _useFieldFetchData2 = _slicedToArray(_useFieldFetchData, 3),
+    loading = _useFieldFetchData2[0],
+    options = _useFieldFetchData2[1],
+    _fetchData = _useFieldFetchData2[2];
+  var _useMergedState = useMergedState(undefined, {
       onChange: onSearch,
       value: propsSearchValue
-    }
-  );
-  useImperativeHandle(ref, () => __spreadProps(__spreadValues({}, treeSelectRef.current || {}), {
-    fetchData: (keyWord) => fetchData(keyWord)
-  }));
-  const optionsValueEnum = useMemo(() => {
-    if (mode !== "read")
-      return;
-    const {
-      value: valuePropsName = "value",
-      label: labelPropsName = "label",
-      children: childrenPropsName = "children"
-    } = (fieldProps == null ? void 0 : fieldProps.fieldNames) || {};
-    const valuesMap = /* @__PURE__ */ new Map();
-    const traverseOptions = (_options) => {
-      if (!(_options == null ? void 0 : _options.length)) {
+    }),
+    _useMergedState2 = _slicedToArray(_useMergedState, 2),
+    searchValue = _useMergedState2[0],
+    setSearchValue = _useMergedState2[1];
+  useImperativeHandle(ref, function () {
+    return _objectSpread(_objectSpread({}, treeSelectRef.current || {}), {}, {
+      fetchData: function fetchData(keyWord) {
+        return _fetchData(keyWord);
+      }
+    });
+  });
+  var optionsValueEnum = useMemo(function () {
+    if (mode !== 'read') return;
+    /**
+     * Support TreeSelect fieldNames
+     * @see https://ant.design/components/tree-select-cn
+     */
+    var _ref3 = (fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.fieldNames) || {},
+      _ref3$value = _ref3.value,
+      valuePropsName = _ref3$value === void 0 ? 'value' : _ref3$value,
+      _ref3$label = _ref3.label,
+      labelPropsName = _ref3$label === void 0 ? 'label' : _ref3$label,
+      _ref3$children = _ref3.children,
+      childrenPropsName = _ref3$children === void 0 ? 'children' : _ref3$children;
+    var valuesMap = new Map();
+    var traverseOptions = function traverseOptions(_options) {
+      if (!(_options !== null && _options !== void 0 && _options.length)) {
         return valuesMap;
       }
-      const length = _options.length;
-      let i = 0;
+      var length = _options.length;
+      var i = 0;
       while (i < length) {
-        const cur = _options[i++];
+        var cur = _options[i++];
         valuesMap.set(cur[valuePropsName], cur[labelPropsName]);
         traverseOptions(cur[childrenPropsName]);
       }
       return valuesMap;
     };
     return traverseOptions(options);
-  }, [fieldProps == null ? void 0 : fieldProps.fieldNames, mode, options]);
-  const onChange = (value, optionList, extra) => {
+  }, [fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.fieldNames, mode, options]);
+  var onChange = function onChange(value, optionList, extra) {
+    // 将搜索框置空 和 antd 行为保持一致
     if (showSearch && autoClearSearchValue) {
-      fetchData(void 0);
-      setSearchValue(void 0);
+      _fetchData(undefined);
+      setSearchValue(undefined);
     }
-    propsOnChange == null ? void 0 : propsOnChange(value, optionList, extra);
+    propsOnChange === null || propsOnChange === void 0 || propsOnChange(value, optionList, extra);
   };
-  if (mode === "read") {
-    const dom = /* @__PURE__ */ React.createElement(React.Fragment, null, proFieldParsingText(
-      rest.text,
-      objectToMap(rest.valueEnum || optionsValueEnum)
-    ));
+  if (mode === 'read') {
+    var dom = /*#__PURE__*/_jsx(_Fragment, {
+      children: proFieldParsingText(rest.text, objectToMap(rest.valueEnum || optionsValueEnum))
+    });
     if (render) {
-      return (_b2 = render(
-        rest.text,
-        __spreadProps(__spreadValues({ mode }, fieldProps), { treeData: options }),
-        dom
-      )) != null ? _b2 : null;
+      var _render;
+      return (_render = render(rest.text, _objectSpread(_objectSpread({
+        mode: mode
+      }, fieldProps), {}, {
+        treeData: options
+      }), dom)) !== null && _render !== void 0 ? _render : null;
     }
     return dom;
   }
-  if (mode === "edit") {
-    const valuesLength = Array.isArray(fieldProps == null ? void 0 : fieldProps.value) ? (_c = fieldProps == null ? void 0 : fieldProps.value) == null ? void 0 : _c.length : 0;
-    let dom = /* @__PURE__ */ React.createElement(Spin, { spinning: loading }, /* @__PURE__ */ React.createElement(
-      TreeSelect,
-      __spreadProps(__spreadValues({
-        open,
-        onOpenChange: (isOpen) => {
-          var _a3;
-          (_a3 = fieldProps == null ? void 0 : fieldProps.onOpenChange) == null ? void 0 : _a3.call(fieldProps, isOpen);
+  if (mode === 'edit') {
+    var _fieldProps$value;
+    var valuesLength = Array.isArray(fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.value) ? fieldProps === null || fieldProps === void 0 || (_fieldProps$value = fieldProps.value) === null || _fieldProps$value === void 0 ? void 0 : _fieldProps$value.length : 0;
+    var _dom = /*#__PURE__*/_jsx(Spin, {
+      spinning: loading,
+      children: /*#__PURE__*/_jsx(TreeSelect, _objectSpread(_objectSpread({
+        open: open,
+        onOpenChange: function onOpenChange(isOpen) {
+          var _fieldProps$onOpenCha;
+          fieldProps === null || fieldProps === void 0 || (_fieldProps$onOpenCha = fieldProps.onOpenChange) === null || _fieldProps$onOpenCha === void 0 || _fieldProps$onOpenCha.call(fieldProps, isOpen);
           setOpen(isOpen);
         },
         ref: treeSelectRef,
         popupMatchSelectWidth: !light,
-        placeholder: intl.getMessage("tableForm.selectPlaceholder", "请选择"),
-        tagRender: light ? (item) => {
-          var _a3;
-          if (valuesLength < 2)
-            return /* @__PURE__ */ React.createElement(React.Fragment, null, item.label);
-          const itemIndex = (_a3 = fieldProps == null ? void 0 : fieldProps.value) == null ? void 0 : _a3.findIndex(
-            (v) => v === item.value || v.value === item.value
-          );
-          return /* @__PURE__ */ React.createElement(React.Fragment, null, item.label, " ", itemIndex < valuesLength - 1 ? "," : "");
-        } : void 0,
-        variant: !light ? "outlined" : "borderless"
-      }, fieldProps), {
+        placeholder: intl.getMessage('tableForm.selectPlaceholder', '请选择'),
+        tagRender: light ? function (item) {
+          var _fieldProps$value2;
+          if (valuesLength < 2) return /*#__PURE__*/_jsx(_Fragment, {
+            children: item.label
+          });
+          /**
+           * 性能不好，等我给 antd 提个issue
+           */
+          var itemIndex = fieldProps === null || fieldProps === void 0 || (_fieldProps$value2 = fieldProps.value) === null || _fieldProps$value2 === void 0 ? void 0 : _fieldProps$value2.findIndex(function (v) {
+            return v === item.value || v.value === item.value;
+          });
+          return /*#__PURE__*/_jsxs(_Fragment, {
+            children: [item.label, " ", itemIndex < valuesLength - 1 ? ',' : '']
+          });
+        } : undefined,
+        variant: !light ? 'outlined' : 'borderless'
+      }, fieldProps), {}, {
         treeData: options,
-        showSearch,
-        style: __spreadValues({
+        showSearch: showSearch,
+        style: _objectSpread({
           minWidth: 60
         }, fieldProps.style),
         allowClear: fieldProps.allowClear !== false,
-        searchValue,
-        autoClearSearchValue,
-        onClear: () => {
-          onClear == null ? void 0 : onClear();
-          fetchData(void 0);
+        searchValue: searchValue,
+        autoClearSearchValue: autoClearSearchValue,
+        onClear: function onClear() {
+          _onClear === null || _onClear === void 0 || _onClear();
+          _fetchData(undefined);
           if (showSearch) {
-            setSearchValue(void 0);
+            setSearchValue(undefined);
           }
         },
-        onChange,
-        onSearch: (value) => {
-          if (fetchDataOnSearch && (rest == null ? void 0 : rest.request)) {
-            fetchData(value);
+        onChange: onChange,
+        onSearch: function onSearch(value) {
+          // fix 不支持请求的情况下不刷新options
+          if (fetchDataOnSearch && rest !== null && rest !== void 0 && rest.request) {
+            _fetchData(value);
           }
           setSearchValue(value);
         },
-        onBlur: (event) => {
-          setSearchValue(void 0);
-          fetchData(void 0);
-          onBlur == null ? void 0 : onBlur(event);
+        onBlur: function onBlur(event) {
+          setSearchValue(undefined);
+          _fetchData(undefined);
+          _onBlur === null || _onBlur === void 0 || _onBlur(event);
         },
-        className: classNames(fieldProps == null ? void 0 : fieldProps.className, layoutClassName)
-      })
-    ));
+        className: classNames(fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.className, layoutClassName)
+      }))
+    });
     if (formItemRender) {
-      dom = (_d = formItemRender(
-        rest.text,
-        __spreadProps(__spreadValues({ mode }, fieldProps), { options, loading }),
-        dom
-      )) != null ? _d : null;
+      var _formItemRender;
+      _dom = (_formItemRender = formItemRender(rest.text, _objectSpread(_objectSpread({
+        mode: mode
+      }, fieldProps), {}, {
+        options: options,
+        loading: loading
+      }), _dom)) !== null && _formItemRender !== void 0 ? _formItemRender : null;
     }
     if (light) {
-      const { disabled, placeholder } = fieldProps;
-      const notEmpty = !!fieldProps.value && ((_e = fieldProps.value) == null ? void 0 : _e.length) !== 0;
-      return /* @__PURE__ */ React.createElement(
-        FieldLabel,
-        {
-          label,
-          disabled,
-          placeholder,
-          onClick: () => {
-            var _a3;
-            setOpen(true);
-            (_a3 = fieldProps == null ? void 0 : fieldProps.onOpenChange) == null ? void 0 : _a3.call(fieldProps, true);
-          },
-          variant,
-          value: notEmpty || open ? dom : null,
-          style: notEmpty ? {
-            paddingInlineEnd: 0
-          } : void 0,
-          allowClear: false,
-          downIcon: false
-        }
-      );
+      var _fieldProps$value3;
+      var disabled = fieldProps.disabled,
+        placeholder = fieldProps.placeholder;
+      var notEmpty = !!fieldProps.value && ((_fieldProps$value3 = fieldProps.value) === null || _fieldProps$value3 === void 0 ? void 0 : _fieldProps$value3.length) !== 0;
+      return /*#__PURE__*/_jsx(FieldLabel, {
+        label: label,
+        disabled: disabled,
+        placeholder: placeholder,
+        onClick: function onClick() {
+          var _fieldProps$onOpenCha2;
+          setOpen(true);
+          fieldProps === null || fieldProps === void 0 || (_fieldProps$onOpenCha2 = fieldProps.onOpenChange) === null || _fieldProps$onOpenCha2 === void 0 || _fieldProps$onOpenCha2.call(fieldProps, true);
+        },
+        variant: variant,
+        value: notEmpty || open ? _dom : null,
+        style: notEmpty ? {
+          paddingInlineEnd: 0
+        } : undefined,
+        allowClear: false,
+        downIcon: false
+      });
     }
-    return dom;
+    return _dom;
   }
   return null;
 };
-var TreeSelect_default = React.forwardRef(FieldTreeSelect);
-export {
-  TreeSelect_default as default
-};
+export default /*#__PURE__*/React.forwardRef(FieldTreeSelect);

package/es/field/index.js

@@ -1,4 +1,3 @@
-// src/field/index.tsx
 import { ProField, defaultRenderText } from "./AllProField";
 import FieldCascader from "./components/Cascader";
 import FieldCheckbox from "./components/Checkbox";
@@ -20,9 +19,7 @@ import FieldRangePicker from "./components/RangePicker";
 import FieldRate from "./components/Rate";
 import FieldSecond from "./components/Second";
 import FieldSegmented from "./components/Segmented";
-import FieldSelect, {
-  proFieldParsingValueEnumToArray
-} from "./components/Select";
+import FieldSelect, { proFieldParsingValueEnumToArray } from "./components/Select";
 import FieldSlider from "./components/Slider";
 import FieldStatus, { ProFieldBadgeColor } from "./components/Status";
 import FieldSwitch from "./components/Switch";
@@ -30,42 +27,5 @@ import FieldText from "./components/Text";
 import FieldTextArea from "./components/TextArea";
 import FieldTimePicker, { FieldTimeRangePicker } from "./components/TimePicker";
 import FieldTreeSelect from "./components/TreeSelect";
-import {
-  PureProField
-} from "./PureProField";
-export {
-  FieldCascader,
-  FieldCheckbox,
-  FieldCode,
-  FieldColorPicker,
-  FieldDatePicker,
-  FieldDigit,
-  FieldDigitRange,
-  FieldFromNow,
-  FieldImage,
-  FieldIndexColumn,
-  FieldMoney,
-  FieldOptions,
-  FieldPassword,
-  FieldPercent,
-  FieldProgress,
-  FieldRadio,
-  FieldRangePicker,
-  FieldRate,
-  FieldSecond,
-  FieldSegmented,
-  FieldSelect,
-  FieldSlider,
-  FieldStatus,
-  FieldSwitch,
-  FieldText,
-  FieldTextArea,
-  FieldTimePicker,
-  FieldTimeRangePicker,
-  FieldTreeSelect,
-  ProField,
-  ProFieldBadgeColor,
-  PureProField,
-  defaultRenderText,
-  proFieldParsingValueEnumToArray
-};
+import { PureProField } from "./PureProField";
+export { FieldCascader, FieldCheckbox, FieldCode, FieldColorPicker, FieldDatePicker, FieldDigit, FieldDigitRange, FieldFromNow, FieldImage, FieldIndexColumn, FieldMoney, FieldOptions, FieldPassword, FieldPercent, FieldProgress, FieldRadio, FieldRangePicker, FieldRate, FieldSecond, FieldSegmented, FieldSelect, FieldSlider, FieldStatus, FieldSwitch, FieldText, FieldTextArea, FieldTimePicker, FieldTimeRangePicker, FieldTreeSelect, ProField, ProFieldBadgeColor, PureProField, defaultRenderText, proFieldParsingValueEnumToArray };