@dhis2/ui-forms 9.10.3 → 9.11.1-beta.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (192) hide show
  1. package/build/cjs/CheckboxFieldFF/{CheckboxFieldFF.stories.e2e.js → CheckboxFieldFF.e2e.stories.js} +22 -15
  2. package/build/cjs/CheckboxFieldFF/CheckboxFieldFF.js +2 -12
  3. package/build/cjs/CheckboxFieldFF/{CheckboxFieldFF.stories.js → CheckboxFieldFF.prod.stories.js} +29 -24
  4. package/build/cjs/CheckboxFieldFF/features/can_toggle_a_boolean/index.js +0 -1
  5. package/build/cjs/CheckboxFieldFF/features/can_toggle_a_value/index.js +0 -1
  6. package/build/cjs/CheckboxFieldFF/features/common/index.js +0 -1
  7. package/build/cjs/CheckboxFieldFF/features/displays_error/index.js +0 -2
  8. package/build/cjs/FieldGroupFF/FieldGroupFF.js +1 -10
  9. package/build/cjs/FieldGroupFF/{FieldGroupFF.stories.js → FieldGroupFF.prod.stories.js} +11 -12
  10. package/build/cjs/FileInputFieldFF/{FileInputFieldFF.stories.e2e.js → FileInputFieldFF.e2e.stories.js} +45 -56
  11. package/build/cjs/FileInputFieldFF/FileInputFieldFF.js +2 -19
  12. package/build/cjs/FileInputFieldFF/{FileInputFieldFF.stories.js → FileInputFieldFF.prod.stories.js} +29 -22
  13. package/build/cjs/FileInputFieldFF/features/accepts_file/index.js +0 -1
  14. package/build/cjs/FileInputFieldFF/features/common/index.js +0 -1
  15. package/build/cjs/FileInputFieldFF/features/displays_error/index.js +0 -1
  16. package/build/cjs/InputFieldFF/InputFieldFF.e2e.stories.js +30 -0
  17. package/build/cjs/InputFieldFF/InputFieldFF.js +2 -12
  18. package/build/cjs/InputFieldFF/{InputFieldFF.stories.js → InputFieldFF.prod.stories.js} +29 -22
  19. package/build/cjs/InputFieldFF/features/can_set_a_value/index.js +0 -1
  20. package/build/cjs/InputFieldFF/features/displays_error/index.js +0 -2
  21. package/build/cjs/MultiSelectFieldFF/{MultiSelectFieldFF.stories.e2e.js → MultiSelectFieldFF.e2e.stories.js} +15 -17
  22. package/build/cjs/MultiSelectFieldFF/MultiSelectFieldFF.js +3 -15
  23. package/build/cjs/MultiSelectFieldFF/MultiSelectFieldFF.prod.stories.js +107 -0
  24. package/build/cjs/MultiSelectFieldFF/features/can_set_a_value/index.js +0 -1
  25. package/build/cjs/MultiSelectFieldFF/features/common/index.js +1 -2
  26. package/build/cjs/MultiSelectFieldFF/features/displays_error/index.js +0 -2
  27. package/build/cjs/RadioFieldFF/RadioFieldFF.e2e.stories.js +45 -0
  28. package/build/cjs/RadioFieldFF/RadioFieldFF.js +2 -12
  29. package/build/cjs/RadioFieldFF/{RadioFieldFF.stories.js → RadioFieldFF.prod.stories.js} +29 -16
  30. package/build/cjs/RadioFieldFF/features/can_set_a_value/index.js +0 -1
  31. package/build/cjs/RadioFieldFF/features/common/index.js +0 -1
  32. package/build/cjs/RadioFieldFF/features/displays_error/index.js +0 -2
  33. package/build/cjs/SingleSelectFieldFF/SingleSelectFieldFF.e2e.stories.js +39 -0
  34. package/build/cjs/SingleSelectFieldFF/SingleSelectFieldFF.js +2 -12
  35. package/build/cjs/SingleSelectFieldFF/SingleSelectFieldFF.prod.stories.js +106 -0
  36. package/build/cjs/SingleSelectFieldFF/features/can_set_a_value/index.js +0 -1
  37. package/build/cjs/SingleSelectFieldFF/features/common/index.js +0 -1
  38. package/build/cjs/SingleSelectFieldFF/features/displays_error/index.js +0 -2
  39. package/build/cjs/SwitchFieldFF/SwitchFieldFF.e2e.stories.js +56 -0
  40. package/build/cjs/SwitchFieldFF/SwitchFieldFF.js +2 -12
  41. package/build/cjs/SwitchFieldFF/{SwitchFieldFF.stories.js → SwitchFieldFF.prod.stories.js} +29 -24
  42. package/build/cjs/SwitchFieldFF/features/can_toggle_a_boolean/index.js +0 -1
  43. package/build/cjs/SwitchFieldFF/features/can_toggle_a_value/index.js +0 -1
  44. package/build/cjs/SwitchFieldFF/features/common/index.js +0 -1
  45. package/build/cjs/SwitchFieldFF/features/displays_error/index.js +0 -2
  46. package/build/cjs/TextAreaFieldFF/TextAreaFieldFF.e2e.stories.js +30 -0
  47. package/build/cjs/TextAreaFieldFF/TextAreaFieldFF.js +2 -12
  48. package/build/cjs/TextAreaFieldFF/{TextAreaFieldFF.stories.js → TextAreaFieldFF.prod.stories.js} +29 -24
  49. package/build/cjs/TextAreaFieldFF/features/can_set_a_value/index.js +0 -1
  50. package/build/cjs/TextAreaFieldFF/features/displays_error/index.js +0 -2
  51. package/build/cjs/__tests__/__snapshots__/index.test.js.snap +3 -0
  52. package/build/cjs/__tests__/index.test.js +1 -1
  53. package/build/cjs/formDecorator.js +6 -21
  54. package/build/cjs/index.js +2 -21
  55. package/build/cjs/locales/index.js +3 -75
  56. package/build/cjs/shared/helpers/createBlurHandler.js +0 -3
  57. package/build/cjs/shared/helpers/createChangeHandler.js +0 -2
  58. package/build/cjs/shared/helpers/createFocusHandler.js +0 -3
  59. package/build/cjs/shared/helpers/createSelectChangeHandler.js +0 -2
  60. package/build/cjs/shared/helpers/createToggleChangeHandler.js +0 -3
  61. package/build/cjs/shared/helpers/getValidationText.js +0 -6
  62. package/build/cjs/shared/helpers/hasError.js +0 -2
  63. package/build/cjs/shared/helpers/isLoading.js +0 -2
  64. package/build/cjs/shared/helpers/isValid.js +0 -2
  65. package/build/cjs/shared/helpers.js +0 -9
  66. package/build/cjs/shared/propTypes.js +7 -20
  67. package/build/cjs/transformers/arrayWithIdObjects.js +2 -6
  68. package/build/cjs/transformers/index.js +0 -1
  69. package/build/cjs/validators/__tests__/alphaNumeric.test.js +0 -2
  70. package/build/cjs/validators/__tests__/boolean.test.js +0 -2
  71. package/build/cjs/validators/__tests__/composeValidators.test.js +0 -3
  72. package/build/cjs/validators/__tests__/createCharacterLengthRange.test.js +6 -6
  73. package/build/cjs/validators/__tests__/createEqualTo.test.js +0 -3
  74. package/build/cjs/validators/__tests__/createMaxCharacterLength.test.js +1 -2
  75. package/build/cjs/validators/__tests__/createMaxNumber.test.js +1 -2
  76. package/build/cjs/validators/__tests__/createMinCharacterLength.test.js +1 -2
  77. package/build/cjs/validators/__tests__/createMinNumber.test.js +1 -2
  78. package/build/cjs/validators/__tests__/createNumberRange.test.js +0 -3
  79. package/build/cjs/validators/__tests__/createPattern.test.js +1 -3
  80. package/build/cjs/validators/__tests__/dhis2Password.test.js +0 -2
  81. package/build/cjs/validators/__tests__/dhis2Username.test.js +0 -2
  82. package/build/cjs/validators/__tests__/email.test.js +7 -6
  83. package/build/cjs/validators/__tests__/hasValue.test.js +0 -2
  84. package/build/cjs/validators/__tests__/integer.test.js +0 -2
  85. package/build/cjs/validators/__tests__/internationalPhoneNumber.test.js +6 -5
  86. package/build/cjs/validators/__tests__/number.test.js +0 -2
  87. package/build/cjs/validators/__tests__/string.test.js +0 -2
  88. package/build/cjs/validators/__tests__/url.test.js +1 -2
  89. package/build/cjs/validators/alphaNumeric.js +2 -11
  90. package/build/cjs/validators/boolean.js +2 -10
  91. package/build/cjs/validators/composeValidators.js +0 -4
  92. package/build/cjs/validators/createCharacterLengthRange.js +1 -8
  93. package/build/cjs/validators/createEqualTo.js +1 -8
  94. package/build/cjs/validators/createMaxCharacterLength.js +1 -6
  95. package/build/cjs/validators/createMaxNumber.js +1 -6
  96. package/build/cjs/validators/createMinCharacterLength.js +1 -6
  97. package/build/cjs/validators/createMinNumber.js +1 -6
  98. package/build/cjs/validators/createNumberRange.js +1 -8
  99. package/build/cjs/validators/createPattern.js +2 -10
  100. package/build/cjs/validators/dhis2Password.js +6 -28
  101. package/build/cjs/validators/dhis2Username.js +2 -11
  102. package/build/cjs/validators/email.js +3 -11
  103. package/build/cjs/validators/hasValue.js +2 -10
  104. package/build/cjs/validators/helpers/index.js +1 -16
  105. package/build/cjs/validators/index.js +0 -20
  106. package/build/cjs/validators/integer.js +3 -10
  107. package/build/cjs/validators/internationalPhoneNumber.js +8 -14
  108. package/build/cjs/validators/number.js +2 -10
  109. package/build/cjs/validators/string.js +2 -10
  110. package/build/cjs/validators/test-helpers/index.js +1 -6
  111. package/build/cjs/validators/url.js +2 -11
  112. package/build/es/CheckboxFieldFF/{CheckboxFieldFF.stories.e2e.js → CheckboxFieldFF.e2e.stories.js} +14 -7
  113. package/build/es/CheckboxFieldFF/CheckboxFieldFF.js +1 -3
  114. package/build/es/CheckboxFieldFF/{CheckboxFieldFF.stories.js → CheckboxFieldFF.prod.stories.js} +29 -3
  115. package/build/es/FieldGroupFF/FieldGroupFF.js +0 -2
  116. package/build/es/FieldGroupFF/{FieldGroupFF.stories.js → FieldGroupFF.prod.stories.js} +11 -1
  117. package/build/es/FileInputFieldFF/{FileInputFieldFF.stories.e2e.js → FileInputFieldFF.e2e.stories.js} +14 -16
  118. package/build/es/FileInputFieldFF/FileInputFieldFF.js +1 -8
  119. package/build/es/FileInputFieldFF/{FileInputFieldFF.stories.js → FileInputFieldFF.prod.stories.js} +29 -3
  120. package/build/es/InputFieldFF/{InputFieldFF.stories.e2e.js → InputFieldFF.e2e.stories.js} +8 -4
  121. package/build/es/InputFieldFF/InputFieldFF.js +1 -3
  122. package/build/es/InputFieldFF/{InputFieldFF.stories.js → InputFieldFF.prod.stories.js} +29 -3
  123. package/build/es/MultiSelectFieldFF/{MultiSelectFieldFF.stories.e2e.js → MultiSelectFieldFF.e2e.stories.js} +7 -7
  124. package/build/es/MultiSelectFieldFF/MultiSelectFieldFF.js +2 -6
  125. package/build/es/MultiSelectFieldFF/MultiSelectFieldFF.prod.stories.js +98 -0
  126. package/build/es/MultiSelectFieldFF/features/common/index.js +1 -1
  127. package/build/es/RadioFieldFF/{RadioFieldFF.stories.e2e.js → RadioFieldFF.e2e.stories.js} +6 -3
  128. package/build/es/RadioFieldFF/RadioFieldFF.js +1 -3
  129. package/build/es/RadioFieldFF/{RadioFieldFF.stories.js → RadioFieldFF.prod.stories.js} +29 -3
  130. package/build/es/SingleSelectFieldFF/{SingleSelectFieldFF.stories.e2e.js → SingleSelectFieldFF.e2e.stories.js} +10 -6
  131. package/build/es/SingleSelectFieldFF/SingleSelectFieldFF.js +1 -3
  132. package/build/es/SingleSelectFieldFF/SingleSelectFieldFF.prod.stories.js +97 -0
  133. package/build/es/SwitchFieldFF/{SwitchFieldFF.stories.e2e.js → SwitchFieldFF.e2e.stories.js} +14 -7
  134. package/build/es/SwitchFieldFF/SwitchFieldFF.js +1 -3
  135. package/build/es/SwitchFieldFF/{SwitchFieldFF.stories.js → SwitchFieldFF.prod.stories.js} +29 -3
  136. package/build/es/TextAreaFieldFF/{TextAreaFieldFF.stories.e2e.js → TextAreaFieldFF.e2e.stories.js} +8 -4
  137. package/build/es/TextAreaFieldFF/TextAreaFieldFF.js +1 -3
  138. package/build/es/TextAreaFieldFF/{TextAreaFieldFF.stories.js → TextAreaFieldFF.prod.stories.js} +29 -3
  139. package/build/es/__tests__/__snapshots__/index.test.js.snap +3 -0
  140. package/build/es/__tests__/index.test.js +1 -0
  141. package/build/es/formDecorator.js +5 -12
  142. package/build/es/index.js +2 -2
  143. package/build/es/shared/helpers/createBlurHandler.js +0 -2
  144. package/build/es/shared/helpers/createChangeHandler.js +0 -2
  145. package/build/es/shared/helpers/createFocusHandler.js +0 -2
  146. package/build/es/shared/helpers/createSelectChangeHandler.js +0 -1
  147. package/build/es/shared/helpers/createToggleChangeHandler.js +0 -2
  148. package/build/es/shared/helpers/getValidationText.js +0 -5
  149. package/build/es/shared/helpers/hasError.js +0 -1
  150. package/build/es/shared/helpers/isLoading.js +0 -1
  151. package/build/es/shared/helpers/isValid.js +0 -1
  152. package/build/es/transformers/arrayWithIdObjects.js +0 -2
  153. package/build/es/validators/__tests__/createCharacterLengthRange.test.js +6 -3
  154. package/build/es/validators/__tests__/createMaxCharacterLength.test.js +1 -0
  155. package/build/es/validators/__tests__/createMaxNumber.test.js +1 -0
  156. package/build/es/validators/__tests__/createMinCharacterLength.test.js +1 -0
  157. package/build/es/validators/__tests__/createMinNumber.test.js +1 -0
  158. package/build/es/validators/__tests__/createPattern.test.js +1 -1
  159. package/build/es/validators/__tests__/email.test.js +7 -4
  160. package/build/es/validators/__tests__/internationalPhoneNumber.test.js +6 -3
  161. package/build/es/validators/__tests__/url.test.js +1 -0
  162. package/build/es/validators/alphaNumeric.js +0 -2
  163. package/build/es/validators/boolean.js +0 -2
  164. package/build/es/validators/composeValidators.js +0 -2
  165. package/build/es/validators/createCharacterLengthRange.js +0 -2
  166. package/build/es/validators/createEqualTo.js +0 -2
  167. package/build/es/validators/createMaxCharacterLength.js +0 -2
  168. package/build/es/validators/createMaxNumber.js +0 -2
  169. package/build/es/validators/createMinCharacterLength.js +0 -2
  170. package/build/es/validators/createMinNumber.js +0 -2
  171. package/build/es/validators/createNumberRange.js +0 -2
  172. package/build/es/validators/createPattern.js +0 -3
  173. package/build/es/validators/dhis2Password.js +3 -12
  174. package/build/es/validators/dhis2Username.js +0 -2
  175. package/build/es/validators/email.js +1 -2
  176. package/build/es/validators/hasValue.js +0 -2
  177. package/build/es/validators/integer.js +3 -4
  178. package/build/es/validators/internationalPhoneNumber.js +7 -7
  179. package/build/es/validators/number.js +0 -2
  180. package/build/es/validators/string.js +0 -2
  181. package/build/es/validators/test-helpers/index.js +1 -4
  182. package/build/es/validators/url.js +2 -3
  183. package/package.json +13 -13
  184. package/build/cjs/InputFieldFF/InputFieldFF.stories.e2e.js +0 -27
  185. package/build/cjs/MultiSelectFieldFF/MultiSelectFieldFF.stories.js +0 -91
  186. package/build/cjs/RadioFieldFF/RadioFieldFF.stories.e2e.js +0 -45
  187. package/build/cjs/SingleSelectFieldFF/SingleSelectFieldFF.stories.e2e.js +0 -37
  188. package/build/cjs/SingleSelectFieldFF/SingleSelectFieldFF.stories.js +0 -90
  189. package/build/cjs/SwitchFieldFF/SwitchFieldFF.stories.e2e.js +0 -49
  190. package/build/cjs/TextAreaFieldFF/TextAreaFieldFF.stories.e2e.js +0 -27
  191. package/build/es/MultiSelectFieldFF/MultiSelectFieldFF.stories.js +0 -70
  192. package/build/es/SingleSelectFieldFF/SingleSelectFieldFF.stories.js +0 -69
