@gpa-gemstone/react-forms 1.1.32 → 1.1.34

package/lib/Input.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import * as React from 'react';
 interface IProps<T> {
     Record: T;
     Field: keyof T;
@@ -7,8 +7,9 @@ interface IProps<T> {
     Label?: string;
     Feedback?: string;
     Disabled?: boolean;
-    Type?: 'number' | 'text' | 'password' | 'email' | 'color';
+    Type?: 'number' | 'text' | 'password' | 'email' | 'color' | 'integer';
     Help?: string | JSX.Element;
+    Style?: React.CSSProperties;
 }
 export default function Input<T>(props: IProps<T>): JSX.Element;
 export {};

package/lib/Input.js

@@ -53,7 +53,7 @@ function Input(props) {
         setInternal(false);
     }, [props.Record[props.Field]]);
     function valueChange(value) {
-        var _a, _b;
+        var _a, _b, _c;
         setInternal(true);
         if (props.Type === 'number') {
             if ((0, helper_functions_1.IsNumber)(value)) {
@@ -61,12 +61,18 @@ function Input(props) {
                 setHeldVal(value);
             }
         }
+        else if (props.Type === 'integer') {
+            if ((0, helper_functions_1.IsInteger)(value)) {
+                props.Setter(__assign(__assign({}, props.Record), (_b = {}, _b[props.Field] = value !== '' ? parseFloat(value) : null, _b)));
+                setHeldVal(value);
+            }
+        }
         else {
-            props.Setter(__assign(__assign({}, props.Record), (_b = {}, _b[props.Field] = value !== '' ? value : null, _b)));
+            props.Setter(__assign(__assign({}, props.Record), (_c = {}, _c[props.Field] = value !== '' ? value : null, _c)));
             setHeldVal(value);
         }
     }
-    return (React.createElement("div", { className: "form-group" },
+    return (React.createElement("div", { className: "form-group", style: props.Style },
         (props.Label !== "") ?
             React.createElement("label", null,
                 props.Label === undefined ? props.Field : props.Label,

package/lib/Select.js

@@ -44,6 +44,28 @@ function Select(props) {
     React.useEffect(function () {
         setGuid((0, helper_functions_1.CreateGuid)());
     }, []);
+    React.useEffect(function () {
+        var _a;
+        var currentValue = GetRecordValue();
+        if (!((_a = props.EmptyOption) !== null && _a !== void 0 ? _a : false) && props.Options.length > 0 && props.Options.findIndex(function (option) { return option.Value === currentValue; }) === -1) {
+            SetRecord(props.Options[0].Value);
+            // tslint:disable-next-line
+            console.warn("The current value is not available as an option. Specify EmptyOption=true if the value should be allowed.");
+        }
+    }, [props.Options]);
+    function SetRecord(value) {
+        var record = __assign({}, props.Record);
+        if (value !== '')
+            record[props.Field] = value;
+        else
+            record[props.Field] = null;
+        props.Setter(record);
+    }
+    ;
+    function GetRecordValue() {
+        return props.Record[props.Field] == null ? '' : props.Record[props.Field].toString();
+    }
+    ;
     return (React.createElement("div", { className: "form-group" },
         (props.Label !== "") ?
             React.createElement("label", null,
@@ -52,14 +74,7 @@ function Select(props) {
         props.Help !== undefined ?
             React.createElement(HelperMessage_1.default, { Show: showHelp, Target: guid }, props.Help)
             : null,
-        React.createElement("select", { "data-help": guid, className: "form-control", onChange: function (evt) {
-                var record = __assign({}, props.Record);
-                if (evt.target.value !== '')
-                    record[props.Field] = evt.target.value;
-                else
-                    record[props.Field] = null;
-                props.Setter(record);
-            }, value: props.Record[props.Field] == null ? '' : props.Record[props.Field].toString(), disabled: props.Disabled == null ? false : props.Disabled },
+        React.createElement("select", { "data-help": guid, className: "form-control", onChange: function (evt) { return SetRecord(evt.target.value); }, value: GetRecordValue(), disabled: props.Disabled == null ? false : props.Disabled },
             props.EmptyOption ? React.createElement("option", { value: "" }, props.EmptyLabel !== undefined ? props.EmptyLabel : '') : null,
             props.Options.map(function (a, i) { return (React.createElement("option", { key: i, value: a.Value }, a.Label)); }))));
 }

package/lib/TextArea.js

@@ -36,7 +36,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var React = require("react");
 function TextArea(props) {
     return (React.createElement("div", { className: "form-group" },
-        React.createElement("label", null, props.Label == null ? props.Field : props.Label),
+        (props.Label !== "") ? React.createElement("label", null,
+            props.Label === undefined ? props.Field : props.Label,
+            " ") : null,
         React.createElement("textarea", { rows: props.Rows, className: props.Valid(props.Field) ? 'form-control' : 'form-control is-invalid', onChange: function (evt) {
                 var record = __assign({}, props.Record);
                 if (evt.target.value !== '')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gpa-gemstone/react-forms",
-  "version": "1.1.32",
+  "version": "1.1.34",
   "description": "React Form modules for gpa webapps",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",