@hedia/recommendation-screen 2.1.21 → 2.1.22-alpha.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 (47) hide show
  1. package/coverage/clover.xml +716 -0
  2. package/coverage/coverage-final.json +28 -0
  3. package/coverage/lcov-report/base.css +224 -0
  4. package/coverage/lcov-report/block-navigation.js +79 -0
  5. package/coverage/lcov-report/favicon.png +0 -0
  6. package/coverage/lcov-report/index.html +201 -0
  7. package/coverage/lcov-report/prettify.css +1 -0
  8. package/coverage/lcov-report/prettify.js +2 -0
  9. package/coverage/lcov-report/sort-arrow-sprite.png +0 -0
  10. package/coverage/lcov-report/sorter.js +170 -0
  11. package/coverage/lcov-report/src/RecommendationScreen.tsx.html +2483 -0
  12. package/coverage/lcov-report/src/__tests__/index.html +111 -0
  13. package/coverage/lcov-report/src/__tests__/utils.tsx.html +533 -0
  14. package/coverage/lcov-report/src/components/Header.tsx.html +356 -0
  15. package/coverage/lcov-report/src/components/InfoBars.tsx.html +518 -0
  16. package/coverage/lcov-report/src/components/InvisibleNumberInput.tsx.html +566 -0
  17. package/coverage/lcov-report/src/components/LimitationMessage.tsx.html +209 -0
  18. package/coverage/lcov-report/src/components/LineSeparator.tsx.html +161 -0
  19. package/coverage/lcov-report/src/components/RecentInsulin.tsx.html +410 -0
  20. package/coverage/lcov-report/src/components/RecommendationModal.tsx.html +923 -0
  21. package/coverage/lcov-report/src/components/RecommendedCarbs.tsx.html +1061 -0
  22. package/coverage/lcov-report/src/components/RecommendedInsulin.tsx.html +779 -0
  23. package/coverage/lcov-report/src/components/Remeasure.tsx.html +551 -0
  24. package/coverage/lcov-report/src/components/TransferToLogbook.tsx.html +443 -0
  25. package/coverage/lcov-report/src/components/TwoOptionModal.tsx.html +665 -0
  26. package/coverage/lcov-report/src/components/activity/Activity.tsx.html +371 -0
  27. package/coverage/lcov-report/src/components/activity/ActivityIcon.tsx.html +281 -0
  28. package/coverage/lcov-report/src/components/activity/ActivityIntensity.tsx.html +281 -0
  29. package/coverage/lcov-report/src/components/activity/index.html +141 -0
  30. package/coverage/lcov-report/src/components/index.html +276 -0
  31. package/coverage/lcov-report/src/components/mood/Emotion.tsx.html +353 -0
  32. package/coverage/lcov-report/src/components/mood/MoodIcon.tsx.html +335 -0
  33. package/coverage/lcov-report/src/components/mood/index.html +126 -0
  34. package/coverage/lcov-report/src/index.html +111 -0
  35. package/coverage/lcov-report/src/locale/i18nUtils.ts.html +206 -0
  36. package/coverage/lcov-report/src/locale/index.html +111 -0
  37. package/coverage/lcov-report/src/utils/AttentionMessages.tsx.html +554 -0
  38. package/coverage/lcov-report/src/utils/Constants.ts.html +248 -0
  39. package/coverage/lcov-report/src/utils/RecommendationError.tsx.html +620 -0
  40. package/coverage/lcov-report/src/utils/RecommendationUtils.ts.html +764 -0
  41. package/coverage/lcov-report/src/utils/Translations.ts.html +131 -0
  42. package/coverage/lcov-report/src/utils/Utils.ts.html +545 -0
  43. package/coverage/lcov-report/src/utils/Validations.ts.html +1544 -0
  44. package/coverage/lcov-report/src/utils/index.html +201 -0
  45. package/coverage/lcov.info +1611 -0
  46. package/package.json +2 -2
  47. package/src/__tests__/utils.js +2 -2
