diff --git a/packages/dnb-eufemia/src/components/input-masked/InputMasked.js b/packages/dnb-eufemia/src/components/input-masked/InputMasked.js
index 607afe73536..73a160e4919 100644
--- a/packages/dnb-eufemia/src/components/input-masked/InputMasked.js
+++ b/packages/dnb-eufemia/src/components/input-masked/InputMasked.js
@@ -12,7 +12,7 @@ import InputMaskedElement from './InputMaskedElement'
import Input, { inputPropTypes } from '../input/Input'
import Context from '../../shared/Context'
-const InputMasked = React.forwardRef((props, ref) => {
+const InputMasked = (props) => {
const context = React.useContext(Context)
// Remove masks defined in Provider/Context, because it overwrites a custom mask
@@ -37,7 +37,6 @@ const InputMasked = React.forwardRef((props, ref) => {
return (
{
)
-})
+}
export default InputMasked
diff --git a/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js b/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js
index e0afb29447a..57374a3a43f 100644
--- a/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js
+++ b/packages/dnb-eufemia/src/components/input-masked/InputMaskedHooks.js
@@ -66,18 +66,6 @@ export const useFilteredProps = () => {
return { props, htmlAttributes: Object.freeze(attributes) }
}
-/**
- * Returns either given component property ref or new internal ref
- *
- * @returns React ref
- */
-export const useInputElementRef = () => {
- const { props } = React.useContext(InputMaskedContext)
- return typeof props?.inner_ref?.current !== 'undefined'
- ? props?.inner_ref
- : React.createRef()
-}
-
/**
* Returns locale from either component or context
*
@@ -217,7 +205,6 @@ export const useMaskParams = () => {
* @returns React Element
*/
export const useInputElement = () => {
- const ref = useInputElementRef()
const { props } = React.useContext(InputMaskedContext)
const { pipe } = props
@@ -226,6 +213,9 @@ export const useInputElement = () => {
const { showMask, showGuide, placeholderChar, keepCharPositions } =
useMaskParams()
+ const _ref = React.useRef()
+ const ref = props?.inner_ref || _ref
+
// Create the actual input element
const inputElementRef = React.useRef()
diff --git a/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.js b/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.js
index d36cb901eea..d15fa6a4128 100644
--- a/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.js
+++ b/packages/dnb-eufemia/src/components/input-masked/__tests__/InputMasked.test.js
@@ -69,11 +69,18 @@ describe('InputMasked component', () => {
})
it('gets valid ref element', () => {
- const ref = React.createRef()
- mount()
+ let ref
+
+ function MockComponent() {
+ ref = React.useRef()
+ return
+ }
+
+ render()
expect(ref.current instanceof window.HTMLInputElement).toBe(true)
expect(ref.current.id).toBe(props.id)
+ expect(ref.current.tagName).toBe('INPUT')
})
it('event "on_change" gets emmited with correct value', () => {
diff --git a/packages/dnb-eufemia/src/components/input-masked/__tests__/__snapshots__/InputMasked.test.js.snap b/packages/dnb-eufemia/src/components/input-masked/__tests__/__snapshots__/InputMasked.test.js.snap
index 070e5401f6a..b056272d031 100644
--- a/packages/dnb-eufemia/src/components/input-masked/__tests__/__snapshots__/InputMasked.test.js.snap
+++ b/packages/dnb-eufemia/src/components/input-masked/__tests__/__snapshots__/InputMasked.test.js.snap
@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`InputMasked component have to match type="text" snapshot 1`] = `
-
-
+
`;
exports[`InputMasked scss have to match snapshot 1`] = `