@kne/react-form-antd 2.0.23 → 2.0.26

package/dist/index.modern.js

@@ -12,8 +12,8 @@ import { LoadingOutlined, PlusOutlined, UploadOutlined } from '@ant-design/icons
 import AvatarEditor from 'react-avatar-editor';
 import moment from 'moment';
 import useControlValue from '@kne/use-control-value';
-import { withFetch } from '@kne/react-fetch';
 import useEvent from '@kne/use-event';
+import { withFetch as withFetch$1 } from '@kne/react-fetch';
 import groupBy from 'lodash/groupBy';
 import uniqueId from 'lodash/uniqueId';
 
@@ -50,7 +50,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
-const _excluded$7 = ["className", "cache", "enterSubmit", "scrollToError", "scrollProps", "type", "size", "children"];
+const _excluded$8 = ["className", "cache", "enterSubmit", "scrollToError", "scrollProps", "type", "size", "children"];
 const {
   ScrollToError,
   EnterSubmit,
@@ -69,7 +69,7 @@ const Form = forwardRef((_ref, ref) => {
     size,
     children
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$8);
 
   let computedClass = 'react-form';
 
@@ -156,7 +156,7 @@ var preset = (props => {
 });
 
 const {
-  useOnChange: useOnChange$c
+  useOnChange: useOnChange$d
 } = hooks;
 const avatarParams = globalParams.field.avatar;
 
@@ -382,23 +382,23 @@ _Avatar.defaultProps = {
 };
 
 const AvatarInput = props => {
-  const render = useOnChange$c(props);
+  const render = useOnChange$d(props);
   return render(_Avatar);
 };
 
 AvatarInput.field = _Avatar;
 
 const {
-  useOnChange: useOnChange$b
+  useOnChange: useOnChange$c
 } = hooks;
 
 const Cascader$1 = props => {
-  const render = useOnChange$b(props);
+  const render = useOnChange$c(props);
   return render(Cascader$2);
 };
 
 const {
-  useOnChange: useOnChange$a,
+  useOnChange: useOnChange$b,
   useCheckedToValue: useCheckedToValue$1
 } = hooks;
 const {
@@ -408,24 +408,42 @@ const WithCheckbox = withChecked$1(Checkbox$2);
 
 const Checkbox$1 = props => {
   const checkedProps = useCheckedToValue$1(props);
-  const render = useOnChange$a(checkedProps);
+  const render = useOnChange$b(checkedProps);
   return render(WithCheckbox);
 };
 
 const {
-  useOnChange: useOnChange$9
+  useOnChange: useOnChange$a
 } = hooks;
 const _CheckboxGroup = Checkbox$2.Group;
 
 const CheckboxGroup$1 = props => {
-  const render = useOnChange$9(props);
+  const render = useOnChange$a(props);
   return render(_CheckboxGroup);
 };
 
 CheckboxGroup$1.Checkbox = Checkbox$2;
 
+const getPopupContainer = triggerNode => {
+  const findAntdPopupContainer = el => {
+    if (el === document.body || !el.parentElement) {
+      return document.body;
+    }
+
+    const targetEl = [].slice.call(el.classList, 0).find(className => ['ant-modal-content', 'ant-popover-content'].indexOf(className) > -1);
+
+    if (targetEl) {
+      return el;
+    }
+
+    return findAntdPopupContainer(el.parentElement);
+  };
+
+  return findAntdPopupContainer(triggerNode);
+};
+
 const {
-  useOnChange: useOnChange$8
+  useOnChange: useOnChange$9
 } = hooks;
 const {
   MonthPicker,
@@ -434,22 +452,26 @@ const {
 } = DatePicker$1;
 
 const _DatePicker = props => {
-  const render = useOnChange$8(Object.assign({
-    placeholder: `请选择${props.label}`
+  const render = useOnChange$9(Object.assign({
+    placeholder: ['开始时间', '结束时间']
   }, props));
   return render(DatePicker$1);
 };
 
+_DatePicker.defaultProps = {
+  getPopupContainer
+};
+
 const _MonthPicker = props => {
-  const render = useOnChange$8(Object.assign({
-    placeholder: `请选择${props.label}`
+  const render = useOnChange$9(Object.assign({
+    placeholder: ['开始时间', '结束时间']
   }, props));
   return render(MonthPicker);
 };
 
 const _RangePicker$1 = props => {
-  const render = useOnChange$8(Object.assign({
-    placeholder: `请选择${props.label}`
+  const render = useOnChange$9(Object.assign({
+    placeholder: ['开始时间', '结束时间']
   }, props)); // if(props.selectToday){
   //     return render(RangePickerToday);
   // }
@@ -457,27 +479,34 @@ const _RangePicker$1 = props => {
   return render(RangePicker$1);
 };
 
+_RangePicker$1.defaultProps = {
+  getPopupContainer
+};
+
 const _WeekPicker = props => {
-  const render = useOnChange$8(Object.assign({
-    placeholder: `请选择${props.label}`
+  const render = useOnChange$9(Object.assign({
+    placeholder: ['开始时间', '结束时间']
   }, props));
   return render(WeekPicker);
 };
 
+_WeekPicker.defaultProps = {
+  getPopupContainer
+};
 _DatePicker.MonthPicker = _MonthPicker;
 _DatePicker.RangePicker = _RangePicker$1;
 _DatePicker.WeekPicker = _WeekPicker;
 
-const _excluded$6 = ["soFarText"];
+const _excluded$7 = ["soFarText"];
 const {
-  useOnChange: useOnChange$7
+  useOnChange: useOnChange$8
 } = hooks;
 
 const PickerToday = _ref => {
   let {
     soFarText
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
 
   const [data, onChange] = useControlValue(props);
   const ref_d = useRef();
@@ -562,7 +591,7 @@ const PickerToday = _ref => {
 };
 
 const RangePickerToday = props => {
-  const render = useOnChange$7(props);
+  const render = useOnChange$8(props);
   return render(PickerToday);
 };
 
@@ -579,10 +608,6 @@ const InputField = props => {
   return render(Input$1);
 };
 
-InputField.defaultProps = {
-  autoComplete: 'off'
-};
-
 InputField.Password = props => {
   const render = useDecorator$2(Object.assign({
     placeholder: `请输入${props.label}`
@@ -590,6 +615,10 @@ InputField.Password = props => {
   return render(Input$1.Password);
 };
 
+InputField.Password.defaultProps = InputField.defaultProps = {
+  autoComplete: 'off'
+};
+
 const {
   useDecorator: useDecorator$1
 } = hooks;
@@ -605,16 +634,16 @@ InputNumberField.defaultProps = {
   autoComplete: 'off'
 };
 
-const _excluded$5 = ["onChange"];
+const _excluded$6 = ["onChange"];
 const {
-  useOnChange: useOnChange$6
+  useOnChange: useOnChange$7
 } = hooks;
 
 const RadioGroup$1 = _ref => {
   let {
     onChange
   } = _ref,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
 
   const handler = useCallback(e => {
     onChange && onChange(e.target.value);
@@ -625,32 +654,103 @@ const RadioGroup$1 = _ref => {
 };
 
 const _RadioGroup = props => {
-  const render = useOnChange$6(props);
+  const render = useOnChange$7(props);
   return render(RadioGroup$1);
 };
 
 _RadioGroup.Radio = Radio;
 
+const _excluded$5 = ["data", "setData", "refresh", "reload", "fetchEmitter", "isLoading", "children", "onLoaded", "fetchProps"];
+const {
+  useOnChange: useOnChange$6
+} = hooks;
+
+const withFetch = WrappedComponent => {
+  const FieldInner = withFetch$1(_ref => {
+    let {
+      data,
+      setData,
+      refresh,
+      reload,
+      fetchEmitter,
+      isLoading,
+      children,
+      onLoaded,
+      fetchProps
+    } = _ref,
+        props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
+
+    const refreshRef = useRef(refresh);
+    refreshRef.current = refresh;
+    const reloadRef = useRef(reload);
+    reloadRef.current = reload;
+    const setDataRef = useRef(setData);
+    setDataRef.current = setData;
+    const dataRef = useRef(data);
+    useEffect(() => {
+      const token1 = fetchEmitter.addListener('select-fetch-refresh', () => refreshRef.current());
+      const token2 = fetchEmitter.addListener('select-fetch-reload', () => reloadRef.current());
+      const token3 = fetchEmitter.addListener('select-fetch-set-data', () => setDataRef.current());
+      return () => {
+        token1 && token1.remove();
+        token2 && token2.remove();
+        token3 && token3.remove();
+      };
+    }, [fetchEmitter]);
+    useEffect(() => {
+      onLoaded && onLoaded(dataRef.current);
+    }, []);
+    return /*#__PURE__*/React.createElement(WrappedComponent, _extends({}, props, children({
+      data,
+      fetchProps,
+      refresh,
+      isLoading,
+      setData
+    })));
+  });
+  const Fetch = forwardRef((props, ref) => {
+    const emitter = useEvent();
+    useImperativeHandle(ref, () => {
+      return {
+        refresh: () => emitter.emit('select-fetch-refresh'),
+        reload: () => emitter.emit('select-fetch-reload'),
+        setData: data => emitter.emit('select-fetch-set-data', data)
+      };
+    }, [emitter]);
+    const render = useOnChange$6(Object.assign({
+      placeholder: `请选择${props.label}`
+    }, props, {
+      fetchEmitter: emitter
+    }));
+    return render(FieldInner);
+  });
+  return Fetch;
+};
+
 const {
   useOnChange: useOnChange$5
 } = hooks;
 
 const _Select = props => {
   const render = useOnChange$5(Object.assign({
-    placeholder: `请选择${props.label}`
+    placeholder: `请选择${props.label || ''}`
   }, props));
   return render(Select$1);
 };
 
+_Select.Fetch = withFetch(Select$1);
 _Select.Option = Select$1.Option;
 _Select.OptGroup = Select$1.OptGroup;
+_Select.defaultProps = _Select.Fetch.defaultProps = {
+  getPopupContainer
+};
 
-const _excluded$4 = ["data", "setData", "refresh", "reload", "emitter", "isLoading", "children", "onLoaded"];
+const _excluded$4 = ["data", "setData", "refresh", "reload", "emitter", "isLoading", "children", "onLoaded", "fetchProps"];
 const {
   useOnChange: useOnChange$4
 } = hooks;
 
-const _SelectFetch = withFetch(_ref => {
+const _SelectFetch = withFetch$1(_ref => {
   let {
     data,
     setData,
@@ -671,6 +771,7 @@ const _SelectFetch = withFetch(_ref => {
   setDataRef.current = setData;
   const dataRef = useRef(data);
   useEffect(() => {
+    console.warn('请使用Select.Fetch替代该组件，该组件会在未来某个版本被移除');
     const token1 = emitter.addListener('select-fetch-refresh', () => refreshRef.current());
     const token2 = emitter.addListener('select-fetch-reload', () => reloadRef.current());
     const token3 = emitter.addListener('select-fetch-set-data', () => setDataRef.current());
@@ -720,6 +821,9 @@ SelectFetch$1.field = forwardRef((props, ref) => {
     emitter: emitter
   }));
 });
+SelectFetch$1.defaultProps = {
+  getPopupContainer
+};
 SelectFetch$1.Option = Select$1.Option;
 SelectFetch$1.OptGroup = Select$1.OptGroup;
 
@@ -758,18 +862,25 @@ const {
 
 const _TimePicker = props => {
   const render = useOnChange$2(Object.assign({
-    placeholder: `请选择${props.label}`
+    placeholder: `请选择${props.label || ''}`
   }, props));
   return render(TimePicker$1);
 };
 
+_TimePicker.defaultProps = {
+  getPopupContainer
+};
+
 const _RangePicker = props => {
   const render = useOnChange$2(Object.assign({
-    placeholder: `请选择${props.label}`
+    placeholder: `请选择${props.label || ''}`
   }, props));
   return render(RangePicker);
 };
 
+_RangePicker.defaultProps = {
+  getPopupContainer
+};
 _TimePicker.RangePicker = _RangePicker;
 
 const {
@@ -778,11 +889,15 @@ const {
 
 const _TreeSelect = props => {
   const render = useOnChange$1(Object.assign({
-    placeholder: `请选择${props.label}`
+    placeholder: `请选择${props.label || ''}`
   }, props));
   return render(TreeSelect$1);
 };
 
+_TreeSelect.Fetch = withFetch(Select$1);
+_TreeSelect.defaultProps = _TreeSelect.Fetch.defaultProps = {
+  getPopupContainer
+};
 _TreeSelect.TreeNode = TreeSelect$1.TreeNode;
 
 const _excluded$3 = ["action", "value", "onChange", "drag", "children", "displayFilename", "accept", "fileSize", "onError", "onUploadComplete", "onBeforeUpload", "maxLength", "transformResponse"];
@@ -979,7 +1094,7 @@ const ResetButton = props => {
 
 const _excluded$1 = ["className", "formProps", "footer", "children"],
       _excluded2 = ["className", "title", "formProps", "footer", "content"];
-const FetchForm = withFetch(Form);
+const FetchForm = withFetch$1(Form);
 
 const CommonModal = ({
   formProps,