@kne/react-form-antd 2.0.15 → 2.0.17

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/LICENSE CHANGED
@@ -1,21 +1,21 @@
1
- MIT License
2
-
3
- Copyright (c) 2019 kne-union
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.
1
+ MIT License
2
+
3
+ Copyright (c) 2019 kne-union
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -1,35 +1,35 @@
1
- # react-form
2
- 用于表单验证的react组件
3
-
4
- ### demo
5
- ``
6
-
7
- <Avatar editor={{open: true, width: 250, height: 250, borderRadius: 1}}
8
- beforeUpload={(file) => {}}/>
9
-
10
- <Input realtime debounce={1000} name="name" label="姓名" rule="REQ TEL EXIT"/>
11
- {isShow ? <Input name="rname" label="姓名哈哈哈" rule="REQ TEL EXIT"/> : null}
12
- <Select name="select" label="选项" rule="REQ">
13
- <Select.Option value="1">选项一</Select.Option>
14
- <Select.Option value="2">选项二</Select.Option>
15
- <Select.Option value="3">选项三</Select.Option>
16
- </Select>
17
- <DatePicker name="date" label="日期" rule="REQ" format="" YYYY-MM-DD/>
18
- <RadioGroup name="radio" label="单选" rule="REQ">
19
- <RadioGroup.Radio value="1">选项一</RadioGroup.Radio>
20
- <RadioGroup.Radio value="2">选项二</RadioGroup.Radio>
21
- <RadioGroup.Radio value="3">选项三</RadioGroup.Radio>
22
- </RadioGroup>
23
-
24
- ``
25
-
26
- # Change Log
27
-
28
- 20200430 v0.1.13 添加了SelectFetch和SelectSearch控件
29
- 20200430 v0.1.14 修改Select组件样式的默认宽度为100%
30
- 20200508 v0.1.16 删除field last-child 样式 margin-bottom 为0
31
- 20200509 v0.1.17 修改导出文件结构,增加fields导出所有field组件
32
- 20200522 v0.1.20 添加头像上传组件
33
- 20200525 v0.1.22 更新@kne/react-fetch以支持setData方法
34
- 20200529 v0.1.23 添加头像上传组件field Avatar
35
- 20200603 v0.1.24 修正Switch的值转换bug
1
+ # react-form
2
+ 用于表单验证的react组件
3
+
4
+ ### demo
5
+ ``
6
+
7
+ <Avatar editor={{open: true, width: 250, height: 250, borderRadius: 1}}
8
+ beforeUpload={(file) => {}}/>
9
+
10
+ <Input realtime debounce={1000} name="name" label="姓名" rule="REQ TEL EXIT"/>
11
+ {isShow ? <Input name="rname" label="姓名哈哈哈" rule="REQ TEL EXIT"/> : null}
12
+ <Select name="select" label="选项" rule="REQ">
13
+ <Select.Option value="1">选项一</Select.Option>
14
+ <Select.Option value="2">选项二</Select.Option>
15
+ <Select.Option value="3">选项三</Select.Option>
16
+ </Select>
17
+ <DatePicker name="date" label="日期" rule="REQ" format="" YYYY-MM-DD/>
18
+ <RadioGroup name="radio" label="单选" rule="REQ">
19
+ <RadioGroup.Radio value="1">选项一</RadioGroup.Radio>
20
+ <RadioGroup.Radio value="2">选项二</RadioGroup.Radio>
21
+ <RadioGroup.Radio value="3">选项三</RadioGroup.Radio>
22
+ </RadioGroup>
23
+
24
+ ``
25
+
26
+ # Change Log
27
+
28
+ 20200430 v0.1.13 添加了SelectFetch和SelectSearch控件
29
+ 20200430 v0.1.14 修改Select组件样式的默认宽度为100%
30
+ 20200508 v0.1.16 删除field last-child 样式 margin-bottom 为0
31
+ 20200509 v0.1.17 修改导出文件结构,增加fields导出所有field组件
32
+ 20200522 v0.1.20 添加头像上传组件
33
+ 20200525 v0.1.22 更新@kne/react-fetch以支持setData方法
34
+ 20200529 v0.1.23 添加头像上传组件field Avatar
35
+ 20200603 v0.1.24 修正Switch的值转换bug
package/dist/index.js CHANGED
@@ -11,6 +11,7 @@ var AvatarEditor = require('react-avatar-editor');
11
11
  var moment = require('moment');
