@xyo-network/react-shared 4.4.10 → 4.4.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xyo-network/react-shared",
-  "version": "4.4.10",
+  "version": "4.4.11",
   "description": "Common React library for all XYO projects that use React",
   "keywords": [
     "xyo",
@@ -43,33 +43,34 @@
     "lint-pkg": "npmPkgJsonLint ."
   },
   "dependencies": {
-    "@xylabs/assert": "^4.5.1",
-    "@xylabs/hex": "^4.5.1",
-    "@xylabs/react-appbar": "^5.3.23",
-    "@xylabs/react-button": "^5.3.23",
-    "@xylabs/react-flexbox": "^5.3.23",
-    "@xylabs/react-hooks": "^5.3.23",
-    "@xylabs/react-link": "^5.3.23",
-    "@xylabs/react-promise": "^5.3.23",
-    "@xyo-network/boundwitness-model": "^3.9.17",
-    "@xyo-network/boundwitness-validator": "^3.9.17",
-    "@xyo-network/payload-builder": "^3.9.17",
-    "@xyo-network/payload-model": "^3.9.17",
-    "@xyo-network/react-event": "^4.4.10",
+    "@xylabs/assert": "^4.5.6",
+    "@xylabs/decimal-precision": "^4.5.6",
+    "@xylabs/hex": "^4.5.6",
+    "@xylabs/react-appbar": "^5.3.25",
+    "@xylabs/react-button": "^5.3.25",
+    "@xylabs/react-flexbox": "^5.3.25",
+    "@xylabs/react-hooks": "^5.3.25",
+    "@xylabs/react-link": "^5.3.25",
+    "@xylabs/react-promise": "^5.3.25",
+    "@xyo-network/boundwitness-model": "^3.9.25",
+    "@xyo-network/boundwitness-validator": "^3.9.25",
+    "@xyo-network/payload-builder": "^3.9.25",
+    "@xyo-network/payload-model": "^3.9.25",
+    "@xyo-network/react-event": "^4.4.11",
     "react-router-dom": "^7.2.0"
   },
   "devDependencies": {
     "@mui/icons-material": "^6.4.6",
     "@mui/material": "^6.4.6",
     "@mui/styles": "^6.4.6",
-    "@storybook/react": "^8.6.2",
-    "@xylabs/react-quick-tip-button": "^5.3.23",
-    "@xylabs/ts-scripts-yarn3": "^5.0.25",
-    "@xylabs/tsconfig-react": "^5.0.25",
+    "@storybook/react": "^8.6.3",
+    "@xylabs/react-quick-tip-button": "^5.3.25",
+    "@xylabs/ts-scripts-yarn3": "^5.0.39",
+    "@xylabs/tsconfig-react": "^5.0.39",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "storybook": "^8.6.2",
-    "typescript": "^5.7.3"
+    "storybook": "^8.6.3",
+    "typescript": "^5.8.2"
   },
   "peerDependencies": {
     "@mui/icons-material": "^6",

package/src/components/bigint/TextField.tsx

@@ -2,6 +2,7 @@ import type { FormControlProps, StandardTextFieldProps } from '@mui/material'
 import {
   FormControl, FormHelperText, TextField,
 } from '@mui/material'
+import { toFixedPoint } from '@xylabs/decimal-precision'
 import type { FocusEventHandler } from 'react'
 import React, {
   useEffect, useMemo, useState,
@@ -20,14 +21,12 @@ export interface BigIntTextFieldProps extends StandardTextFieldProps {
 export const BigIntTextField: React.FC<BigIntTextFieldProps> = ({
   defaultFixedPoint = 18, defaultRawValue, helperText, hideAdornment, onChangeFixedPoint, onChange, resetValue, ...props
 }) => {
-  const [value, setValue] = useState<number | undefined>()
   const [rawValue, setRawValue] = useState<string>('')
   const [fixedPoint, setFixedPoint] = useState(defaultFixedPoint)
   const [error, setError] = useState<Error>()
 
   useMemo(() => {
     setRawValue('')
-    setValue(undefined)
   }, [resetValue])
 
   const handleRawValueChange = (rawValue: string) => {
@@ -36,19 +35,11 @@ export const BigIntTextField: React.FC<BigIntTextFieldProps> = ({
     // only allow one decimal point
     if (filteredValue.split('.').length > 2) return
     setRawValue(filteredValue)
-
-    // parse the raw filtered raw value
-    const value = Number.parseFloat(filteredValue)
-    // if the value is NaN set it to 0
-    if (Number.isNaN(value)) setValue(undefined)
-    setValue(value)
   }
 
   useMemo(() => {
     if (defaultRawValue) {
       handleRawValueChange(defaultRawValue)
-    } else {
-      setValue(undefined)
     }
   }, [defaultRawValue])
 
@@ -62,11 +53,11 @@ export const BigIntTextField: React.FC<BigIntTextFieldProps> = ({
 
   // on value or point changes, run the bigInt callback
   const bigIntValue = useMemo(() => {
-    if (value) {
-      const fixedValue = value * (10 ** fixedPoint)
+    if (rawValue) {
+      const fixedValue = toFixedPoint(rawValue)
       setError(undefined)
       try {
-        return BigInt(fixedValue)
+        return fixedValue
       } catch (e) {
         console.error(e)
         setError(e as Error)
@@ -76,7 +67,7 @@ export const BigIntTextField: React.FC<BigIntTextFieldProps> = ({
       return
     }
     // run bigInt callback
-  }, [value, fixedPoint])
+  }, [rawValue, fixedPoint])
 
   useEffect(() => {
     onChangeFixedPoint?.(bigIntValue)