envoc-form 3.1.0 → 4.0.1-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 (422) hide show
  1. package/README.md +10 -1
  2. package/dist/css/envoc-form-styles.css +0 -113
  3. package/dist/css/envoc-form-styles.css.map +1 -1
  4. package/es/AddressInput/AddressInput.d.ts +15 -0
  5. package/es/AddressInput/AddressInput.js +21 -97
  6. package/es/AddressInput/UsStates.d.ts +3 -0
  7. package/es/AddressInput/UsStates.js +53 -152
  8. package/es/ConfirmBaseForm/ConfirmBaseForm.d.ts +10 -0
  9. package/es/ConfirmBaseForm/ConfirmBaseForm.js +35 -43
  10. package/es/ConfirmDeleteForm/ConfirmDeleteForm.d.ts +11 -0
  11. package/es/ConfirmDeleteForm/ConfirmDeleteForm.js +54 -40
  12. package/es/DatePickerInput/DatePickerInput.d.ts +14 -0
  13. package/es/DatePickerInput/DatePickerInput.js +63 -95
  14. package/es/Field/CustomFieldInputProps.d.ts +7 -0
  15. package/es/Field/CustomFieldInputProps.js +1 -0
  16. package/es/Field/CustomFieldMetaProps.d.ts +4 -0
  17. package/es/Field/CustomFieldMetaProps.js +1 -0
  18. package/es/Field/Field.d.ts +22 -0
  19. package/es/Field/Field.js +46 -0
  20. package/es/Field/FieldErrorScrollTarget.d.ts +2 -0
  21. package/es/Field/FieldErrorScrollTarget.js +11 -0
  22. package/es/Field/FieldNameContext.d.ts +3 -0
  23. package/es/Field/FieldNameContext.js +3 -0
  24. package/es/Field/FieldSection.d.ts +7 -0
  25. package/es/Field/FieldSection.js +20 -0
  26. package/es/Field/InjectedFieldProps.d.ts +7 -0
  27. package/es/Field/InjectedFieldProps.js +1 -0
  28. package/es/Field/useStandardField.d.ts +15 -0
  29. package/es/Field/useStandardField.js +93 -0
  30. package/es/FieldArray/FieldArray.d.ts +15 -0
  31. package/es/FieldArray/FieldArray.js +80 -0
  32. package/es/File/FileGroup.d.ts +8 -0
  33. package/es/File/FileGroup.js +50 -0
  34. package/es/File/FileList.d.ts +6 -0
  35. package/es/File/FileList.js +20 -0
  36. package/es/File/humanFileSize.d.ts +1 -0
  37. package/es/File/humanFileSize.js +6 -0
  38. package/es/Form/FocusError.d.ts +5 -0
  39. package/es/Form/FocusError.js +41 -53
  40. package/es/Form/Form.d.ts +22 -0
  41. package/es/Form/Form.js +111 -125
  42. package/es/Form/FormBasedPreventNavigation.d.ts +5 -0
  43. package/es/Form/FormBasedPreventNavigation.js +53 -30
  44. package/es/Form/ServerErrorContext.d.ts +10 -0
  45. package/es/Form/ServerErrorContext.js +8 -6
  46. package/es/FormActions.d.ts +7 -0
  47. package/es/FormActions.js +22 -0
  48. package/es/Group.d.ts +13 -0
  49. package/es/Group.js +22 -0
  50. package/es/Input/IconInputGroup.d.ts +9 -0
  51. package/es/Input/IconInputGroup.js +40 -0
  52. package/es/Input/InputGroup.d.ts +12 -0
  53. package/es/Input/InputGroup.js +33 -0
  54. package/es/Input/MoneyInputGroup.d.ts +7 -0
  55. package/es/Input/MoneyInputGroup.js +41 -0
  56. package/es/Input/NumberInputGroup.d.ts +7 -0
  57. package/es/Input/NumberInputGroup.js +41 -0
  58. package/es/Input/StringInputGroup.d.ts +7 -0
  59. package/es/Input/StringInputGroup.js +40 -0
  60. package/es/Normalization/NormalizationFunction.d.ts +4 -0
  61. package/es/Normalization/NormalizationFunction.js +1 -0
  62. package/es/Normalization/normalizers.d.ts +2 -0
  63. package/es/Normalization/normalizers.js +30 -0
  64. package/es/Select/BooleanSelectGroup.d.ts +7 -0
  65. package/es/Select/BooleanSelectGroup.js +27 -0
  66. package/es/Select/NumberSelectGroup.d.ts +8 -0
  67. package/es/Select/NumberSelectGroup.js +19 -0
  68. package/es/Select/SelectGroup.d.ts +22 -0
  69. package/es/Select/SelectGroup.js +59 -0
  70. package/es/Select/SelectGroupPropsHelper.d.ts +3 -0
  71. package/es/Select/SelectGroupPropsHelper.js +1 -0
  72. package/es/Select/StringSelectGroup.d.ts +8 -0
  73. package/es/Select/StringSelectGroup.js +19 -0
  74. package/es/StandardFormActions.d.ts +6 -0
  75. package/es/StandardFormActions.js +23 -24
  76. package/es/SubmitFormButton.d.ts +7 -0
  77. package/es/SubmitFormButton.js +37 -23
  78. package/es/Validation/ValidatedApiResult.d.ts +6 -0
  79. package/es/Validation/ValidatedApiResult.js +1 -0
  80. package/es/Validation/ValidationError.d.ts +5 -0
  81. package/es/Validation/ValidationError.js +1 -0
  82. package/es/Validation/ValidationFunction.d.ts +4 -0
  83. package/es/Validation/ValidationFunction.js +1 -0
  84. package/es/Validation/validators.d.ts +15 -0
  85. package/es/Validation/validators.js +73 -0
  86. package/es/__Tests__/FormTestBase.d.ts +27 -0
  87. package/es/__Tests__/FormTestBase.js +83 -12
  88. package/{src/__Tests__/index.js → es/__Tests__/index.d.ts} +0 -0
  89. package/es/__Tests__/index.js +2 -2
  90. package/es/index.d.ts +57 -0
  91. package/es/index.js +41 -20
  92. package/es/utils/objectContainsNonSerializableProperty.d.ts +1 -0
  93. package/es/utils/objectContainsNonSerializableProperty.js +14 -16
  94. package/es/utils/objectToFormData.d.ts +10 -0
  95. package/es/utils/objectToFormData.js +77 -65
  96. package/es/utils/typeChecks.d.ts +8 -0
  97. package/es/utils/typeChecks.js +18 -25
  98. package/lib/AddressInput/AddressInput.d.ts +15 -0
  99. package/lib/AddressInput/AddressInput.js +27 -123
  100. package/lib/AddressInput/UsStates.d.ts +3 -0
  101. package/lib/AddressInput/UsStates.js +55 -159
  102. package/lib/ConfirmBaseForm/ConfirmBaseForm.d.ts +10 -0
  103. package/lib/ConfirmBaseForm/ConfirmBaseForm.js +41 -57
  104. package/lib/ConfirmDeleteForm/ConfirmDeleteForm.d.ts +11 -0
  105. package/lib/ConfirmDeleteForm/ConfirmDeleteForm.js +60 -56
  106. package/lib/DatePickerInput/DatePickerInput.d.ts +14 -0
  107. package/lib/DatePickerInput/DatePickerInput.js +69 -113
  108. package/lib/Field/CustomFieldInputProps.d.ts +7 -0
  109. package/lib/Field/CustomFieldInputProps.js +2 -0
  110. package/lib/Field/CustomFieldMetaProps.d.ts +4 -0
  111. package/lib/Field/CustomFieldMetaProps.js +2 -0
  112. package/lib/Field/Field.d.ts +22 -0
  113. package/lib/Field/Field.js +51 -0
  114. package/lib/Field/FieldErrorScrollTarget.d.ts +2 -0
  115. package/lib/Field/FieldErrorScrollTarget.js +14 -0
  116. package/lib/Field/FieldNameContext.d.ts +3 -0
  117. package/lib/Field/FieldNameContext.js +9 -0
  118. package/lib/Field/FieldSection.d.ts +7 -0
  119. package/lib/Field/FieldSection.js +23 -0
  120. package/lib/Field/InjectedFieldProps.d.ts +7 -0
  121. package/lib/Field/InjectedFieldProps.js +2 -0
  122. package/lib/Field/useStandardField.d.ts +15 -0
  123. package/lib/Field/useStandardField.js +96 -0
  124. package/lib/FieldArray/FieldArray.d.ts +15 -0
  125. package/lib/FieldArray/FieldArray.js +86 -0
  126. package/lib/File/FileGroup.d.ts +8 -0
  127. package/lib/File/FileGroup.js +55 -0
  128. package/lib/File/FileList.d.ts +6 -0
  129. package/lib/File/FileList.js +23 -0
  130. package/lib/File/humanFileSize.d.ts +1 -0
  131. package/lib/File/humanFileSize.js +10 -0
  132. package/lib/Form/FocusError.d.ts +5 -0
  133. package/lib/Form/FocusError.js +47 -66
  134. package/lib/Form/Form.d.ts +22 -0
  135. package/lib/Form/Form.js +117 -153
  136. package/lib/Form/FormBasedPreventNavigation.d.ts +5 -0
  137. package/lib/Form/FormBasedPreventNavigation.js +56 -39
  138. package/lib/Form/ServerErrorContext.d.ts +10 -0
  139. package/lib/Form/ServerErrorContext.js +14 -18
  140. package/lib/FormActions.d.ts +7 -0
  141. package/lib/FormActions.js +28 -0
  142. package/lib/Group.d.ts +13 -0
  143. package/lib/Group.js +28 -0
  144. package/lib/Input/IconInputGroup.d.ts +9 -0
  145. package/lib/Input/IconInputGroup.js +45 -0
  146. package/lib/Input/InputGroup.d.ts +12 -0
  147. package/lib/Input/InputGroup.js +38 -0
  148. package/lib/Input/MoneyInputGroup.d.ts +7 -0
  149. package/lib/Input/MoneyInputGroup.js +46 -0
  150. package/lib/Input/NumberInputGroup.d.ts +7 -0
  151. package/lib/Input/NumberInputGroup.js +46 -0
  152. package/lib/Input/StringInputGroup.d.ts +7 -0
  153. package/lib/Input/StringInputGroup.js +45 -0
  154. package/lib/Normalization/NormalizationFunction.d.ts +4 -0
  155. package/lib/Normalization/NormalizationFunction.js +2 -0
  156. package/lib/Normalization/normalizers.d.ts +2 -0
  157. package/lib/Normalization/normalizers.js +35 -0
  158. package/lib/Select/BooleanSelectGroup.d.ts +7 -0
  159. package/lib/Select/BooleanSelectGroup.js +34 -0
  160. package/lib/Select/NumberSelectGroup.d.ts +8 -0
  161. package/lib/Select/NumberSelectGroup.js +27 -0
  162. package/lib/Select/SelectGroup.d.ts +22 -0
  163. package/lib/Select/SelectGroup.js +65 -0
  164. package/lib/Select/SelectGroupPropsHelper.d.ts +3 -0
  165. package/lib/Select/SelectGroupPropsHelper.js +2 -0
  166. package/lib/Select/StringSelectGroup.d.ts +8 -0
  167. package/lib/Select/StringSelectGroup.js +27 -0
  168. package/lib/StandardFormActions.d.ts +6 -0
  169. package/lib/StandardFormActions.js +29 -37
  170. package/lib/SubmitFormButton.d.ts +7 -0
  171. package/lib/SubmitFormButton.js +42 -38
  172. package/lib/Validation/ValidatedApiResult.d.ts +6 -0
  173. package/lib/Validation/ValidatedApiResult.js +2 -0
  174. package/lib/Validation/ValidationError.d.ts +5 -0
  175. package/lib/Validation/ValidationError.js +2 -0
  176. package/lib/Validation/ValidationFunction.d.ts +4 -0
  177. package/lib/Validation/ValidationFunction.js +2 -0
  178. package/lib/Validation/validators.d.ts +15 -0
  179. package/lib/Validation/validators.js +86 -0
  180. package/lib/__Tests__/FormTestBase.d.ts +27 -0
  181. package/lib/__Tests__/FormTestBase.js +86 -25
  182. package/lib/__Tests__/index.d.ts +2 -0
  183. package/lib/__Tests__/index.js +8 -15
  184. package/lib/index.d.ts +57 -0
  185. package/lib/index.js +101 -174
  186. package/lib/utils/objectContainsNonSerializableProperty.d.ts +1 -0
  187. package/lib/utils/objectContainsNonSerializableProperty.js +17 -24
  188. package/lib/utils/objectToFormData.d.ts +10 -0
  189. package/lib/utils/objectToFormData.js +79 -73
  190. package/lib/utils/typeChecks.d.ts +8 -0
  191. package/lib/utils/typeChecks.js +29 -58
  192. package/package.json +106 -100
  193. package/src/AddressInput/{AddesssInput.test.js → AddressInput.test.tsx} +7 -3
  194. package/src/AddressInput/AddressInput.tsx +72 -0
  195. package/src/AddressInput/{UsStates.js → UsStates.ts} +3 -1
  196. package/src/AddressInput/__snapshots__/AddressInput.test.tsx.snap +175 -0
  197. package/src/ConfirmBaseForm/ConfirmBaseForm.test.tsx +24 -0
  198. package/src/ConfirmBaseForm/ConfirmBaseForm.tsx +50 -0
  199. package/src/ConfirmBaseForm/__snapshots__/{ConfirmBaseForm.test.js.snap → ConfirmBaseForm.test.tsx.snap} +2 -2
  200. package/src/ConfirmDeleteForm/{ConfirmDeleteForm.test.js → ConfirmDeleteForm.test.tsx} +3 -3
  201. package/src/ConfirmDeleteForm/ConfirmDeleteForm.tsx +67 -0
  202. package/src/ConfirmDeleteForm/__snapshots__/{ConfirmDeleteForm.test.js.snap → ConfirmDeleteForm.test.tsx.snap} +2 -2
  203. package/src/DatePickerInput/DatePickerInput.test.tsx +48 -0
  204. package/src/DatePickerInput/DatePickerInput.tsx +85 -0
  205. package/src/DatePickerInput/__snapshots__/DatePickerInput.test.tsx.snap +151 -0
  206. package/src/Field/CustomFieldInputProps.ts +10 -0
  207. package/src/Field/CustomFieldMetaProps.ts +5 -0
  208. package/src/Field/Field.tsx +90 -0
  209. package/src/Field/FieldErrorScrollTarget.tsx +11 -0
  210. package/src/Field/FieldNameContext.ts +6 -0
  211. package/src/Field/FieldSection.tsx +18 -0
  212. package/src/Field/InjectedFieldProps.ts +8 -0
  213. package/src/Field/useStandardField.ts +121 -0
  214. package/src/FieldArray/FieldArray.tsx +133 -0
  215. package/src/File/FileGroup.test.tsx +35 -0
  216. package/src/File/FileGroup.tsx +71 -0
  217. package/src/File/FileList.tsx +19 -0
  218. package/src/File/__snapshots__/FileGroup.test.tsx.snap +32 -0
  219. package/src/File/humanFileSize.ts +8 -0
  220. package/src/Form/{FocusError.js → FocusError.tsx} +10 -6
  221. package/src/Form/Form.test.tsx +14 -0
  222. package/src/Form/{Form.js → Form.tsx} +71 -31
  223. package/src/Form/FormBasedPreventNavigation.tsx +74 -0
  224. package/src/Form/ServerErrorContext.ts +17 -0
  225. package/src/Form/__snapshots__/{Form.test.js.snap → Form.test.tsx.snap} +1 -1
  226. package/src/FormActions.tsx +34 -0
  227. package/src/Group.tsx +43 -0
  228. package/src/Input/IconInputGroup.tsx +48 -0
  229. package/src/Input/InputGroup.tsx +57 -0
  230. package/src/Input/MoneyInputGroup.tsx +44 -0
  231. package/src/Input/NumberInputGroup.tsx +42 -0
  232. package/src/Input/StringInputGroup.tsx +40 -0
  233. package/src/Input/__Tests__/IconInputGroup.test.tsx +35 -0
  234. package/src/Input/__Tests__/MoneyInputGroup.test.tsx +37 -0
  235. package/src/Input/__Tests__/NumberInputGroup.test.tsx +35 -0
  236. package/src/Input/__Tests__/StringInputGroup.test.tsx +27 -0
  237. package/src/Input/__Tests__/__snapshots__/IconInputGroup.test.tsx.snap +29 -0
  238. package/src/Input/__Tests__/__snapshots__/MoneyInputGroup.test.tsx.snap +31 -0
  239. package/src/Input/__Tests__/__snapshots__/NumberInputGroup.test.tsx.snap +29 -0
  240. package/src/Input/__Tests__/__snapshots__/StringInputGroup.test.tsx.snap +28 -0
  241. package/src/Normalization/NormalizationFunction.ts +4 -0
  242. package/src/{normalizers.js → Normalization/normalizers.ts} +5 -5
  243. package/src/Select/BooleanSelectGroup.tsx +27 -0
  244. package/src/Select/NumberSelectGroup.tsx +14 -0
  245. package/src/Select/SelectGroup.tsx +106 -0
  246. package/src/Select/SelectGroupPropsHelper.ts +4 -0
  247. package/src/Select/StringSelectGroup.tsx +14 -0
  248. package/src/Select/__tests__/BooleanSelectGroup.test.tsx +35 -0
  249. package/src/Select/__tests__/NumberSelectGroup.test.tsx +87 -0
  250. package/src/Select/__tests__/StringSelectGroup.test.tsx +89 -0
  251. package/src/Select/__tests__/__snapshots__/BooleanSelectGroup.test.tsx.snap +99 -0
  252. package/src/Select/__tests__/__snapshots__/NumberSelectGroup.test.tsx.snap +197 -0
  253. package/src/Select/__tests__/__snapshots__/StringSelectGroup.test.tsx.snap +197 -0
  254. package/src/{StandardFormActions.js → StandardFormActions.tsx} +12 -6
  255. package/src/SubmitFormButton.tsx +44 -0
  256. package/src/Validation/ValidatedApiResult.ts +8 -0
  257. package/src/Validation/ValidationError.ts +6 -0
  258. package/src/Validation/ValidationFunction.ts +4 -0
  259. package/src/{validators/validators.test.js → Validation/validators.test.tsx} +6 -4
  260. package/src/Validation/validators.ts +92 -0
  261. package/src/__Tests__/FormTestBase.tsx +63 -0
  262. package/src/__Tests__/{StandardFormActions.test.js → StandardFormActions.test.tsx} +2 -8
  263. package/src/__Tests__/{SubmitFormButton.test.js → SubmitFormButton.test.tsx} +2 -8
  264. package/src/__Tests__/__snapshots__/{StandardFormActions.test.js.snap → StandardFormActions.test.tsx.snap} +2 -2
  265. package/src/__Tests__/__snapshots__/{SubmitFormButton.test.js.snap → SubmitFormButton.test.tsx.snap} +1 -1
  266. package/src/__Tests__/index.ts +3 -0
  267. package/src/index.ts +114 -0
  268. package/src/react-app-env.d.ts +1 -0
  269. package/src/styles.scss +0 -7
  270. package/src/utils/{objectContainsNonSerializableProperty.test.js → objectContainsNonSerializableProperty.test.tsx} +0 -0
  271. package/src/utils/{objectContainsNonSerializableProperty.js → objectContainsNonSerializableProperty.ts} +4 -2
  272. package/src/utils/{objectToFormData.test.js → objectToFormData.test.tsx} +0 -0
  273. package/src/utils/{objectToFormData.js → objectToFormData.ts} +29 -13
  274. package/src/utils/typeChecks.ts +18 -0
  275. package/es/AddressInput/index.js +0 -2
  276. package/es/BoolInput/BoolInput.js +0 -10
  277. package/es/BoolInput/InlineBoolInput.js +0 -10
  278. package/es/BoolInput/boolOptions.js +0 -8
  279. package/es/BoolInput/index.js +0 -3
  280. package/es/ConfirmBaseForm/index.js +0 -2
  281. package/es/ConfirmDeleteForm/index.js +0 -2
  282. package/es/DatePickerInput/index.js +0 -2
  283. package/es/ErrorScrollTarget.js +0 -10
  284. package/es/FileInput/DefaultFileList.js +0 -36
  285. package/es/FileInput/DropzoneFileInput.js +0 -58
  286. package/es/FileInput/FileInput.js +0 -62
  287. package/es/FileInput/index.js +0 -3
  288. package/es/Form/index.js +0 -3
  289. package/es/FormGroup.js +0 -22
  290. package/es/FormGroupWrapper.js +0 -22
  291. package/es/FormInput/FormInput.js +0 -206
  292. package/es/FormInput/index.js +0 -2
  293. package/es/FormInputArray/FormInputArray.js +0 -225
  294. package/es/FormInputArray/index.js +0 -2
  295. package/es/FormSection.js +0 -11
  296. package/es/IconInput.js +0 -33
  297. package/es/InlineFormInput/InlineFormInput.js +0 -8
  298. package/es/InlineFormInput/index.js +0 -2
  299. package/es/MoneyInput/InlineMoneyInput.js +0 -7
  300. package/es/MoneyInput/MoneyInput.js +0 -7
  301. package/es/MoneyInput/index.js +0 -3
  302. package/es/MoneyInput/moneyInputProps.js +0 -13
  303. package/es/NestedFormFieldContext.js +0 -4
  304. package/es/ReactSelectField/ReactSelectField.js +0 -128
  305. package/es/ReactSelectField/index.js +0 -2
  306. package/es/normalizers.js +0 -39
  307. package/es/selectors.js +0 -6
  308. package/es/useStandardFormInput.js +0 -119
  309. package/es/utils/index.js +0 -3
  310. package/es/validators/index.js +0 -2
  311. package/es/validators/validators.js +0 -94
  312. package/lib/AddressInput/index.js +0 -13
  313. package/lib/BoolInput/BoolInput.js +0 -23
  314. package/lib/BoolInput/InlineBoolInput.js +0 -23
  315. package/lib/BoolInput/boolOptions.js +0 -15
  316. package/lib/BoolInput/index.js +0 -23
  317. package/lib/ConfirmBaseForm/index.js +0 -13
  318. package/lib/ConfirmDeleteForm/index.js +0 -13
  319. package/lib/DatePickerInput/index.js +0 -13
  320. package/lib/ErrorScrollTarget.js +0 -20
  321. package/lib/FileInput/DefaultFileList.js +0 -47
  322. package/lib/FileInput/DropzoneFileInput.js +0 -75
  323. package/lib/FileInput/FileInput.js +0 -82
  324. package/lib/FileInput/index.js +0 -23
  325. package/lib/Form/index.js +0 -23
  326. package/lib/FormGroup.js +0 -33
  327. package/lib/FormGroupWrapper.js +0 -37
  328. package/lib/FormInput/FormInput.js +0 -229
  329. package/lib/FormInput/index.js +0 -13
  330. package/lib/FormInputArray/FormInputArray.js +0 -248
  331. package/lib/FormInputArray/index.js +0 -13
  332. package/lib/FormSection.js +0 -28
  333. package/lib/IconInput.js +0 -51
  334. package/lib/InlineFormInput/InlineFormInput.js +0 -20
  335. package/lib/InlineFormInput/index.js +0 -13
  336. package/lib/MoneyInput/InlineMoneyInput.js +0 -20
  337. package/lib/MoneyInput/MoneyInput.js +0 -20
  338. package/lib/MoneyInput/index.js +0 -23
  339. package/lib/MoneyInput/moneyInputProps.js +0 -26
  340. package/lib/NestedFormFieldContext.js +0 -16
  341. package/lib/ReactSelectField/ReactSelectField.js +0 -152
  342. package/lib/ReactSelectField/index.js +0 -31
  343. package/lib/normalizers.js +0 -51
  344. package/lib/selectors.js +0 -18
  345. package/lib/useStandardFormInput.js +0 -135
  346. package/lib/utils/index.js +0 -23
  347. package/lib/validators/index.js +0 -17
  348. package/lib/validators/validators.js +0 -130
  349. package/src/AddressInput/AddressInput.js +0 -73
  350. package/src/AddressInput/__snapshots__/AddesssInput.test.js.snap +0 -207
  351. package/src/AddressInput/index.js +0 -2
  352. package/src/BoolInput/BoolInput.js +0 -7
  353. package/src/BoolInput/BoolInput.test.js +0 -23
  354. package/src/BoolInput/InlineBoolInput.js +0 -7
  355. package/src/BoolInput/__snapshots__/BoolInput.test.js.snap +0 -89
  356. package/src/BoolInput/boolOptions.js +0 -6
  357. package/src/BoolInput/index.js +0 -4
  358. package/src/ConfirmBaseForm/ConfirmBaseForm.js +0 -37
  359. package/src/ConfirmBaseForm/ConfirmBaseForm.test.js +0 -14
  360. package/src/ConfirmBaseForm/index.js +0 -2
  361. package/src/ConfirmDeleteForm/ConfirmDeleteForm.js +0 -39
  362. package/src/ConfirmDeleteForm/index.js +0 -2
  363. package/src/DatePickerInput/DatePickerInput.js +0 -49
  364. package/src/DatePickerInput/DatePickerInput.test.js +0 -74
  365. package/src/DatePickerInput/__snapshots__/DatePickerInput.test.js.snap +0 -134
  366. package/src/DatePickerInput/date-picker-input.scss +0 -42
  367. package/src/DatePickerInput/index.js +0 -3
  368. package/src/ErrorScrollTarget.js +0 -6
  369. package/src/FileInput/DefaultFileList.js +0 -39
  370. package/src/FileInput/DropzoneFileInput.js +0 -56
  371. package/src/FileInput/DropzoneFileInput.test.js +0 -24
  372. package/src/FileInput/FileInput.js +0 -77
  373. package/src/FileInput/FileInput.test.js +0 -24
  374. package/src/FileInput/__snapshots__/DropzoneFileInput.test.js.snap +0 -57
  375. package/src/FileInput/__snapshots__/FileInput.test.js.snap +0 -58
  376. package/src/FileInput/file-input.scss +0 -58
  377. package/src/FileInput/index.js +0 -4
  378. package/src/Form/Form.test.js +0 -23
  379. package/src/Form/FormBasedPreventNavigation.js +0 -25
  380. package/src/Form/ServerErrorContext.js +0 -7
  381. package/src/Form/index.js +0 -3
  382. package/src/FormGroup.js +0 -30
  383. package/src/FormGroupWrapper.js +0 -28
  384. package/src/FormInput/FormInput.js +0 -145
  385. package/src/FormInput/FormInput.test.js +0 -66
  386. package/src/FormInput/__snapshots__/FormInput.test.js.snap +0 -323
  387. package/src/FormInput/form-input.scss +0 -9
  388. package/src/FormInput/index.js +0 -2
  389. package/src/FormInputArray/FormInputArray.js +0 -224
  390. package/src/FormInputArray/FormInputArray.test.js +0 -108
  391. package/src/FormInputArray/__snapshots__/FormInputArray.test.js.snap +0 -52
  392. package/src/FormInputArray/form-input-array.scss +0 -13
  393. package/src/FormInputArray/index.js +0 -2
  394. package/src/FormSection.js +0 -13
  395. package/src/IconInput.js +0 -31
  396. package/src/InlineFormInput/InlineFormInput.js +0 -6
  397. package/src/InlineFormInput/InlineFormInput.test.js +0 -23
  398. package/src/InlineFormInput/__snapshots__/InlineFormInput.test.js.snap +0 -26
  399. package/src/InlineFormInput/index.js +0 -3
  400. package/src/InlineFormInput/inline-form-input.scss +0 -3
  401. package/src/MoneyInput/InlineMoneyInput.js +0 -7
  402. package/src/MoneyInput/MoneyInput.js +0 -7
  403. package/src/MoneyInput/MoneyInputs.test.js +0 -43
  404. package/src/MoneyInput/__snapshots__/MoneyInputs.test.js.snap +0 -81
  405. package/src/MoneyInput/index.js +0 -4
  406. package/src/MoneyInput/money-input.scss +0 -3
  407. package/src/MoneyInput/moneyInputProps.js +0 -12
  408. package/src/NestedFormFieldContext.js +0 -6
  409. package/src/ReactSelectField/ReactSelectField.js +0 -122
  410. package/src/ReactSelectField/index.js +0 -6
  411. package/src/ReactSelectField/react-select-field.scss +0 -5
  412. package/src/SubmitFormButton.js +0 -28
  413. package/src/__Tests__/FormTestBase.js +0 -14
  414. package/src/__Tests__/IconInput.test.js +0 -23
  415. package/src/__Tests__/__snapshots__/IconInput.test.js.snap +0 -38
  416. package/src/index.js +0 -45
  417. package/src/selectors.js +0 -3
  418. package/src/useStandardFormInput.js +0 -118
  419. package/src/utils/index.js +0 -3
  420. package/src/utils/typeChecks.js +0 -18
  421. package/src/validators/index.js +0 -2
  422. package/src/validators/validators.js +0 -93