@@ -1,8 +1,6 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { createCharacterLengthRange } from './createCharacterLengthRange.js';
3
-
4
3
  const createMinCharacterLength = lowerBound => createCharacterLengthRange(lowerBound, Infinity, i18n.t('Please enter at least {{lowerBound}} characters', {
5
4
  lowerBound
6
5
  }));
7
-
8
6
  export { createMinCharacterLength };
@@ -1,8 +1,6 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { createNumberRange } from './createNumberRange.js';
3
-
4
3
  const createMinNumber = lowerBound => createNumberRange(lowerBound, Infinity, i18n.t('Please enter a number of at least {{lowerBound}}', {
5
4
  lowerBound
6
5
  }));
7
-
8
6
  export { createMinNumber };
@@ -1,6 +1,5 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { isEmpty, isNumeric, toNumber, isInRange, requireArgument } from './helpers/index.js';
3
-
4
3
  const createNumberRange = (lowerBound, upperBound, customMessage) => {
5
4
  requireArgument(lowerBound, 'number');
6
5
  requireArgument(upperBound, 'number');
@@ -10,5 +9,4 @@ const createNumberRange = (lowerBound, upperBound, customMessage) => {
10
9
  });
11
10
  return value => isEmpty(value) || isNumeric(value) && isInRange(lowerBound, upperBound, toNumber(value)) ? undefined : errorMessage;
