Keep the value of the input-box locally as well to solve the caret

jumping issue. It fixes #7878.

Reference:
- https://dev.to/kwirke/solving-caret-jumping-in-react-inputs-36ic

web/pgadmin/static/js/components/FormComponents.jsx

@@ -354,12 +354,21 @@ export const InputText = forwardRef(({
   cid, helpid, readonly, disabled, value, onChange, controlProps, type, size, inputStyle, ...props }, ref) => {
 
   const maxlength = typeof(controlProps?.maxLength) != 'undefined' ? controlProps.maxLength : 255;
-
   const patterns = {
     'numeric': '^-?[0-9]\\d*\\.?\\d*$',
     'int': '^-?[0-9]\\d*$',
   };
-  let onChangeFinal = (e) => {
+
+  let finalValue = (_.isNull(value) || _.isUndefined(value)) ? '' : value;
+
+  if (controlProps?.formatter) {
+    finalValue = controlProps.formatter.fromRaw(finalValue);
+  }
+
+  if (_.isNull(finalValue) || _.isUndefined(finalValue)) finalValue = '';
+
+  const [val, setVal] = useState(finalValue);
+  const onChangeFinal = (e) => {
     let changeVal = e.target.value;
 
     /* For type number, we set type as tel with number regex to get validity.*/
@@ -371,14 +380,10 @@ export const InputText = forwardRef(({
     if (controlProps?.formatter) {
       changeVal = controlProps.formatter.toRaw(changeVal);
     }
+    setVal(changeVal);
     onChange?.(changeVal);
   };
 
-  let finalValue = (_.isNull(value) || _.isUndefined(value)) ? '' : value;
-
-  if (controlProps?.formatter) {
-    finalValue = controlProps.formatter.fromRaw(finalValue);
-  }
 
   const filteredProps = _.pickBy(props, (_v, key)=>(
     /* When used in ButtonGroup, following props should be skipped */
@@ -406,7 +411,7 @@ export const InputText = forwardRef(({
       disabled={Boolean(disabled)}
       rows={4}
       notched={false}
-      value={(_.isNull(finalValue) || _.isUndefined(finalValue)) ? '' : finalValue}
+      value={val}
       onChange={onChangeFinal}
       {
         ...(controlProps?.onKeyDown && { onKeyDown: controlProps.onKeyDown })