@gpa-gemstone/react-forms 1.1.83 → 1.1.84

package/lib/CheckBox.js

@@ -55,12 +55,11 @@ function CheckBox(props) {
                 props.Setter(record);
             }, value: props.Record[props.Field] ? 'on' : 'off', checked: props.Record[props.Field], disabled: props.Disabled == null ? false : props.Disabled }),
         showHelpIcon || showLabel ?
-            React.createElement("label", { className: 'form-check-label' },
-                showLabel ? label : '',
-                showHelpIcon ?
-                    React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 }))
-                    : null) : null,
+            React.createElement("label", { className: "form-check-label d-flex align-items-center" },
+                React.createElement("span", null, showLabel ? label : ''),
+                showHelpIcon && (React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
+                    React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))))
+            : null,
         showHelpIcon ?
             React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help)
             : null));

package/lib/DatePicker.js

@@ -216,10 +216,11 @@ function DateTimePicker(props) {
     }
     return (React.createElement("div", { className: "form-group", ref: divRef },
         showHelpIcon || showLabel ?
-            React.createElement("label", { className: 'd-flex align-items-center' },
-                showLabel ? label : '',
-                showHelpIcon ? React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
-                    React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 })) : null) : null,
+            React.createElement("label", { className: "d-flex align-items-center" },
+                React.createElement("span", null, showLabel ? label : ''),
+                showHelpIcon && (React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
+                    React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))))
+            : null,
         showHelpIcon ?
             React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help)
             : null,

package/lib/Input.js

@@ -104,12 +104,11 @@ function Input(props) {
     var label = props.Label === undefined ? props.Field : props.Label;
     return (React.createElement("div", { className: "form-group " + (props.Size === 'large' ? 'form-group-lg' : '') + (props.Size === 'small' ? 'form-group-sm' : ''), style: props.Style },
         showHelpIcon || showLabel ?
-            React.createElement("label", { className: 'd-flex align-items-center' },
-                showLabel ? label : '',
-                showHelpIcon ?
-                    React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 }))
-                    : null) : null,
+            React.createElement("label", { className: "d-flex align-items-center" },
+                React.createElement("span", null, showLabel ? label : ''),
+                showHelpIcon && (React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
+                    React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))))
+            : null,
         showHelpIcon ?
             React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help)
             : null,

package/lib/InputWithButton.js

@@ -94,10 +94,12 @@ function InputWithButton(props) {
     return (React.createElement("div", { className: "form-group " + (props.Size === 'large' ? 'form-group-lg' : '') + (props.Size === 'small' ? 'form-group-sm' : ''), style: props.InputStyle },
         showHelpIcon || showLabel ?
             React.createElement("label", { className: 'd-flex align-items-center' },
-                showLabel ? label : '',
+                React.createElement("span", null, showLabel ? label : ''),
                 showHelpIcon ?
-                    React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 })) : null) : null,
+                    React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
+                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))
+                    : null)
+            : null,
         showHelpIcon ?
             React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help)
             : null,

package/lib/MultiInput.js

