🚀 - Number-mask

[nsbarsukov]

Which package(s) are relevant/related to the feature request?

@maskito/kit

Description

We should create mask for InputNumber.
Overwrite-mode is equal to shift.

Proposed API

import {Maskito} from `@maskito/core`;
import {maskitoNumberOptionsGenerator} from `@maskito/kit`;

const inputNumber = new Maskito(
    element,
    maskitoNumberOptionsGenerator({
        min: -5000,
        max: 5000,
        precision: 0, 
        zeroPadding: false,
        decimalSeparator: ',', // comma
        thousandSeparator: ' ', // space 
    })
)

Configurable options

min

Default value: Number.MIN_SAFE_INTEGER.

max

Default value: Number.MAX_SAFE_INTEGER.

precision

A number of digits after decimalSeparator.
Default value: 0 (no digits after decimalSeparator are allowed).

decimalSeparator

This parameter makes sense only if precision > 0.

Symbol for separating fraction.
Default value: , (comma).

zeroPadding

This parameter makes sense only if precision > 0.

Possible values:

• true - number of digits after decimalSeparator ALWAYS is equal to the precision.
  it is not possible for user to delete digits after decimalSeparator!
  If user press Backspace / Delete, mask should replace deleted digits with zeroes and place caret to the left/right.

• false - number of digits after decimalSeparator can equal or less to to the precision.
  User can leave decimals with tailing zeroes. For example (precision: 4), 3.4300.
  User can delete tailing character. For example (precision: 4), 3.43.
  The only restriction in this mode: user cannot insert more digits (after decimalSeparator) than precision.
  Default value: false.

thousandSeparator

Symbol for separating thousands.
Default value: \u00A0 (Non-breaking space).

Additional requirements for new mask

• To make decimalSeparator (dot, comma etc) autocorrect, if none of these symbols is used as thousands separator.
  For examples, decimalSeparator: ',' and user presses dot, the should replace typed dot with comma.
• Add example with custom zero-padding to documentation-page: "add zeroPadding only if user insert something for fraction (decimal separator of the first fraction digit); don't add zero padding for another cases".

[waterplea]

I think yes, decimals should be boolean. And don't forget, that number format is locale dependent. We also want to make dot/comma autocorrect, if none of these symbols is used as thousands separator.

[waterplea]

We probably want to make trailing zeroes configurable somehow. They make sense for money, but not for numbers in general.