12
12
  var useControlValue = require('@kne/use-control-value');
13
13
  var reactFetch = require('@kne/react-fetch');
14
+ var useEvent = require('@kne/use-event');
14
15
  var groupBy = require('lodash/groupBy');
15
16
  var uniqueId = require('lodash/uniqueId');
16
17
 
@@ -25,6 +26,7 @@ var get__default = /*#__PURE__*/_interopDefaultLegacy(get);
25
26
  var AvatarEditor__default = /*#__PURE__*/_interopDefaultLegacy(AvatarEditor);
26
27
  var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
27
28
  var useControlValue__default = /*#__PURE__*/_interopDefaultLegacy(useControlValue);
29
+ var useEvent__default = /*#__PURE__*/_interopDefaultLegacy(useEvent);
28
30
  var groupBy__default = /*#__PURE__*/_interopDefaultLegacy(groupBy);
29
31
  var uniqueId__default = /*#__PURE__*/_interopDefaultLegacy(uniqueId);
30
32
 
@@ -61,7 +63,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
61
63
  return target;
62
64
  }
63
65
 
64
- var _excluded$6 = ["className", "cache", "enterSubmit", "scrollToError", "scrollProps", "type", "size", "children"];
66
+ var _excluded$7 = ["className", "cache", "enterSubmit", "scrollToError", "scrollProps", "type", "size", "children"];
65
67
  var ScrollToError = reactFormHelper.widget.ScrollToError,
66
68
  EnterSubmit = reactFormHelper.widget.EnterSubmit,
67
69
  FormStore = reactFormHelper.widget.FormStore,
@@ -76,7 +78,7 @@ var Form = React.forwardRef(function (_ref, ref) {
76
78
  type = _ref.type,
77
79
  size = _ref.size,
78
80
  children = _ref.children,
79
- props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
81
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
80
82
 
81
83
  var computedClass = 'react-form';
82
84
 
@@ -446,17 +448,23 @@ var MonthPicker = antd.DatePicker.MonthPicker,
446
448
  WeekPicker = antd.DatePicker.WeekPicker;
447
449
 
448
450
  var _DatePicker = function _DatePicker(props) {
449
- var render = useOnChange$8(props);
451
+ var render = useOnChange$8(Object.assign({
452
+ placeholder: "\u8BF7\u9009\u62E9" + props.label
453
+ }, props));
450
454
  return render(antd.DatePicker);
451
455
  };
452
456
 
453
457
  var _MonthPicker = function _MonthPicker(props) {
454
- var render = useOnChange$8(props);
458
+ var render = useOnChange$8(Object.assign({
459
+ placeholder: "\u8BF7\u9009\u62E9" + props.label
460
+ }, props));
455
461
  return render(MonthPicker);
456
462
  };
457
463
 
458
464
  var _RangePicker$1 = function _RangePicker(props) {
459
- var render = useOnChange$8(props); // if(props.selectToday){
465
+ var render = useOnChange$8(Object.assign({
466
+ placeholder: "\u8BF7\u9009\u62E9" + props.label
467
+ }, props)); // if(props.selectToday){
460
468
  // return render(RangePickerToday);
461
469
  // }
462
470
 
@@ -464,7 +472,9 @@ var _RangePicker$1 = function _RangePicker(props) {
464
472
  };
465
473
 
466
474
  var _WeekPicker = function _WeekPicker(props) {
467
- var render = useOnChange$8(props);
475
+ var render = useOnChange$8(Object.assign({
476
+ placeholder: "\u8BF7\u9009\u62E9" + props.label
477
+ }, props));
468
478
  return render(WeekPicker);
469
479
  };
470
480
 
@@ -472,9 +482,13 @@ _DatePicker.MonthPicker = _MonthPicker;
472
482
  _DatePicker.RangePicker = _RangePicker$1;
473
483
  _DatePicker.WeekPicker = _WeekPicker;
474
484
 
485
+ var _excluded$6 = ["soFarButtonText"];
475
486
  var useOnChange$7 = reactFormHelper.hooks.useOnChange;
476
487
 
477
- var PickerToday = function PickerToday(props) {
488
+ var PickerToday = function PickerToday(_ref) {
489
+ var soFarButtonText = _ref.soFarButtonText,
490
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
491
+
478
492
  // console.log('>>>>data', data);
479
493
  var _useControlValue = useControlValue__default["default"](props),
480
494
  data = _useControlValue[0],
@@ -519,7 +533,7 @@ var PickerToday = function PickerToday(props) {
519
533
  ref_d.current.blur();
520
534
  onChange([newData.start || '', '至今']);
521
535
  }
522
- }, "\u81F3\u4ECA");
536
+ }, soFarButtonText || '至今');
523
537
  };
