Элемент управления MaskedInput не работает при использовании: type = "number" и маски одновременно

Question

У меня есть очень простой React код, где я использую следующие Node пакеты:

import MaskedInput from 'react-text-mask';
import createNumberMask from 'text-mask-addons/dist/createNumberMask';

Моя проблема , которую я не могу применить type="number" и mask={...} в то же время.

Я хочу использовать замаскированный ввод и одновременно потянуть цифровую клавиатуру вверх, когда пользователь фокусирует ввод.Вот почему я хочу использовать: type="number".

Моя цель - позволить пользователю вводить числовое значение с помощью цифровой клавиатуры и одновременно видеть цифровую маску.

Ниже у вас естьрабочий код, который вы также можете найти и поиграть на:

https://codesandbox.io/s/l42v92xml

import React from "react";
import MaskedInput from 'react-text-mask';
import createNumberMask from 'text-mask-addons/dist/createNumberMask';

export default class DollarAmount extends React.Component {
  render() {
    return (
      <MaskedInput
        type="text"
        mask={createNumberMask({ prefix: '$ ' })}
        placeholderChar={'\u2000'}
      />
    );
  }
}

Пример выше работает, потому что он использует: type="text".

Помните, что конфликт равен type="number" и mask={...} одновременно.

Следующий код также будет работать:

import React from "react";
import MaskedInput from 'react-text-mask';
import createNumberMask from 'text-mask-addons/dist/createNumberMask';

export default class DollarAmount extends React.Component {
  render() {
    return (
      <MaskedInput
        type="number"
        placeholderChar={'\u2000'}
      />
    );
  }
}

, поскольку он не имеет атрибута mask.

Есть идеи, как получить эту работу?

Спасибо!