authscape 1.0.149 → 1.0.150

package/index.js

@@ -729,6 +729,7 @@ var _ListItemIcon = _interopRequireDefault(require("@mui/material/ListItemIcon")
 var _LocationOnRounded = _interopRequireDefault(require("@mui/icons-material/LocationOnRounded"));
 var _ListItemText = _interopRequireDefault(require("@mui/material/ListItemText"));
 var _reactCoolOnclickoutside = _interopRequireDefault(require("react-cool-onclickoutside"));
+var _reactHookForm = require("react-hook-form");
 var _Stack = _interopRequireDefault(require("@mui/material/Stack"));
 var _usePlacesAutocomplete = _interopRequireWildcard(require("use-places-autocomplete"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -746,6 +747,7 @@ var AutoCompleteDialog = function AutoCompleteDialog(_ref) {
     onSelected = _ref.onSelected,
     defaultValue = _ref.defaultValue,
     react_hook_form_Control = _ref.react_hook_form_Control,
+    react_hook_form_errors = _ref.react_hook_form_errors,
     onChange = _ref.onChange;
   var txtAddressField = (0, _react.useRef)(null);
   var dismissSuggestions = function dismissSuggestions() {
@@ -990,7 +992,7 @@ var AutoCompleteDialog = function AutoCompleteDialog(_ref) {
     sx: {
       color: "red"
     }
-  }, "Address is required.")), react_hook_form_Control != null && /*#__PURE__*/_react["default"].createElement(Controller, {
+  }, "Address is required.")), react_hook_form_Control != null && /*#__PURE__*/_react["default"].createElement(_reactHookForm.Controller, {
     control: react_hook_form_Control,
     rules: {
       required: true
@@ -1033,7 +1035,11 @@ var GooglePlacesModal = function GooglePlacesModal(_ref4) {
     _ref4$_state = _ref4._state,
     _state = _ref4$_state === void 0 ? "" : _ref4$_state,
     _ref4$_postalCode = _ref4._postalCode,
-    _postalCode = _ref4$_postalCode === void 0 ? "" : _ref4$_postalCode;
+    _postalCode = _ref4$_postalCode === void 0 ? "" : _ref4$_postalCode,
+    _ref4$react_hook_form = _ref4.react_hook_form_Control,
+    react_hook_form_Control = _ref4$react_hook_form === void 0 ? null : _ref4$react_hook_form,
+    _ref4$react_hook_form2 = _ref4.react_hook_form_errors,
+    react_hook_form_errors = _ref4$react_hook_form2 === void 0 ? null : _ref4$react_hook_form2;
   var _useState = (0, _react.useState)(_address),
     _useState2 = _slicedToArray(_useState, 2),
     address = _useState2[0],
@@ -1060,6 +1066,8 @@ var GooglePlacesModal = function GooglePlacesModal(_ref4) {
     setLng = _useState12[1];
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_system.Box, null, /*#__PURE__*/_react["default"].createElement(AutoCompleteDialog, {
     placeholder: "Address",
+    react_hook_form_Control: react_hook_form_Control,
+    react_hook_form_errors: react_hook_form_errors,
     defaultValue: address,
     onSelected: function onSelected(data) {
       setAddress(data.address);
@@ -1082,35 +1090,79 @@ var GooglePlacesModal = function GooglePlacesModal(_ref4) {
   }, /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
     item: true,
     xs: 6
-  }, /*#__PURE__*/_react["default"].createElement(_system.Box, null, /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_system.Box, null, react_hook_form_Control == null && /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
     id: "outlined-basic",
     label: "City",
     name: "city",
     variant: "outlined",
     fullWidth: true,
     value: city,
-    InputProps: {
-      readOnly: true
-    },
     onChange: function onChange(val) {
       setCity(val.currentTarget.value);
     }
+  }), react_hook_form_Control != null && /*#__PURE__*/_react["default"].createElement(_reactHookForm.Controller, {
+    control: react_hook_form_Control,
+    rules: {
+      required: true
+    },
+    name: "city",
+    render: function render(_ref5) {
+      var field = _ref5.field;
+      return /*#__PURE__*/_react["default"].createElement(_Stack["default"], null, /*#__PURE__*/_react["default"].createElement(_TextField["default"], _extends({
+        id: "outlined-basic",
+        label: "City",
+        name: "city",
+        variant: "outlined"
+      }, field, {
+        fullWidth: true,
+        value: city,
+        onChange: function onChange(val) {
+          setCity(val.currentTarget.value);
+        }
+      })), react_hook_form_errors != null && react_hook_form_errors.city && react_hook_form_errors.city.type === 'required' && /*#__PURE__*/_react["default"].createElement(Typography, {
+        sx: {
+          color: "red"
+        }
+      }, "City is required."));
+    }
   }))), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
     item: true,
     xs: 6
-  }, /*#__PURE__*/_react["default"].createElement(_system.Box, null, /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_system.Box, null, react_hook_form_Control == null && /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
     id: "outlined-basic",
     label: "State",
     name: "state",
     variant: "outlined",
     fullWidth: true,
-    InputProps: {
-      readOnly: true
-    },
     value: state,
     onChange: function onChange(val) {
       setState(val.currentTarget.value);
     }
+  }), react_hook_form_Control != null && /*#__PURE__*/_react["default"].createElement(_reactHookForm.Controller, {
+    control: react_hook_form_Control,
+    rules: {
+      required: true
+    },
+    name: "state",
+    render: function render(_ref6) {
+      var field = _ref6.field;
+      return /*#__PURE__*/_react["default"].createElement(_Stack["default"], null, /*#__PURE__*/_react["default"].createElement(_TextField["default"], _extends({
+        id: "outlined-basic",
+        label: "State"
+      }, field, {
+        name: "state",
+        variant: "outlined",
+        fullWidth: true,
+        value: state,
+        onChange: function onChange(val) {
+          setState(val.currentTarget.value);
+        }
+      })), react_hook_form_errors != null && react_hook_form_errors.state && react_hook_form_errors.state.type === 'required' && /*#__PURE__*/_react["default"].createElement(Typography, {
+        sx: {
+          color: "red"
+        }
+      }, "State is required."));
+    }
   })))), /*#__PURE__*/_react["default"].createElement(_system.Box, {
     sx: {
       marginTop: 2
@@ -1122,20 +1174,17 @@ var GooglePlacesModal = function GooglePlacesModal(_ref4) {
     variant: "outlined",
     fullWidth: true,
     value: zip,
-    InputProps: {
-      readOnly: true
-    },
     onChange: function onChange(val) {
       setPostalcode(val.currentTarget.value);
     }
-  }), react_hook_form_Control != null && /*#__PURE__*/_react["default"].createElement(Controller, {
+  }), react_hook_form_Control != null && /*#__PURE__*/_react["default"].createElement(_reactHookForm.Controller, {
     control: react_hook_form_Control,
     rules: {
       required: true
     },
     name: "postalCode",
-    render: function render(_ref5) {
-      var field = _ref5.field;
+    render: function render(_ref7) {
+      var field = _ref7.field;
       return /*#__PURE__*/_react["default"].createElement(_Stack["default"], null, /*#__PURE__*/_react["default"].createElement(_TextField["default"], _extends({
         id: "outlined-basic",
         label: "Postal code"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "authscape",
-  "version": "1.0.149",
+  "version": "1.0.150",
   "description": "",
   "main": "index.js",
   "scripts": {

package/src/components/GoogleMapsAutoComplete.js

@@ -9,6 +9,7 @@ import ListItemIcon from '@mui/material/ListItemIcon';
 import LocationOnRoundedIcon from '@mui/icons-material/LocationOnRounded';
 import ListItemText from '@mui/material/ListItemText';
 import useOnclickOutside from "react-cool-onclickoutside";
+import { useForm, Controller, useFieldArray } from "react-hook-form";
 import Stack from "@mui/material/Stack";
 
 import usePlacesAutocomplete, {
@@ -18,7 +19,7 @@ import usePlacesAutocomplete, {
   getLatLng,
 } from "use-places-autocomplete";
 
-const AutoCompleteDialog = ({placeholder, onSelected, defaultValue, react_hook_form_Control, onChange}) => {
+const AutoCompleteDialog = ({placeholder, onSelected, defaultValue, react_hook_form_Control, react_hook_form_errors, onChange}) => {
 
     const txtAddressField = useRef(null);
   
@@ -369,7 +370,9 @@ export const GooglePlacesModal = ({
   _address = "",
   _city = "",
   _state = "",
-  _postalCode = ""
+  _postalCode = "",
+  react_hook_form_Control = null,
+  react_hook_form_errors = null
 }) => {
   const [address, setAddress] = useState(_address);
   const [city, setCity] = useState(_city);
@@ -384,6 +387,8 @@ export const GooglePlacesModal = ({
     <Box>
         <AutoCompleteDialog
         placeholder={"Address"}
+        react_hook_form_Control={react_hook_form_Control}
+        react_hook_form_errors={react_hook_form_errors}
         defaultValue={address}
         onSelected={(data) => {
             setAddress(data.address);
@@ -403,7 +408,8 @@ export const GooglePlacesModal = ({
         <Grid container spacing={1} sx={{ marginTop: 1 }}>
         <Grid item xs={6}>
             <Box>
-            
+
+            {react_hook_form_Control == null &&
                 <TextField
                     id="outlined-basic"
                     label="City"
@@ -411,13 +417,40 @@ export const GooglePlacesModal = ({
                     variant="outlined"
                     fullWidth={true}
                     value={city}
-                    InputProps={{
-                        readOnly: true,
-                      }}
                     onChange={(val) => {
                     setCity(val.currentTarget.value);
                     }}
                 />
+            }
+
+            {react_hook_form_Control != null &&
+                <Controller
+                    control={react_hook_form_Control}
+                    rules={{ required: true }}
+                    name="city"
+                    render={({ field }) => (
+                    <Stack>
+                        <TextField
+                            id="outlined-basic"
+                            label="City"
+                            name="city"
+                            variant="outlined"
+                            {...field}
+                            fullWidth={true}
+                            value={city}
+                            onChange={(val) => {
+                            setCity(val.currentTarget.value);
+                            }}
+                        />
+
+                        {react_hook_form_errors != null && react_hook_form_errors.city && 
+                    react_hook_form_errors.city.type === 'required' 
+                    && <Typography sx={{color: "red"}}>City is required.</Typography>}
+                    </Stack>
+                    )}
+                />
+            }
+                
             
             </Box>
         </Grid>
@@ -425,21 +458,51 @@ export const GooglePlacesModal = ({
         <Grid item xs={6}>
             <Box>
 
+            {react_hook_form_Control == null &&
+
                 <TextField
                     id="outlined-basic"
                     label="State"
                     name="state"
                     variant="outlined"
                     fullWidth={true}
-                    InputProps={{
-                        readOnly: true,
-                    }}
                     value={state}
                     onChange={(val) => {
                     setState(val.currentTarget.value);
                     }}
                 />
-           
+            }
+
+            {react_hook_form_Control != null &&
+                <Controller
+                    control={react_hook_form_Control}
+                    rules={{ required: true }}
+                    name="state"
+                    render={({ field }) => (
+                    <Stack>
+
+                        <TextField
+                            id="outlined-basic"
+                            label="State"
+                            {...field}
+                            name="state"
+                            variant="outlined"
+                            fullWidth={true}
+                            value={state}
+                            onChange={(val) => {
+                            setState(val.currentTarget.value);
+                            }}
+                        />
+                        
+                        {react_hook_form_errors != null && react_hook_form_errors.state && 
+                    react_hook_form_errors.state.type === 'required' 
+                    && <Typography sx={{color: "red"}}>State is required.</Typography>}
+                    </Stack>
+                    )}
+                />
+            }
+
+
 
             
             </Box>
@@ -458,9 +521,6 @@ export const GooglePlacesModal = ({
                 variant="outlined"
                 fullWidth={true}
                 value={zip}
-                InputProps={{
-                    readOnly: true,
-                }}
                 onChange={(val) => {
                     setPostalcode(val.currentTarget.value);
                 }}