@sinchsmb/ui-kit/dist/types/form/MaskedInput.d.ts

UI kit for SinchSMB frontend

import React, { AriaAttributes } from 'react';
import { TestIdProps } from '../types';
/**
 * Mask can be array of strings or RegExp
 *
 * If the `mask` is `false` then mask will be not applied to value.
 *
 * @see https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#mask
 */
export type Mask = Array<string | RegExp> | false;
/**
 * @see https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#pipe
 */
export interface PipeConfig {
    placeholder: string;
    placeholderChar: string;
    currentCaretPosition: number;
    keepCharPositions: boolean;
    rawValue: string;
    guide: boolean | undefined;
    previousConformedValue: string | undefined;
}
/**
 * Based on https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react-text-mask/index.d.ts
 */
export interface MaskedInputProps extends TestIdProps, Pick<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'onBlur' | 'disabled' | 'id' | 'placeholder' | 'required' | 'className'> {
    /** @see https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#mask */
    mask: Mask | ((value: string) => Mask);
    /** @see https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#guide */
    guide?: boolean;
    /** @see https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#placeholderchar */
    placeholderChar?: string;
    /** @see https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#keepcharpositions */
    keepCharPositions?: boolean;
    /** @see https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#pipe */
    pipe?: (conformedValue: string, config: PipeConfig) => false | string | {
        value: string;
        indexesOfPipedChars: number[];
    };
    /** @see https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#showmask */
    showMask?: boolean;
    ariaLabel?: AriaAttributes['aria-label'];
    ariaDescribedBy?: AriaAttributes['aria-describedby'];
    ariaInvalid?: AriaAttributes['aria-invalid'];
    ariaErrorMessage?: AriaAttributes['aria-errormessage'];
    ariaRequired?: AriaAttributes['aria-required'];
}
/**
 * Wrapper on text-mask
 *
 * @see https://github.com/text-mask/text-mask/tree/master/react#readme
 *
 * Base on https://github.com/text-mask/text-mask/blob/master/react/src/reactTextMask.js
 */
export declare const MaskedInput: React.ForwardRefExoticComponent<MaskedInputProps & React.RefAttributes<HTMLInputElement>>;