diff --git a/package-lock.json b/package-lock.json
index 9b2f4d42c2..9ebe4e3932 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -22294,16 +22294,13 @@
       "license": "MIT"
     },
     "node_modules/react-number-format": {
-      "version": "4.9.1",
-      "resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-4.9.1.tgz",
-      "integrity": "sha512-v49XqXv7SpwYZKGkghNJjoDUr6lIUozlPLrObcxre7GfcLx7qD4TCvArn3GozN/Y4FVbLyEYCwJoBCiChdBh5A==",
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-5.4.1.tgz",
+      "integrity": "sha512-NICOjo/70dcAiwVmH6zMWoZrTQDlBrEXV/f7S0t/ewlpzp4z00pasg5G1yBX6NHLafwOF3QZ+VvK/XApwSKxdA==",
       "license": "MIT",
-      "dependencies": {
-        "prop-types": "^15.7.2"
-      },
       "peerDependencies": {
-        "react": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0",
-        "react-dom": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0"
+        "react": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0",
+        "react-dom": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0"
       }
     },
     "node_modules/react-redux": {
@@ -28148,7 +28145,7 @@
         "overlayscrollbars-react": "0.3.0",
         "qs": "6.12.1",
         "react-dropzone": "14.2.3",
-        "react-number-format": "4.9.1",
+        "react-number-format": "5.4.1",
         "react-redux": "8.1.2",
         "react-scroll-to-bottom": "4.2.0",
         "react-teleporter": "3.1.0",
@@ -28387,7 +28384,7 @@
         "react-dropzone": "14.2.3",
         "react-hook-form": "7.45.4",
         "react-hotkeys-hook": "4.5.0",
-        "react-number-format": "4.9.1",
+        "react-number-format": "5.4.1",
         "react-redux": "8.1.2",
         "react-router": "6.15.0",
         "react-router-dom": "6.15.0",
diff --git a/packages/core/package.json b/packages/core/package.json
index 88a9f9a5c4..be544fe6c4 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -37,11 +37,11 @@
     "lodash": "4.17.21",
     "match-sorter": "6.3.1",
     "moment": "2.30.1",
-    "qs": "6.12.1",
     "overlayscrollbars": "1.13.3",
     "overlayscrollbars-react": "0.3.0",
+    "qs": "6.12.1",
     "react-dropzone": "14.2.3",
-    "react-number-format": "4.9.1",
+    "react-number-format": "5.4.1",
     "react-redux": "8.1.2",
     "react-scroll-to-bottom": "4.2.0",
     "react-teleporter": "3.1.0",
diff --git a/packages/core/src/components/Amount/NumberFormatCustom.tsx b/packages/core/src/components/Amount/NumberFormatCustom.tsx
index 58b919ed8d..0f54c57950 100644
--- a/packages/core/src/components/Amount/NumberFormatCustom.tsx
+++ b/packages/core/src/components/Amount/NumberFormatCustom.tsx
@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-import NumberFormat from 'react-number-format';
+import { NumericFormat, type OnValueChange } from 'react-number-format';
 
 interface NumberFormatCustomProps {
   onChange: (event: { target: { name: string; value: string } }) => void;
@@ -9,18 +9,21 @@ interface NumberFormatCustomProps {
 function NumberFormatCustom(props: NumberFormatCustomProps, ref: any) {
   const { onChange, ...other } = props;
 
-  function handleChange(values: any) {
-    onChange(values.value);
-  }
+  const handleChange: OnValueChange = React.useCallback(
+    (values) => {
+      onChange(values.value);
+    },
+    [onChange],
+  );
 
   return (
-    <NumberFormat
+    <NumericFormat
       {...other}
       getInputRef={ref}
       onValueChange={handleChange}
       thousandSeparator
       allowNegative={false}
-      isNumericString
+      valueIsNumericString
     />
   );
 }
diff --git a/packages/core/src/components/TextFieldNumber/NumberFormatCustom.tsx b/packages/core/src/components/TextFieldNumber/NumberFormatCustom.tsx
index 62de8125d9..c6c34fb7b9 100644
--- a/packages/core/src/components/TextFieldNumber/NumberFormatCustom.tsx
+++ b/packages/core/src/components/TextFieldNumber/NumberFormatCustom.tsx
@@ -1,8 +1,8 @@
 import React, { forwardRef } from 'react';
-import NumberFormat from 'react-number-format';
+import { NumericFormat, type OnValueChange } from 'react-number-format';
 
 interface NumberFormatCustomProps {
-  inputRef: (instance: NumberFormat | null) => void;
+  inputRef: (instance: typeof NumericFormat | null) => void;
   onChange: (event: { target: { name: string; value: string } }) => void;
   name: string;
 }
@@ -10,18 +10,21 @@ interface NumberFormatCustomProps {
 function NumberFormatCustom(props: NumberFormatCustomProps) {
   const { inputRef, onChange, ...other } = props;
 
-  function handleChange(values: Object) {
-    onChange(values.value);
-  }
+  const handleChange: OnValueChange = React.useCallback(
+    (values) => {
+      onChange(values.value);
+    },
+    [onChange],
+  );
 
   return (
-    <NumberFormat
+    <NumericFormat
       {...other}
       getInputRef={inputRef}
       onValueChange={handleChange}
       thousandSeparator
       allowNegative={false}
-      isNumericString
+      valueIsNumericString
     />
   );
 }
diff --git a/packages/gui/package.json b/packages/gui/package.json
index 3387db59f5..9cd66adc34 100644
--- a/packages/gui/package.json
+++ b/packages/gui/package.json
@@ -80,7 +80,7 @@
     "react-dropzone": "14.2.3",
     "react-hook-form": "7.45.4",
     "react-hotkeys-hook": "4.5.0",
-    "react-number-format": "4.9.1",
+    "react-number-format": "5.4.1",
     "react-redux": "8.1.2",
     "react-router": "6.15.0",
     "react-router-dom": "6.15.0",
diff --git a/packages/gui/src/components/offers/OfferExchangeRate.tsx b/packages/gui/src/components/offers/OfferExchangeRate.tsx
index 2eb55d4872..cfdc19bdd6 100644
--- a/packages/gui/src/components/offers/OfferExchangeRate.tsx
+++ b/packages/gui/src/components/offers/OfferExchangeRate.tsx
@@ -3,19 +3,19 @@ import { Flex } from '@chia-network/core';
 import { ImportExport } from '@mui/icons-material';
 import { InputAdornment, TextField, Typography } from '@mui/material';
 import React, { useMemo, useState } from 'react';
-import NumberFormat from 'react-number-format';
+import { NumericFormat } from 'react-number-format';
 
 import { AssetIdMapEntry } from '../../hooks/useAssetIdName';
 
 interface OfferExchangeRateNumberFormatProps {
-  inputRef: (instance: NumberFormat | null) => void;
+  inputRef: (instance: typeof NumericFormat | null) => void;
   name: string;
 }
 
 function OfferExchangeRateNumberFormat(props: OfferExchangeRateNumberFormatProps) {
   const { inputRef, ...other } = props;
 
-  return <NumberFormat {...other} getInputRef={inputRef} allowNegative={false} isNumericString />;
+  return <NumericFormat {...other} getInputRef={inputRef} allowNegative={false} valueIsNumericString />;
 }
 
 type Props = {