Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
_createMask(props) {
const maskOpts = {
prefix: '', // override default of '$'
allowDecimal: true,
decimalLimit: null,
allowNegative: true
};
MASK_PROPS.forEach(name => {
if (props[name] !== undefined) {
maskOpts[name] = props[name];
}
});
this.set({ mask: createNumberMask(maskOpts) });
}
render() {
const newProps = {...this.props.input};
newProps.disabled = this.props.disabled;
newProps.onChange = this.forwardEvent(this.props.input.onChange);
newProps.onBlur = this.forwardEvent(this.props.input.onBlur);
return (
);
}
}
private createMaskCollection(allowDecimal: boolean): TsMaskCollection {
return {
phone: {
mask: ['(', /[1-9]/, /\d/, /\d/, ')', ' ', /\d/, /\d/, /\d/, '-', /\d/, /\d/, /\d/, /\d/],
unmaskRegex: NUMBER_ONLY_REGEX,
},
currency: {
mask: createNumberMask({ allowDecimal }),
unmaskRegex: allowDecimal ? NUMBER_WITH_DECIMAL_REGEX : NUMBER_ONLY_REGEX,
},
number: {
mask: createNumberMask({
prefix: '',
suffix: '',
allowDecimal,
allowLeadingZeroes: true,
}),
unmaskRegex: allowDecimal ? NUMBER_WITH_DECIMAL_REGEX : NUMBER_ONLY_REGEX,
},
percentage: {
mask: createNumberMask({
prefix: '',
suffix: '%',
allowDecimal,
preset(preset) {
const { presetConfig } = this.props;
switch (preset) {
case 'phone':
return this._mapToArray('+9 (999)-999-99-99');
case 'post-code':
return this._mapToArray('999999');
case 'date':
return this._mapToArray('99.99.9999');
case 'money':
return createNumberMask(presetConfig);
case 'percentage':
return createNumberMask({ prefix: '', suffix: '%' });
case 'card':
return this._mapToArray('9999 9999 9999 9999');
}
}
/**
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import React from 'react';
import { storiesOf } from '@storybook/react';
import { withInfo } from '@storybook/addon-info';
import createNumberMask from 'text-mask-addons/dist/createNumberMask';
import { GROUPS } from '../../../../../.storybook/hierarchySeparators';
import withTests from '../../../../util/withTests';
import SimpleCurrencyInput from './SimpleCurrencyInput';
import { CURRENCY_SYMBOLS } from '../../../../util/currency';
const numberMask = createNumberMask({
prefix: '',
suffix: '',
thousandsSeparatorSymbol: ',',
allowDecimal: true,
decimalLimit: 2,
decimalSymbol: '.'
});
storiesOf(`${GROUPS.FORMS}|CurrencyInput/SimpleCurrencyInput`, module)
.addDecorator(withTests('SimpleCurrencyInput'))
.add(
'Default SimpleCurrencyInput',
withInfo()(() => (
currencyMask() {
return createNumberMask({
prefix: "$",
allowDecimal: true
});
}
},
currency: {
mask: createNumberMask({ allowDecimal }),
unmaskRegex: allowDecimal ? NUMBER_WITH_DECIMAL_REGEX : NUMBER_ONLY_REGEX,
},
number: {
mask: createNumberMask({
prefix: '',
suffix: '',
allowDecimal,
allowLeadingZeroes: true,
}),
unmaskRegex: allowDecimal ? NUMBER_WITH_DECIMAL_REGEX : NUMBER_ONLY_REGEX,
},
percentage: {
mask: createNumberMask({
prefix: '',
suffix: '%',
allowDecimal,
}),
unmaskRegex: allowDecimal ? NUMBER_WITH_DECIMAL_REGEX : NUMBER_ONLY_REGEX,
},
postal: { mask: this.determinePostalMask },
date: {
mask: [/\d/, /\d/, '-', /\d/, /\d/, '-', /\d/, /\d/, /\d/, /\d/],
pipe: createAutoCorrectedDatePipe(this.defaultDateFormat),
keepCharPositions: false,
},
default: { mask: false },
};
}