@@ -0,0 +1,197 @@
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`MultiNumberSelectGroup has matching snapshot 1`] = `
4
+ <DocumentFragment>
5
+ <form
6
+ action="#"
7
+ >
8
+ <div
9
+ class="multiple select-group group"
10
+ >
11
+ <div
12
+ id="userroles-error-scroll-target"
13
+ style="display: none;"
14
+ />
15
+ <label
16
+ for="userRoles"
17
+ >
18
+ Favorite Number
19
+ </label>
20
+ <div
21
+ class="select-group css-b62m3t-container"
22
+ >
23
+ <span
24
+ class="css-1f43avz-a11yText-A11yText"
25
+ id="react-select-5-live-region"
26
+ />
27
+ <span
28
+ aria-atomic="false"
29
+ aria-live="polite"
30
+ aria-relevant="additions text"
31
+ class="css-1f43avz-a11yText-A11yText"
32
+ />
33
+ <div
34
+ class="react-select__control css-1s2u09g-control"
35
+ >
36
+ <div
37
+ class="react-select__value-container react-select__value-container--is-multi css-dlobye-Component"
38
+ >
39
+ <div
40
+ class="react-select__placeholder css-14el2xx-placeholder"
41
+ id="react-select-5-placeholder"
42
+ >
43
+ Select...
44
+ </div>
45
+ <div
46
+ class="react-select__input-container css-1u4kn00-Component"
47
+ data-value=""
48
+ >
49
+ <input
50
+ aria-autocomplete="list"
51
+ aria-controls="react-select-5-listbox"
52
+ aria-describedby="react-select-5-placeholder"
53
+ aria-expanded="false"
54
+ aria-haspopup="true"
55
+ aria-owns="react-select-5-listbox"
56
+ autocapitalize="none"
57
+ autocomplete="off"
58
+ autocorrect="off"
59
+ class="react-select__input"
60
+ id="userRoles"
61
+ role="combobox"
62
+ spellcheck="false"
63
+ style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
64
+ tabindex="0"
65
+ type="text"
66
+ value=""
67
+ />
68
+ </div>
69
+ </div>
70
+ <div
71
+ class="react-select__indicators css-ny0e4k-Component"
72
+ >
73
+ <span
74
+ class="react-select__indicator-separator css-1okebmr-indicatorSeparator"
75
+ />
76
+ <div
77
+ aria-hidden="true"
78
+ class="react-select__indicator react-select__dropdown-indicator css-tlfecz-indicatorContainer"
79
+ >
80
+ <svg
81
+ aria-hidden="true"
82
+ class="css-tj5bde-Svg"
83
+ focusable="false"
84
+ height="20"
85
+ viewBox="0 0 20 20"
86
+ width="20"
87
+ >
88
+ <path
89
+ d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
90
+ />
91
+ </svg>
92
+ </div>
93
+ </div>
94
+ </div>
95
+ </div>
96
+ </div>
97
+ </form>
98
+ </DocumentFragment>
99
+ `;
100
+
101
+ exports[`SingleNumberSelectGroup has matching snapshot 1`] = `
102
+ <DocumentFragment>
103
+ <form
104
+ action="#"
105
+ >
106
+ <div
107
+ class="select-group group"
108
+ >
109
+ <div
110
+ id="favoritenumber-error-scroll-target"
111
+ style="display: none;"
112
+ />
113
+ <label
114
+ for="favoriteNumber"
115
+ >
116
+ Favorite Number
117
+ </label>
118
+ <div
119
+ class="select-group css-b62m3t-container"
120
+ >
121
+ <span
122
+ class="css-1f43avz-a11yText-A11yText"
123
+ id="react-select-3-live-region"
124
+ />
125
+ <span
126
+ aria-atomic="false"
127
+ aria-live="polite"
128
+ aria-relevant="additions text"
129
+ class="css-1f43avz-a11yText-A11yText"
130
+ />
131
+ <div
132
+ class="react-select__control css-1s2u09g-control"
133
+ >
134
+ <div
135
+ class="react-select__value-container css-dlobye-Component"
136
+ >
137
+ <div
138
+ class="react-select__placeholder css-14el2xx-placeholder"
139
+ id="react-select-3-placeholder"
140
+ >
141
+ Select...
142
+ </div>
143
+ <div
144
+ class="react-select__input-container css-1u4kn00-Component"
145
+ data-value=""
146
+ >
147
+ <input
148
+ aria-autocomplete="list"
149
+ aria-controls="react-select-3-listbox"
150
+ aria-describedby="react-select-3-placeholder"
151
+ aria-expanded="false"
152
+ aria-haspopup="true"
153
+ aria-owns="react-select-3-listbox"
154
+ autocapitalize="none"
155
+ autocomplete="off"
156
+ autocorrect="off"
157
+ class="react-select__input"
158
+ id="favoriteNumber"
159
+ role="combobox"
160
+ spellcheck="false"
161
+ style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
162
+ tabindex="0"
163
+ type="text"
164
+ value=""
165
+ />
166
+ </div>
167
+ </div>
168
+ <div
169
+ class="react-select__indicators css-ny0e4k-Component"
170
+ >
171
+ <span
172
+ class="react-select__indicator-separator css-1okebmr-indicatorSeparator"
173
+ />
174
+ <div
175
+ aria-hidden="true"
176
+ class="react-select__indicator react-select__dropdown-indicator css-tlfecz-indicatorContainer"
177
+ >
178
+ <svg
179
+ aria-hidden="true"
180
+ class="css-tj5bde-Svg"
181
+ focusable="false"
182
+ height="20"
183
+ viewBox="0 0 20 20"
184
+ width="20"
185
+ >
186
+ <path
187
+ d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
188
+ />
189
+ </svg>
190
+ </div>
191
+ </div>
192
+ </div>
193
+ </div>
194
+ </div>
195
+ </form>
196
+ </DocumentFragment>
197
+ `;
@@ -0,0 +1,197 @@
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`MultiStringSelectGroup has matching snapshot 1`] = `
4
+ <DocumentFragment>
5
+ <form
6
+ action="#"
7
+ >
8
+ <div
9
+ class="multiple select-group group"
10
+ >
11
+ <div
12
+ id="favoritecolors-error-scroll-target"
13
+ style="display: none;"
14
+ />
15
+ <label
16
+ for="favoriteColors"
17
+ >
18
+ Favorite Color
19
+ </label>
20
+ <div
21
+ class="select-group css-b62m3t-container"
22
+ >
23
+ <span
24
+ class="css-1f43avz-a11yText-A11yText"
25
+ id="react-select-5-live-region"
26
+ />
27
+ <span
28
+ aria-atomic="false"
29
+ aria-live="polite"
30
+ aria-relevant="additions text"
31
+ class="css-1f43avz-a11yText-A11yText"
32
+ />
33
+ <div
34
+ class="react-select__control css-1s2u09g-control"
35
+ >
36
+ <div
37
+ class="react-select__value-container react-select__value-container--is-multi css-dlobye-Component"
38
+ >
39
+ <div
40
+ class="react-select__placeholder css-14el2xx-placeholder"
41
+ id="react-select-5-placeholder"
42
+ >
43
+ Select...
44
+ </div>
45
+ <div
46
+ class="react-select__input-container css-1u4kn00-Component"
47
+ data-value=""
48
+ >
49
+ <input
50
+ aria-autocomplete="list"
51
+ aria-controls="react-select-5-listbox"
52
+ aria-describedby="react-select-5-placeholder"
53
+ aria-expanded="false"
54
+ aria-haspopup="true"
55
+ aria-owns="react-select-5-listbox"
56
+ autocapitalize="none"
57
+ autocomplete="off"
58
+ autocorrect="off"
59
+ class="react-select__input"
60
+ id="favoriteColors"
61
+ role="combobox"
62
+ spellcheck="false"
63
+ style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
64
+ tabindex="0"
65
+ type="text"
66
+ value=""
67
+ />
68
+ </div>
69
+ </div>
70
+ <div
71
+ class="react-select__indicators css-ny0e4k-Component"
72
+ >
73
+ <span
74
+ class="react-select__indicator-separator css-1okebmr-indicatorSeparator"
75
+ />
76
+ <div
77
+ aria-hidden="true"
78
+ class="react-select__indicator react-select__dropdown-indicator css-tlfecz-indicatorContainer"
79
+ >
80
+ <svg
81
+ aria-hidden="true"
82
+ class="css-tj5bde-Svg"
83
+ focusable="false"
84
+ height="20"
85
+ viewBox="0 0 20 20"
86
+ width="20"
87
+ >
88
+ <path
89
+ d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
90
+ />
91
+ </svg>
92
+ </div>
93
+ </div>
94
+ </div>
95
+ </div>
96
+ </div>
97
+ </form>
98
+ </DocumentFragment>
99
+ `;
100
+
101
+ exports[`SingleStringSelectGroup has matching snapshot 1`] = `
102
+ <DocumentFragment>
103
+ <form
104
+ action="#"
105
+ >
106
+ <div
107
+ class="select-group group"
108
+ >
109
+ <div
110
+ id="favoritecolor-error-scroll-target"
111
+ style="display: none;"
112
+ />
113
+ <label
114
+ for="favoriteColor"
115
+ >
116
+ Favorite Color
117
+ </label>
118
+ <div
119
+ class="select-group css-b62m3t-container"
120
+ >
121
+ <span
122
+ class="css-1f43avz-a11yText-A11yText"
123
+ id="react-select-3-live-region"
124
+ />
125
+ <span
126
+ aria-atomic="false"
127
+ aria-live="polite"
128
+ aria-relevant="additions text"
129
+ class="css-1f43avz-a11yText-A11yText"
130
+ />
131
+ <div
132
+ class="react-select__control css-1s2u09g-control"
133
+ >
134
+ <div
135
+ class="react-select__value-container css-dlobye-Component"
136
+ >
137
+ <div
138
+ class="react-select__placeholder css-14el2xx-placeholder"
139
+ id="react-select-3-placeholder"
140
+ >
141
+ Select...
142
+ </div>
143
+ <div
144
+ class="react-select__input-container css-1u4kn00-Component"
145
+ data-value=""
146
+ >
147
+ <input
148
+ aria-autocomplete="list"
149
+ aria-controls="react-select-3-listbox"
150
+ aria-describedby="react-select-3-placeholder"
151
+ aria-expanded="false"
152
+ aria-haspopup="true"
153
+ aria-owns="react-select-3-listbox"
154
+ autocapitalize="none"
155
+ autocomplete="off"
156
+ autocorrect="off"
157
+ class="react-select__input"
158
+ id="favoriteColor"
159
+ role="combobox"
160
+ spellcheck="false"
161
+ style="opacity: 1; width: 100%; grid-area: 1 / 2; min-width: 2px; border: 0px; margin: 0px; outline: 0; padding: 0px;"
162
+ tabindex="0"
163
+ type="text"
164
+ value=""
165
+ />
166
+ </div>
167
+ </div>
168
+ <div
169
+ class="react-select__indicators css-ny0e4k-Component"
170
+ >
171
+ <span
172
+ class="react-select__indicator-separator css-1okebmr-indicatorSeparator"
173
+ />
174
+ <div
175
+ aria-hidden="true"
176
+ class="react-select__indicator react-select__dropdown-indicator css-tlfecz-indicatorContainer"
177
+ >
178
+ <svg
179
+ aria-hidden="true"
180
+ class="css-tj5bde-Svg"
181
+ focusable="false"
182
+ height="20"
183
+ viewBox="0 0 20 20"
184
+ width="20"
185
+ >
186
+ <path
187
+ d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
188
+ />
189
+ </svg>
190
+ </div>
191
+ </div>
192
+ </div>
193
+ </div>
194
+ </div>
195
+ </form>
196
+ </DocumentFragment>
197
+ `;
@@ -1,24 +1,30 @@
1
- import React from 'react';
2
- import { Button } from 'reactstrap';
1
+ import { MouseEventHandler } from 'react';
2
+ import classNames from 'classnames';
3
3
  import { useFormikContext } from 'formik';