@@ -50,7 +50,7 @@ var helper_functions_1 = require("@gpa-gemstone/helper-functions");
 //Only supporting string/number arrays for now
 function MultiInput(props) {
     var _a;
-    var guid = React.useRef((0, helper_functions_1.CreateGuid)());
+    var guid = React.useState((0, helper_functions_1.CreateGuid)())[0];
     var _b = React.useState(false), showHelp = _b[0], setShowHelp = _b[1];
     var fieldArray = props.Record[props.Field];
     if ((fieldArray === null || fieldArray === void 0 ? void 0 : fieldArray.constructor) !== Array) {
@@ -60,10 +60,11 @@ function MultiInput(props) {
     return (React.createElement(React.Fragment, null,
         fieldArray.length === 0 ?
             React.createElement(React.Fragment, null,
-                React.createElement("label", { className: 'd-flex align-items-center' }, (_a = props.Label) !== null && _a !== void 0 ? _a : props.Field,
+                React.createElement("label", { className: 'd-flex align-items-center' },
+                    React.createElement("span", null, (_a = props.Label) !== null && _a !== void 0 ? _a : props.Field),
                     props.Help != null ?
-                        React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid.current },
-                            React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 }))
+                        React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
+                            React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))
                         : null,
                     React.createElement("button", { className: 'btn', onClick: function () {
                             var _a;
@@ -72,7 +73,7 @@ function MultiInput(props) {
                         " ",
                         React.createElement(gpa_symbols_1.ReactIcons.CirclePlus, null),
                         " ")),
-                React.createElement(ToolTip_1.default, { Show: showHelp && props.Help != null, Target: guid.current, Class: "info", Position: "bottom" }, props.Help))
+                React.createElement(ToolTip_1.default, { Show: showHelp && props.Help != null, Target: guid, Class: "info", Position: "bottom" }, props.Help))
             : null,
         fieldArray.map(function (r, index) {
             var _a, _b;

package/lib/MutliCheckBoxSelect.js

@@ -96,11 +96,11 @@ var MultiSelect = function (props) {
     return (React.createElement("div", { className: "form-group" },
         showLabel || showHelpIcon ?
             React.createElement("label", { className: 'd-flex align-items-center' },
-                showLabel ?
-                    (props.Label === undefined ? 'Select' : props.Label) : '',
+                React.createElement("span", null, showLabel ?
+                    (props.Label === undefined ? 'Select' : props.Label) : ''),
                 showHelpIcon ?
-                    React.createElement("button", { className: 'btn btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": helperGuid },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 }))
+                    React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": helperGuid },
+                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))
                     : null) : null,
         showHelpIcon ?
             React.createElement(ToolTip_1.default, { Show: showHelp, Target: helperGuid, Class: "info", Position: "bottom" }, props.Help)

package/lib/RadioButtons.js

@@ -39,17 +39,19 @@ var helper_functions_1 = require("@gpa-gemstone/helper-functions");
 var ToolTip_1 = require("./ToolTip");
 var gpa_symbols_1 = require("@gpa-gemstone/gpa-symbols");
 function RadioButtons(props) {
-    var _a;
-    var guid = React.useRef((0, helper_functions_1.CreateGuid)());
-    var _b = React.useState(false), showHelp = _b[0], setShowHelp = _b[1];
+    var guid = React.useState((0, helper_functions_1.CreateGuid)())[0];
+    var _a = React.useState(false), showHelp = _a[0], setShowHelp = _a[1];
+    // Variables to control the rendering of label and help icon.
     var showHelpIcon = props.Help !== undefined;
+    var label = props.Label === undefined ? props.Field : props.Label;
     return (React.createElement("div", { className: "form-group" },
-        React.createElement("label", { className: "form-check-label w-100 d-flex align-items-center" }, (_a = props.Label) !== null && _a !== void 0 ? _a : props.Field,
+        React.createElement("label", { className: "form-check-label w-100 d-flex align-items-center" },
+            React.createElement("span", null, label),
             showHelpIcon ?
                 React.createElement(React.Fragment, null,
-                    React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid.current },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 })),
-                    React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid.current, Class: "info", Position: "bottom" }, props.Help))
+                    React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
+                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 })),
+                    React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help))
                 : null),
         props.Options.map(function (option, index) {
             var _a;

package/lib/Select.js

@@ -42,12 +42,8 @@ var helper_functions_1 = require("@gpa-gemstone/helper-functions");
 var gpa_symbols_1 = require("@gpa-gemstone/gpa-symbols");
 function Select(props) {
     var _a;
-    var _b = React.useState(""), guid = _b[0], setGuid = _b[1];
-    var _c = React.useState(false), showHelp = _c[0], setShowHelp = _c[1];
-    // Effect to generate a unique ID for the component.
-    React.useEffect(function () {
-        setGuid((0, helper_functions_1.CreateGuid)());
-    }, []);
+    var guid = React.useState((0, helper_functions_1.CreateGuid)())[0];
+    var _b = React.useState(false), showHelp = _b[0], setShowHelp = _b[1];
     // Effect to validate the current value against the available options.
     React.useEffect(function () {
         var _a;
@@ -81,12 +77,11 @@ function Select(props) {
     var label = props.Label === undefined ? props.Field : props.Label;
     return (React.createElement("div", { className: "form-group" },
         showHelpIcon || showLabel ?
-            React.createElement("label", { className: 'd-flex align-items-center' },
-                showLabel ? label : '',
-                showHelpIcon ?
-                    React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 }))
-                    : null) : null,
+            React.createElement("label", { className: "d-flex align-items-center" },
+                React.createElement("span", null, showLabel ? label : ''),
+                showHelpIcon && (React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
+                    React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))))
+            : null,
         showHelpIcon ?
             React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help)
             : null,

package/lib/StylableSelect.js

@@ -117,14 +117,17 @@ function StylableSelect(props) {
         SetRecord(option);
         setShow(false);
     };
+    // Variables to control the rendering of label and help icon.
+    var showLabel = props.Label !== "";
+    var showHelpIcon = props.Help !== undefined;
+    var label = props.Label === undefined ? props.Field : props.Label;
     return (React.createElement("div", { ref: stylableSelect, style: { position: 'relative', display: 'inline-block', width: 'inherit' } },
-        (props.Label !== "") ?
-            React.createElement("label", { className: 'd-flex align-items-center' },
-                props.Label === undefined ? props.Field : props.Label,
-                props.Help !== undefined ?
-                    React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 }))
-                    : null) : null,
+        showHelpIcon || showLabel ?
+            React.createElement("label", { className: "d-flex align-items-center" },
+                React.createElement("span", null, showLabel ? label : ''),
+                showHelpIcon && (React.createElement("span", { onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid, className: "ml-2 d-flex align-items-center" },
+                    React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))))
+            : null,
         props.Help !== undefined ?
             React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help)
             : null,

