@hedia/recommendation-screen 2.1.15 → 2.1.16

package/coverage/lcov-report/src/__tests__/index.html

@@ -95,7 +95,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
-                at Fri Jul 09 2021 12:31:53 GMT+0000 (Coordinated Universal Time)
+                at Thu Jul 29 2021 07:55:43 GMT+0000 (Coordinated Universal Time)
             </div>
         </div>
         <script src="../../prettify.js"></script>

package/coverage/lcov-report/src/__tests__/utils.tsx.html

@@ -201,7 +201,21 @@
 <a name='L142'></a><a href='#L142'>142</a>
 <a name='L143'></a><a href='#L143'>143</a>
 <a name='L144'></a><a href='#L144'>144</a>
-<a name='L145'></a><a href='#L145'>145</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L145'></a><a href='#L145'>145</a>
+<a name='L146'></a><a href='#L146'>146</a>
+<a name='L147'></a><a href='#L147'>147</a>
+<a name='L148'></a><a href='#L148'>148</a>
+<a name='L149'></a><a href='#L149'>149</a>
+<a name='L150'></a><a href='#L150'>150</a>
+<a name='L151'></a><a href='#L151'>151</a>
+<a name='L152'></a><a href='#L152'>152</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -345,7 +359,15 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">69x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { Activity, BloodGlucoseUnit, BloodKetonesUnit, Languages, UserSettings } from "@hedia/types";
+<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import {
+	Activity,
+	BloodGlucoseUnit,
+	BloodKetonesUnit,
+	BolusCalculator,
+	Languages,
+	Logbook,
+	UserSettings,
+} from "@hedia/types";
 import { I18nProvider } from "@lingui/react";
 import React from "react";
 import { RenderAPI } from "react-native-testing-library";
@@ -353,7 +375,6 @@ import { ReactTestInstance } from "react-test-renderer";
 import { i18n } from "../locale/i18nUtils";
 import { IRecommendationProps } from "../RecommendationScreen";
 import { Testing } from "../types/enum";
-import { IActivityParams, IRecommendationParams, logbookEntry } from "../types/types";
 &nbsp;
 const ActivityEnum = Activity.Enums.ActivityEnum;
 const ActivityIntensity = Activity.Enums.ActivityIntensity;
@@ -388,7 +409,7 @@ export function getRecommendationProps(partials?: Partial&lt;IRecommendationProp
 	};
 }
 &nbsp;