12
11
  };
13
-
14
12
  export { createNumberRange };
@@ -1,15 +1,12 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { isEmpty, isString } from './helpers/index.js';
3
3
  const invalidPatternMessage = 'The first argument passed to createPattern was not a valid regex';
4
-
5
4
  const createPattern = (pattern, message) => {
6
5
  if (!(pattern instanceof RegExp)) {
7
6
  throw new Error(invalidPatternMessage);
8
7
  }
9
-
10
8
  return value => isEmpty(value) || isString(value) && pattern.test(value) ? undefined : message || i18n.t('Please make sure the value of this input matches the pattern {{patternString}}.', {
11
9
  patternString: pattern.toString()
12
10
  });
13
11
  };
14
-
15
12
  export { createPattern, invalidPatternMessage };
@@ -2,9 +2,9 @@ import i18n from '../locales/index.js';
2
2
  import { isEmpty, isString } from './helpers/index.js';
3
3
  const LOWER_CASE_PATTERN = /^(?=.*[a-z]).+$/;
4
4
  const UPPER_CASE_PATTERN = /^(?=.*[A-Z]).+$/;
5
- const DIGIT_PATTERN = /^(?=.*[0-9]).+$/; // Using this regex to match all non-alphanumeric characters to match server-side implementation
5
+ const DIGIT_PATTERN = /^(?=.*[0-9]).+$/;
6
+ // Using this regex to match all non-alphanumeric characters to match server-side implementation
6
7
  // https://github.com/dhis2/dhis2-core/blob/master/dhis-2/dhis-services/dhis-service-core/src/main/java/org/hisp/dhis/user/SpecialCharacterValidationRule.java#L39
