@weareconceptstudio/form 0.2.0 → 0.2.3

package/dist/phone-number/index.js

@@ -1,12 +1,18 @@
 import React from 'react';
 import classNames from 'classnames';
-import Input from 'react-phone-number-input/react-hook-form-input';
+import PhoneInput from 'react-phone-number-input/input';
 import useFormInstance from '../form/hooks/useFormInstance';
+import { Controller } from 'react-hook-form';
 const PhoneNumber = ({ name, className, autoComplete = 'new-password', options = {} }) => {
-    const { control } = useFormInstance();
+    const { control, setValue, getValues, trigger } = useFormInstance();
     const classString = classNames('phone-number-input', {
         [className]: className,
     });
-    return (React.createElement(Input, { name: name, country: 'AM', international: true, maxLength: 14, control: control, withCountryCallingCode: true, className: classString, autoComplete: autoComplete, ...options }));
+    return (React.createElement(Controller, { name: name, control: control, render: ({ field: { onChange, value, onBlur } }) => (React.createElement(PhoneInput, { name: name, country: 'AM', maxLength: 14, international: true, withCountryCallingCode: true, className: classString, autoComplete: autoComplete, value: getValues(name), onChange: (value) => {
+                setValue(name, value);
+                trigger(name);
+            }, onBlur: () => {
+                onBlur();
+            }, ...options })) }));
 };
 export default PhoneNumber;

package/dist/select/index.js

@@ -1,4 +1,4 @@
-import React, { useState, useMemo } from 'react';
+import React, { useState, useMemo, useEffect, useRef } from 'react';
 import ReactSelect, { components } from 'react-select';
 import classNames from 'classnames';
 import { bottom_arrow, empty } from './icons';
@@ -14,10 +14,18 @@ const Select = (props) => {
     let selectProps = {};
     if (formInstance == null) {
         const [val, setVal] = useState(value);
+        const isInternalUpdate = useRef(false);
+        useEffect(() => {
+            if (!isInternalUpdate.current) {
+                setVal(value);
+            }
+            isInternalUpdate.current = false;
+        }, [value]);
         selectProps = {
             onChange: (e) => {
                 onChange?.(e.value);
                 setVal(e.value);
+                isInternalUpdate.current = true;
             },
             value: val,
         };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@weareconceptstudio/form",
-	"version": "0.2.0",
+	"version": "0.2.3",
 	"description": "Concept Studio Form",
 	"author": "Concept Studio",
 	"license": "ISC",