envoc-form 2.0.1-7 → 2.0.1

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 (143) hide show
  1. package/README.md +7 -7
  2. package/dist/css/envoc-form-styles.css +43 -5
  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 +2 -1
  7. package/es/DatePickerInput/DatePickerInput.js +22 -5
  8. package/es/FileInput/DefaultFileList.js +12 -8
  9. package/es/FileInput/DropzoneFileInput.js +24 -23
  10. package/es/FileInput/FileInput.js +31 -9
  11. package/es/Form/Form.js +4 -2
  12. package/es/FormGroupWrapper.js +2 -1
  13. package/es/FormInput/FormInput.js +12 -6
  14. package/es/FormInputArray/FormInputArray.js +39 -24
  15. package/es/IconInput.js +2 -1
  16. package/es/ReactSelectField/ReactSelectField.js +6 -3
  17. package/es/SubmitFormButton.js +2 -1
  18. package/es/__Tests__/FormTestBase.js +5 -2
  19. package/es/normalizers.js +10 -5
  20. package/es/useStandardFormInput.js +4 -2
  21. package/es/utils/objectToFormData.js +10 -2
  22. package/lib/AddressInput/AddressInput.js +14 -8
  23. package/lib/ConfirmBaseForm/ConfirmBaseForm.js +4 -2
  24. package/lib/ConfirmDeleteForm/ConfirmDeleteForm.js +3 -1
  25. package/lib/DatePickerInput/DatePickerInput.js +25 -5
  26. package/lib/FileInput/DefaultFileList.js +20 -13
  27. package/lib/FileInput/DropzoneFileInput.js +25 -25
  28. package/lib/FileInput/FileInput.js +39 -10
  29. package/lib/Form/Form.js +11 -4
  30. package/lib/Form/FormBasedPreventNavigation.js +5 -1
  31. package/lib/FormGroupWrapper.js +3 -1
  32. package/lib/FormInput/FormInput.js +13 -6
  33. package/lib/FormInputArray/FormInputArray.js +47 -26
  34. package/lib/FormSection.js +5 -1
  35. package/lib/IconInput.js +3 -1
  36. package/lib/ReactSelectField/ReactSelectField.js +13 -5
  37. package/lib/ReactSelectField/index.js +6 -2
  38. package/lib/SubmitFormButton.js +3 -1
  39. package/lib/__Tests__/FormTestBase.js +6 -2
  40. package/lib/index.js +7 -3
  41. package/lib/normalizers.js +10 -5
  42. package/lib/useStandardFormInput.js +5 -2
  43. package/lib/utils/objectToFormData.js +10 -2
  44. package/lib/validators/index.js +5 -1
  45. package/package.json +99 -93
  46. package/src/AddressInput/AddesssInput.test.js +23 -23
  47. package/src/AddressInput/AddressInput.js +73 -73
  48. package/src/AddressInput/UsStates.js +53 -53
  49. package/src/AddressInput/__snapshots__/AddesssInput.test.js.snap +207 -207
  50. package/src/AddressInput/index.js +2 -2
  51. package/src/BoolInput/BoolInput.js +7 -7
  52. package/src/BoolInput/BoolInput.test.js +23 -23
  53. package/src/BoolInput/InlineBoolInput.js +7 -7
  54. package/src/BoolInput/__snapshots__/BoolInput.test.js.snap +89 -89
  55. package/src/BoolInput/boolOptions.js +6 -6
  56. package/src/BoolInput/index.js +4 -4
  57. package/src/ConfirmBaseForm/ConfirmBaseForm.js +37 -37
  58. package/src/ConfirmBaseForm/ConfirmBaseForm.test.js +14 -14
  59. package/src/ConfirmBaseForm/__snapshots__/ConfirmBaseForm.test.js.snap +23 -23
  60. package/src/ConfirmBaseForm/index.js +1 -1
  61. package/src/ConfirmDeleteForm/ConfirmDeleteForm.js +39 -39
  62. package/src/ConfirmDeleteForm/ConfirmDeleteForm.test.js +24 -24
  63. package/src/ConfirmDeleteForm/__snapshots__/ConfirmDeleteForm.test.js.snap +25 -25
  64. package/src/ConfirmDeleteForm/index.js +1 -1
  65. package/src/DatePickerInput/DatePickerInput.js +58 -46
  66. package/src/DatePickerInput/DatePickerInput.test.js +74 -74
  67. package/src/DatePickerInput/__snapshots__/DatePickerInput.test.js.snap +134 -134
  68. package/src/DatePickerInput/date-picker-input.scss +42 -42
  69. package/src/DatePickerInput/index.js +3 -3
  70. package/src/ErrorScrollTarget.js +6 -6
  71. package/src/FileInput/DefaultFileList.js +39 -39
  72. package/src/FileInput/DropzoneFileInput.js +56 -59
  73. package/src/FileInput/DropzoneFileInput.test.js +24 -0
  74. package/src/FileInput/FileInput.js +77 -49
  75. package/src/FileInput/FileInput.test.js +24 -15
  76. package/src/FileInput/__snapshots__/DropzoneFileInput.test.js.snap +57 -0
  77. package/src/FileInput/__snapshots__/FileInput.test.js.snap +58 -22
  78. package/src/FileInput/file-input.scss +58 -17
  79. package/src/FileInput/index.js +4 -4
  80. package/src/Form/FocusError.js +48 -48
  81. package/src/Form/Form.js +139 -138
  82. package/src/Form/Form.test.js +23 -23
  83. package/src/Form/FormBasedPreventNavigation.js +25 -25
  84. package/src/Form/ServerErrorContext.js +7 -7
  85. package/src/Form/__snapshots__/Form.test.js.snap +9 -9
  86. package/src/Form/index.js +3 -3
  87. package/src/FormGroup.js +30 -30
  88. package/src/FormGroupWrapper.js +28 -28
  89. package/src/FormInput/FormInput.js +144 -144
  90. package/src/FormInput/FormInput.test.js +66 -66
  91. package/src/FormInput/__snapshots__/FormInput.test.js.snap +323 -316
  92. package/src/FormInput/form-input.scss +9 -9
  93. package/src/FormInput/index.js +2 -2
  94. package/src/FormInputArray/FormInputArray.js +224 -210
  95. package/src/FormInputArray/FormInputArray.test.js +108 -59
  96. package/src/FormInputArray/__snapshots__/FormInputArray.test.js.snap +52 -40
  97. package/src/FormInputArray/form-input-array.scss +13 -8
  98. package/src/FormInputArray/index.js +2 -2
  99. package/src/FormSection.js +13 -13
  100. package/src/IconInput.js +31 -31
  101. package/src/InlineFormInput/InlineFormInput.js +6 -6
  102. package/src/InlineFormInput/InlineFormInput.test.js +23 -23
  103. package/src/InlineFormInput/__snapshots__/InlineFormInput.test.js.snap +26 -26
  104. package/src/InlineFormInput/index.js +3 -3
  105. package/src/InlineFormInput/inline-form-input.scss +3 -3
  106. package/src/MoneyInput/InlineMoneyInput.js +7 -7
  107. package/src/MoneyInput/MoneyInput.js +7 -7
  108. package/src/MoneyInput/MoneyInputs.test.js +43 -43
  109. package/src/MoneyInput/__snapshots__/MoneyInputs.test.js.snap +81 -81
  110. package/src/MoneyInput/index.js +4 -4
  111. package/src/MoneyInput/money-input.scss +3 -3
  112. package/src/MoneyInput/moneyInputProps.js +12 -12
  113. package/src/NestedFormFieldContext.js +6 -6
  114. package/src/ReactSelectField/ReactSelectField.js +122 -120
  115. package/src/ReactSelectField/index.js +6 -6
  116. package/src/ReactSelectField/react-select-field.scss +5 -5
  117. package/src/StandardFormActions.js +27 -27
  118. package/src/SubmitFormButton.js +28 -28
  119. package/src/__Tests__/FormTestBase.js +14 -11
  120. package/src/__Tests__/IconInput.test.js +23 -23
  121. package/src/__Tests__/StandardFormActions.test.js +23 -23
  122. package/src/__Tests__/SubmitFormButton.test.js +23 -23
  123. package/src/__Tests__/__snapshots__/IconInput.test.js.snap +38 -38
  124. package/src/__Tests__/__snapshots__/StandardFormActions.test.js.snap +25 -25
  125. package/src/__Tests__/__snapshots__/SubmitFormButton.test.js.snap +18 -18
  126. package/src/__Tests__/index.js +2 -2
  127. package/src/_variables.scss +11 -11
  128. package/src/index.js +33 -33
  129. package/src/normalizers.js +42 -32
  130. package/src/selectors.js +3 -3
  131. package/src/styles.scss +7 -7
  132. package/src/useStandardFormInput.js +118 -118
  133. package/src/utils/index.js +3 -3
  134. package/src/utils/objectContainsNonSerializableProperty.js +15 -15
  135. package/src/utils/objectContainsNonSerializableProperty.test.js +49 -49
  136. package/src/utils/objectToFormData.js +89 -83
  137. package/src/utils/objectToFormData.test.js +76 -47
  138. package/src/utils/typeChecks.js +18 -18
  139. package/src/validators/index.js +2 -2
  140. package/src/validators/validators.js +93 -93
  141. package/src/validators/validators.test.js +79 -79
  142. package/CHANGELOG.json +0 -95
  143. 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