524
538
 
525
539
  return /*#__PURE__*/React__default["default"].createElement("div", {
@@ -571,7 +585,9 @@ RangePickerToday.field = PickerToday;
571
585
  var useDecorator$2 = reactFormHelper.hooks.useDecorator;
572
586
 
573
587
  var InputField = function InputField(props) {
574
- var render = useDecorator$2(props);
588
+ var render = useDecorator$2(Object.assign({
589
+ placeholder: "\u8BF7\u8F93\u5165" + props.label
590
+ }, props));
575
591
  return render(antd.Input);
576
592
  };
577
593
 
@@ -582,7 +598,9 @@ InputField.defaultProps = {
582
598
  var useDecorator$1 = reactFormHelper.hooks.useDecorator;
583
599
 
584
600
  var InputNumberField = function InputNumberField(props) {
585
- var render = useDecorator$1(props);
601
+ var render = useDecorator$1(Object.assign({
602
+ placeholder: "\u8BF7\u8F93\u5165" + props.label
603
+ }, props));
586
604
  return render(antd.InputNumber);
587
605
  };
588
606
 
@@ -615,24 +633,55 @@ _RadioGroup.Radio = antd.Radio;
615
633
  var useOnChange$5 = reactFormHelper.hooks.useOnChange;
616
634
 
617
635
  var _Select = function _Select(props) {
618
- var render = useOnChange$5(props);
636
+ var render = useOnChange$5(Object.assign({
637
+ placeholder: "\u8BF7\u9009\u62E9" + props.label
638
+ }, props));
619
639
  return render(antd.Select);
620
640
  };
621
641
 
622
642
  _Select.Option = antd.Select.Option;
623
643
  _Select.OptGroup = antd.Select.OptGroup;
624
644
 
625
- var _excluded$4 = ["data", "setData", "refresh", "isLoading", "children"];
645
+ var _excluded$4 = ["data", "setData", "refresh", "reload", "emitter", "isLoading", "children", "onLoaded"];
626
646
  var useOnChange$4 = reactFormHelper.hooks.useOnChange;
627
647
 
628
648
  var _SelectFetch = reactFetch.withFetch(function (_ref) {
629
649
  var data = _ref.data,
630
650
  setData = _ref.setData,
631
651
  refresh = _ref.refresh,
652
+ reload = _ref.reload,
653
+ emitter = _ref.emitter,
632
654
  isLoading = _ref.isLoading,
633
655
  children = _ref.children,
656
+ onLoaded = _ref.onLoaded,
634
657
  props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
635
658
 
659
+ var refreshRef = React.useRef(refresh);
660
+ refreshRef.current = refresh;
661
+ var reloadRef = React.useRef(reload);
662
+ reloadRef.current = reload;
663
+ var setDataRef = React.useRef(setData);
664
+ setDataRef.current = setData;
665
+ var dataRef = React.useRef(data);
666
+ React.useEffect(function () {
667
+ var token1 = emitter.addListener('select-fetch-refresh', function () {
668
+ return refreshRef.current();
669
+ });
670
+ var token2 = emitter.addListener('select-fetch-reload', function () {
671
+ return reloadRef.current();
672
+ });
673
+ var token3 = emitter.addListener('select-fetch-set-data', function () {
674
+ return setDataRef.current();
675
+ });
676
+ return function () {
677
+ token1 && token1.remove();
678
+ token2 && token2.remove();
679
+ token3 && token3.remove();
680
+ };
681
+ }, [emitter]);
682
+ React.useEffect(function () {
683
+ onLoaded && onLoaded(dataRef.current);
684
+ }, []);
636
685
  return /*#__PURE__*/React__default["default"].createElement(antd.Select, props, children({
637
686
  data: data,
638
687
  refresh: refresh,
@@ -641,11 +690,28 @@ var _SelectFetch = reactFetch.withFetch(function (_ref) {
641
690
  }));
642
691
  });
643
692
 
644
- var SelectFetch$1 = function SelectFetch(props) {
645
- var render = useOnChange$4(props);
693
+ var SelectFetch$1 = React.forwardRef(function (props, ref) {
694
+ var emitter = useEvent__default["default"]();
695
+ React.useImperativeHandle(ref, function () {
696
+ return {
697
+ refresh: function refresh() {
698
+ return emitter.emit('select-fetch-refresh');
699
+ },
700
+ reload: function reload() {
701
+ return emitter.emit('select-fetch-reload');
702
+ },
703
+ setData: function setData(data) {
704
+ return emitter.emit('select-fetch-set-data', data);
705
+ }
706
+ };
707
+ }, [emitter]);
708
+ var render = useOnChange$4(Object.assign({
709
+ placeholder: "\u8BF7\u9009\u62E9" + props.label
710
+ }, props, {
711
+ emitter: emitter
712
+ }));
646
713
  return render(_SelectFetch);
647
- };
648
-
714
+ });
649
715
  SelectFetch$1.Option = antd.Select.Option;
650
716
  SelectFetch$1.OptGroup = antd.Select.OptGroup;
651
717
 
@@ -663,7 +729,9 @@ var Switch$1 = function Switch(props) {
663
729
  var useDecorator = reactFormHelper.hooks.useDecorator;
664
730
 
665
731
  var TextArea$1 = function TextArea(props) {
666
- var render = useDecorator(props);
732
+ var render = useDecorator(Object.assign({
733
+ placeholder: "\u8BF7\u8F93\u5165" + props.label
734
+ }, props));
667
735
  return render(antd.Input.TextArea);
668
736
  };
669
737
 
@@ -671,12 +739,16 @@ var useOnChange$2 = reactFormHelper.hooks.useOnChange;
671
739
  var RangePicker = antd.TimePicker.RangePicker;
672
740
 
673
741
  var _TimePicker = function _TimePicker(props) {
674
- var render = useOnChange$2(props);
742
+ var render = useOnChange$2(Object.assign({
743
+ placeholder: "\u8BF7\u9009\u62E9" + props.label
744
+ }, props));
675
745
  return render(antd.TimePicker);
676
746
  };
677
747
 
678
748
  var _RangePicker = function _RangePicker(props) {
679
- var render = useOnChange$2(props);
749
+ var render = useOnChange$2(Object.assign({
750
+ placeholder: "\u8BF7\u9009\u62E9" + props.label
751
+ }, props));
680
752
  return render(RangePicker);
681
753
  };
682
754
 
@@ -685,7 +757,9 @@ _TimePicker.RangePicker = _RangePicker;
685
757
  var useOnChange$1 = reactFormHelper.hooks.useOnChange;
686
758
 
687
759
  var _TreeSelect = function _TreeSelect(props) {
688
- var render = useOnChange$1(props);
760
+ var render = useOnChange$1(Object.assign({
761
+ placeholder: "\u8BF7\u9009\u62E9" + props.label
762
+ }, props));
689
763
  return render(antd.TreeSelect);
690
764
  };
691
765
 
@@ -876,7 +950,7 @@ var SubmitButton = function SubmitButton(_ref) {
876
950
 
877
951
  return /*#__PURE__*/React__default["default"].createElement(antd.Button, _extends({
878
952
  loading: isLoading,
879
- disabled: disabled && (realTime ? !isPass : false)
953
+ disabled: disabled || (realTime ? !isPass : false)
880
954
  }, submitProps, props));
881
955
  };
882
956