@kne/react-form-antd 4.1.8 → 4.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +57 -2
- package/dist/index.css +307 -20
- package/dist/index.css.map +1 -1
- package/dist/index.js +48 -41
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +49 -44
- package/dist/index.modern.js.map +1 -1
- package/package.json +2 -2
package/dist/index.modern.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import React__default, { forwardRef, useState, useRef, useCallback, useLayoutEffect, useEffect, useMemo
|
|
2
|
+
import React__default, { createContext, useContext, forwardRef, useState, useRef, useCallback, useLayoutEffect, useEffect, useMemo } from 'react';
|
|
3
3
|
import classnames from 'classnames';
|
|
4
4
|
import ReactForm__default, { preset as preset$2, useReset, useSubmit } from '@kne/react-form';
|
|
5
5
|
export * from '@kne/react-form';
|
|
@@ -55,7 +55,16 @@ var preset = props => {
|
|
|
55
55
|
preset$2(globalParams.rules);
|
|
56
56
|
};
|
|
57
57
|
|
|
58
|
-
|
|
58
|
+
/** 仅控制表单布局;字段弹层、字号等字段级移动端优化不读这里 */
|
|
59
|
+
const FormMobileContext = createContext(undefined);
|
|
60
|
+
const useFormMobile = () => useContext(FormMobileContext);
|
|
61
|
+
const useFormIsMobile = () => {
|
|
62
|
+
const mobile = useFormMobile();
|
|
63
|
+
const isMobile = useIsMobile();
|
|
64
|
+
return mobile === false ? false : isMobile;
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
const _excluded$7 = ["className", "cache", "enterSubmit", "scrollToError", "scrollProps", "type", "size", "mobile", "children"];
|
|
59
68
|
const {
|
|
60
69
|
ScrollToError,
|
|
61
70
|
EnterSubmit,
|
|
@@ -72,10 +81,13 @@ const Form = forwardRef((originProps, ref) => {
|
|
|
72
81
|
scrollProps = {
|
|
73
82
|
block: 'center'
|
|
74
83
|
},
|
|
84
|
+
mobile: originMobile,
|
|
75
85
|
children
|
|
76
86
|
} = originProps,
|
|
77
|
-
props = _objectWithoutPropertiesLoose(originProps, _excluded$
|
|
87
|
+
props = _objectWithoutPropertiesLoose(originProps, _excluded$7);
|
|
78
88
|
const isMobile = useIsMobile();
|
|
89
|
+
const parentMobile = useFormMobile();
|
|
90
|
+
const mobile = originMobile !== undefined ? originMobile : parentMobile !== undefined ? parentMobile : globalParams.mobile;
|
|
79
91
|
const baseClass = 'react-form';
|
|
80
92
|
let computedClass = baseClass;
|
|
81
93
|
const {
|
|
@@ -93,11 +105,13 @@ const Form = forwardRef((originProps, ref) => {
|
|
|
93
105
|
}
|
|
94
106
|
const maxLabel = /*#__PURE__*/React__default.createElement(MaxLabelProvider, null, children);
|
|
95
107
|
return /*#__PURE__*/React__default.createElement("form", {
|
|
96
|
-
className: classnames(baseClass, computedClass, isMobile && 'is-mobile', className),
|
|
108
|
+
className: classnames(baseClass, computedClass, isMobile && 'is-mobile', mobile === false && 'is-mobile-disabled', className),
|
|
97
109
|
onSubmit: e => {
|
|
98
110
|
e.preventDefault();
|
|
99
111
|
e.stopPropagation();
|
|
100
112
|
}
|
|
113
|
+
}, /*#__PURE__*/React__default.createElement(FormMobileContext.Provider, {
|
|
114
|
+
value: mobile
|
|
101
115
|
}, /*#__PURE__*/React__default.createElement(SizeProvider, {
|
|
102
116
|
value: {
|
|
103
117
|
size
|
|
@@ -108,7 +122,7 @@ const Form = forwardRef((originProps, ref) => {
|
|
|
108
122
|
cache: cache
|
|
109
123
|
}) : null, scrollToError ? /*#__PURE__*/React__default.createElement(ScrollToError, {
|
|
110
124
|
scrollProps: scrollProps
|
|
111
|
-
}) : null, enterSubmit ? /*#__PURE__*/React__default.createElement(EnterSubmit, null, maxLabel) : maxLabel)));
|
|
125
|
+
}) : null, enterSubmit ? /*#__PURE__*/React__default.createElement(EnterSubmit, null, maxLabel) : maxLabel))));
|
|
112
126
|
});
|
|
113
127
|
|
|
114
128
|
const locale$1 = {
|
|
@@ -31282,18 +31296,12 @@ const useMobileFieldPopup = ({
|
|
|
31282
31296
|
disabled: _disabled = false,
|
|
31283
31297
|
unlockTriggerWidth: _unlockTriggerWidth = false,
|
|
31284
31298
|
syncListHeight: _syncListHeight = false,
|
|
31285
|
-
dropdownVisibleEvent: _dropdownVisibleEvent = false,
|
|
31286
31299
|
anchorRef: anchorRefProp,
|
|
31287
31300
|
open: openProp,
|
|
31288
31301
|
onOpenChange,
|
|
31289
|
-
onDropdownVisibleChange,
|
|
31290
31302
|
getPopupContainer: getPopupContainerProp,
|
|
31291
31303
|
classNames: classNamesProp,
|
|
31292
31304
|
styles: stylesProp,
|
|
31293
|
-
popupClassName,
|
|
31294
|
-
dropdownClassName,
|
|
31295
|
-
popupStyle,
|
|
31296
|
-
dropdownStyle,
|
|
31297
31305
|
placement,
|
|
31298
31306
|
zIndex,
|
|
31299
31307
|
inputReadOnly,
|
|
@@ -31566,8 +31574,7 @@ const useMobileFieldPopup = ({
|
|
|
31566
31574
|
updatePopupMetrics();
|
|
31567
31575
|
}
|
|
31568
31576
|
onOpenChange && onOpenChange(next);
|
|
31569
|
-
|
|
31570
|
-
}, [controlled, isMobile, onDropdownVisibleChange, onOpenChange, updatePopupMetrics]);
|
|
31577
|
+
}, [controlled, isMobile, onOpenChange, updatePopupMetrics]);
|
|
31571
31578
|
const close = useCallback(() => {
|
|
31572
31579
|
emitOpenChange(false);
|
|
31573
31580
|
}, [emitOpenChange]);
|
|
@@ -31593,7 +31600,6 @@ const useMobileFieldPopup = ({
|
|
|
31593
31600
|
left: (_popupMetrics$left = popupMetrics.left) != null ? _popupMetrics$left : 0,
|
|
31594
31601
|
zIndex: panelZIndex
|
|
31595
31602
|
};
|
|
31596
|
-
const mergedPopupStyle = Object.assign({}, popupStyle, dropdownStyle, mobilePopupStyle);
|
|
31597
31603
|
let popupProps = {};
|
|
31598
31604
|
if (isMobile) {
|
|
31599
31605
|
popupProps = {
|
|
@@ -31604,16 +31610,9 @@ const useMobileFieldPopup = ({
|
|
|
31604
31610
|
// 位置由我们按可用空间计算,禁止 antd 再自动翻转,否则遮罩会和弹层错位
|
|
31605
31611
|
autoAdjustOverflow: false,
|
|
31606
31612
|
transitionName: '',
|
|
31607
|
-
popupClassName: classnames(popupClassName, popupClass),
|
|
31608
|
-
dropdownClassName: classnames(dropdownClassName, popupClass),
|
|
31609
|
-
popupStyle: mergedPopupStyle,
|
|
31610
|
-
dropdownStyle: mergedPopupStyle,
|
|
31611
31613
|
classNames: mergeClassNames(classNamesProp, popupClass),
|
|
31612
31614
|
styles: mergeStyles(stylesProp, mobilePopupStyle)
|
|
31613
31615
|
};
|
|
31614
|
-
if (_dropdownVisibleEvent) {
|
|
31615
|
-
popupProps.onDropdownVisibleChange = emitOpenChange;
|
|
31616
|
-
}
|
|
31617
31616
|
if (_kind === 'picker' || _kind === 'range-picker') {
|
|
31618
31617
|
popupProps.inputReadOnly = inputReadOnly !== undefined ? inputReadOnly : true;
|
|
31619
31618
|
}
|
|
@@ -31646,13 +31645,13 @@ const useMobileFieldPopup = ({
|
|
|
31646
31645
|
};
|
|
31647
31646
|
};
|
|
31648
31647
|
|
|
31649
|
-
const _excluded$
|
|
31648
|
+
const _excluded$6 = ["disableMobilePopup"];
|
|
31650
31649
|
const withMobilePopup = (WrappedComponent, options = {}) => {
|
|
31651
31650
|
const MobilePopupField = forwardRef((props, ref) => {
|
|
31652
31651
|
const {
|
|
31653
31652
|
disableMobilePopup
|
|
31654
31653
|
} = props,
|
|
31655
|
-
rest = _objectWithoutPropertiesLoose(props, _excluded$
|
|
31654
|
+
rest = _objectWithoutPropertiesLoose(props, _excluded$6);
|
|
31656
31655
|
const {
|
|
31657
31656
|
isMobile,
|
|
31658
31657
|
mask,
|
|
@@ -31662,14 +31661,9 @@ const withMobilePopup = (WrappedComponent, options = {}) => {
|
|
|
31662
31661
|
disabled: disableMobilePopup,
|
|
31663
31662
|
open: rest.open,
|
|
31664
31663
|
onOpenChange: rest.onOpenChange,
|
|
31665
|
-
onDropdownVisibleChange: rest.onDropdownVisibleChange,
|
|
31666
31664
|
getPopupContainer: rest.getPopupContainer,
|
|
31667
31665
|
classNames: rest.classNames,
|
|
31668
31666
|
styles: rest.styles,
|
|
31669
|
-
popupClassName: rest.popupClassName,
|
|
31670
|
-
dropdownClassName: rest.dropdownClassName,
|
|
31671
|
-
popupStyle: rest.popupStyle,
|
|
31672
|
-
dropdownStyle: rest.dropdownStyle,
|
|
31673
31667
|
placement: rest.placement,
|
|
31674
31668
|
zIndex: rest.zIndex,
|
|
31675
31669
|
inputReadOnly: rest.inputReadOnly,
|
|
@@ -31773,7 +31767,7 @@ const normalizeDateValue = (value, picker = 'date') => {
|
|
|
31773
31767
|
return startOfByPicker(value, picker);
|
|
31774
31768
|
};
|
|
31775
31769
|
|
|
31776
|
-
const _excluded$
|
|
31770
|
+
const _excluded$5 = ["value", "defaultValue", "format", "showTime", "picker", "onChange"];
|
|
31777
31771
|
|
|
31778
31772
|
/**
|
|
31779
31773
|
* Wrap antd picker so string/number initial values from form/API become dayjs.
|
|
@@ -31794,7 +31788,7 @@ const withDayjsValue = (WrappedComponent, options = {}) => {
|
|
|
31794
31788
|
picker,
|
|
31795
31789
|
onChange
|
|
31796
31790
|
} = _ref,
|
|
31797
|
-
props = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
31791
|
+
props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
31798
31792
|
const mergedPicker = picker || defaultPicker;
|
|
31799
31793
|
const shouldStripTime = stripTime && !showTime;
|
|
31800
31794
|
const mergedValue = useMemo(() => {
|
|
@@ -31951,8 +31945,7 @@ const {
|
|
|
31951
31945
|
const MobileSelect = withMobilePopup(Select, {
|
|
31952
31946
|
kind: 'select',
|
|
31953
31947
|
unlockTriggerWidth: true,
|
|
31954
|
-
syncListHeight: true
|
|
31955
|
-
dropdownVisibleEvent: true
|
|
31948
|
+
syncListHeight: true
|
|
31956
31949
|
});
|
|
31957
31950
|
const SelectInner = props => {
|
|
31958
31951
|
const {
|
|
@@ -31975,7 +31968,7 @@ SelectInner.Option = Select.Option;
|
|
|
31975
31968
|
SelectInner.OptGroup = Select.OptGroup;
|
|
31976
31969
|
const _Select = withLocale(SelectInner);
|
|
31977
31970
|
|
|
31978
|
-
const _excluded$
|
|
31971
|
+
const _excluded$4 = ["onChange"];
|
|
31979
31972
|
const {
|
|
31980
31973
|
useOnChange: useOnChange$7
|
|
31981
31974
|
} = hooks;
|
|
@@ -31983,7 +31976,7 @@ const RadioGroup = _ref => {
|
|
|
31983
31976
|
let {
|
|
31984
31977
|
onChange
|
|
31985
31978
|
} = _ref,
|
|
31986
|
-
props = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
31979
|
+
props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
31987
31980
|
props = Object.assign({}, {
|
|
31988
31981
|
fieldName: 'radioGroup'
|
|
31989
31982
|
}, props);
|
|
@@ -32489,7 +32482,7 @@ if (process.env.NODE_ENV !== 'production') {
|
|
|
32489
32482
|
}
|
|
32490
32483
|
var CloseCircleFilled$1 = RefIcon;
|
|
32491
32484
|
|
|
32492
|
-
const _excluded$
|
|
32485
|
+
const _excluded$3 = ["soFarText", "soFarValue", "picker", "placeholder"];
|
|
32493
32486
|
const {
|
|
32494
32487
|
useOnChange: useOnChange$6
|
|
32495
32488
|
} = hooks;
|
|
@@ -32500,7 +32493,7 @@ const PickerTodayInner = _ref => {
|
|
|
32500
32493
|
picker = 'date',
|
|
32501
32494
|
placeholder
|
|
32502
32495
|
} = _ref,
|
|
32503
|
-
props = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
32496
|
+
props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
32504
32497
|
const {
|
|
32505
32498
|
formatMessage
|
|
32506
32499
|
} = useIntl();
|
|
@@ -32978,18 +32971,26 @@ const Slider = props => {
|
|
|
32978
32971
|
};
|
|
32979
32972
|
Slider.Field = Slider$1;
|
|
32980
32973
|
|
|
32981
|
-
const
|
|
32974
|
+
const _excluded$2 = ["className"];
|
|
32975
|
+
const ResetButton = _ref => {
|
|
32976
|
+
let {
|
|
32977
|
+
className
|
|
32978
|
+
} = _ref,
|
|
32979
|
+
props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
32982
32980
|
const resetProps = useReset();
|
|
32983
|
-
return /*#__PURE__*/React__default.createElement(Button, _extends$3({}, resetProps, props
|
|
32981
|
+
return /*#__PURE__*/React__default.createElement(Button, _extends$3({}, resetProps, props, {
|
|
32982
|
+
className: classnames('react-form__action-button', className)
|
|
32983
|
+
}));
|
|
32984
32984
|
};
|
|
32985
32985
|
|
|
32986
|
-
const _excluded$1 = ["type", "realtime", "disabled"],
|
|
32986
|
+
const _excluded$1 = ["type", "realtime", "disabled", "className"],
|
|
32987
32987
|
_excluded2 = ["isPass", "isLoading"];
|
|
32988
32988
|
const SubmitButton = _ref => {
|
|
32989
32989
|
let {
|
|
32990
32990
|
type = 'primary',
|
|
32991
32991
|
realtime,
|
|
32992
|
-
disabled = false
|
|
32992
|
+
disabled = false,
|
|
32993
|
+
className
|
|
32993
32994
|
} = _ref,
|
|
32994
32995
|
props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
32995
32996
|
const _useSubmit = useSubmit(props),
|
|
@@ -33002,20 +33003,24 @@ const SubmitButton = _ref => {
|
|
|
33002
33003
|
type: type,
|
|
33003
33004
|
loading: isLoading,
|
|
33004
33005
|
disabled: disabled || (realtime ? !isPass : false)
|
|
33005
|
-
}, props, submitProps
|
|
33006
|
+
}, props, submitProps, {
|
|
33007
|
+
className: classnames('react-form__action-button', className)
|
|
33008
|
+
}));
|
|
33006
33009
|
};
|
|
33007
33010
|
|
|
33008
|
-
const _excluded = ["onClick"];
|
|
33011
|
+
const _excluded = ["onClick", "className"];
|
|
33009
33012
|
const {
|
|
33010
33013
|
useCacheRemove
|
|
33011
33014
|
} = hooks;
|
|
33012
33015
|
const CancelButton = _ref => {
|
|
33013
33016
|
let {
|
|
33014
|
-
onClick
|
|
33017
|
+
onClick,
|
|
33018
|
+
className
|
|
33015
33019
|
} = _ref,
|
|
33016
33020
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
33017
33021
|
const remove = useCacheRemove();
|
|
33018
33022
|
return /*#__PURE__*/React__default.createElement(Button, _extends$3({}, props, {
|
|
33023
|
+
className: classnames('react-form__action-button', className),
|
|
33019
33024
|
onClick: (...args) => {
|
|
33020
33025
|
remove();
|
|
33021
33026
|
onClick && onClick(...args);
|
|
@@ -33042,5 +33047,5 @@ const fields = {
|
|
|
33042
33047
|
Slider
|
|
33043
33048
|
};
|
|
33044
33049
|
|
|
33045
|
-
export { CancelButton, Cascader, Checkbox, CheckboxGroup, _DatePicker as DatePicker, RangePickerToday as DatePickerToday, FormAntd, InputField as Input, InputNumberField as InputNumber, _RadioGroup as RadioGroup, Rate, ResetButton, _Select as Select, Slider, SubmitButton, Switch, TextArea, _TimePicker as TimePicker, _TreeSelect as TreeSelect, Form as default, fields, preset };
|
|
33050
|
+
export { CancelButton, Cascader, Checkbox, CheckboxGroup, _DatePicker as DatePicker, RangePickerToday as DatePickerToday, FormAntd, FormMobileContext, InputField as Input, InputNumberField as InputNumber, _RadioGroup as RadioGroup, Rate, ResetButton, _Select as Select, Slider, SubmitButton, Switch, TextArea, _TimePicker as TimePicker, _TreeSelect as TreeSelect, Form as default, fields, preset, useFormIsMobile, useFormMobile };
|
|
33046
33051
|
//# sourceMappingURL=index.modern.js.map
|