7
-
8
8
  const SPECIAL_CHARACTER_PATTERN = /[^a-zA-Z0-9]/;
9
9
  const notString = i18n.t('Password should be a string');
10
10
  const tooShort = i18n.t('Password should be at least 8 characters long');
@@ -13,6 +13,7 @@ const noLowerCase = i18n.t('Password should contain at least one lowercase lette
13
13
  const noUpperCase = i18n.t('Password should contain at least one UPPERCASE letter');
14
14
  const noNumber = i18n.t('Password should contain at least one number');
15
15
  const noSpecialCharacter = i18n.t('Password should have at least one special character');
16
+
16
17
  /**
17
18
  * Tests if a given password is compliant with the password restrictions.
18
19
  * This function checks all restrictions below, but returns when the first violation was found:
@@ -23,43 +24,33 @@ const noSpecialCharacter = i18n.t('Password should have at least one special cha
23
24
  * - Contains at least 1 number
24
25
  * - Contains at least 1 special character
25
26
  */
26
-
27
27
  const dhis2Password = value => {
28
28
  if (isEmpty(value)) {
29
29
  return undefined;
30
30
  }
31
-
32
31
  if (!isString(value)) {
33
32
  return notString;
34
33
  }
35
-
36
34
  if (value.length < 8) {
37
35
  return tooShort;
38
36
  }
39
-
40
37
  if (value.length > 35) {
41
38
  return tooLong;
42
39
  }
43
-
44
40
  if (!LOWER_CASE_PATTERN.test(value)) {
45
41
  return noLowerCase;
46
42
  }
47
-
48
43
  if (!UPPER_CASE_PATTERN.test(value)) {
49
44
  return noUpperCase;
50
45
  }
51
-
52
46
  if (!DIGIT_PATTERN.test(value)) {
53
47
  return noNumber;
54
48
  }
55
-
56
49
  if (!SPECIAL_CHARACTER_PATTERN.test(value)) {
57
50
  return noSpecialCharacter;
58
51
  }
59
-
60
52
  return undefined;
61
53
  };
62
-
63
54
  const errorMessages = {
64
55
  notString,
65
56
  tooShort,
@@ -2,7 +2,5 @@ import i18n from '../locales/index.js';
2
2
  import { isEmpty, isString } from './helpers/index.js';
3
3
  const USERNAME_PATTERN = /^(?=.{4,255}$)(?![_\-.@])(?!.*[_\-.@]{2})[a-zA-Z0-9._\-@]+(?<![_\-.@])$/;
4
4
  const invalidUsernameMessage = i18n.t('Please provide a username between 4 and 255 characters long and possibly separated by . _ - or @');
5
-
6
5
  const dhis2Username = value => isEmpty(value) || isString(value) && USERNAME_PATTERN.test(value) ? undefined : invalidUsernameMessage;
7
-
8
6
  export { dhis2Username, invalidUsernameMessage };
@@ -1,5 +1,6 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { isEmpty, isString } from './helpers/index.js';
3
+
3
4
  /*
4
5
  * Email validation is complicated business. There is no perfect regex,
5
6
  * instead we have to make a trade-off between complexity, correctness,
@@ -26,7 +27,5 @@ import { isEmpty, isString } from './helpers/index.js';
26
27
 
27
28
  const EMAIL_ADDRESS_PATTERN = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/i;
28
29
  const invalidEmailMessage = i18n.t('Please provide a valid email address');
29
-
30
30
  const email = value => isEmpty(value) || isString(value) && EMAIL_ADDRESS_PATTERN.test(value) ? undefined : invalidEmailMessage;
31
-
32
31
  export { email, invalidEmailMessage };
@@ -1,7 +1,5 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { isEmpty } from './helpers/index.js';
3
3
  const hasValueMessage = i18n.t('Please provide a value');
4
-
5
4
  const hasValue = value => isEmpty(value) ? hasValueMessage : undefined;
6
-
7
5
  export { hasValue, hasValueMessage };
@@ -1,10 +1,9 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { isEmpty, isNumeric, toNumber } from './helpers/index.js';
3
- const invalidIntegerMessage = i18n.t('Please provide a round number without decimals'); // Regex accepts only digits (no decimals even if it is trailing like 4.0)
4
- // it also rejects a leading 0 (i.e 04) as this is rejected by backend
3
+ const invalidIntegerMessage = i18n.t('Please provide a round number without decimals');
5
4
 
5
+ // Regex accepts only digits (no decimals even if it is trailing like 4.0)
6
+ // it also rejects a leading 0 (i.e 04) as this is rejected by backend
6
7
  const INTEGER_PATTERN = /^(-?[1-9]\d*|0)$/;
7
-
8
8
  const integer = value => isEmpty(value) || INTEGER_PATTERN.test(value) && isNumeric(value) && Number.isSafeInteger(toNumber(value)) ? undefined : invalidIntegerMessage;
9
-
10
9
  export { integer, invalidIntegerMessage };
@@ -1,5 +1,6 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { isEmpty, isString, isNumeric } from './helpers/index.js';
3
+
3
4
  /*
4
5
  * There were some problems with the server side implementation
5
6
  * of how international phone numbers are validated, and the
@@ -27,22 +28,21 @@ import { isEmpty, isString, isNumeric } from './helpers/index.js';
27
28
  */
28
29
 
29
30
  const invalidInternationalPhoneNumberMessage = i18n.t('Please provide a valid international phone number.');
30
-
31
31
  const internationalPhoneNumber = value => {
32
32
  // allow empty values
33
33
  if (isEmpty(value)) {
34
34
  return undefined;
35
- } // value must be a string
36
-
35
+ }
37
36
 
37
+ // value must be a string
38
38
  if (!isString(value)) {
39
39
  return invalidInternationalPhoneNumberMessage;
40
40
  }
41
-
42
- const cleanedValue = value // strip all hyphens, dots, spaces
43
- .replace(/[-. )(]/g, '') // trim leading zeroes and plus signs
41
+ const cleanedValue = value
42
+ // strip all hyphens, dots, spaces
43
+ .replace(/[-. )(]/g, '')
44
+ // trim leading zeroes and plus signs
44
45
  .replace(/^[0+]+/, '');
45
46
  return isNumeric(cleanedValue) && cleanedValue.length <= 15 ? undefined : invalidInternationalPhoneNumberMessage;
46
47
  };
47
-
48
48
  export { internationalPhoneNumber, invalidInternationalPhoneNumberMessage };
@@ -1,7 +1,5 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { isEmpty, isNumeric } from './helpers/index.js';
3
3
  const invalidNumberMessage = i18n.t('Please provide a number');
4
-
5
4
  const number = value => isEmpty(value) || isNumeric(value) ? undefined : invalidNumberMessage;
6
-
7
5
  export { number, invalidNumberMessage };
@@ -1,7 +1,5 @@
1
1
  import i18n from '../locales/index.js';
2
2
  import { isEmpty, isString } from './helpers/index.js';
3
3
  const invalidStringMessage = i18n.t('Please provide a string');
4
-
5
4
  const string = value => isEmpty(value) || isString(value) ? undefined : invalidStringMessage;
6
-
7
5
  export { string, invalidStringMessage };
@@ -1,19 +1,16 @@
1
1
  const testValidatorValues = (validator, returnValue, values) => {
2
2
  const returnValueStr = returnValue === undefined ? 'undefined' : 'an error string';
3
-
4
3
  for (const value of values) {
5
4
  const type = typeof value;
6
5
  const valueStr = type === 'object' ? JSON.stringify(value) : value;
7
- it("should return ".concat(returnValueStr, " for value `").concat(valueStr, "` of type ").concat(type), () => {
6
+ it(`should return ${returnValueStr} for value \`${valueStr}\` of type ${type}`, () => {
8
7
  expect(validator(value)).toBe(returnValue);
9
8
  });
10
9
  }
11
10
  };
12
-
13
11
  const allowsEmptyValues = validator => {
14
12
  describe('allows empty values', () => {
15
13
  testValidatorValues(validator, undefined, ['', null, undefined]);
16
14
  });
17
15
  };
18
-
19
16
  export { testValidatorValues, allowsEmptyValues };
@@ -1,9 +1,8 @@
1
1
  import i18n from '../locales/index.js';
2
- import { isEmpty, isString } from './helpers/index.js'; // Source: https://gist.github.com/dperini/729294
2
+ import { isEmpty, isString } from './helpers/index.js';
3
3
 
4
+ // Source: https://gist.github.com/dperini/729294
4
5
  const URL_PATTERN = /^(?:(?:(?:https?|ftp):)?\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})))(?::\d{2,5})?(?:[/?#]\S*)?$/i;
5
6
  const invalidUrlMessage = i18n.t('Please provide a valid url');
6
-
7
7
  const url = value => isEmpty(value) || isString(value) && URL_PATTERN.test(value) ? undefined : invalidUrlMessage;
8
-
9
8
  export { url, invalidUrlMessage };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2/ui-forms",
3
- "version": "9.10.3",
3
+ "version": "9.11.1-beta.1",
4
4
  "main": "./build/cjs/index.js",
5
5
  "module": "./build/es/index.js",
6
6
  "sideEffects": [
@@ -26,24 +26,24 @@
26
26
  "access": "public"
27
27
  },
28
28
  "scripts": {
29
- "start": "start-storybook -c ../../storybook/config --port 5000",
29
+ "start": "storybook dev -c ../../storybook/config --port 5000",
30
30
  "build": "d2-app-scripts build"
31
31
  },
32
32
  "peerDependencies": {
33
- "react": "^16.8",
34
- "react-dom": "^16.8"
33
+ "react": "^16.13",
34
+ "react-dom": "^16.13"
35
35
  },
36
36
  "dependencies": {
37
37
  "@dhis2/prop-types": "^3.1.2",
38
- "@dhis2-ui/button": "9.10.3",
39
- "@dhis2-ui/checkbox": "9.10.3",
40
- "@dhis2-ui/field": "9.10.3",
41
- "@dhis2-ui/file-input": "9.10.3",
42
- "@dhis2-ui/input": "9.10.3",
43
- "@dhis2-ui/radio": "9.10.3",
44
- "@dhis2-ui/select": "9.10.3",
45
- "@dhis2-ui/switch": "9.10.3",
46
- "@dhis2-ui/text-area": "9.10.3",
38
+ "@dhis2-ui/button": "9.11.1-beta.1",
39
+ "@dhis2-ui/checkbox": "9.11.1-beta.1",
40
+ "@dhis2-ui/field": "9.11.1-beta.1",
41
+ "@dhis2-ui/file-input": "9.11.1-beta.1",
42
+ "@dhis2-ui/input": "9.11.1-beta.1",
43
+ "@dhis2-ui/radio": "9.11.1-beta.1",
44
+ "@dhis2-ui/select": "9.11.1-beta.1",
45
+ "@dhis2-ui/switch": "9.11.1-beta.1",
46
+ "@dhis2-ui/text-area": "9.11.1-beta.1",
47
47
  "classnames": "^2.3.1",
48
48
  "final-form": "^4.20.2",
49
49
  "prop-types": "^15.7.2",
@@ -1,27 +0,0 @@
1
- "use strict";
2
-
3
- var _react = require("@storybook/react");
4
-
5
- var _react2 = _interopRequireDefault(require("react"));
6
-
7
- var _reactFinalForm = require("react-final-form");
8
-
9
- var _formDecorator = require("../formDecorator.js");
10
-
11
- var _index = require("../validators/index.js");
12
-
13
- var _InputFieldFF = require("./InputFieldFF.js");
14
-
15
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
-
17
- (0, _react.storiesOf)('Testing:InputFieldFF', module).addDecorator(_formDecorator.formDecorator).add('Default', () => /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
18
- component: _InputFieldFF.InputFieldFF,
19
- name: "agree",
20
- label: "Do you agree?"
21
- })).add('Required', () => /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
22
- name: "agree",
23
- component: _InputFieldFF.InputFieldFF,
24
- required: true,
25
- validate: _index.hasValue,
26
- label: "Do you agree?"
27
- }));
@@ -1,91 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.InitialValue = exports.Default = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _reactFinalForm = require("react-final-form");
11
-
12
- var _formDecorator = require("../formDecorator.js");
13
-
14
- var _propTypes = require("../shared/propTypes.js");
15
-
16
- var _MultiSelectFieldFF = require("./MultiSelectFieldFF.js");
17
-
18
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
-
20
- const description = "\nThe `MultiSelectFieldFF` is a wrapper around a `MultiSelectField` that enables it to work with Final Form, the preferred library for form validation and utilities in DHIS 2 apps.\n\n#### Final Form\n\nSee how to use Final Form at [Final Form - Getting Started](https://final-form.org/docs/react-final-form/getting-started).\n\nInside a Final Form `<Form>` component, these 'FF' UI components are intended to be used in the `component` prop of the [Final Form `<Field>` components](https://final-form.org/docs/react-final-form/api/Field) where they will receive some props from the Field, e.g. `<Field component={MultiSelectFieldFF} />`. See the code samples below for examples.\n\n#### Props\n\nThe props shown in the table below are generally provided to the `MultiSelectFieldFF` wrapper by the Final Form `Field`.\n\nNote that any props beyond the API of the `Field` component will be spread to the `MultiSelectFieldFF`, which passes any extra props to the underlying `MultiSelectField` using `{...rest}`.\n\nTherefore, to add any props to the `MultiSelectFieldFF` or `MultiSelectField`, add those props to the parent Final Form `Field` component.\n\nAlso see `MultiSelect` and `MultiSelectField` for notes about props and implementation.\n\n```js\nimport { MultiSelectFieldFF } from '@dhis2/ui'\n```\n\nPress **Submit** to see the form values logged to the console.\n\n_**Note:** Dropdowns may not appear correctly on this page. See the affected demos in the 'Canvas' tab for propper dropdown placement._\n";
21
- const options = [{
22
- value: '1',
23
- label: 'one'
24
- }, {
25
- value: '2',
26
- label: 'two'
27
- }, {
28
- value: '3',
29
- label: 'three'
30
- }, {
31
- value: '4',
32
- label: 'four'
33
- }, {
34
- value: '5',
35
- label: 'five'
36
- }, {
37
- value: '6',
38
- label: 'six'
39
- }, {
40
- value: '7',
41
- label: 'seven'
42
- }, {
43
- value: '8',
44
- label: 'eight'
45
- }, {
46
- value: '9',
47
- label: 'nine'
48
- }, {
49
- value: '10',
50
- label: 'ten'
51
- }];
52
- const initialValue = ['3', '4', '9', '10'];
53
- var _default = {
54
- title: 'Multi Select Field (Final Form)',
55
- component: _MultiSelectFieldFF.MultiSelectFieldFF,
56
- decorators: [_formDecorator.formDecorator],
57
- parameters: {
58
- docs: {
59
- description: {
60
- component: description
61
- }
62
- }
63
- },
64
- argTypes: {
65
- input: { ..._propTypes.inputArgType
66
- },
67
- meta: { ..._propTypes.metaArgType
68
- }
69
- }
70
- };
71
- exports.default = _default;
72
-
73
- const Default = () => /*#__PURE__*/_react.default.createElement(_reactFinalForm.Field, {
74
- component: _MultiSelectFieldFF.MultiSelectFieldFF,
75
- name: "agree",
76
- label: "Do you agree?",
77
- options: options
78
- });
79
-
80
- exports.Default = Default;
81
-
82
- const InitialValue = () => /*#__PURE__*/_react.default.createElement(_reactFinalForm.Field, {
83
- component: _MultiSelectFieldFF.MultiSelectFieldFF,
84
- name: "agree",
85
- label: "Do you agree?",
86
- options: options,
87
- initialValue: initialValue
88
- });
89
-
90
- exports.InitialValue = InitialValue;
91
- InitialValue.storyName = 'InitialValue';
@@ -1,45 +0,0 @@
1
- "use strict";
2
-
3
- var _react = require("@storybook/react");
4
-
5
- var _react2 = _interopRequireDefault(require("react"));
6
-
7
- var _reactFinalForm = require("react-final-form");
8
-
9
- var _FieldGroupFF = require("../FieldGroupFF/FieldGroupFF.js");
10
-
11
- var _formDecorator = require("../formDecorator.js");
12
-
13
- var _index = require("../validators/index.js");
14
-
15
- var _RadioFieldFF = require("./RadioFieldFF.js");
16
-
17
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
18
-
19
- (0, _react.storiesOf)('Testing:RadioFieldFF', module).addDecorator(_formDecorator.formDecorator).add('Required and no selected value', () => /*#__PURE__*/_react2.default.createElement(_FieldGroupFF.FieldGroupFF, {
20
- name: "choice"
21
- }, /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
22
- type: "radio",
23
- component: _RadioFieldFF.RadioFieldFF,
24
- name: "choice",
25
- label: "One",
26
- value: "one",
27
- validate: _index.hasValue,
28
- required: true
29
- }), /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
30
- type: "radio",
31
- component: _RadioFieldFF.RadioFieldFF,
32
- name: "choice",
33
- label: "Two",
34
- value: "two",
35
- validate: _index.hasValue,
36
- required: true
37
- }), /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
38
- type: "radio",
39
- component: _RadioFieldFF.RadioFieldFF,
40
- name: "choice",
41
- label: "Three",
42
- value: "three",
43
- validate: _index.hasValue,
44
- required: true
45
- })));
@@ -1,37 +0,0 @@
1
- "use strict";
2
-
3
- var _react = require("@storybook/react");
4
-
5
- var _react2 = _interopRequireDefault(require("react"));
6
-
7
- var _reactFinalForm = require("react-final-form");
8
-
9
- var _formDecorator = require("../formDecorator.js");
10
-
11
- var _index = require("../validators/index.js");
12
-
13
- var _SingleSelectFieldFF = require("./SingleSelectFieldFF.js");
14
-
15
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
-
17
- const defaultOptions = [{
18
- value: 'initial',
19
- label: 'Initial'
20
- }];
21
- (0, _react.storiesOf)('Testing:SingleSelectFieldFF', module).addDecorator(_formDecorator.formDecorator).addParameters({
22
- options: {
23
- showPanel: false
24
- }
25
- }).add('Required', (_, _ref) => {
26
- let {
27
- cypressProps
28
- } = _ref;
29
- return /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
30
- required: true,
31
- name: "singleSelect",
32
- label: "Single select",
33
- component: _SingleSelectFieldFF.SingleSelectFieldFF,
34
- validate: _index.hasValue,
35
- options: cypressProps.options || defaultOptions
36
- });
37
- });
@@ -1,90 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.InitialValue = exports.Default = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _reactFinalForm = require("react-final-form");
11
-
12
- var _formDecorator = require("../formDecorator.js");
13
-
14
- var _propTypes = require("../shared/propTypes.js");
15
-
16
- var _SingleSelectFieldFF = require("./SingleSelectFieldFF.js");
17
-
18
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
-
20
- const description = "\nThe `SingleSelectFieldFF` is a wrapper around a `SingleSelectField` that enables it to work with Final Form, the preferred library for form validation and utilities in DHIS 2 apps.\n\n#### Final Form\n\nSee how to use Final Form at [Final Form - Getting Started](https://final-form.org/docs/react-final-form/getting-started).\n\nInside a Final Form `<Form>` component, these 'FF' UI components are intended to be used in the `component` prop of the [Final Form `<Field>` components](https://final-form.org/docs/react-final-form/api/Field) where they will receive some props from the Field, e.g. `<Field component={SingleSelectFieldFF} />`. See the code samples below for examples.\n\n#### Props\n\nThe props shown in the table below are generally provided to the `SingleSelectFieldFF` wrapper by the Final Form `Field`.\n\nNote that any props beyond the API of the `Field` component will be spread to the `SingleSelectFieldFF`, which passes any extra props to the underlying `SingleSelectField` using `{...rest}`.\n\nTherefore, to add any props to the `SingleSelectFieldFF` or `SingleSelectField`, add those props to the parent Final Form `Field` component.\n\nAlso see `SingleSelect` and `SingleSelectField` for notes about props and implementation.\n\n```js\nimport { SingleSelectFieldFF } from '@dhis2/ui'\n```\n\nPress **Submit** to see the form values logged to the console.\n\n_**Note:** Dropdowns may not appear correctly on this page. See the affected demos in the 'Canvas' tab for propper dropdown placement._\n";
21
- const options = [{
22
- value: '1',
23
- label: 'one'
24
- }, {
25
- value: '2',
26
- label: 'two'
27
- }, {
28
- value: '3',
29
- label: 'three'
30
- }, {
31
- value: '4',
32
- label: 'four'
33
- }, {
34
- value: '5',
35
- label: 'five'
36
- }, {
37
- value: '6',
38
- label: 'six'
39
- }, {
40
- value: '7',
41
- label: 'seven'
42
- }, {
43
- value: '8',
44
- label: 'eight'
45
- }, {
46
- value: '9',
47
- label: 'nine'
48
- }, {
49
- value: '10',
50
- label: 'ten'
51
- }];
52
- var _default = {
53
- title: 'Single Select Field (Final Form)',
54
- component: _SingleSelectFieldFF.SingleSelectFieldFF,
55
- decorators: [_formDecorator.formDecorator],
56
- parameters: {
57
- docs: {
58
- description: {
59
- component: description
60
- }
61
- }
62
- },
63
- argTypes: {
64
- input: { ..._propTypes.inputArgType
65
- },
66
- meta: { ..._propTypes.metaArgType
67
- }
68
- }
69
- };
70
- exports.default = _default;
71
-
72
- const Default = () => /*#__PURE__*/_react.default.createElement(_reactFinalForm.Field, {
73
- component: _SingleSelectFieldFF.SingleSelectFieldFF,
74
- name: "agree",
75
- label: "Do you agree?",
76
- options: options
77
- });
78
-
79
- exports.Default = Default;
80
-
81
- const InitialValue = () => /*#__PURE__*/_react.default.createElement(_reactFinalForm.Field, {
82
- component: _SingleSelectFieldFF.SingleSelectFieldFF,
83
- name: "agree",
84
- label: "Do you agree?",
85
- options: options,
86
- initialValue: "4"
87
- });
88
-
89
- exports.InitialValue = InitialValue;
90
- InitialValue.storyName = 'InitialValue';
@@ -1,49 +0,0 @@
1
- "use strict";
2
-
3
- var _react = require("@storybook/react");
4
-
5
- var _react2 = _interopRequireDefault(require("react"));
6
-
7
- var _reactFinalForm = require("react-final-form");
8
-
9
- var _formDecorator = require("../formDecorator.js");
10
-
11
- var _index = require("../validators/index.js");
12
-
13
- var _SwitchFieldFF = require("./SwitchFieldFF.js");
14
-
15
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
-
17
- // https://github.com/final-form/react-final-form-arrays/issues/111
18
- const initialValue = ['yes'];
19
- (0, _react.storiesOf)('Testing:SwitchFieldFF', module).addDecorator(_formDecorator.formDecorator).add('Unchecked', () => /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
20
- component: _SwitchFieldFF.SwitchFieldFF,
21
- className: "switch",
22
- name: "switch",
23
- label: "Label text",
24
- validate: _index.hasValue,
25
- required: true,
26
- type: "checkbox"
27
- })).add('Checked ', () => /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
28
- component: _SwitchFieldFF.SwitchFieldFF,
29
- className: "switch",
30
- name: "switch",
31
- label: "Label text",
32
- initialValue: true,
33
- type: "checkbox"
34
- })).add('Unchecked with value', () => /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
35
- component: _SwitchFieldFF.SwitchFieldFF,
36
- className: "switch",
37
- name: "switch",
38
- label: "Label text",
39
- value: "yes",
40
- type: "checkbox"
41
- })).add('Checked with value', () => /*#__PURE__*/_react2.default.createElement(_reactFinalForm.Field, {
42
- component: _SwitchFieldFF.SwitchFieldFF,
43
- className: "switch",
44
- name: "switch",
45
- label: "Label text",
46
- value: "yes",
47
- initialValue: initialValue,
48
- type: "checkbox"
49
- }));