From 800e29effab4e778df1f5b78567856627e285dad Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tobias=20H=C3=B8egh?= <tobias@tujo.no>
Date: Thu, 26 Oct 2023 23:07:54 +0200
Subject: [PATCH] fix(NumberMask): as_number should default to locale given
 decimalSymbol

---
 .../input-masked/InputMaskedHooks.js          | 11 ++++---
 .../__tests__/InputMasked.test.tsx            | 30 +++++++++++++++++++
 .../extensions/forms/Field/Number/Number.tsx  |  2 +-
 3 files changed, 36 insertions(+), 7 deletions(-)

diff --git a/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js b/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js
index e28590a2633..4d7096e0112 100644
--- a/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js
+++ b/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js
@@ -12,6 +12,7 @@ import {
 import {
   isTrue,
   dispatchCustomElementEvent,
+  extendPropsWithContext,
 } from '../../shared/component-helper'
 import { safeSetSelection } from './text-mask/createTextMaskInputElement'
 
@@ -482,21 +483,19 @@ const useNumberMaskParams = () => {
     const decimalSymbol = handleDecimalSeparator(locale)
 
     if (isTrue(as_number) || isTrue(as_percent)) {
-      number_mask = {
+      number_mask = extendPropsWithContext(number_mask, null, {
         decimalSymbol,
         thousandsSeparatorSymbol,
-        ...number_mask,
-      }
+      })
     } else if (as_currency) {
-      currency_mask = {
+      currency_mask = extendPropsWithContext(currency_mask, null, {
         decimalSymbol,
         thousandsSeparatorSymbol,
         currency: getCurrencySymbol(
           locale,
           typeof as_currency === 'string' ? as_currency : null
         ),
-        ...currency_mask,
-      }
+      })
     }
   }
 
diff --git a/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.tsx b/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.tsx
index 80a65cd83d0..23d1abc73b7 100644
--- a/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.tsx
+++ b/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.tsx
@@ -1018,6 +1018,36 @@ describe('InputMasked component as_number', () => {
     expect(document.querySelector('input').value).toBe('12 345,6')
   })
 
+  it('will not overwrite decimalSymbol when undefined was given', () => {
+    const { rerender } = render(
+      <InputMasked
+        value={12345.678}
+        as_number
+        number_mask={{
+          thousandsSeparatorSymbol: '|',
+          decimalSymbol: ':',
+          allowDecimal: true,
+        }}
+      />
+    )
+
+    expect(document.querySelector('input').value).toBe('12|345:67')
+
+    rerender(
+      <InputMasked
+        value={12345.678}
+        as_number
+        number_mask={{
+          thousandsSeparatorSymbol: undefined,
+          decimalSymbol: undefined,
+          allowDecimal: true,
+        }}
+      />
+    )
+
+    expect(document.querySelector('input').value).toBe('12 345,67')
+  })
+
   it('should merge "mask_options" properties', () => {
     render(
       <InputMasked
diff --git a/packages/dnb-eufemia/src/extensions/forms/Field/Number/Number.tsx b/packages/dnb-eufemia/src/extensions/forms/Field/Number/Number.tsx
index d39fad733d7..9467084000c 100644
--- a/packages/dnb-eufemia/src/extensions/forms/Field/Number/Number.tsx
+++ b/packages/dnb-eufemia/src/extensions/forms/Field/Number/Number.tsx
@@ -46,7 +46,7 @@ function NumberComponent(props: Props) {
     percent,
     mask,
     thousandSeparator,
-    decimalSymbol = ',',
+    decimalSymbol,
     decimalLimit = 12,
     prefix,
     suffix,