fix(Field.Currency): set limit of safe big number

Fixes #3124
dnbexperience · Jan 7, 2024 · d4e7ab8 · d4e7ab8
1 parent c33ae35
commit d4e7ab8
Show file tree

Hide file tree

Showing 4 changed files with 62 additions and 7 deletions.
diff --git a/...system-portal/src/docs/uilib/extensions/forms/base-fields/Number/properties.mdx b/...system-portal/src/docs/uilib/extensions/forms/base-fields/Number/properties.mdx
@@ -17,8 +17,8 @@ import DataValueReadwriteProperties from '../../data-value-readwrite-properties.
 | `percent`                               | `boolean`            | _(optional)_ Format a number as percentage.                                                                                                                     |
 | `prefix`                                | `string`             | _(optional)_ Text added before the value input.                                                                                                                 |
 | `suffix`                                | `string`             | _(optional)_ Text added after the value input.                                                                                                                  |
-| `minimum`                               | `number`             | _(optional)_ Validation for inclusive minimum number value (greater than or equal).                                                                             |
-| `maximum`                               | `number`             | _(optional)_ Validation for inclusive maximum number value (less than or equal).                                                                                |
+| `minimum`                               | `number`             | _(optional)_ Validation for inclusive minimum number value (greater than or equal). Defaults to `-Number.MAX_SAFE_INTEGER`.                                     |
+| `maximum`                               | `number`             | _(optional)_ Validation for inclusive maximum number value (less than or equal). Defaults to `Number.MAX_SAFE_INTEGER`.                                         |
 | `exclusiveMinimum`                      | `number`             | _(optional)_ Validation for exclusive minimum number value (greater than).                                                                                      |
 | `exclusiveMaximum`                      | `number`             | _(optional)_ Validation for exclusive maximum number value (less than).                                                                                         |
 | `multipleOf`                            | `number`             | _(optional)_ Validation that requires the number to be a multiple of given value.                                                                               |

diff --git a/packages/dnb-eufemia/src/extensions/forms/Field/Number/Number.tsx b/packages/dnb-eufemia/src/extensions/forms/Field/Number/Number.tsx
@@ -104,14 +104,32 @@ function NumberComponent(props: Props) {
     return external
   }, [])
   const fromInput = useCallback(
-    ({ value, numberValue }: { value: string; numberValue: number }) => {
-      if (value === '') {
+    (event: { value?: string; numberValue: number }) => {
+      if (typeof event === 'number') {
+        event = { numberValue: event }
+      }
+
+      if (event?.value === '') {
         return props.emptyValue
       }
-      return numberValue
+
+      return event?.numberValue
     },
     [props.emptyValue]
   )
+  const transformValue = useCallback(
+    (value: number, currentValue: number) => {
+      if (
+        value > Number.MAX_SAFE_INTEGER ||
+        value < -Number.MAX_SAFE_INTEGER
+      ) {
+        return currentValue
+      }
+
+      return value
+    },
+    []
+  )
 
   const maskProps: Partial<InputMaskedProps> = useMemo(() => {
     if (currency) {
@@ -155,6 +173,7 @@ function NumberComponent(props: Props) {
     schema,
     toInput,
     fromInput,
+    transformValue,
     size:
       props.size !== 'small' && props.size !== 'large'
         ? 'medium'
@@ -174,8 +193,8 @@ function NumberComponent(props: Props) {
     labelDescription,
     labelSecondary,
     value,
-    minimum,
-    maximum,
+    minimum = -Number.MAX_SAFE_INTEGER,
+    maximum = Number.MAX_SAFE_INTEGER,
     disabled,
     info,
     warning,

diff --git a/packages/dnb-eufemia/src/extensions/forms/Field/Number/__tests__/Number.test.tsx b/packages/dnb-eufemia/src/extensions/forms/Field/Number/__tests__/Number.test.tsx
@@ -24,6 +24,42 @@ describe('Field.Number', () => {
       expect(screen.getByLabelText('Number label')).toBeInTheDocument()
     })
 
+    it('corrects minimum number', () => {
+      render(<Field.Number value={-Number.MAX_SAFE_INTEGER} />)
+
+      const input = document.querySelector('input')
+
+      fireEvent.change(input, {
+        target: {
+          value: String(-Number.MAX_SAFE_INTEGER - 1),
+        },
+      })
+
+      expect(input).toHaveValue(String(-Number.MAX_SAFE_INTEGER - 1))
+
+      fireEvent.blur(input)
+
+      expect(input).toHaveValue(String(-Number.MAX_SAFE_INTEGER))
+    })
+
+    it('corrects maximum number', () => {
+      render(<Field.Number value={Number.MAX_SAFE_INTEGER} />)
+
+      const input = document.querySelector('input')
+
+      fireEvent.change(input, {
+        target: {
+          value: String(Number.MAX_SAFE_INTEGER + 1),
+        },
+      })
+
+      expect(input).toHaveValue(String(Number.MAX_SAFE_INTEGER + 1))
+
+      fireEvent.blur(input)
+
+      expect(input).toHaveValue(String(Number.MAX_SAFE_INTEGER))
+    })
+
     it('should support disabled prop', () => {
       const { rerender } = render(
         <Field.Number label="Disabled label" disabled />

diff --git a/...ld/Number/stories/Number.test.stories.tsx → ...s/Field/Number/stories/Number.stories.tsx b/...ld/Number/stories/Number.test.stories.tsx → ...s/Field/Number/stories/Number.stories.tsx