envoc-form 2.0.1-8 → 3.0.0

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.
Files changed (144) hide show
  1. package/README.md +7 -7
  2. package/dist/css/envoc-form-styles.css +7 -6
  3. package/dist/css/envoc-form-styles.css.map +1 -1
  4. package/es/AddressInput/AddressInput.js +7 -6
  5. package/es/ConfirmBaseForm/ConfirmBaseForm.js +3 -2
  6. package/es/ConfirmDeleteForm/ConfirmDeleteForm.js +6 -5
  7. package/es/DatePickerInput/DatePickerInput.js +8 -3
  8. package/es/FileInput/DefaultFileList.js +3 -2
  9. package/es/FileInput/DropzoneFileInput.js +15 -12
  10. package/es/FileInput/FileInput.js +31 -9
  11. package/es/Form/Form.js +4 -2
  12. package/es/Form/FormBasedPreventNavigation.js +4 -7
  13. package/es/FormGroupWrapper.js +2 -1
  14. package/es/FormInput/FormInput.js +14 -8
  15. package/es/FormInputArray/FormInputArray.js +39 -24
  16. package/es/IconInput.js +2 -1
  17. package/es/ReactSelectField/ReactSelectField.js +6 -3
  18. package/es/SubmitFormButton.js +2 -1
  19. package/es/__Tests__/FormTestBase.js +5 -2
  20. package/es/normalizers.js +10 -5
  21. package/es/useStandardFormInput.js +4 -2
  22. package/es/utils/objectToFormData.js +10 -2
  23. package/lib/AddressInput/AddressInput.js +14 -8
  24. package/lib/ConfirmBaseForm/ConfirmBaseForm.js +4 -2
  25. package/lib/ConfirmDeleteForm/ConfirmDeleteForm.js +6 -4
  26. package/lib/DatePickerInput/DatePickerInput.js +9 -3
  27. package/lib/FileInput/DefaultFileList.js +3 -2
  28. package/lib/FileInput/DropzoneFileInput.js +17 -12
  29. package/lib/FileInput/FileInput.js +39 -10
  30. package/lib/Form/Form.js +11 -4
  31. package/lib/Form/FormBasedPreventNavigation.js +4 -10
  32. package/lib/FormGroupWrapper.js +3 -1
  33. package/lib/FormInput/FormInput.js +15 -8
  34. package/lib/FormInputArray/FormInputArray.js +47 -26
  35. package/lib/FormSection.js +5 -1
  36. package/lib/IconInput.js +3 -1
  37. package/lib/ReactSelectField/ReactSelectField.js +13 -5
  38. package/lib/ReactSelectField/index.js +6 -2
  39. package/lib/SubmitFormButton.js +3 -1
  40. package/lib/__Tests__/FormTestBase.js +6 -2
  41. package/lib/index.js +7 -3
  42. package/lib/normalizers.js +10 -5
  43. package/lib/useStandardFormInput.js +5 -2
  44. package/lib/utils/objectToFormData.js +10 -2
  45. package/lib/validators/index.js +5 -1
  46. package/package.json +99 -92
  47. package/src/AddressInput/AddesssInput.test.js +23 -23
  48. package/src/AddressInput/AddressInput.js +73 -73
  49. package/src/AddressInput/UsStates.js +53 -53
  50. package/src/AddressInput/__snapshots__/AddesssInput.test.js.snap +207 -207
  51. package/src/AddressInput/index.js +2 -2
  52. package/src/BoolInput/BoolInput.js +7 -7
  53. package/src/BoolInput/BoolInput.test.js +23 -23
  54. package/src/BoolInput/InlineBoolInput.js +7 -7
  55. package/src/BoolInput/__snapshots__/BoolInput.test.js.snap +89 -89
  56. package/src/BoolInput/boolOptions.js +6 -6
  57. package/src/BoolInput/index.js +4 -4
  58. package/src/ConfirmBaseForm/ConfirmBaseForm.js +37 -37
  59. package/src/ConfirmBaseForm/ConfirmBaseForm.test.js +14 -14
  60. package/src/ConfirmBaseForm/__snapshots__/ConfirmBaseForm.test.js.snap +23 -23
  61. package/src/ConfirmBaseForm/index.js +1 -1
  62. package/src/ConfirmDeleteForm/ConfirmDeleteForm.js +39 -39
  63. package/src/ConfirmDeleteForm/ConfirmDeleteForm.test.js +24 -24
  64. package/src/ConfirmDeleteForm/__snapshots__/ConfirmDeleteForm.test.js.snap +25 -25
  65. package/src/ConfirmDeleteForm/index.js +1 -1
  66. package/src/DatePickerInput/DatePickerInput.js +49 -46
  67. package/src/DatePickerInput/DatePickerInput.test.js +74 -74
  68. package/src/DatePickerInput/__snapshots__/DatePickerInput.test.js.snap +134 -134
  69. package/src/DatePickerInput/date-picker-input.scss +42 -42
  70. package/src/DatePickerInput/index.js +3 -3
  71. package/src/ErrorScrollTarget.js +6 -6
  72. package/src/FileInput/DefaultFileList.js +39 -39
  73. package/src/FileInput/DropzoneFileInput.js +56 -55
  74. package/src/FileInput/DropzoneFileInput.test.js +24 -15
  75. package/src/FileInput/FileInput.js +77 -49
  76. package/src/FileInput/FileInput.test.js +24 -15
  77. package/src/FileInput/__snapshots__/DropzoneFileInput.test.js.snap +57 -28
  78. package/src/FileInput/__snapshots__/FileInput.test.js.snap +58 -22
  79. package/src/FileInput/file-input.scss +57 -57
  80. package/src/FileInput/index.js +4 -4
  81. package/src/Form/FocusError.js +48 -48
  82. package/src/Form/Form.js +139 -138
  83. package/src/Form/Form.test.js +23 -23
  84. package/src/Form/FormBasedPreventNavigation.js +25 -25
  85. package/src/Form/ServerErrorContext.js +7 -7
  86. package/src/Form/__snapshots__/Form.test.js.snap +9 -9
  87. package/src/Form/index.js +3 -3
  88. package/src/FormGroup.js +30 -30
  89. package/src/FormGroupWrapper.js +28 -28
  90. package/src/FormInput/FormInput.js +145 -144
  91. package/src/FormInput/FormInput.test.js +66 -66
  92. package/src/FormInput/__snapshots__/FormInput.test.js.snap +323 -316
  93. package/src/FormInput/form-input.scss +9 -9
  94. package/src/FormInput/index.js +2 -2
  95. package/src/FormInputArray/FormInputArray.js +224 -210
  96. package/src/FormInputArray/FormInputArray.test.js +108 -59
  97. package/src/FormInputArray/__snapshots__/FormInputArray.test.js.snap +52 -40
  98. package/src/FormInputArray/form-input-array.scss +13 -8
  99. package/src/FormInputArray/index.js +2 -2
  100. package/src/FormSection.js +13 -13
  101. package/src/IconInput.js +31 -31
  102. package/src/InlineFormInput/InlineFormInput.js +6 -6
  103. package/src/InlineFormInput/InlineFormInput.test.js +23 -23
  104. package/src/InlineFormInput/__snapshots__/InlineFormInput.test.js.snap +26 -26
  105. package/src/InlineFormInput/index.js +3 -3
  106. package/src/InlineFormInput/inline-form-input.scss +3 -3
  107. package/src/MoneyInput/InlineMoneyInput.js +7 -7
  108. package/src/MoneyInput/MoneyInput.js +7 -7
  109. package/src/MoneyInput/MoneyInputs.test.js +43 -43
  110. package/src/MoneyInput/__snapshots__/MoneyInputs.test.js.snap +81 -81
  111. package/src/MoneyInput/index.js +4 -4
  112. package/src/MoneyInput/money-input.scss +3 -3
  113. package/src/MoneyInput/moneyInputProps.js +12 -12
  114. package/src/NestedFormFieldContext.js +6 -6
  115. package/src/ReactSelectField/ReactSelectField.js +122 -120
  116. package/src/ReactSelectField/index.js +6 -6
  117. package/src/ReactSelectField/react-select-field.scss +5 -5
  118. package/src/StandardFormActions.js +27 -27
  119. package/src/SubmitFormButton.js +28 -28
  120. package/src/__Tests__/FormTestBase.js +14 -11
  121. package/src/__Tests__/IconInput.test.js +23 -23
  122. package/src/__Tests__/StandardFormActions.test.js +23 -23
  123. package/src/__Tests__/SubmitFormButton.test.js +23 -23
  124. package/src/__Tests__/__snapshots__/IconInput.test.js.snap +38 -38
  125. package/src/__Tests__/__snapshots__/StandardFormActions.test.js.snap +25 -25
  126. package/src/__Tests__/__snapshots__/SubmitFormButton.test.js.snap +18 -18
  127. package/src/__Tests__/index.js +2 -2
  128. package/src/_variables.scss +11 -11
  129. package/src/index.js +33 -33
  130. package/src/normalizers.js +42 -32
  131. package/src/selectors.js +3 -3
  132. package/src/styles.scss +7 -7
  133. package/src/useStandardFormInput.js +118 -118
  134. package/src/utils/index.js +3 -3
  135. package/src/utils/objectContainsNonSerializableProperty.js +15 -15
  136. package/src/utils/objectContainsNonSerializableProperty.test.js +49 -49
  137. package/src/utils/objectToFormData.js +89 -83
  138. package/src/utils/objectToFormData.test.js +76 -47
  139. package/src/utils/typeChecks.js +18 -18
  140. package/src/validators/index.js +2 -2
  141. package/src/validators/validators.js +93 -93
  142. package/src/validators/validators.test.js +79 -79
  143. package/CHANGELOG.json +0 -95
  144. package/CHANGELOG.md +0 -58