@@ -62,13 +62,51 @@ input.money-input {
62
62
  display: none !important;
63
63
  }
64
64
 
65
- .remove-array-item {
66
- width: 35px;
65
+ section.react-dropzone > div {
67
66
  display: flex;
68
- justify-content: center;
67
+ flex: 1;
68
+ flex-direction: column;
69
69
  align-items: center;
70
- margin-bottom: auto;
71
- margin-top: 0;
70
+ border: 1px dashed #d8dbe0;
71
+ border-radius: 0.25rem;
72
+ background-color: white;
73
+ color: #8a93a2;
74
+ outline: none;
75
+ margin: 0;
76
+ padding: 20px;
77
+ transition: "border .24s ease-in-out";
78
+ cursor: pointer;
79
+ }
80
+ section.react-dropzone > div:focus, section.react-dropzone > div:focus-within {
81
+ border-color: #958bef;
82
+ box-shadow: 0 0 0 0.2rem rgba(50, 31, 219, 0.25);
83
+ }
84
+ section.react-dropzone.active > div, section.react-dropzone.accept > div {
85
+ border-color: #958bef;
86
+ box-shadow: 0 0 0 0.2rem rgba(50, 31, 219, 0.25);
87
+ }
88
+ section.react-dropzone.reject > div {
89
+ color: #e55353;
90
+ border-color: #e55353;
91
+ box-shadow: rgba(229, 83, 83, 0.25) 0px 0px 0px 3.2px;
92
+ }
93
+ section.react-dropzone.disabled > div {
94
+ background-color: #f2f2f2;
95
+ border-color: #e6e6e6;
96
+ cursor: no-drop;
97
+ }
98
+ section.react-dropzone > aside > .list-group:not(:empty) {
99
+ margin-top: 1rem;
100
+ }
101
+
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 {
109
+ display: flex;
72
110
  }
73
111
 
74
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;;;AEdJ;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,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 = ["successUrl", "form", "children"];
3
4
  import React from 'react';
4
5
  import { useHistory, useParams } from 'react-router-dom';
5
6
  import ConfirmBaseForm from '../ConfirmBaseForm';
@@ -8,7 +9,7 @@ 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
14
  var history = useHistory();
14
15
 
@@ -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);
@@ -46,7 +48,7 @@ var DatePickerInput = /*#__PURE__*/function (_React$Component) {
46
48
  onChange(null);
47
49
  } else {
48
50
  // ensure ONLY the date is persisted - so UTC offset info / time is not persisted or sent
49
- onChange(e.toISOString().split('T')[0]);
51
+ onChange(convertToTimeZoneInsensitiveISOString(e).split('T')[0]);
50
52
  }
