ngx-mask
Version:
awesome ngx mask
272 lines (263 loc) • 14.6 kB
TypeScript
import * as _angular_core from '@angular/core';
import { EventEmitter, InjectionToken, Provider, EnvironmentProviders, ElementRef, OnChanges, SimpleChanges, PipeTransform } from '@angular/core';
import * as ngx_mask from 'ngx-mask';
import { ControlValueAccessor, Validator, FormControl, ValidationErrors } from '@angular/forms';
type InputTransformFn = (value: unknown) => string | number;
type OutputTransformFn = (value: string | number | undefined | null) => unknown;
type NgxMaskConfig = {
suffix: string;
prefix: string;
thousandSeparator: string;
decimalMarker: '.' | ',' | ['.', ','];
clearIfNotMatch: boolean;
showMaskTyped: boolean;
placeHolderCharacter: string;
shownMaskExpression: string;
specialCharacters: string[] | readonly string[];
dropSpecialCharacters: boolean | string[] | readonly string[];
hiddenInput: boolean;
validation: boolean;
instantPrefix: boolean;
separatorLimit: string;
apm: boolean;
allowNegativeNumbers: boolean;
leadZeroDateTime: boolean;
leadZero: boolean;
triggerOnMaskChange: boolean;
keepCharacterPositions: boolean;
inputTransformFn: InputTransformFn;
outputTransformFn: OutputTransformFn;
maskFilled: EventEmitter<void>;
patterns: Record<string, {
pattern: RegExp;
optional?: boolean;
symbol?: string;
}>;
};
type NgxMaskOptions = Partial<NgxMaskConfig>;
declare const NGX_MASK_CONFIG: InjectionToken<NgxMaskConfig>;
declare const NEW_CONFIG: InjectionToken<NgxMaskConfig>;
declare const INITIAL_CONFIG: InjectionToken<NgxMaskConfig>;
declare const initialConfig: NgxMaskConfig;
declare const timeMasks: string[];
declare const withoutValidation: string[];
declare function provideNgxMask(configValue?: NgxMaskOptions | (() => NgxMaskOptions)): Provider[];
declare function provideEnvironmentNgxMask(configValue?: NgxMaskOptions | (() => NgxMaskOptions)): EnvironmentProviders;
type CustomKeyboardEvent = KeyboardEvent;
declare class NgxMaskApplierService {
protected _config: NgxMaskConfig;
dropSpecialCharacters: NgxMaskConfig['dropSpecialCharacters'];
hiddenInput: NgxMaskConfig['hiddenInput'];
clearIfNotMatch: NgxMaskConfig['clearIfNotMatch'];
specialCharacters: NgxMaskConfig['specialCharacters'];
patterns: NgxMaskConfig['patterns'];
prefix: NgxMaskConfig['prefix'];
suffix: NgxMaskConfig['suffix'];
thousandSeparator: NgxMaskConfig['thousandSeparator'];
decimalMarker: NgxMaskConfig['decimalMarker'];
customPattern: NgxMaskConfig['patterns'];
showMaskTyped: NgxMaskConfig['showMaskTyped'];
placeHolderCharacter: NgxMaskConfig['placeHolderCharacter'];
validation: NgxMaskConfig['validation'];
separatorLimit: NgxMaskConfig['separatorLimit'];
allowNegativeNumbers: NgxMaskConfig['allowNegativeNumbers'];
leadZeroDateTime: NgxMaskConfig['leadZeroDateTime'];
leadZero: NgxMaskConfig['leadZero'];
apm: NgxMaskConfig['apm'];
inputTransformFn: NgxMaskConfig['inputTransformFn'] | null;
outputTransformFn: NgxMaskConfig['outputTransformFn'] | null;
keepCharacterPositions: NgxMaskConfig['keepCharacterPositions'];
instantPrefix: NgxMaskConfig['instantPrefix'];
triggerOnMaskChange: NgxMaskConfig['triggerOnMaskChange'];
private _shift;
plusOnePosition: boolean;
maskExpression: string;
actualValue: string;
showKeepCharacterExp: string;
shownMaskExpression: NgxMaskConfig['shownMaskExpression'];
deletedSpecialCharacter: boolean;
ipError?: boolean;
cpfCnpjError?: boolean;
applyMask(inputValue: string | object | boolean | null | undefined, maskExpression: string, position?: number, justPasted?: boolean, backspaced?: boolean, cb?: (...args: any[]) => any): string;
_findDropSpecialChar(inputSymbol: string): undefined | string;
_findSpecialChar(inputSymbol: string): undefined | string;
_checkSymbolMask(inputSymbol: string, maskSymbol: string): boolean;
private _formatWithSeparators;
private percentage;
getPrecision: (maskExpression: string) => number;
private checkAndRemoveSuffix;
private checkInputPrecision;
private _stripToDecimal;
private _charToRegExpExpression;
private _shiftStep;
protected _compareOrIncludes<T>(value: T, comparedValue: T | T[], excludedValue: T): boolean;
private _validIP;
private _splitPercentZero;
private _findFirstNonZeroAndDecimalIndex;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxMaskApplierService, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<NgxMaskApplierService>;
}
declare class NgxMaskService extends NgxMaskApplierService {
isNumberValue: boolean;
maskIsShown: string;
selStart: number | null;
selEnd: number | null;
maskChanged: boolean;
maskExpressionArray: string[];
previousValue: string;
currentValue: string;
/**
* Whether we are currently in writeValue function, in this case when applying the mask we don't want to trigger onChange function,
* since writeValue should be a one way only process of writing the DOM value based on the Angular model value.
*/
writingValue: boolean;
isInitialized: boolean;
private _emitValue;
private _start;
private _end;
onChange: (_: any) => void;
readonly _elementRef: ElementRef<any> | null;
private readonly document;
protected _config: NgxMaskConfig;
private readonly _renderer;
/**
* Applies the mask to the input value.
* @param inputValue The input value to be masked.
* @param maskExpression The mask expression to apply.
* @param position The position in the input value.
* @param justPasted Whether the value was just pasted.
* @param backspaced Whether the value was backspaced.
* @param cb Callback function.
* @returns The masked value.
*/
applyMask(inputValue: string, maskExpression: string, position?: number, justPasted?: boolean, backspaced?: boolean, cb?: (...args: any[]) => any): string;
private _numberSkipedSymbols;
applyValueChanges(position: number, justPasted: boolean, backspaced: boolean, cb?: (...args: any[]) => any): void;
hideInput(inputValue: string, maskExpression: string): string;
getActualValue(res: string): string;
shiftTypedSymbols(inputValue: string): string;
/**
* Convert number value to string
* 3.1415 -> '3.1415'
* 1e-7 -> '0.0000001'
*/
numberToString(value: number | string): string;
showMaskInInput(inputVal?: string): string;
clearIfNotMatchFn(): void;
set formElementProperty([name, value]: [string, string | boolean]);
checkDropSpecialCharAmount(mask: string): number;
removeMask(inputValue: string): string;
private _checkForIp;
private _checkForCpfCnpj;
/**
* Recursively determine the current active element by navigating the Shadow DOM until the Active Element is found.
*/
private _getActiveElement;
/**
* Propogates the input value back to the Angular model by triggering the onChange function. It won't do this if writingValue
* is true. If that is true it means we are currently in the writeValue function, which is supposed to only update the actual
* DOM element based on the Angular model value. It should be a one way process, i.e. writeValue should not be modifying the Angular
* model value too. Therefore, we don't trigger onChange in this scenario.
* @param inputValue the current form input value
*/
private formControlResult;
private _toNumber;
private _removeMask;
private _removePrefix;
private _removeSuffix;
private _retrieveSeparatorValue;
private _regExpForRemove;
private _replaceDecimalMarkerToDot;
_checkSymbols(result: string): string | number | undefined | null;
private _checkPatternForSpace;
private _retrieveSeparatorPrecision;
_checkPrecision(separatorExpression: string, separatorValue: string): number | string;
_repeatPatternSymbols(maskExp: string): string;
currentLocaleDecimalMarker(): string;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxMaskService, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<NgxMaskService>;
}
declare class NgxMaskDirective implements ControlValueAccessor, OnChanges, Validator {
mask: _angular_core.InputSignal<string | null | undefined>;
specialCharacters: _angular_core.InputSignal<string[] | readonly string[]>;
patterns: _angular_core.InputSignal<Record<string, {
pattern: RegExp;
optional?: boolean;
symbol?: string;
}>>;
prefix: _angular_core.InputSignal<string>;
suffix: _angular_core.InputSignal<string>;
thousandSeparator: _angular_core.InputSignal<string>;
decimalMarker: _angular_core.InputSignal<"." | "," | [".", ","]>;
dropSpecialCharacters: _angular_core.InputSignal<boolean | string[] | readonly string[] | null>;
hiddenInput: _angular_core.InputSignal<boolean | null>;
showMaskTyped: _angular_core.InputSignal<boolean | null>;
placeHolderCharacter: _angular_core.InputSignal<string | null>;
shownMaskExpression: _angular_core.InputSignal<string | null>;
clearIfNotMatch: _angular_core.InputSignal<boolean | null>;
validation: _angular_core.InputSignal<boolean | null>;
separatorLimit: _angular_core.InputSignal<string | null>;
allowNegativeNumbers: _angular_core.InputSignal<boolean | null>;
leadZeroDateTime: _angular_core.InputSignal<boolean | null>;
leadZero: _angular_core.InputSignal<boolean | null>;
triggerOnMaskChange: _angular_core.InputSignal<boolean | null>;
apm: _angular_core.InputSignal<boolean | null>;
inputTransformFn: _angular_core.InputSignal<ngx_mask.InputTransformFn | null>;
outputTransformFn: _angular_core.InputSignal<ngx_mask.OutputTransformFn | null>;
keepCharacterPositions: _angular_core.InputSignal<boolean | null>;
instantPrefix: _angular_core.InputSignal<boolean | null>;
maskFilled: _angular_core.OutputEmitterRef<void>;
private _maskValue;
private _inputValue;
private _position;
private _code;
private _maskExpressionArray;
private _justPasted;
private _isFocused;
/**For IME composition event */
private _isComposing;
_maskService: NgxMaskService;
private readonly document;
protected _config: NgxMaskConfig;
onChange: (_: any) => void;
onTouch: () => void;
ngOnChanges(changes: SimpleChanges): void;
validate({ value }: FormControl): ValidationErrors | null;
onPaste(): void;
onFocus(): void;
onModelChange(value: string | undefined | null | number): void;
onInput(e: CustomKeyboardEvent): void;
onCompositionStart(): void;
onCompositionEnd(e: CustomKeyboardEvent): void;
onBlur(e: CustomKeyboardEvent): void;
onClick(e: MouseEvent | CustomKeyboardEvent): void;
onKeyDown(e: CustomKeyboardEvent): void;
/** It writes the value in the input */
writeValue(controlValue: unknown): Promise<void>;
registerOnChange(fn: typeof this.onChange): void;
registerOnTouched(fn: typeof this.onTouch): void;
private _getActiveElement;
checkSelectionOnDeletion(el: HTMLInputElement): void;
/** It disables the input element */
setDisabledState(isDisabled: boolean): void;
private _applyMask;
private _validateTime;
private _getActualInputLength;
private _createValidationError;
private _setMask;
private _areAllCharactersInEachStringSame;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxMaskDirective, never>;
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgxMaskDirective, "input[mask], textarea[mask]", ["mask", "ngxMask"], { "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "specialCharacters": { "alias": "specialCharacters"; "required": false; "isSignal": true; }; "patterns": { "alias": "patterns"; "required": false; "isSignal": true; }; "prefix": { "alias": "prefix"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "thousandSeparator": { "alias": "thousandSeparator"; "required": false; "isSignal": true; }; "decimalMarker": { "alias": "decimalMarker"; "required": false; "isSignal": true; }; "dropSpecialCharacters": { "alias": "dropSpecialCharacters"; "required": false; "isSignal": true; }; "hiddenInput": { "alias": "hiddenInput"; "required": false; "isSignal": true; }; "showMaskTyped": { "alias": "showMaskTyped"; "required": false; "isSignal": true; }; "placeHolderCharacter": { "alias": "placeHolderCharacter"; "required": false; "isSignal": true; }; "shownMaskExpression": { "alias": "shownMaskExpression"; "required": false; "isSignal": true; }; "clearIfNotMatch": { "alias": "clearIfNotMatch"; "required": false; "isSignal": true; }; "validation": { "alias": "validation"; "required": false; "isSignal": true; }; "separatorLimit": { "alias": "separatorLimit"; "required": false; "isSignal": true; }; "allowNegativeNumbers": { "alias": "allowNegativeNumbers"; "required": false; "isSignal": true; }; "leadZeroDateTime": { "alias": "leadZeroDateTime"; "required": false; "isSignal": true; }; "leadZero": { "alias": "leadZero"; "required": false; "isSignal": true; }; "triggerOnMaskChange": { "alias": "triggerOnMaskChange"; "required": false; "isSignal": true; }; "apm": { "alias": "apm"; "required": false; "isSignal": true; }; "inputTransformFn": { "alias": "inputTransformFn"; "required": false; "isSignal": true; }; "outputTransformFn": { "alias": "outputTransformFn"; "required": false; "isSignal": true; }; "keepCharacterPositions": { "alias": "keepCharacterPositions"; "required": false; "isSignal": true; }; "instantPrefix": { "alias": "instantPrefix"; "required": false; "isSignal": true; }; }, { "maskFilled": "maskFilled"; }, never, never, true, never>;
}
declare class NgxMaskPipe implements PipeTransform {
private readonly defaultOptions;
private readonly _maskService;
private _maskExpressionArray;
private mask;
transform(value: string | number, mask: string, { patterns, ...config }?: Partial<NgxMaskConfig>): string;
private _setMask;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgxMaskPipe, never>;
static ɵpipe: _angular_core.ɵɵPipeDeclaration<NgxMaskPipe, "mask", true>;
}
export { INITIAL_CONFIG, NEW_CONFIG, NGX_MASK_CONFIG, NgxMaskDirective, NgxMaskPipe, NgxMaskService, initialConfig, provideEnvironmentNgxMask, provideNgxMask, timeMasks, withoutValidation };
export type { InputTransformFn, NgxMaskConfig, NgxMaskOptions, OutputTransformFn };