package/lib/TextArea.js

@@ -43,7 +43,7 @@ var gpa_symbols_1 = require("@gpa-gemstone/gpa-symbols");
 function TextArea(props) {
     // Internal ref and state hooks for managing the component state.
     var internal = React.useRef(false);
-    var guid = React.useRef((0, helper_functions_1.CreateGuid)());
+    var guid = React.useState((0, helper_functions_1.CreateGuid)())[0];
     var _a = React.useState(false), showHelp = _a[0], setShowHelp = _a[1];
     var _b = React.useState(''), heldVal = _b[0], setHeldVal = _b[1];
     // Effect to handle changes to the record's field value.
@@ -66,14 +66,13 @@ function TextArea(props) {
     var label = props.Label === undefined ? props.Field : props.Label;
     return (React.createElement("div", { className: "form-group" },
         showHelpIcon || showLabel ?
-            React.createElement("label", { className: 'd-flex align-items-center' },
-                showLabel ? label : '',
-                showHelpIcon ?
-                    React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid.current },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 }))
-                    : null) : null,
+            React.createElement("label", { className: "d-flex align-items-center" },
+                React.createElement("span", null, showLabel ? label : ''),
+                showHelpIcon && (React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
+                    React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))))
+            : null,
         showHelpIcon ?
-            React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid.current, Class: "info", Position: "bottom" }, props.Help)
+            React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help)
             : null,
         React.createElement("textarea", { rows: props.Rows, className: props.Valid(props.Field) ? 'form-control' : 'form-control is-invalid', onChange: function (evt) { return valueChange(evt.target.value); }, value: heldVal == null ? '' : heldVal, disabled: props.Disabled == null ? false : props.Disabled }),
         React.createElement("div", { className: "invalid-feedback" }, props.Feedback == null ? props.Field + ' is a required field.' : props.Feedback)));

package/lib/TimePicker.js

