@opengeoweb/form-fields 14.1.0 → 14.2.1

package/index.esm.js

@@ -482,8 +482,7 @@ var ReactHookFormSelect = function ReactHookFormSelect(_ref) {
         // default props
         _onChange(changeEvent, child);
       },
-      // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-      value: value || '',
+      value: value != null ? value : '',
       variant: "filled"
     }, otherProps, {
       children: children
@@ -678,12 +677,10 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_ref) {
     var before = inputElement.value.slice(0, inputElement.selectionStart);
     var after = inputElement.value.slice(inputElement.selectionEnd);
     var newValue = before + clipboardText + after;
-    // eslint-disable-next-line no-useless-escape
-    if (inputMode === 'numeric' && !/^\-?[0-9]+$/.exec(newValue)) {
+    if (inputMode === 'numeric' && !/^-?[0-9]+$/.exec(newValue)) {
       event.preventDefault();
     }
-    // eslint-disable-next-line no-useless-escape
-    if (inputMode === 'decimal' && !/^\-?[0-9]*(\.[0-9]+)?$/.exec(newValue)) {
+    if (inputMode === 'decimal' && !/^-?[0-9]*(.[0-9]+)?$/.exec(newValue)) {
       event.preventDefault();
     }
   };
@@ -702,9 +699,50 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_ref) {
       event.preventDefault();
     }
   };
-  var _React$useState = React.useState(value === null || isNaN(value) ? '' : value),
-    displayValue = _React$useState[0],
-    setDisplayValue = _React$useState[1];
+  // Transform number value to string for display, following React Hook Form transform pattern
+  var formatValueForDisplay = React.useCallback(function (numValue) {
+    if (numValue === null || numValue === undefined || isNaN(numValue)) {
+      return '';
+    }
+    return String(numValue);
+  }, []);
+  // Local state to preserve string precision during editing (e.g., trailing zeros), only sync from form value when not actively editing
+  var _React$useState = React.useState(null),
+    localValue = _React$useState[0],
+    setLocalValue = _React$useState[1];
+  var isFocusedRef = React.useRef(false);
+  var previousValueRef = React.useRef(value);
+  var lastSetValueRef = React.useRef(null);
+  // Sync local value from form value when value changes externally, but only when not actively editing and the change wasn't from our own update
+  React.useEffect(function () {
+    if (!isFocusedRef.current && value !== previousValueRef.current) {
+      var wasOurUpdate = lastSetValueRef.current !== null && lastSetValueRef.current === value;
+      if (!wasOurUpdate) {
+        setLocalValue(null); // Clear local value to use form value
+      } else if (localValue !== null) {
+        // It was our update, but check if localValue still represents this number accurately
+        var numFromLocal = convertNumericInputValue(localValue, inputMode);
+        if (numFromLocal !== value) {
+          // Local value no longer matches form value, clear it
+          setLocalValue(null);
+        }
+      }
+      previousValueRef.current = value;
+    }
+  }, [value, localValue, inputMode]);
+  // Compute display value: prefer local value if it has more precision than number representation
+  var displayValue = React.useMemo(function () {
+    // Always use local value if it exists and represents the same number as form value
+    if (localValue !== null) {
+      var numFromLocal = convertNumericInputValue(localValue, inputMode);
+      var valuesMatch = numFromLocal === value || numFromLocal === null && value === null || numFromLocal !== null && typeof numFromLocal === 'number' && typeof value === 'number' && isNaN(numFromLocal) && isNaN(value);
+      if (valuesMatch) {
+        return localValue;
+      }
+    }
+    // When no local value or it doesn't match, use formatted form value
+    return formatValueForDisplay(value);
+  }, [value, localValue, inputMode, formatValueForDisplay]);
   return jsx(ReactHookFormFormControl, {
     className: className,
     disabled: disabled,
@@ -719,12 +757,30 @@ var ReactHookFormNumberField = function ReactHookFormNumberField(_ref) {
       inputRef: ref,
       label: label,
       name: name,
+      onBlur: function onBlur(evt) {
+        isFocusedRef.current = false;
+        // Keep local value on blur to preserve precision (e.g., trailing zeros), it will be cleared only if form value changes externally
+        previousValueRef.current = value;
+        otherProps.onBlur == null || otherProps.onBlur(evt);
+      },
       onChange: function onChange(evt) {
-        var value = evt.target.value;
-        setDisplayValue(value);
-        onChangeField(convertNumericInputValue(value, inputMode));
+        var inputValue = evt.target.value;
+        // Update local value to preserve string precision during editing
+        setLocalValue(inputValue);
+        // Convert to number for form value
+        var numericValue = convertNumericInputValue(inputValue, inputMode);
+        lastSetValueRef.current = numericValue;
+        onChangeField(numericValue);
         _onChange(null);
       },
+      onFocus: function onFocus(evt) {
+        isFocusedRef.current = true;
+        // Initialize local value with current display value when focusing
+        if (localValue === null) {
+          setLocalValue(formatValueForDisplay(value));
+        }
+        otherProps.onFocus == null || otherProps.onFocus(evt);
+      },
       onKeyDown: onKeyDown,
       size: size,
       type: "text",
@@ -1079,8 +1135,7 @@ var useDraftFormHelpers = function useDraftFormHelpers(isDefaultDraft) {
     setValue(HIDDEN_INPUT_HELPER_IS_DRAFT, isDefaultDraft, {
       shouldDirty: false
     });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, [isDefaultDraft, setValue]);
   var isDraft = function isDraft() {
     return getValues(HIDDEN_INPUT_HELPER_IS_DRAFT) === true;
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/form-fields",
-  "version": "14.1.0",
+  "version": "14.2.1",
   "description": "GeoWeb form-fields library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -8,11 +8,11 @@
     "url": "git@gitlab.com:opengeoweb/opengeoweb.git"
   },
   "dependencies": {
-    "@opengeoweb/theme": "14.1.0",
+    "@opengeoweb/theme": "14.2.1",
     "react-hook-form": "^7.50.1",
     "@mui/x-date-pickers": "^8.11.2",
     "lodash": "^4.17.21",
-    "@opengeoweb/shared": "14.1.0",
+    "@opengeoweb/shared": "14.2.1",
     "react-i18next": "^15.1.1",
     "@mui/material": "^7.0.1",
     "i18next": "^25.0.1",