51
53
  });
52
54
 
@@ -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
  }]);
@@ -87,4 +92,16 @@ var DatePickerInput = /*#__PURE__*/function (_React$Component) {
87
92
  return DatePickerInput;
88
93
  }(React.Component);
89
94
 
90
- export { DatePickerInput as default };
95
+ export { DatePickerInput as default };
96
+ export function convertToTimeZoneInsensitiveISOString(date) {
97
+ var year = new Intl.DateTimeFormat('en', {
98
+ year: 'numeric'
99
+ }).format(date);
100
+ var month = new Intl.DateTimeFormat('en', {
101
+ month: '2-digit'
102
+ }).format(date);
103
+ var day = new Intl.DateTimeFormat('en', {
104
+ day: '2-digit'
105
+ }).format(date);
106
+ return "".concat(year, "-").concat(month, "-").concat(day, "T00:00:00.000Z");
107
+ }
@@ -1,29 +1,33 @@
1
+ import React from 'react';
1
2
  import { ListGroupItem, ListGroup } from 'reactstrap';
2
3
  export default function DefaultFileList(_ref) {
3
4
  var files = _ref.files,
4
- rejectedFiles = _ref.rejectedFiles;
5
+ _ref$rejectedFiles = _ref.rejectedFiles,
6
+ rejectedFiles = _ref$rejectedFiles === void 0 ? [] : _ref$rejectedFiles;
5
7
  return /*#__PURE__*/React.createElement(ListGroup, null, files.map(function (file) {
6
8
  return /*#__PURE__*/React.createElement(Group, {
9
+ key: file.path,
7
10
  item: file,
8
11
  warning: false
9
12
  });
10
- }), rejectedFiles.map(function (failed) {
13
+ }), rejectedFiles.map(function (_ref2) {
14
+ var file = _ref2.file;
11
15
  return /*#__PURE__*/React.createElement(Group, {
12
- item: failed.file,
16
+ key: file.path,
17
+ item: file,
13
18
  warning: true
14
19
  });
15
20
  }));
16
21
  }