@@ -39,17 +39,20 @@ var ToolTip_1 = require("./ToolTip");
 var helper_functions_1 = require("@gpa-gemstone/helper-functions");
 var gpa_symbols_1 = require("@gpa-gemstone/gpa-symbols");
 function DatePicker(props) {
-    var _a;
-    var guid = React.useRef((0, helper_functions_1.CreateGuid)());
-    var _b = React.useState(false), showHelp = _b[0], setShowHelp = _b[1];
+    var guid = React.useState((0, helper_functions_1.CreateGuid)())[0];
+    var _a = React.useState(false), showHelp = _a[0], setShowHelp = _a[1];
+    // Variables to control the rendering of label and help icon.
+    var showLabel = props.Label !== "";
+    var showHelpIcon = props.Help !== undefined;
+    var label = props.Label === undefined ? props.Field : props.Label;
     return (React.createElement("div", { className: "form-group" },
-        (props.Help != null || props.Label !== "") ?
-            React.createElement("label", { className: 'd-flex align-items-center' }, (_a = props.Label) !== null && _a !== void 0 ? _a : props.Field,
-                props.Help != null ?
-                    React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid.current },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 })) : React.createElement(React.Fragment, null))
-            : React.createElement(React.Fragment, null),
-        React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid.current, Class: "info", Position: "bottom" }, props.Help),
+        showHelpIcon || showLabel ?
+            React.createElement("label", { className: "d-flex align-items-center" },
+                React.createElement("span", null, showLabel ? label : ''),
+                showHelpIcon && (React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid },
+                    React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 }))))
+            : null,
+        React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help),
         React.createElement("input", { className: 'form-control' + (props.Valid(props.Field) ? '' : ' is-invalid'), type: "time", step: props.Step === null ? 60 : props.Step, onChange: function (evt) {
                 var record = __assign({}, props.Record);
                 if (evt.target.value !== '')

package/lib/ToggleSwitch.js

@@ -39,22 +39,24 @@ var helper_functions_1 = require("@gpa-gemstone/helper-functions");
 var ToolTip_1 = require("./ToolTip");
 var gpa_symbols_1 = require("@gpa-gemstone/gpa-symbols");
 function ToggleSwitch(props) {
-    var helpID = React.useRef((0, helper_functions_1.CreateGuid)());
-    var switchID = React.useRef((0, helper_functions_1.CreateGuid)());
+    var helpID = React.useState((0, helper_functions_1.CreateGuid)())[0];
+    var switchID = React.useState((0, helper_functions_1.CreateGuid)())[0];
     var _a = React.useState(false), showHelp = _a[0], setShowHelp = _a[1];
+    // Variables to control the rendering of label and help icon.
     var showHelpIcon = props.Help !== undefined;
+    var label = props.Label === undefined ? props.Field : props.Label;
     return (React.createElement("div", { className: "custom-control custom-switch", style: props.Style },
         React.createElement("input", { type: "checkbox", className: "custom-control-input", onChange: function (evt) {
                 var record = __assign({}, props.Record);
                 record[props.Field] = evt.target.checked;
                 props.Setter(record);
-            }, value: props.Record[props.Field] ? 'on' : 'off', checked: props.Record[props.Field], disabled: props.Disabled == null ? false : props.Disabled, id: switchID.current }),
-        React.createElement("label", { className: "custom-control-label", htmlFor: switchID.current },
-            props.Label == null ? props.Field : props.Label,
+            }, value: props.Record[props.Field] ? 'on' : 'off', checked: props.Record[props.Field], disabled: props.Disabled == null ? false : props.Disabled, id: switchID }),
+        React.createElement("label", { className: "custom-control-label d-flex align-items-center", htmlFor: switchID },
+            React.createElement("span", null, label),
             showHelpIcon ?
                 React.createElement(React.Fragment, null,
-                    React.createElement("button", { className: 'btn mb-1 pt-0 pb-0', onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": helpID.current },
-                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: 'var(--info)', Size: 20 })),
-                    React.createElement(ToolTip_1.default, { Show: showHelp, Target: helpID.current, Zindex: 9999, Class: "info", Position: "bottom" }, props.Help))
+                    React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": helpID },
+                        React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 })),
+                    React.createElement(ToolTip_1.default, { Show: showHelp, Target: helpID, Zindex: 9999, Class: "info", Position: "bottom" }, props.Help))
                 : null)));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gpa-gemstone/react-forms",
-  "version": "1.1.83",
+  "version": "1.1.84",
   "description": "React Form modules for gpa webapps",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -45,9 +45,9 @@
     "typescript": "5.5.3"
   },
   "dependencies":   {
-    "@gpa-gemstone/application-typings": "0.0.82",
-    "@gpa-gemstone/gpa-symbols": "0.0.48",
-    "@gpa-gemstone/helper-functions": "0.0.37",
+    "@gpa-gemstone/application-typings": "0.0.83",
+    "@gpa-gemstone/gpa-symbols": "0.0.49",
+    "@gpa-gemstone/helper-functions": "0.0.38",
     "@types/react": "^17.0.14",
     "@types/styled-components": "^5.1.11",
     "lodash": "^4.17.21",