-export function generateDefaultCalculatorParams(): IRecommendationParams {
+export function generateDefaultCalculatorParams(): BolusCalculator.Types.IRecommendationParams {
 	return {
 		carbohydrateRatio: 10,
 		carbohydrates: 4,
@@ -409,7 +430,7 @@ export function generateDefaultCalculatorParams(): IRecommendationParams {
 	};
 }
 &nbsp;
-export function generateActivityProps(): IActivityParams {
+export function generateActivityProps(): BolusCalculator.Types.IActivityParams {
 	return {
 		activityDate: new Date(),
 		activityDuration: 30,
@@ -418,7 +439,7 @@ export function generateActivityProps(): IActivityParams {
 	};
 }
 &nbsp;
-export function generateDefaultActivitySettings(): IActivityParams["activitySettings"] {
+export function generateDefaultActivitySettings(): BolusCalculator.Types.IActivityParams["activitySettings"] {
 	return {
 		hard: { fromFortysix: null, fromThirty: 0.25, fromZero: 1 },
 		light: { fromFortysix: 0.5, fromThirty: 0.75, fromZero: 1 },
@@ -427,7 +448,7 @@ export function generateDefaultActivitySettings(): IActivityParams["activitySett
 		target: 9,
 	};
 }
-export function generateDefaultLogbook(): logbookEntry {
+export function generateDefaultLogbook(): Logbook.Types.ILogbookEntry {
 	return {
 		blood_glucose_millimolar: 6,
 		carbohydrates_entered_grams: 25,
@@ -496,7 +517,7 @@ export function getIcon(wrapper: RenderAPI, name: string, active: boolean): Reac
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
-                at Fri Jul 09 2021 12:31:53 GMT+0000 (Coordinated Universal Time)
+                at Thu Jul 29 2021 07:55:43 GMT+0000 (Coordinated Universal Time)
             </div>
         </div>
         <script src="../../prettify.js"></script>

package/coverage/lcov-report/src/components/Header.tsx.html

@@ -146,7 +146,13 @@
 <a name='L87'></a><a href='#L87'>87</a>
 <a name='L88'></a><a href='#L88'>88</a>
 <a name='L89'></a><a href='#L89'>89</a>
-<a name='L90'></a><a href='#L90'>90</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L90'></a><a href='#L90'>90</a>
+<a name='L91'></a><a href='#L91'>91</a>
+<a name='L92'></a><a href='#L92'>92</a>
+<a name='L93'></a><a href='#L93'>93</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -243,11 +249,14 @@ import { Testing } from "../types/enum";
 import { BACKGROUND_COLOUR_PURPLE, BORDER_COLOUR_GREY } from "../utils/Constants";
 import Icon from "./Icon";
 &nbsp;
-interface IProps {
+export interface IProps {
+	/** A callback that doesn’t take any arguments and doesn’t return a value to be called when the cancel-button is pressed. */
 	exitCallback(): void;
 }
 &nbsp;
+/** Component to display a header text along with a cancel-button that triggers a callback function. */
 export default class Header extends React.Component&lt;IProps&gt; {
+	/** JSX element to display the cancel button and header. When the cancel button in the header is tabbed, the exitCallback prop callback function should be called. */
 	public render(): JSX.Element {
 		return (
 			&lt;React.Fragment&gt;
@@ -283,7 +292,7 @@ export default class Header extends React.Component&lt;IProps&gt; {
 	}
 }
 &nbsp;
-export const headerStyles = StyleSheet.create({
+const headerStyles = StyleSheet.create({
 	backgroundColour: {
 		backgroundColor: BACKGROUND_COLOUR_PURPLE,
 	},
@@ -331,7 +340,7 @@ export const headerStyles = StyleSheet.create({
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
-                at Fri Jul 09 2021 12:31:53 GMT+0000 (Coordinated Universal Time)
+                at Thu Jul 29 2021 07:55:43 GMT+0000 (Coordinated Universal Time)
             </div>
         </div>
         <script src="../../prettify.js"></script>

package/coverage/lcov-report/src/components/InfoBars.tsx.html

@@ -175,7 +175,51 @@
 <a name='L116'></a><a href='#L116'>116</a>
 <a name='L117'></a><a href='#L117'>117</a>
 <a name='L118'></a><a href='#L118'>118</a>
-<a name='L119'></a><a href='#L119'>119</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L119'></a><a href='#L119'>119</a>
+<a name='L120'></a><a href='#L120'>120</a>
+<a name='L121'></a><a href='#L121'>121</a>
+<a name='L122'></a><a href='#L122'>122</a>
+<a name='L123'></a><a href='#L123'>123</a>
+<a name='L124'></a><a href='#L124'>124</a>
+<a name='L125'></a><a href='#L125'>125</a>
+<a name='L126'></a><a href='#L126'>126</a>
+<a name='L127'></a><a href='#L127'>127</a>
+<a name='L128'></a><a href='#L128'>128</a>
+<a name='L129'></a><a href='#L129'>129</a>
+<a name='L130'></a><a href='#L130'>130</a>
+<a name='L131'></a><a href='#L131'>131</a>
+<a name='L132'></a><a href='#L132'>132</a>
+<a name='L133'></a><a href='#L133'>133</a>
+<a name='L134'></a><a href='#L134'>134</a>
+<a name='L135'></a><a href='#L135'>135</a>
+<a name='L136'></a><a href='#L136'>136</a>
+<a name='L137'></a><a href='#L137'>137</a>
+<a name='L138'></a><a href='#L138'>138</a>
+<a name='L139'></a><a href='#L139'>139</a>
+<a name='L140'></a><a href='#L140'>140</a>
+<a name='L141'></a><a href='#L141'>141</a>
+<a name='L142'></a><a href='#L142'>142</a>
+<a name='L143'></a><a href='#L143'>143</a>
+<a name='L144'></a><a href='#L144'>144</a>
+<a name='L145'></a><a href='#L145'>145</a>
+<a name='L146'></a><a href='#L146'>146</a>
+<a name='L147'></a><a href='#L147'>147</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -200,6 +244,14 @@
 <span class="cline-any cline-yes">410x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">203x</span>
 <span class="cline-any cline-yes">410x</span>
 <span class="cline-any cline-yes">410x</span>
@@ -209,6 +261,9 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">410x</span>
 <span class="cline-any cline-yes">410x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -238,6 +293,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">6x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -303,14 +359,30 @@ import { BORDER_COLOUR_GREY } from "../utils/Constants";
 import { Utils } from "../utils/Utils";
 &nbsp;
 export interface IProps {
+	/** The display label that describes the value to the user. */
 	label: string;
+	/** The value to display. */
 	value: string | null;
+	/** Unit label to print after the value. */
 	unit: string | BloodGlucoseUnit | BloodKetonesUnit | null;
+	/** If true then a dash character (“-”) will be printed in place of the value if the value is null. */
 	showNullAsDash: boolean;
+	/**  optional object that contains as properties a valueID and a unitID */
 	testID?: { valueID: Testing.Id.InfoBarTestIds.Value; unitID: Testing.Id.InfoBarTestIds.Unit };
 }
 &nbsp;
+/** A standard panel to display some data that the user entered. */
 export default class InfoBars extends React.Component&lt;IProps&gt; {
+	/**
+	 * Determine the value to be displayed in the infobar.
+	 *
+	 * Steps:
+	 * 1. Unpack showNullAsDash, unit, and value from props.
+	 * 2. Set noDecimal to be true if unit is BloodGlucoseUnit.MG_DL or if unit is BloodKetonesUnit.MG_DL.
+	 * 3. Set nullPlaceholder to be ‘-' if noDecimal is true and to '-.-’ otherwise.
+	 * 4. Return value if it is not null or undefined. Otherwise, if showNullAsDash is true then return nullPlaceholder, otherwise return the string '0'.
+	 * @returns The string to display as the value in the infobar.
+	 */
 	public displayValue = (): string =&gt; {
 		const { showNullAsDash, unit, value } = this.props;
 		const noDecimal = unit === BloodGlucoseUnit.MG_DL || unit === BloodKetonesUnit.MG_DL;
@@ -318,6 +390,14 @@ export default class InfoBars extends React.Component&lt;IProps&gt; {
 		return value ?? (showNullAsDash ? nullPlaceholder : `0`);
 	};
 &nbsp;
+	/**
+	 * Determine the unit string to be displayed in the infobar.
+	 *
+	 * Steps:
+	 * 1. Unpack unit from props.
+	 * 2. Return unit if unit is “units” or the result of calling formatUnit() with unit as argument otherwise.
+	 * @returns The string to display as the unit in the infobar
+	 */
 	public displayUnit = (): string | null =&gt; {
 		const { unit } = this.props;
 		if (!unit) {
@@ -326,6 +406,9 @@ export default class InfoBars extends React.Component&lt;IProps&gt; {
 		return unit === i18n._(t`units`) ? unit : Utils.formatUnit(unit as BloodGlucoseUnit | BloodKetonesUnit);
 	};
 &nbsp;
+	/**
+	 * @returns JSX element to display a card with the entered value.
+	 */
 	public render(): JSX.Element {
 		const { testID } = this.props;
 		return (
@@ -356,6 +439,7 @@ export default class InfoBars extends React.Component&lt;IProps&gt; {
 	}
 }
 &nbsp;
+/** @internal */
 export const infoStyles = StyleSheet.create({
 	container: { flex: 1 },
 	margin: {
@@ -418,7 +502,7 @@ export const infoStyles = StyleSheet.create({
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
-                at Fri Jul 09 2021 12:31:53 GMT+0000 (Coordinated Universal Time)
+                at Thu Jul 29 2021 07:55:43 GMT+0000 (Coordinated Universal Time)
             </div>
         </div>
         <script src="../../prettify.js"></script>

package/coverage/lcov-report/src/components/InvisibleNumberInput.tsx.html

@@ -155,7 +155,90 @@
 <a name='L96'></a><a href='#L96'>96</a>
 <a name='L97'></a><a href='#L97'>97</a>
 <a name='L98'></a><a href='#L98'>98</a>
-<a name='L99'></a><a href='#L99'>99</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L99'></a><a href='#L99'>99</a>
+<a name='L100'></a><a href='#L100'>100</a>
+<a name='L101'></a><a href='#L101'>101</a>
+<a name='L102'></a><a href='#L102'>102</a>
+<a name='L103'></a><a href='#L103'>103</a>
+<a name='L104'></a><a href='#L104'>104</a>
+<a name='L105'></a><a href='#L105'>105</a>
+<a name='L106'></a><a href='#L106'>106</a>
+<a name='L107'></a><a href='#L107'>107</a>
+<a name='L108'></a><a href='#L108'>108</a>
+<a name='L109'></a><a href='#L109'>109</a>
+<a name='L110'></a><a href='#L110'>110</a>
+<a name='L111'></a><a href='#L111'>111</a>
+<a name='L112'></a><a href='#L112'>112</a>
+<a name='L113'></a><a href='#L113'>113</a>
+<a name='L114'></a><a href='#L114'>114</a>
+<a name='L115'></a><a href='#L115'>115</a>
+<a name='L116'></a><a href='#L116'>116</a>
+<a name='L117'></a><a href='#L117'>117</a>
+<a name='L118'></a><a href='#L118'>118</a>
+<a name='L119'></a><a href='#L119'>119</a>
+<a name='L120'></a><a href='#L120'>120</a>
+<a name='L121'></a><a href='#L121'>121</a>
+<a name='L122'></a><a href='#L122'>122</a>
+<a name='L123'></a><a href='#L123'>123</a>
+<a name='L124'></a><a href='#L124'>124</a>
+<a name='L125'></a><a href='#L125'>125</a>
+<a name='L126'></a><a href='#L126'>126</a>
+<a name='L127'></a><a href='#L127'>127</a>
+<a name='L128'></a><a href='#L128'>128</a>
+<a name='L129'></a><a href='#L129'>129</a>
+<a name='L130'></a><a href='#L130'>130</a>
+<a name='L131'></a><a href='#L131'>131</a>
+<a name='L132'></a><a href='#L132'>132</a>
+<a name='L133'></a><a href='#L133'>133</a>
+<a name='L134'></a><a href='#L134'>134</a>
+<a name='L135'></a><a href='#L135'>135</a>
+<a name='L136'></a><a href='#L136'>136</a>
+<a name='L137'></a><a href='#L137'>137</a>
+<a name='L138'></a><a href='#L138'>138</a>
+<a name='L139'></a><a href='#L139'>139</a>
+<a name='L140'></a><a href='#L140'>140</a>
+<a name='L141'></a><a href='#L141'>141</a>
+<a name='L142'></a><a href='#L142'>142</a>
+<a name='L143'></a><a href='#L143'>143</a>
+<a name='L144'></a><a href='#L144'>144</a>
+<a name='L145'></a><a href='#L145'>145</a>
+<a name='L146'></a><a href='#L146'>146</a>
+<a name='L147'></a><a href='#L147'>147</a>
+<a name='L148'></a><a href='#L148'>148</a>
+<a name='L149'></a><a href='#L149'>149</a>
+<a name='L150'></a><a href='#L150'>150</a>
+<a name='L151'></a><a href='#L151'>151</a>
+<a name='L152'></a><a href='#L152'>152</a>
+<a name='L153'></a><a href='#L153'>153</a>
+<a name='L154'></a><a href='#L154'>154</a>
+<a name='L155'></a><a href='#L155'>155</a>
+<a name='L156'></a><a href='#L156'>156</a>
+<a name='L157'></a><a href='#L157'>157</a>
+<a name='L158'></a><a href='#L158'>158</a>
+<a name='L159'></a><a href='#L159'>159</a>
+<a name='L160'></a><a href='#L160'>160</a>
+<a name='L161'></a><a href='#L161'>161</a>
+<a name='L162'></a><a href='#L162'>162</a>
+<a name='L163'></a><a href='#L163'>163</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -182,6 +265,14 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">143x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -193,6 +284,20 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">143x</span>
 <span class="cline-any cline-yes">45x</span>
 <span class="cline-any cline-yes">45x</span>
@@ -206,6 +311,18 @@
 <span class="cline-any cline-yes">5x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">143x</span>
 <span class="cline-any cline-yes">41x</span>
 <span class="cline-any cline-yes">41x</span>
@@ -218,12 +335,23 @@
 <span class="cline-any cline-yes">41x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">143x</span>
 <span class="cline-any cline-yes">14x</span>
 <span class="cline-any cline-yes">14x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">459x</span>
 <span class="cline-any cline-yes">459x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -256,29 +384,56 @@
 <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React from "react";
 import { StyleSheet, TextInput } from "react-native";
 &nbsp;
-interface IProps {
+export interface IProps {
+	/** The initial value to put in the input field. */
 	startValue?: string;
+	/** The precision with which the content of the input field may be displayed */
 	decimalPlaces: number;
+	/** Whether or not the clean method should be used on the content every time it is changed */
 	cleanPartialInput: boolean;
+	/** Whether or not negative values can be entered. */
 	negativeAllowed: boolean;
+	/** Max length of the content in the input field. */
 	maxLength?: number;
+	/** Test id used for component testing */
 	testID: string;
+	/** Callback function taking a function as argument - For passing a reference for the input field’s to the parent component. */
 	visible(toggle: () =&gt; void): void;
+	/** 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. */
 	onEnd?(value: number): void;
+	/** Callback function taking a string as input and not returning anything - To be called every time the content in the input field changes. */
 	partialInput?(value: string): void;
 }
 &nbsp;
-interface IState {
+export interface IState {
+	/** For storing the value of the text input so it is available for handling in onEndEdit() when editing the text input ends. */
 	value: string;
 }
 &nbsp;
+/**
+ * InvisibleNumberInput is used to enable numerical input by the user without displaying a traditional input field on the screen.
+ * Since the input field is made invisible and thus can’t be tapped directly by the user we need to be able to call
+ * its focus() method from the parent component in order to activate the input field and show the keyboard.
+ * We do this by defining a function that calls the input field’s focus() method inside the InvisibleNumberInput component when it has been mounted.
+ * This function is then passed to the parent by giving it as the argument for a callback function named visible.
+ */
 export default class InvisibleNumberInput extends React.Component&lt;IProps, IState&gt; {
+	/** For holding a reference to the TextInput component so it can be focused when the InvisibleNumberInput component has been mounted. */
 	public textInput?: TextInput;
 &nbsp;
+	/** Initialise the state value variable with `0` */
 	public state: IState = {
 		value: `0`,
 	};
 &nbsp;
+	/**
+	 * Called immediately after a component is mounted. Setting state here will trigger re-rendering.
+	 * Perform various initialisation steps:
+	 * 1. Set the value state of the component to the startValue prop (or to '0' if it is undefined)
+	 * 2. Call the visible callback function using an anonymous function as argument. The anonymous function shall do the following:
+	 * 	- Set the value state of the InvisibleNumberInput component to the startValue prop (or to '0' if it is undefined)
+	 * 	- Return the value from calling the focus() method on the input field.
+	 */
 	public componentDidMount(): void {
 		this.setState({
 			value: this.props.startValue ?? `0`,
@@ -291,6 +446,20 @@ export default class InvisibleNumberInput extends React.Component&lt;IProps, ISt
 		});
 	}
 &nbsp;
+	/**
+	 * Sanitise a user-entered value by removing invalid characters
+	 *
+	 * Steps:
+	 * 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.
+	 * 	- Replace any commas with periods
+	 * 	- Remove any characters that comes after two groups of zero or more digits separated by a period.
+	 * 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.
+	 * 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
+	 * 4. (If the NaN-check from step 2 didn’t fail) return the string '0'.
+&nbsp;
+	 * @param text The string input to clean up
+	 * @returns A string with the cleaned text.
+	 */
 	public cleanInput = (text: string): string =&gt; {
 		const replaced = text.replace(/\,/g, `.`).replace(/(\d*\.\d*).*/, `$1`);
 		const round = (value: string): string =&gt; {
@@ -304,6 +473,18 @@ export default class InvisibleNumberInput extends React.Component&lt;IProps, ISt
 		return `0`;
 	};
 &nbsp;
+	/**
+	 * Handle what happens when the text in the input field is being changed.
+	 * That includes cleaning the text a little and then saving the value and potentially calling a callback function.
+	 *
+	 * Steps:
+	 * 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.
+	 *    Otherwise just replace any commas in the text argument with periods and save the result to the same variable.
+	 * 2. Remove repeated periods from the text in the cleaned variable and save the the result in a new variable named replacedSeparator.
+	 * 3. Set the value state of the component to replacedSeparator.
+	 * 4. If the partialInput callback function prop is defined, call it with replacedSeparator as argument.
+	 * @param text The updated text in the input field
+	 */
 	public handleOnChangeText = (text: string): void =&gt; {
 		const cleaned = this.props.cleanPartialInput ? this.cleanInput(text) : text.replace(/\,/g, `.`);
 		let replacedSeparator = cleaned.replace(/\.+/g, `.`).replace(/(\d*\.\d*).*/, `$1`);
@@ -316,11 +497,22 @@ export default class InvisibleNumberInput extends React.Component&lt;IProps, ISt
 		this.props.partialInput?.(`${replacedSeparator}`);
 	};
 &nbsp;
+	/**
+	 * Handle what should happen when the user finish editing the input field.
+	 *
+	 * Steps:
+	 * 1. Use the cleanInput() method on the value state and store the result in a variable named cleaned.
+	 * 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.
+	 */
 	public onEndEdit = (): void =&gt; {
 		const cleaned = this.cleanInput(this.state.value);
 		this.props.onEnd?.(Number(cleaned));
 	};
 &nbsp;
+	/**
+	 * @returns JSX element to display a TextInput field with the component’s value state as its value
+	 * and the handleOnChangeText() and onEndEdit() methods as the textInput’s onChangeText and onEndEditing respectively.
+	 */
 	public render(): JSX.Element {
 		const { testID } = this.props;
 		return (
@@ -358,7 +550,7 @@ const inputStyles = StyleSheet.create({
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
-                at Fri Jul 09 2021 12:31:53 GMT+0000 (Coordinated Universal Time)
+                at Thu Jul 29 2021 07:55:43 GMT+0000 (Coordinated Universal Time)
             </div>
         </div>
         <script src="../../prettify.js"></script>