17
22
 
18
- function Group(_ref2) {
19
- var item = _ref2.item,
20
- warning = _ref2.warning;
23
+ function Group(_ref3) {
24
+ var item = _ref3.item,
25
+ warning = _ref3.warning;
21
26
  return /*#__PURE__*/React.createElement(ListGroupItem, {
22
- key: item.path,
23
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")
24
28
  }, /*#__PURE__*/React.createElement("span", {
25
29
  className: "d-flex justify-content-between w-100"
26
- }, /*#__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))));
27
31
  }
28
32
 
29
33
  function humanFileSize(size) {
@@ -1,56 +1,57 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
- import './file-input.scss';
4
- import React, { useMemo } from 'react';
3
+ import _readOnlyError from "@babel/runtime/helpers/esm/readOnlyError";
4
+ var _excluded = ["className", "onChange", "value", "accept", "disabled", "multiple", "FileList", "placeholder", "dropzone"];
5
+ import React from 'react';
5
6
  import { useDropzone } from 'react-dropzone';
6
7
  import classNames from 'classnames';
7
8
  import DefaultFileList from './DefaultFileList';
8
9
  export default function DropzoneFileInput(_ref) {
9
- var className = _ref.className,
10
+ var classNameProp = _ref.className,
10
11
  onChange = _ref.onChange,
11
12
  value = _ref.value,
12
13
  accept = _ref.accept,
13
14
  disabled = _ref.disabled,
14
- multiple = _ref.multiple,
15
+ _ref$multiple = _ref.multiple,
16
+ multiple = _ref$multiple === void 0 ? false : _ref$multiple,
15
17
  _ref$FileList = _ref.FileList,
16
18
  FileList = _ref$FileList === void 0 ? DefaultFileList : _ref$FileList,
17
19
  _ref$placeholder = _ref.placeholder,
18
- placeholder = _ref$placeholder === void 0 ? "Drag 'n' drop some files here, or click to select files" : _ref$placeholder,
19
- props = _objectWithoutProperties(_ref, ["className", "onChange", "value", "accept", "disabled", "multiple", "FileList", "placeholder"]);
20
+ placeholder = _ref$placeholder === void 0 ? 'Drag and drop some file(s) here, or click to select file(s)' : _ref$placeholder,
21
+ dropzone = _ref.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
 
44
- var classNameProp = useMemo(function () {
45
- return classNames('react-dropzone', {
46
- accept: isDragAccept,
47
- reject: isDragReject,
48
- disabled: disabled
49
- });
50
- }, [isDragAccept, isDragReject, disabled]);
47
+ var className = classNames('react-dropzone', classNameProp, {
48
+ accept: isDragAccept,
49
+ reject: isDragReject,
50
+ disabled: disabled
51
+ });
51
52
  return /*#__PURE__*/React.createElement("section", {
52
- className: classNameProp
53
- }, /*#__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, {
53
+ className: className
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, {
54
55
  files: acceptedFiles,
55
56
  rejectedFiles: fileRejections
56
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,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,7 +113,7 @@ 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
118
  var allOptions = includeEmptyOption ? [{
113
119
  label: ' ',
@@ -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',
@@ -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
  };