4
4
  import SubmitFormButton from './SubmitFormButton';
5
5
 
6
+ export interface StandardFormActionsProps {
7
+ allowPristineSubmit?: boolean;
8
+ handleCancel?: MouseEventHandler<HTMLButtonElement>;
9
+ }
10
+
6
11
  export default function StandardFormActions({
7
12
  allowPristineSubmit,
8
13
  handleCancel,
9
- }) {
14
+ }: StandardFormActionsProps) {
10
15
  const { isSubmitting } = useFormikContext();
16
+
11
17
  return (
12
18
  <>
13
19
  <SubmitFormButton allowPristineSubmit={allowPristineSubmit} />
14
20
  &nbsp;
15
- <Button
21
+ <button
22
+ className={classNames('standard-form-actions-cancel-button')}
16
23
  type="button"
17
- color="link"
18
24
  disabled={isSubmitting}
19
25
  onClick={handleCancel || goBack}>
20
26
  Cancel
21
- </Button>
27
+ </button>
22
28
  </>
23
29
  );
24
30
  function goBack() {
@@ -0,0 +1,44 @@
1
+ import React, { LegacyRef } from 'react';
2
+ import classNames from 'classnames';
3
+ import { useFormikContext } from 'formik';
4
+
5
+ export interface SubmitFormButtonProps
6
+ extends Omit<React.HTMLProps<HTMLButtonElement>, 'type'> {
7
+ allowPristineSubmit?: boolean;
8
+ children?: React.ReactNode;
9
+ }
10
+ function SubmitFormButton(
11
+ {
12
+ allowPristineSubmit,
13
+ children,
14
+ disabled,
15
+ title,
16
+ className,
17
+ ...props
18
+ }: SubmitFormButtonProps,
19
+ ref: LegacyRef<HTMLButtonElement>
20
+ ) {
21
+ const { isSubmitting, dirty } = useFormikContext();
22
+ const preventSubmit = (!dirty && !allowPristineSubmit) || isSubmitting;
23
+ return (
24
+ <button
25
+ {...props}
26
+ ref={ref}
27
+ type="submit"
28
+ disabled={preventSubmit || disabled}
29
+ title={
30
+ title || isSubmitting
31
+ ? 'Loading, please wait...'
32
+ : preventSubmit
33
+ ? "You haven't made any changes"
34
+ : ''
35
+ }
36
+ className={classNames('submit-form-button', className)}>
37
+ {children || 'Submit'}
38
+ </button>
39
+ );
40
+ }
41
+
42
+ export default React.forwardRef(
43
+ SubmitFormButton
44
+ ) as React.ComponentType<SubmitFormButtonProps>;
@@ -0,0 +1,8 @@
1
+ import { ValidationError } from './ValidationError';
2
+
3
+ // TODO: this means that all template projects MUST have this API shape - thoughts?
4
+ /** The root result from a typical envoc API call when forms are returned */
5
+ export interface ValidatedApiResult {
6
+ validationFailures?: ValidationError[];
7
+ hasErrors?: boolean;
8
+ }
@@ -0,0 +1,6 @@
1
+ // TODO: this means that all template projects MUST have this API shape - thoughts?
2
+ /** Represents a server side validation failure - only 'standard' for envoc */
3
+ export interface ValidationError {
4
+ propertyName?: string;
5
+ errorMessage?: string;
6
+ }
@@ -0,0 +1,4 @@
1
+ /** Client side validation function */
2
+ export interface ValidationFunction<TValue> {
3
+ (value: TValue): string | undefined;
4
+ }
@@ -2,12 +2,12 @@ import { integer, length, maxLength, maxValue, minValue } from './validators';
2
2
 
3
3
  describe('integer validator', () => {
4
4
  it('accepts an integer', () => {
5
- const returned = integer(123);
5
+ const returned = integer('123');
6
6
  expect(returned).toBe(undefined);
7
7
  });
8
8
 
9
9
  it("doesn't accept a float", () => {
10
- const returned = integer(123.5569);
10
+ const returned = integer('123.5569');
11
11
  expect(returned).toBe('Must be a whole number');
12
12
  });
13
13
  });
@@ -65,8 +65,10 @@ describe('minValue validator', () => {
65
65
  describe('maxLength validator', () => {
66
66
  it('fails for invalid value', () => {
67
67
  const maxLength10 = maxLength(10);
68
- const tooLong = maxLength10('012345678910');
69
- expect(tooLong).toBe('Maximum length 10 exceeded');
68
+ const stringTooLong = maxLength10('012345678910');
69
+ const numberTooLong = maxLength10(1234567890123);
70
+ expect(stringTooLong).toBe('Maximum length 10 exceeded');
71
+ expect(numberTooLong).toBe('Maximum length 10 exceeded');
70
72
  });
71
73
 
72
74
  it('succeeds for valid value', () => {
@@ -0,0 +1,92 @@
1
+ import { ValidationFunction } from './ValidationFunction';
2
+
3
+ export const required = (value: any) =>
4
+ Array.isArray(value)
5
+ ? value.length > 0
6
+ ? undefined
7
+ : 'Required'
8
+ : value || value === false || value === 0
9
+ ? undefined
10
+ : 'Required';
11
+
12
+ //asserts that the value is a certain number of characters. numbers are coerced to a string
13
+ export const length = (len: number) => (value: string | number | undefined) => {
14
+ const hasError = getLengthOfValue(value) !== len;
15
+ return !hasError ? undefined : `Length must be ${len}`;
16
+ };
17
+
18
+ export const integer = (val: string | undefined) => {
19
+ if (!val) {
20
+ return undefined;
21
+ }
22
+ if (!Number.isInteger(parseFloat(val))) {
23
+ return 'Must be a whole number';
24
+ }
25
+ };
26
+
27
+ export const maxLength =
28
+ (len: number) => (value: string | number | undefined) => {
29
+ const hasError = getLengthOfValue(value) > len;
30
+ return !hasError ? undefined : `Maximum length ${len} exceeded`;
31
+ };
32
+
33
+ export const maxCount =
34
+ (count: number) => (value: { isDeleted?: boolean }[] | undefined) => {
35
+ const hasError =
36
+ !!value && value.filter((x) => !x.isDeleted).length > count;
37
+ return !hasError ? undefined : `Should not have more than ${count}`;
38
+ };
39
+
40
+ export const minCount =
41
+ (count: number) => (value: { isDeleted?: boolean }[] | undefined) => {
42
+ const hasError = !value || value.filter((x) => !x.isDeleted).length < count;
43
+ return !hasError ? undefined : `Should have at least ${count}`;
44
+ };
45
+
46
+ export const maxValue = (max: number) => (value: number | undefined) => {
47
+ const hasError = !!value && value > max;
48
+ return !hasError ? undefined : `Maximum value ${max} exceeded`;
49
+ };
50
+
51
+ export const minValue = (min: number) => (value: number | undefined) => {
52
+ const hasError = !value || value < min;
53
+ return !hasError ? undefined : `Minimum value ${min} not met`;
54
+ };
55
+
56
+ export const zipCode = (value: string | undefined) => {
57
+ return value && !/^[0-9]{5}(?:-[0-9]{4})?$/.test(value)
58
+ ? 'Invalid ZIP Code'
59
+ : undefined;
60
+ };
61
+
62
+ //one of the validators provided must be true
63
+ export const any =
64
+ <TValue>(validatorList: ValidationFunction<TValue>[]) =>
65
+ (value: TValue) => {
66
+ if (validatorList.length === 0 || !value) {
67
+ return;
68
+ }
69
+
70
+ return validatorList.reduce(
71
+ (isAnyTrue, x) => (isAnyTrue ? isAnyTrue : x(value)),
72
+ undefined as string | undefined
73
+ );
74
+ };
75
+
76
+ function getLengthOfValue(value: string | number | undefined) {
77
+ switch (typeof value) {
78
+ case 'undefined':
79
+ return 0;
80
+ case 'string':
81
+ return value.length;
82
+ case 'number':
83
+ // TODO: this seems iffy to me - what if the actual visible value is a fixed length or some special format (e.g. with commas?)
84
+ return value.toString().length;
85
+ default:
86
+ assertUnreachable(value);
87
+ return 0;
88
+ }
89
+ }
90
+ function assertUnreachable(x: never) {
91
+ return null;
92
+ }
@@ -0,0 +1,63 @@
1
+ import '@testing-library/jest-dom/extend-expect';
2
+ import { HashRouter } from 'react-router-dom';
3
+ import { ValidatedApiResult } from 'Validation/ValidatedApiResult';
4
+ import { DateOnly, Form, FormBuilderProp } from '../../src';
5
+
6
+ interface FormTestBaseProps<TForm extends object> {
7
+ children: (formBuilder: FormBuilderProp<TForm>) => JSX.Element;
8
+ initialValues?: TForm;
9
+ }
10
+
11
+ export default function FormTestBase<TForm extends PersonDto>({
12
+ children,
13
+ initialValues,
14
+ }: FormTestBaseProps<TForm>) {
15
+ return (
16
+ <HashRouter>
17
+ <Form onSubmit={onSubmit} initialValues={initialValues}>
18
+ {children}
19
+ </Form>
20
+ </HashRouter>
21
+ );
22
+
23
+ async function onSubmit(
24
+ data: PersonDto | FormData
25
+ ): Promise<ValidatedApiResult> {
26
+ const isFormData = data instanceof FormData;
27
+ const result = await fetch('/api/submit', {
28
+ body: isFormData ? data : JSON.stringify(data),
29
+ method: 'POST',
30
+ headers: {
31
+ 'Content-Type': isFormData ? 'multipart/form-data' : 'application/json',
32
+ 'X-Show-Errors': `Errors go here`,
33
+ },
34
+ });
35
+
36
+ const apiResult = await (result.json() as Promise<ValidatedApiResult>);
37
+
38
+ if (!apiResult.hasErrors) {
39
+ alert('submitted');
40
+ }
41
+
42
+ return apiResult;
43
+ }
44
+ }
45
+
46
+ interface PersonDto {
47
+ name?: string | undefined;
48
+ nameWithIcon?: string | undefined;
49
+ numberOfArms?: number;
50
+ phoneNumber?: string;
51
+ yearlySalaryUSD?: number;
52
+ isCool?: boolean;
53
+ gradDate?: DateOnly;
54
+ favoriteDate?: DateOnly;
55
+ favoriteNumber?: number;
56
+ favoriteColor?: string;
57
+ favoriteColors?: string[];
58
+ favoriteNames?: string[];
59
+ allowLogin?: boolean;
60
+ userRoles?: number[];
61
+ profileImage?: any;
62
+ favoritePictures?: any[];
63
+ }