package/README.md CHANGED
@@ -1,8 +1,8 @@
1
- # envoc-form
2
-
3
- [![npm package][npm-badge]][npm]
4
-
5
- Base form package for envoc projects.
6
-
7
- [npm-badge]: https://img.shields.io/npm/v/envoc-form.png?style=flat
1
+ # envoc-form
2
+
3
+ [![npm package][npm-badge]][npm]
4
+
5
+ Base form package for envoc projects.
6
+
7
+ [npm-badge]: https://img.shields.io/npm/v/envoc-form.png?style=flat
8
8
  [npm]: https://www.npmjs.com/package/envoc-form
@@ -99,13 +99,14 @@ section.react-dropzone > aside > .list-group:not(:empty) {
99
99
  margin-top: 1rem;
100
100
  }
101
101
 
102
- .remove-array-item {
103
- width: 35px;
102
+ .field-array-card {
103
+ margin-bottom: 1rem;
104
+ }
105
+ .field-array-card .field-array-item.removed {
106
+ display: none;
107
+ }
108
+ .field-array-card .field-array-item > .remove-array-item {
104
109
  display: flex;
105
- justify-content: center;
106
- align-items: center;
107
- margin-bottom: auto;
108
- margin-top: 0;
109
110
  }
110
111
 
111
112
  div.react-select-input.has-error {
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../src/DatePickerInput/date-picker-input.scss","../../src/InlineFormInput/inline-form-input.scss","../../src/MoneyInput/money-input.scss","../../src/FormInput/form-input.scss","../../src/FileInput/file-input.scss","../../src/_variables.scss","../../src/FormInputArray/form-input-array.scss","../../src/ReactSelectField/react-select-field.scss"],"names":[],"mappings":"AAEA;EACE;;AACA;EACE;EACA;;AAEF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAEF;EACE;EACA;;AACA;EACE;;AAIJ;EACE;;;ACvCJ;EACE;;;ACDF;EACE;;;ACDF;EACE;;;AAIA;EACE;;;ACFA;EACE;;;AAKN;EACE,kBCFgC;EDGhC,cCF4B;;ADG5B;EACE;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EAEE;EACA;;AAGJ;EAEE;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE,kBCzC8B;ED0C9B,cCzC0B;ED0C1B;;AAEF;EACE;;;AEvDJ;EACE;EACA;EACA;EACA;EACA;EACA;;;ACJF;EACE,cFDI","file":"envoc-form-styles.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../../src/DatePickerInput/date-picker-input.scss","../../src/InlineFormInput/inline-form-input.scss","../../src/MoneyInput/money-input.scss","../../src/FormInput/form-input.scss","../../src/FileInput/file-input.scss","../../src/_variables.scss","../../src/FormInputArray/form-input-array.scss","../../src/ReactSelectField/react-select-field.scss"],"names":[],"mappings":"AAEA;EACE;;AACA;EACE;EACA;;AAEF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAEF;EACE;EACA;;AACA;EACE;;AAIJ;EACE;;;ACvCJ;EACE;;;ACDF;EACE;;;ACDF;EACE;;;AAIA;EACE;;;ACFA;EACE;;;AAKN;EACE,kBCFgC;EDGhC,cCF4B;;ADG5B;EACE;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EAEE;EACA;;AAGJ;EAEE;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE,kBCzC8B;ED0C9B,cCzC0B;ED0C1B;;AAEF;EACE;;;AEvDJ;EACE;;AAGE;EACE;;AAGF;EACE;;;ACPN;EACE,cFDI","file":"envoc-form-styles.css"}
@@ -5,10 +5,11 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
5
5
  import _inherits from "@babel/runtime/helpers/esm/inherits";
6
6
  import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
7
7
  import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
8
+ var _excluded = ["name"];
8
9
 
9
10
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
10
11
 
11
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
12
+ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
12
13
 
13
14
  import React from 'react';
14
15
  import { Col, Row } from 'reactstrap';
@@ -35,7 +36,7 @@ var AddressInput = /*#__PURE__*/function (_React$Component) {
35
36
  value: function render() {
36
37
  var _this$props = this.props,
37
38
  name = _this$props.name,
38
- props = _objectWithoutProperties(_this$props, ["name"]);
39
+ props = _objectWithoutProperties(_this$props, _excluded);
39
40
 
40
41
  return /*#__PURE__*/React.createElement(FormSection, _extends({
41
42
  name: name
@@ -84,10 +85,10 @@ var AddressInput = /*#__PURE__*/function (_React$Component) {
84
85
 
85
86
  export { AddressInput as default };
86
87
  AddressInput.propTypes = {
87
- /**
88
- * The key that the resulting values should be nested under within the form values.
89
- * If name prop were chicken the submitted form values would look like: {chicken: {address1:...}}
90
- * this allows us to have two address inputs inside the same form (shipping and billing address)
88
+ /**
89
+ * The key that the resulting values should be nested under within the form values.
90
+ * If name prop were chicken the submitted form values would look like: {chicken: {address1:...}}
91
+ * this allows us to have two address inputs inside the same form (shipping and billing address)
91
92
  */
92
93
  name: PropTypes.string
93
94
  };
@@ -1,8 +1,9 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
4
+ var _excluded = ["handleCancel", "request", "yesColor", "style", "title"];
4
5
 
5
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
6
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
6
7
 
7
8
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
8
9
 
@@ -16,7 +17,7 @@ export default function ConfirmBaseForm(_ref) {
16
17
  yesColor = _ref$yesColor === void 0 ? 'danger' : _ref$yesColor,
17
18
  style = _ref.style,
18
19
  title = _ref.title,
19
- props = _objectWithoutProperties(_ref, ["handleCancel", "request", "yesColor", "style", "title"]);
20
+ props = _objectWithoutProperties(_ref, _excluded);
20
21
 
21
22
  var webRequest = useAxiosRequest(Object.assign({}, request, {
22
23
  autoExecute: false
@@ -1,16 +1,17 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
+ var _excluded = ["successUrl", "form", "children"];
3
4
  import React from 'react';
4
- import { useHistory, useParams } from 'react-router-dom';
5
+ import { useNavigate, useParams } from 'react-router-dom';
5
6
  import ConfirmBaseForm from '../ConfirmBaseForm';
6
7
  import { toast } from 'react-toastify';
7
8
  export default function ConfirmDeleteForm(_ref) {
8
9
  var successUrl = _ref.successUrl,
9
10
  form = _ref.form,
10
11
  children = _ref.children,
11
- props = _objectWithoutProperties(_ref, ["successUrl", "form", "children"]);
12
+ props = _objectWithoutProperties(_ref, _excluded);
12
13
 
13
- var history = useHistory();
14
+ var navigate = useNavigate();
14
15
 
15
16
  var _useParams = useParams(),
16
17
  entityId = _useParams.entityId;
@@ -31,9 +32,9 @@ export default function ConfirmDeleteForm(_ref) {
31
32
 
32
33
  function goBack() {
33
34
  if (successUrl) {
34
- history.push(successUrl);
35
+ navigate(successUrl);
35
36
  } else {
36
- history.back();
37
+ navigate(-1);
37
38
  }
38
39
  }
39
40
  }
@@ -7,16 +7,18 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
7
7
  import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
8
8
  import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
9
9
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
10
+ var _excluded = ["value", "className", "maxDate"];
10
11
 
11
12
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
12
13
 
13
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
14
+ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
14
15
 
15
16
  import React from 'react';
16
17
  import DatePicker from 'react-date-picker';
17
18
  import parseISO from 'date-fns/parseISO';
18
19
  import classnames from 'classnames';
19
20
  var dateOnlyRegex = /^\d{4}-\d{2}-\d{2}$/;
21
+ var defaultMaxDate = new Date('9999-12-31');
20
22
 
21
23
  var DatePickerInput = /*#__PURE__*/function (_React$Component) {
22
24
  _inherits(DatePickerInput, _React$Component);
@@ -59,7 +61,9 @@ var DatePickerInput = /*#__PURE__*/function (_React$Component) {
59
61
  var _this$props = this.props,
60
62
  value = _this$props.value,
61
63
  className = _this$props.className,
62
- rest = _objectWithoutProperties(_this$props, ["value", "className"]);
64
+ _this$props$maxDate = _this$props.maxDate,
65
+ maxDate = _this$props$maxDate === void 0 ? defaultMaxDate : _this$props$maxDate,
66
+ rest = _objectWithoutProperties(_this$props, _excluded);
63
67
 
64
68
  if (value && !dateOnlyRegex.test(value)) {
65
69
  var errorMessage = "Invalid date only value of ".concat(value, " passed to DatePicker input. This input is only configured to handle dates in the format yyyy-mm-dd. Ensure that the server is configured to return date only values.");
@@ -79,7 +83,8 @@ var DatePickerInput = /*#__PURE__*/function (_React$Component) {
79
83
  }, rest, {
80
84
  value: parsedValue,
81
85
  onChange: this.handleChange,
82
- onBlur: this.handleBlur
86
+ onBlur: this.handleBlur,
87
+ maxDate: maxDate
83
88
  }));
84
89
  }
85
90
  }]);
@@ -2,7 +2,8 @@ import React from 'react';
2
2
  import { ListGroupItem, ListGroup } from 'reactstrap';
3
3
  export default function DefaultFileList(_ref) {
4
4
  var files = _ref.files,
5
- rejectedFiles = _ref.rejectedFiles;
5
+ _ref$rejectedFiles = _ref.rejectedFiles,
6
+ rejectedFiles = _ref$rejectedFiles === void 0 ? [] : _ref$rejectedFiles;
6
7
  return /*#__PURE__*/React.createElement(ListGroup, null, files.map(function (file) {
7
8
  return /*#__PURE__*/React.createElement(Group, {
8
9
  key: file.path,
@@ -26,7 +27,7 @@ function Group(_ref3) {
26
27
  color: "d-flex ".concat(warning ? 'warning' : 'success', " justify-content-between list-group-item ").concat(warning ? 'list-group-item-warning' : 'list-group-item-success', " px-3 py-1 rounded-1")
27
28
  }, /*#__PURE__*/React.createElement("span", {
28
29
  className: "d-flex justify-content-between w-100"
29
- }, /*#__PURE__*/React.createElement("span", null, item.path), " ", /*#__PURE__*/React.createElement("span", null, humanFileSize(item.size))));
30
+ }, /*#__PURE__*/React.createElement("span", null, item.name), " ", /*#__PURE__*/React.createElement("span", null, humanFileSize(item.size))));
30
31
  }
31
32
 
32
33
  function humanFileSize(size) {
@@ -1,5 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
+ import _readOnlyError from "@babel/runtime/helpers/esm/readOnlyError";
4
+ var _excluded = ["className", "onChange", "value", "accept", "disabled", "multiple", "FileList", "placeholder", "dropzone"];
3
5
  import React from 'react';
4
6
  import { useDropzone } from 'react-dropzone';
5
7
  import classNames from 'classnames';
@@ -10,34 +12,35 @@ export default function DropzoneFileInput(_ref) {
10
12
  value = _ref.value,
11
13
  accept = _ref.accept,
12
14
  disabled = _ref.disabled,
13
- multiple = _ref.multiple,
15
+ _ref$multiple = _ref.multiple,
16
+ multiple = _ref$multiple === void 0 ? false : _ref$multiple,
14
17
  _ref$FileList = _ref.FileList,
15
18
  FileList = _ref$FileList === void 0 ? DefaultFileList : _ref$FileList,
16
19
  _ref$placeholder = _ref.placeholder,
17
- placeholder = _ref$placeholder === void 0 ? 'Drag and drop some files here, or click to select files' : _ref$placeholder,
20
+ placeholder = _ref$placeholder === void 0 ? 'Drag and drop some file(s) here, or click to select file(s)' : _ref$placeholder,
18
21
  dropzone = _ref.dropzone,
19
- props = _objectWithoutProperties(_ref, ["className", "onChange", "value", "accept", "disabled", "multiple", "FileList", "placeholder", "dropzone"]);
22
+ props = _objectWithoutProperties(_ref, _excluded);
20
23
 
21
24
  var _useDropzone = useDropzone({
22
25
  accept: accept,
23
26
  onDrop: onDrop,
24
- disabled: disabled
27
+ disabled: disabled,
28
+ multiple: multiple
25
29
  }),
26
- acceptedFiles = _useDropzone.acceptedFiles,
27
- fileRejections = _useDropzone.fileRejections,
30
+ _useDropzone$accepted = _useDropzone.acceptedFiles,
31
+ acceptedFiles = _useDropzone$accepted === void 0 ? (acceptedFiles[0], _readOnlyError("acceptedFiles")) : _useDropzone$accepted,
32
+ _useDropzone$fileReje = _useDropzone.fileRejections,
33
+ fileRejections = _useDropzone$fileReje === void 0 ? fileRejections.push(acceptedFiles.slice(1, acceptedFiles.length)) : _useDropzone$fileReje,
28
34
  getRootProps = _useDropzone.getRootProps,
29
35
  getInputProps = _useDropzone.getInputProps,
30
36
  isDragAccept = _useDropzone.isDragAccept,
31
37
  isDragReject = _useDropzone.isDragReject;
32
38
 
33
39
  function onDrop(acceptedFiles) {
34
- if (acceptedFiles !== null && acceptedFiles !== void 0 && acceptedFiles.length) {
40
+ if (!(acceptedFiles !== null && acceptedFiles !== void 0 && acceptedFiles.length) > 1 && !multiple) {
35
41
  onChange(null);
36
- } else if (multiple) {
37
- onChange(acceptedFiles);
38
42
  } else {
39
- var target = acceptedFiles[0];
40
- onChange(target);
43
+ onChange(acceptedFiles);
41
44
  }
42
45
  }
43
46
 
@@ -48,7 +51,7 @@ export default function DropzoneFileInput(_ref) {
48
51
  });
49
52
  return /*#__PURE__*/React.createElement("section", {
50
53
  className: className
51
- }, /*#__PURE__*/React.createElement("div", getRootProps(), /*#__PURE__*/React.createElement("input", _extends({}, props, getInputProps())), /*#__PURE__*/React.createElement(React.Fragment, null, placeholder)), /*#__PURE__*/React.createElement("aside", null, /*#__PURE__*/React.createElement(FileList, {
54
+ }, /*#__PURE__*/React.createElement("div", getRootProps(), /*#__PURE__*/React.createElement("input", _extends({}, props, getInputProps())), /*#__PURE__*/React.createElement(React.Fragment, null, placeholder), !multiple && /*#__PURE__*/React.createElement("b", null, "Only one file accepted."), accept && /*#__PURE__*/React.createElement("b", null, "Files of type \"".concat(accept, "\" accepted"))), /*#__PURE__*/React.createElement("aside", null, /*#__PURE__*/React.createElement(FileList, {
52
55
  files: acceptedFiles,
53
56
  rejectedFiles: fileRejections
54
57
  })));
@@ -1,35 +1,57 @@
1
+ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
1
2
  import _extends from "@babel/runtime/helpers/esm/extends";
3
+ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
4
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
- import React, { useEffect, useRef } from 'react';
5
+ var _excluded = ["className", "onChange", "value", "multiple"];
6
+ import React, { useEffect, useRef, useState } from 'react';
7
+ import DefaultFileList from './DefaultFileList';
4
8
  export default function FileInput(_ref) {
5
9
  var className = _ref.className,
6
10
  onChange = _ref.onChange,
7
11
  value = _ref.value,
8
- props = _objectWithoutProperties(_ref, ["className", "onChange", "value"]);
12
+ _ref$multiple = _ref.multiple,
13
+ multiple = _ref$multiple === void 0 ? false : _ref$multiple,
14
+ props = _objectWithoutProperties(_ref, _excluded);
9
15
 
10
16
  var inputRef = useRef();
17
+
18
+ var _useState = useState([]),
19
+ _useState2 = _slicedToArray(_useState, 2),
20
+ acceptedFiles = _useState2[0],
21
+ setAcceptedFiles = _useState2[1];
22
+
11
23
  useEffect(function () {
12
24
  if (!value && inputRef.current) {
13
25
  inputRef.current.value = null;
14
26
  }
15
27
  }, [value]);
16
- return /*#__PURE__*/React.createElement("div", {
28
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
17
29
  className: "custom-file file-input ".concat(className || '', " ").concat(props.disabled ? 'disabled' : '')
18
- }, /*#__PURE__*/React.createElement("input", _extends({
30
+ }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", _extends({
19
31
  ref: inputRef,
20
32
  type: "file",
21
33
  className: "custom-file-input",
22
- onChange: handleChange
23
- }, props)), /*#__PURE__*/React.createElement("label", {
34
+ onChange: handleChange,
35
+ multiple: multiple
36
+ }, props))), /*#__PURE__*/React.createElement("label", {
24
37
  className: "custom-file-label"
25
- }, !value && /*#__PURE__*/React.createElement("span", null, "Choose A File..."), value && /*#__PURE__*/React.createElement("span", null, value.name, " - size: ", humanFileSize(value.size))));
38
+ }, /*#__PURE__*/React.createElement("div", null, !value && /*#__PURE__*/React.createElement("span", null, "Choose A File..."), value && (!multiple ? /*#__PURE__*/React.createElement("span", null, value.name, " - size: ", humanFileSize(value.size)) : value.length === 1 ? /*#__PURE__*/React.createElement("span", null, value[0].name, " - size: ", humanFileSize(value[0].size)) : /*#__PURE__*/React.createElement("span", null, "Multiple files selected."))))), /*#__PURE__*/React.createElement(DefaultFileList, {
39
+ files: acceptedFiles
40
+ }));
26
41
 
27
42
  function handleChange(e) {
28
43
  if (e == null || !e.target || !e.target.files.length) {
29
44
  onChange(null);
30
45
  } else {
31
- var target = e.target.files[0];
32
- onChange(target);
46
+ var files = _toConsumableArray(e.target.files);
47
+
48
+ setAcceptedFiles(files);
49
+
50
+ if (!multiple) {
51
+ onChange(files[0]);
52
+ } else {
53
+ onChange(files);
54
+ }
33
55
  }
34
56
  }
35
57
  }
package/es/Form/Form.js CHANGED
@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
3
3
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
4
4
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
5
+ var _excluded = ["children", "className", "style", "ignoreLostChanges", "onSubmit", "initialValues"];
5
6
  import React, { useState, useMemo, useContext } from 'react';
6
7
  import PropTypes from 'prop-types';
7
8
  import FocusError from './FocusError';
@@ -16,7 +17,7 @@ export default function Form(_ref) {
16
17
  ignoreLostChanges = _ref.ignoreLostChanges,
17
18
  onSubmit = _ref.onSubmit,
18
19
  initialValues = _ref.initialValues,
19
- props = _objectWithoutProperties(_ref, ["children", "className", "style", "ignoreLostChanges", "onSubmit", "initialValues"]);
20
+ props = _objectWithoutProperties(_ref, _excluded);
20
21
 
21
22
  // formik resets all error on each blur (with our settings)
22
23
  // this means that ALL errors from the server disappear when any one field is blurred
@@ -64,7 +65,8 @@ export default function Form(_ref) {
64
65
  formData = objectToFormData(values, {
65
66
  indices: true,
66
67
  dotNotation: true,
67
- allowEmptyArrays: true
68
+ allowEmptyArrays: true,
69
+ noFileListBrackets: true
68
70
  });
69
71
  }
70
72
 
@@ -1,5 +1,4 @@
1
- import React, { useEffect } from 'react';
2
- import { Prompt } from 'react-router-dom';
1
+ import { useEffect } from 'react';
3
2
  import { useFormikContext } from 'formik';
4
3
  export default function FormBasedPreventNavigation(_ref) {
5
4
  var ignoreLostChanges = _ref.ignoreLostChanges,
@@ -25,9 +24,7 @@ export default function FormBasedPreventNavigation(_ref) {
25
24
  e.preventDefault();
26
25
  e.returnValue = promptMessage;
27
26
  }
28
- }, [preventNavigate, promptMessage]);
29
- return /*#__PURE__*/React.createElement(Prompt, {
30
- when: preventNavigate,
31
- message: promptMessage
32
- });
27
+ }, [preventNavigate, promptMessage]); // TODO: https://reactrouter.com/docs/en/v6/upgrading/v5#prompt-is-not-currently-supported
28
+
29
+ return null;
33
30
  }
@@ -1,5 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
+ var _excluded = ["prepend", "append", "Component", "helpText"];
3
4
  import React from 'react';
4
5
  import { InputGroup } from 'reactstrap';
5
6
  import FormGroup from './FormGroup';
@@ -9,7 +10,7 @@ export default function FormGroupWrapper(_ref) {
9
10
  append = _ref.append,
10
11
  Component = _ref.Component,
11
12
  helpText = _ref.helpText,
12
- props = _objectWithoutProperties(_ref, ["prepend", "append", "Component", "helpText"]);
13
+ props = _objectWithoutProperties(_ref, _excluded);
13
14
 
14
15
  var meta = props.meta;
15
16
  return /*#__PURE__*/React.createElement(FormGroup, _extends({
@@ -2,6 +2,12 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
3
  import _extends from "@babel/runtime/helpers/esm/extends";
4
4
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
5
+ var _excluded = ["className", "meta", "helpText"],
6
+ _excluded2 = ["meta"],
7
+ _excluded3 = ["includeEmptyOption", "options"],
8
+ _excluded4 = ["optionsUrl", "includeEmptyOption", "includeOtherOption", "cache", "maxAge"],
9
+ _excluded5 = ["meta"],
10
+ _excluded6 = ["helpText", "meta"];
5
11
  import React from 'react';
6
12
  import classnames from 'classnames';
7
13
  import { Input as BootstrapInput, FormFeedback, CustomInput, FormText, Alert } from 'reactstrap';
@@ -86,7 +92,7 @@ var TextAreaInput = function TextAreaInput(_ref) {
86
92
  var className = _ref.className,
87
93
  meta = _ref.meta,
88
94
  helpText = _ref.helpText,
89
- props = _objectWithoutProperties(_ref, ["className", "meta", "helpText"]);
95
+ props = _objectWithoutProperties(_ref, _excluded);
90
96
 
91
97
  return /*#__PURE__*/React.createElement(TextareaAutosize, _extends({
92
98
  cacheMeasurements: true,
@@ -96,7 +102,7 @@ var TextAreaInput = function TextAreaInput(_ref) {
96
102
 
97
103
  var DefaultInput = function DefaultInput(_ref2) {
98
104
  var meta = _ref2.meta,
99
- props = _objectWithoutProperties(_ref2, ["meta"]);
105
+ props = _objectWithoutProperties(_ref2, _excluded2);
100
106
 
101
107
  return /*#__PURE__*/React.createElement(BootstrapInput, _extends({
102
108
  invalid: !!meta.error
@@ -107,9 +113,9 @@ var Select = function Select(_ref3) {
107
113
  var _ref3$includeEmptyOpt = _ref3.includeEmptyOption,
108
114
  includeEmptyOption = _ref3$includeEmptyOpt === void 0 ? true : _ref3$includeEmptyOpt,
109
115
  options = _ref3.options,
110
- props = _objectWithoutProperties(_ref3, ["includeEmptyOption", "options"]);
116
+ props = _objectWithoutProperties(_ref3, _excluded3);
111
117
 
112
- var allOptions = includeEmptyOption ? [{
118
+ var allOptions = includeEmptyOption && !props.isMulti ? [{
113
119
  label: ' ',
114
120
  value: null
115
121
  }].concat(_toConsumableArray(options)) : options;
@@ -135,7 +141,7 @@ var RemoteSelect = function RemoteSelect(_ref4) {
135
141
  cache = _ref4$cache === void 0 ? optionCache : _ref4$cache,
136
142
  _ref4$maxAge = _ref4.maxAge,
137
143
  maxAge = _ref4$maxAge === void 0 ? 1000 * 10 : _ref4$maxAge,
138
- props = _objectWithoutProperties(_ref4, ["optionsUrl", "includeEmptyOption", "includeOtherOption", "cache", "maxAge"]);
144
+ props = _objectWithoutProperties(_ref4, _excluded4);
139
145
 
140
146
  var request = {
141
147
  method: 'get',
@@ -160,7 +166,7 @@ var RemoteSelect = function RemoteSelect(_ref4) {
160
166
  value: ''
161
167
  });
162
168
  } else {
163
- if (includeEmptyOption) {
169
+ if (includeEmptyOption && !props.isMulti) {
164
170
  options.push({
165
171
  label: ' ',
166
172
  value: null
@@ -184,7 +190,7 @@ var RemoteSelect = function RemoteSelect(_ref4) {
184
190
 
185
191
  var DatePicker = function DatePicker(_ref5) {
186
192
  var meta = _ref5.meta,
187
- props = _objectWithoutProperties(_ref5, ["meta"]);
193
+ props = _objectWithoutProperties(_ref5, _excluded5);
188
194
 
189
195
  return /*#__PURE__*/React.createElement(DatePickerInput, _extends({}, props, {
190
196
  className: meta.error ? 'is-invalid' : ''
@@ -194,7 +200,7 @@ var DatePicker = function DatePicker(_ref5) {
194
200
  var Checkbox = function Checkbox(_ref6) {
195
201
  var helpText = _ref6.helpText,
196
202
  meta = _ref6.meta,
197
- props = _objectWithoutProperties(_ref6, ["helpText", "meta"]);
203
+ props = _objectWithoutProperties(_ref6, _excluded6);
198
204
 
199
205
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CustomInput, props), meta.error && /*#__PURE__*/React.createElement(FormFeedback, null, meta.error), helpText && /*#__PURE__*/React.createElement(FormText, null, helpText));
200
206
  };