package/coverage/lcov-report/src/components/InvisibleNumberInput.tsx.html ADDED
@@ -0,0 +1,566 @@
1
+
2
+ <!doctype html>
3
+ <html lang="en">
4
+
5
+ <head>
6
+ <title>Code coverage report for src/components/InvisibleNumberInput.tsx</title>
7
+ <meta charset="utf-8" />
8
+ <link rel="stylesheet" href="../../prettify.css" />
9
+ <link rel="stylesheet" href="../../base.css" />
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
11
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
12
+ <style type='text/css'>
13
+ .coverage-summary .sorter {
14
+ background-image: url(../../sort-arrow-sprite.png);
15
+ }
16
+ </style>
17
+ </head>
18
+
19
+ <body>
20
+ <div class='wrapper'>
21
+ <div class='pad1'>
22
+ <h1><a href="../../index.html">All files</a> / <a href="index.html">src/components</a> InvisibleNumberInput.tsx</h1>
23
+ <div class='clearfix'>
24
+
25
+ <div class='fl pad1y space-right2'>
26
+ <span class="strong">100% </span>
27
+ <span class="quiet">Statements</span>
28
+ <span class='fraction'>29/29</span>
29
+ </div>
30
+
31
+
32
+ <div class='fl pad1y space-right2'>
33
+ <span class="strong">100% </span>
34
+ <span class="quiet">Branches</span>
35
+ <span class='fraction'>12/12</span>
36
+ </div>
37
+
38
+
39
+ <div class='fl pad1y space-right2'>
40
+ <span class="strong">100% </span>
41
+ <span class="quiet">Functions</span>
42
+ <span class='fraction'>8/8</span>
43
+ </div>
44
+
45
+
46
+ <div class='fl pad1y space-right2'>
47
+ <span class="strong">100% </span>
48
+ <span class="quiet">Lines</span>
49
+ <span class='fraction'>29/29</span>
50
+ </div>
51
+
52
+
53
+ </div>
54
+ <p class="quiet">
55
+ Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
+ </p>
57
+ </div>
58
+ <div class='status-line high'></div>
59
+ <pre><table class="coverage">
60
+ <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
61
+ <a name='L2'></a><a href='#L2'>2</a>
62
+ <a name='L3'></a><a href='#L3'>3</a>
63
+ <a name='L4'></a><a href='#L4'>4</a>
64
+ <a name='L5'></a><a href='#L5'>5</a>
65
+ <a name='L6'></a><a href='#L6'>6</a>
66
+ <a name='L7'></a><a href='#L7'>7</a>
67
+ <a name='L8'></a><a href='#L8'>8</a>
68
+ <a name='L9'></a><a href='#L9'>9</a>
69
+ <a name='L10'></a><a href='#L10'>10</a>
70
+ <a name='L11'></a><a href='#L11'>11</a>
71
+ <a name='L12'></a><a href='#L12'>12</a>
72
+ <a name='L13'></a><a href='#L13'>13</a>
73
+ <a name='L14'></a><a href='#L14'>14</a>
74
+ <a name='L15'></a><a href='#L15'>15</a>
75
+ <a name='L16'></a><a href='#L16'>16</a>
76
+ <a name='L17'></a><a href='#L17'>17</a>
77
+ <a name='L18'></a><a href='#L18'>18</a>
78
+ <a name='L19'></a><a href='#L19'>19</a>
79
+ <a name='L20'></a><a href='#L20'>20</a>
80
+ <a name='L21'></a><a href='#L21'>21</a>
81
+ <a name='L22'></a><a href='#L22'>22</a>
82
+ <a name='L23'></a><a href='#L23'>23</a>
83
+ <a name='L24'></a><a href='#L24'>24</a>
84
+ <a name='L25'></a><a href='#L25'>25</a>
85
+ <a name='L26'></a><a href='#L26'>26</a>
86
+ <a name='L27'></a><a href='#L27'>27</a>
87
+ <a name='L28'></a><a href='#L28'>28</a>
88
+ <a name='L29'></a><a href='#L29'>29</a>
89
+ <a name='L30'></a><a href='#L30'>30</a>
90
+ <a name='L31'></a><a href='#L31'>31</a>
91
+ <a name='L32'></a><a href='#L32'>32</a>
92
+ <a name='L33'></a><a href='#L33'>33</a>
93
+ <a name='L34'></a><a href='#L34'>34</a>
94
+ <a name='L35'></a><a href='#L35'>35</a>
95
+ <a name='L36'></a><a href='#L36'>36</a>
96
+ <a name='L37'></a><a href='#L37'>37</a>
97
+ <a name='L38'></a><a href='#L38'>38</a>
98
+ <a name='L39'></a><a href='#L39'>39</a>
99
+ <a name='L40'></a><a href='#L40'>40</a>
100
+ <a name='L41'></a><a href='#L41'>41</a>
101
+ <a name='L42'></a><a href='#L42'>42</a>
102
+ <a name='L43'></a><a href='#L43'>43</a>
103
+ <a name='L44'></a><a href='#L44'>44</a>
104
+ <a name='L45'></a><a href='#L45'>45</a>
105
+ <a name='L46'></a><a href='#L46'>46</a>
106
+ <a name='L47'></a><a href='#L47'>47</a>
107
+ <a name='L48'></a><a href='#L48'>48</a>
108
+ <a name='L49'></a><a href='#L49'>49</a>
109
+ <a name='L50'></a><a href='#L50'>50</a>
110
+ <a name='L51'></a><a href='#L51'>51</a>
111
+ <a name='L52'></a><a href='#L52'>52</a>
112
+ <a name='L53'></a><a href='#L53'>53</a>
113
+ <a name='L54'></a><a href='#L54'>54</a>
114
+ <a name='L55'></a><a href='#L55'>55</a>
115
+ <a name='L56'></a><a href='#L56'>56</a>
116
+ <a name='L57'></a><a href='#L57'>57</a>
117
+ <a name='L58'></a><a href='#L58'>58</a>
118
+ <a name='L59'></a><a href='#L59'>59</a>
119
+ <a name='L60'></a><a href='#L60'>60</a>
120
+ <a name='L61'></a><a href='#L61'>61</a>
121
+ <a name='L62'></a><a href='#L62'>62</a>
122
+ <a name='L63'></a><a href='#L63'>63</a>
123
+ <a name='L64'></a><a href='#L64'>64</a>
124
+ <a name='L65'></a><a href='#L65'>65</a>
125
+ <a name='L66'></a><a href='#L66'>66</a>
126
+ <a name='L67'></a><a href='#L67'>67</a>
127
+ <a name='L68'></a><a href='#L68'>68</a>
128
+ <a name='L69'></a><a href='#L69'>69</a>
129
+ <a name='L70'></a><a href='#L70'>70</a>
130
+ <a name='L71'></a><a href='#L71'>71</a>
131
+ <a name='L72'></a><a href='#L72'>72</a>
132
+ <a name='L73'></a><a href='#L73'>73</a>
133
+ <a name='L74'></a><a href='#L74'>74</a>
134
+ <a name='L75'></a><a href='#L75'>75</a>
135
+ <a name='L76'></a><a href='#L76'>76</a>
136
+ <a name='L77'></a><a href='#L77'>77</a>
137
+ <a name='L78'></a><a href='#L78'>78</a>
138
+ <a name='L79'></a><a href='#L79'>79</a>
139
+ <a name='L80'></a><a href='#L80'>80</a>
140
+ <a name='L81'></a><a href='#L81'>81</a>
141
+ <a name='L82'></a><a href='#L82'>82</a>
142
+ <a name='L83'></a><a href='#L83'>83</a>
143
+ <a name='L84'></a><a href='#L84'>84</a>
144
+ <a name='L85'></a><a href='#L85'>85</a>
145
+ <a name='L86'></a><a href='#L86'>86</a>
146
+ <a name='L87'></a><a href='#L87'>87</a>
147
+ <a name='L88'></a><a href='#L88'>88</a>
148
+ <a name='L89'></a><a href='#L89'>89</a>
149
+ <a name='L90'></a><a href='#L90'>90</a>
150
+ <a name='L91'></a><a href='#L91'>91</a>
151
+ <a name='L92'></a><a href='#L92'>92</a>
152
+ <a name='L93'></a><a href='#L93'>93</a>
153
+ <a name='L94'></a><a href='#L94'>94</a>
154
+ <a name='L95'></a><a href='#L95'>95</a>
155
+ <a name='L96'></a><a href='#L96'>96</a>
156
+ <a name='L97'></a><a href='#L97'>97</a>
157
+ <a name='L98'></a><a href='#L98'>98</a>
158
+ <a name='L99'></a><a href='#L99'>99</a>
159
+ <a name='L100'></a><a href='#L100'>100</a>
160
+ <a name='L101'></a><a href='#L101'>101</a>
161
+ <a name='L102'></a><a href='#L102'>102</a>
162
+ <a name='L103'></a><a href='#L103'>103</a>
163
+ <a name='L104'></a><a href='#L104'>104</a>
164
+ <a name='L105'></a><a href='#L105'>105</a>
165
+ <a name='L106'></a><a href='#L106'>106</a>
166
+ <a name='L107'></a><a href='#L107'>107</a>
167
+ <a name='L108'></a><a href='#L108'>108</a>
168
+ <a name='L109'></a><a href='#L109'>109</a>
169
+ <a name='L110'></a><a href='#L110'>110</a>
170
+ <a name='L111'></a><a href='#L111'>111</a>
171
+ <a name='L112'></a><a href='#L112'>112</a>
172
+ <a name='L113'></a><a href='#L113'>113</a>
173
+ <a name='L114'></a><a href='#L114'>114</a>
174
+ <a name='L115'></a><a href='#L115'>115</a>
175
+ <a name='L116'></a><a href='#L116'>116</a>
176
+ <a name='L117'></a><a href='#L117'>117</a>
177
+ <a name='L118'></a><a href='#L118'>118</a>
178
+ <a name='L119'></a><a href='#L119'>119</a>
179
+ <a name='L120'></a><a href='#L120'>120</a>
180
+ <a name='L121'></a><a href='#L121'>121</a>
181
+ <a name='L122'></a><a href='#L122'>122</a>
182
+ <a name='L123'></a><a href='#L123'>123</a>
183
+ <a name='L124'></a><a href='#L124'>124</a>
184
+ <a name='L125'></a><a href='#L125'>125</a>
185
+ <a name='L126'></a><a href='#L126'>126</a>
186
+ <a name='L127'></a><a href='#L127'>127</a>
187
+ <a name='L128'></a><a href='#L128'>128</a>
188
+ <a name='L129'></a><a href='#L129'>129</a>
189
+ <a name='L130'></a><a href='#L130'>130</a>
190
+ <a name='L131'></a><a href='#L131'>131</a>
191
+ <a name='L132'></a><a href='#L132'>132</a>
192
+ <a name='L133'></a><a href='#L133'>133</a>
193
+ <a name='L134'></a><a href='#L134'>134</a>
194
+ <a name='L135'></a><a href='#L135'>135</a>
195
+ <a name='L136'></a><a href='#L136'>136</a>
196
+ <a name='L137'></a><a href='#L137'>137</a>
197
+ <a name='L138'></a><a href='#L138'>138</a>
198
+ <a name='L139'></a><a href='#L139'>139</a>
199
+ <a name='L140'></a><a href='#L140'>140</a>
200
+ <a name='L141'></a><a href='#L141'>141</a>
201
+ <a name='L142'></a><a href='#L142'>142</a>
202
+ <a name='L143'></a><a href='#L143'>143</a>
203
+ <a name='L144'></a><a href='#L144'>144</a>
204
+ <a name='L145'></a><a href='#L145'>145</a>
205
+ <a name='L146'></a><a href='#L146'>146</a>
206
+ <a name='L147'></a><a href='#L147'>147</a>
207
+ <a name='L148'></a><a href='#L148'>148</a>
208
+ <a name='L149'></a><a href='#L149'>149</a>
209
+ <a name='L150'></a><a href='#L150'>150</a>
210
+ <a name='L151'></a><a href='#L151'>151</a>
211
+ <a name='L152'></a><a href='#L152'>152</a>
212
+ <a name='L153'></a><a href='#L153'>153</a>
213
+ <a name='L154'></a><a href='#L154'>154</a>
214
+ <a name='L155'></a><a href='#L155'>155</a>
215
+ <a name='L156'></a><a href='#L156'>156</a>
216
+ <a name='L157'></a><a href='#L157'>157</a>
217
+ <a name='L158'></a><a href='#L158'>158</a>
218
+ <a name='L159'></a><a href='#L159'>159</a>
219
+ <a name='L160'></a><a href='#L160'>160</a>
220
+ <a name='L161'></a><a href='#L161'>161</a>
221
+ <a name='L162'></a><a href='#L162'>162</a>
222
+ <a name='L163'></a><a href='#L163'>163</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
223
+ <span class="cline-any cline-neutral">&nbsp;</span>
224
+ <span class="cline-any cline-neutral">&nbsp;</span>
225
+ <span class="cline-any cline-neutral">&nbsp;</span>
226
+ <span class="cline-any cline-neutral">&nbsp;</span>
227
+ <span class="cline-any cline-neutral">&nbsp;</span>
228
+ <span class="cline-any cline-neutral">&nbsp;</span>
229
+ <span class="cline-any cline-neutral">&nbsp;</span>
230
+ <span class="cline-any cline-neutral">&nbsp;</span>
231
+ <span class="cline-any cline-neutral">&nbsp;</span>
232
+ <span class="cline-any cline-neutral">&nbsp;</span>
233
+ <span class="cline-any cline-neutral">&nbsp;</span>
234
+ <span class="cline-any cline-neutral">&nbsp;</span>
235
+ <span class="cline-any cline-neutral">&nbsp;</span>
236
+ <span class="cline-any cline-neutral">&nbsp;</span>
237
+ <span class="cline-any cline-neutral">&nbsp;</span>
238
+ <span class="cline-any cline-neutral">&nbsp;</span>
239
+ <span class="cline-any cline-neutral">&nbsp;</span>
240
+ <span class="cline-any cline-neutral">&nbsp;</span>
241
+ <span class="cline-any cline-neutral">&nbsp;</span>
242
+ <span class="cline-any cline-neutral">&nbsp;</span>
243
+ <span class="cline-any cline-neutral">&nbsp;</span>
244
+ <span class="cline-any cline-neutral">&nbsp;</span>
245
+ <span class="cline-any cline-neutral">&nbsp;</span>
246
+ <span class="cline-any cline-neutral">&nbsp;</span>
247
+ <span class="cline-any cline-neutral">&nbsp;</span>
248
+ <span class="cline-any cline-neutral">&nbsp;</span>
249
+ <span class="cline-any cline-neutral">&nbsp;</span>
250
+ <span class="cline-any cline-neutral">&nbsp;</span>
251
+ <span class="cline-any cline-neutral">&nbsp;</span>
252
+ <span class="cline-any cline-neutral">&nbsp;</span>
253
+ <span class="cline-any cline-neutral">&nbsp;</span>
254
+ <span class="cline-any cline-neutral">&nbsp;</span>
255
+ <span class="cline-any cline-neutral">&nbsp;</span>
256
+ <span class="cline-any cline-neutral">&nbsp;</span>
257
+ <span class="cline-any cline-neutral">&nbsp;</span>
258
+ <span class="cline-any cline-neutral">&nbsp;</span>
259
+ <span class="cline-any cline-neutral">&nbsp;</span>
260
+ <span class="cline-any cline-neutral">&nbsp;</span>
261
+ <span class="cline-any cline-neutral">&nbsp;</span>
262
+ <span class="cline-any cline-neutral">&nbsp;</span>
263
+ <span class="cline-any cline-yes">143x</span>
264
+ <span class="cline-any cline-neutral">&nbsp;</span>
265
+ <span class="cline-any cline-neutral">&nbsp;</span>
266
+ <span class="cline-any cline-neutral">&nbsp;</span>
267
+ <span class="cline-any cline-neutral">&nbsp;</span>
268
+ <span class="cline-any cline-neutral">&nbsp;</span>
269
+ <span class="cline-any cline-neutral">&nbsp;</span>
270
+ <span class="cline-any cline-neutral">&nbsp;</span>
271
+ <span class="cline-any cline-neutral">&nbsp;</span>
272
+ <span class="cline-any cline-neutral">&nbsp;</span>
273
+ <span class="cline-any cline-neutral">&nbsp;</span>
274
+ <span class="cline-any cline-neutral">&nbsp;</span>
275
+ <span class="cline-any cline-neutral">&nbsp;</span>
276
+ <span class="cline-any cline-yes">143x</span>
277
+ <span class="cline-any cline-neutral">&nbsp;</span>
278
+ <span class="cline-any cline-neutral">&nbsp;</span>
279
+ <span class="cline-any cline-yes">143x</span>
280
+ <span class="cline-any cline-yes">45x</span>
281
+ <span class="cline-any cline-neutral">&nbsp;</span>
282
+ <span class="cline-any cline-neutral">&nbsp;</span>
283
+ <span class="cline-any cline-yes">45x</span>
284
+ <span class="cline-any cline-neutral">&nbsp;</span>
285
+ <span class="cline-any cline-neutral">&nbsp;</span>
286
+ <span class="cline-any cline-neutral">&nbsp;</span>
287
+ <span class="cline-any cline-neutral">&nbsp;</span>
288
+ <span class="cline-any cline-neutral">&nbsp;</span>
289
+ <span class="cline-any cline-neutral">&nbsp;</span>
290
+ <span class="cline-any cline-neutral">&nbsp;</span>
291
+ <span class="cline-any cline-neutral">&nbsp;</span>
292
+ <span class="cline-any cline-neutral">&nbsp;</span>
293
+ <span class="cline-any cline-neutral">&nbsp;</span>
294
+ <span class="cline-any cline-neutral">&nbsp;</span>
295
+ <span class="cline-any cline-neutral">&nbsp;</span>
296
+ <span class="cline-any cline-neutral">&nbsp;</span>
297
+ <span class="cline-any cline-neutral">&nbsp;</span>
298
+ <span class="cline-any cline-neutral">&nbsp;</span>
299
+ <span class="cline-any cline-neutral">&nbsp;</span>
300
+ <span class="cline-any cline-neutral">&nbsp;</span>
301
+ <span class="cline-any cline-yes">143x</span>
302
+ <span class="cline-any cline-yes">45x</span>
303
+ <span class="cline-any cline-yes">45x</span>
304
+ <span class="cline-any cline-yes">40x</span>
305
+ <span class="cline-any cline-yes">40x</span>
306
+ <span class="cline-any cline-yes">40x</span>
307
+ <span class="cline-any cline-neutral">&nbsp;</span>
308
+ <span class="cline-any cline-yes">45x</span>
309
+ <span class="cline-any cline-yes">40x</span>
310
+ <span class="cline-any cline-neutral">&nbsp;</span>
311
+ <span class="cline-any cline-yes">5x</span>
312
+ <span class="cline-any cline-neutral">&nbsp;</span>
313
+ <span class="cline-any cline-neutral">&nbsp;</span>
314
+ <span class="cline-any cline-neutral">&nbsp;</span>
315
+ <span class="cline-any cline-neutral">&nbsp;</span>
316
+ <span class="cline-any cline-neutral">&nbsp;</span>
317
+ <span class="cline-any cline-neutral">&nbsp;</span>
318
+ <span class="cline-any cline-neutral">&nbsp;</span>
319
+ <span class="cline-any cline-neutral">&nbsp;</span>
320
+ <span class="cline-any cline-neutral">&nbsp;</span>
321
+ <span class="cline-any cline-neutral">&nbsp;</span>
322
+ <span class="cline-any cline-neutral">&nbsp;</span>
323
+ <span class="cline-any cline-neutral">&nbsp;</span>
324
+ <span class="cline-any cline-neutral">&nbsp;</span>
325
+ <span class="cline-any cline-neutral">&nbsp;</span>
326
+ <span class="cline-any cline-yes">143x</span>
327
+ <span class="cline-any cline-yes">41x</span>
328
+ <span class="cline-any cline-yes">41x</span>
329
+ <span class="cline-any cline-yes">41x</span>
330
+ <span class="cline-any cline-yes">36x</span>
331
+ <span class="cline-any cline-neutral">&nbsp;</span>
332
+ <span class="cline-any cline-yes">41x</span>
333
+ <span class="cline-any cline-neutral">&nbsp;</span>
334
+ <span class="cline-any cline-neutral">&nbsp;</span>
335
+ <span class="cline-any cline-yes">41x</span>
336
+ <span class="cline-any cline-neutral">&nbsp;</span>
337
+ <span class="cline-any cline-neutral">&nbsp;</span>
338
+ <span class="cline-any cline-neutral">&nbsp;</span>
339
+ <span class="cline-any cline-neutral">&nbsp;</span>
340
+ <span class="cline-any cline-neutral">&nbsp;</span>
341
+ <span class="cline-any cline-neutral">&nbsp;</span>
342
+ <span class="cline-any cline-neutral">&nbsp;</span>
343
+ <span class="cline-any cline-neutral">&nbsp;</span>
344
+ <span class="cline-any cline-neutral">&nbsp;</span>
345
+ <span class="cline-any cline-yes">143x</span>
346
+ <span class="cline-any cline-yes">14x</span>
347
+ <span class="cline-any cline-yes">14x</span>
348
+ <span class="cline-any cline-neutral">&nbsp;</span>
349
+ <span class="cline-any cline-neutral">&nbsp;</span>
350
+ <span class="cline-any cline-neutral">&nbsp;</span>
351
+ <span class="cline-any cline-neutral">&nbsp;</span>
352
+ <span class="cline-any cline-neutral">&nbsp;</span>
353
+ <span class="cline-any cline-neutral">&nbsp;</span>
354
+ <span class="cline-any cline-neutral">&nbsp;</span>
355
+ <span class="cline-any cline-yes">459x</span>
356
+ <span class="cline-any cline-yes">459x</span>
357
+ <span class="cline-any cline-neutral">&nbsp;</span>
358
+ <span class="cline-any cline-neutral">&nbsp;</span>
359
+ <span class="cline-any cline-neutral">&nbsp;</span>
360
+ <span class="cline-any cline-neutral">&nbsp;</span>
361
+ <span class="cline-any cline-neutral">&nbsp;</span>
362
+ <span class="cline-any cline-yes">918x</span>
363
+ <span class="cline-any cline-yes">459x</span>
364
+ <span class="cline-any cline-neutral">&nbsp;</span>
365
+ <span class="cline-any cline-neutral">&nbsp;</span>
366
+ <span class="cline-any cline-neutral">&nbsp;</span>
367
+ <span class="cline-any cline-neutral">&nbsp;</span>
368
+ <span class="cline-any cline-neutral">&nbsp;</span>
369
+ <span class="cline-any cline-neutral">&nbsp;</span>
370
+ <span class="cline-any cline-neutral">&nbsp;</span>
371
+ <span class="cline-any cline-neutral">&nbsp;</span>
372
+ <span class="cline-any cline-neutral">&nbsp;</span>
373
+ <span class="cline-any cline-neutral">&nbsp;</span>
374
+ <span class="cline-any cline-neutral">&nbsp;</span>
375
+ <span class="cline-any cline-neutral">&nbsp;</span>
376
+ <span class="cline-any cline-neutral">&nbsp;</span>
377
+ <span class="cline-any cline-yes">4x</span>
378
+ <span class="cline-any cline-neutral">&nbsp;</span>
379
+ <span class="cline-any cline-neutral">&nbsp;</span>
380
+ <span class="cline-any cline-neutral">&nbsp;</span>
381
+ <span class="cline-any cline-neutral">&nbsp;</span>
382
+ <span class="cline-any cline-neutral">&nbsp;</span>
383
+ <span class="cline-any cline-neutral">&nbsp;</span>
384
+ <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React from "react";
385
+ import { StyleSheet, TextInput } from "react-native";
386
+ &nbsp;
387
+ export interface IProps {
388
+ /** The initial value to put in the input field. */
389
+ startValue?: string;
390
+ /** The precision with which the content of the input field may be displayed */
391
+ decimalPlaces: number;
392
+ /** Whether or not the clean method should be used on the content every time it is changed */
393
+ cleanPartialInput: boolean;
394
+ /** Whether or not negative values can be entered. */
395
+ negativeAllowed: boolean;
396
+ /** Max length of the content in the input field. */
397
+ maxLength?: number;
398
+ /** Test id used for component testing */
399
+ testID: string;
400
+ /** Callback function taking a function as argument - For passing a reference for the input field’s to the parent component. */
401
+ visible(toggle: () =&gt; void): void;
402
+ /** Callback function taking a number argument - To be called when the user finishes editing the invisible text field with the final numerical value as argument. */
403
+ onEnd?(value: number): void;
404
+ /** Callback function taking a string as input and not returning anything - To be called every time the content in the input field changes. */
405
+ partialInput?(value: string): void;
406
+ }
407
+ &nbsp;
408
+ export interface IState {
409
+ /** For storing the value of the text input so it is available for handling in onEndEdit() when editing the text input ends. */
410
+ value: string;
411
+ }
412
+ &nbsp;
413
+ /**
414
+ * InvisibleNumberInput is used to enable numerical input by the user without displaying a traditional input field on the screen.
415
+ * Since the input field is made invisible and thus can’t be tapped directly by the user we need to be able to call
416
+ * its focus() method from the parent component in order to activate the input field and show the keyboard.
417
+ * We do this by defining a function that calls the input field’s focus() method inside the InvisibleNumberInput component when it has been mounted.
418
+ * This function is then passed to the parent by giving it as the argument for a callback function named visible.
419
+ */
420
+ export default class InvisibleNumberInput extends React.Component&lt;IProps, IState&gt; {
421
+ /** For holding a reference to the TextInput component so it can be focused when the InvisibleNumberInput component has been mounted. */
422
+ public textInput?: TextInput;
423
+ &nbsp;
424
+ /** Initialise the state value variable with `0` */
425
+ public state: IState = {
426
+ value: `0`,
427
+ };
428
+ &nbsp;
429
+ /**
430
+ * Called immediately after a component is mounted. Setting state here will trigger re-rendering.
431
+ * Perform various initialisation steps:
432
+ * 1. Set the value state of the component to the startValue prop (or to '0' if it is undefined)
433
+ * 2. Call the visible callback function using an anonymous function as argument. The anonymous function shall do the following:
434
+ * - Set the value state of the InvisibleNumberInput component to the startValue prop (or to '0' if it is undefined)
435
+ * - Return the value from calling the focus() method on the input field.
436
+ */
437
+ public componentDidMount(): void {
438
+ this.setState({
439
+ value: this.props.startValue ?? `0`,
440
+ });
441
+ this.props.visible((): void =&gt; {
442
+ this.setState({
443
+ value: this.props.startValue ?? `0`,
444
+ });
445
+ return this.textInput?.focus();
446
+ });
447
+ }
448
+ &nbsp;
449
+ /**
450
+ * Sanitise a user-entered value by removing invalid characters
451
+ *
452
+ * Steps:
453
+ * 1. Use regular expressions to make the following manipulations to the text argument in the defined order and save the result to a local string variable named replaced.
454
+ * - Replace any commas with periods
455
+ * - Remove any characters that comes after two groups of zero or more digits separated by a period.
456
+ * 2. Define a function named round that rounds a given string that contains a number to have the amount of decimals given by the decimalPlaces prop. Return the result as a string.
457
+ * 3. If the value of the replaced variable from step 1 is not a NaN (not a number) when converted to a Number type then use the round function defined in step 2 on replaced and return the result
458
+ * 4. (If the NaN-check from step 2 didn’t fail) return the string '0'.
459
+ &nbsp;
460
+ * @param text The string input to clean up
461
+ * @returns A string with the cleaned text.
462
+ */
463
+ public cleanInput = (text: string): string =&gt; {
464
+ const replaced = text.replace(/\,/g, `.`).replace(/(\d*\.\d*).*/, `$1`);
465
+ const round = (value: string): string =&gt; {
466
+ const temp = Number(value) * Math.pow(10, this.props.decimalPlaces);
467
+ const rounded = Math.round(temp) / Math.pow(10, this.props.decimalPlaces);
468
+ return rounded.toFixed(this.props.decimalPlaces);
469
+ };
470
+ if (!isNaN(Number(replaced))) {
471
+ return round(replaced);
472
+ }
473
+ return `0`;
474
+ };
475
+ &nbsp;
476
+ /**
477
+ * Handle what happens when the text in the input field is being changed.
478
+ * That includes cleaning the text a little and then saving the value and potentially calling a callback function.
479
+ *
480
+ * Steps:
481
+ * 1. If the cleanPartialInput prop is true, use the cleanInput() method to to clean the content of the text argument and save it to a variable named cleaned.
482
+ * Otherwise just replace any commas in the text argument with periods and save the result to the same variable.
483
+ * 2. Remove repeated periods from the text in the cleaned variable and save the the result in a new variable named replacedSeparator.
484
+ * 3. Set the value state of the component to replacedSeparator.
485
+ * 4. If the partialInput callback function prop is defined, call it with replacedSeparator as argument.
486
+ * @param text The updated text in the input field
487
+ */
488
+ public handleOnChangeText = (text: string): void =&gt; {
489
+ const cleaned = this.props.cleanPartialInput ? this.cleanInput(text) : text.replace(/\,/g, `.`);
490
+ let replacedSeparator = cleaned.replace(/\.+/g, `.`).replace(/(\d*\.\d*).*/, `$1`);
491
+ if (!this.props.negativeAllowed) {
492
+ replacedSeparator = replacedSeparator.replace(/[^0-9.]/g, ``);
493
+ }
494
+ this.setState({
495
+ value: `${replacedSeparator}`,
496
+ });
497
+ this.props.partialInput?.(`${replacedSeparator}`);
498
+ };
499
+ &nbsp;
500
+ /**
501
+ * Handle what should happen when the user finish editing the input field.
502
+ *
503
+ * Steps:
504
+ * 1. Use the cleanInput() method on the value state and store the result in a variable named cleaned.
505
+ * 2. If the onEnd prop is not null, then convert the value of cleaned to a number and use it as an argument to call the onEnd prop function.
506
+ */
507
+ public onEndEdit = (): void =&gt; {
508
+ const cleaned = this.cleanInput(this.state.value);
509
+ this.props.onEnd?.(Number(cleaned));
510
+ };
511
+ &nbsp;
512
+ /**
513
+ * @returns JSX element to display a TextInput field with the component’s value state as its value
514
+ * and the handleOnChangeText() and onEndEdit() methods as the textInput’s onChangeText and onEndEditing respectively.
515
+ */
516
+ public render(): JSX.Element {
517
+ const { testID } = this.props;
518
+ return (
519
+ &lt;TextInput
520
+ testID={testID}
521
+ accessibilityLabel="InvisibleNumberInput"
522
+ value={`${this.state.value}`}
523
+ ref={(textInput): void =&gt; {
524
+ if (textInput !== null) {
525
+ this.textInput = textInput;
526
+ }
527
+ }}
528
+ style={inputStyles.textInput}
529
+ keyboardType="numeric"
530
+ onChangeText={this.handleOnChangeText}
531
+ onEndEditing={this.onEndEdit}
532
+ maxLength={this.props.maxLength}
533
+ selectTextOnFocus
534
+ /&gt;
535
+ );
536
+ }
537
+ }
538
+ &nbsp;
539
+ const inputStyles = StyleSheet.create({
540
+ textInput: {
541
+ width: 0,
542
+ height: 0,
543
+ padding: 0.2,
544
+ },
545
+ });
546
+ &nbsp;</pre></td></tr></table></pre>
547
+
548
+ <div class='push'></div><!-- for sticky footer -->
549
+ </div><!-- /wrapper -->
550
+ <div class='footer quiet pad2 space-top1 center small'>
551
+ Code coverage generated by
552
+ <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
553
+ at Thu Sep 23 2021 09:47:17 GMT+0000 (Coordinated Universal Time)
554
+ </div>
555
+ </div>
556
+ <script src="../../prettify.js"></script>
557
+ <script>
558
+ window.onload = function () {
559
+ prettyPrint();
560
+ };
561
+ </script>
562
+ <script src="../../sorter.js"></script>
563
+ <script src="../../block-navigation.js"></script>
564
+ </body>
565
+ </html>
566
+