ngx-mask 18.0.3 → 19.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/ngx-mask.mjs +486 -536
- package/fesm2022/ngx-mask.mjs.map +1 -1
- package/lib/ngx-mask.config.d.ts +1 -1
- package/lib/ngx-mask.directive.d.ts +0 -3
- package/lib/ngx-mask.service.d.ts +0 -19
- package/package.json +1 -3
- package/esm2022/index.mjs +0 -6
- package/esm2022/lib/custom-keyboard-event.mjs +0 -17
- package/esm2022/lib/ngx-mask-applier.service.mjs +0 -758
- package/esm2022/lib/ngx-mask-expression.enum.mjs +0 -2
- package/esm2022/lib/ngx-mask.config.mjs +0 -89
- package/esm2022/lib/ngx-mask.directive.mjs +0 -968
- package/esm2022/lib/ngx-mask.pipe.mjs +0 -102
- package/esm2022/lib/ngx-mask.providers.mjs +0 -34
- package/esm2022/lib/ngx-mask.service.mjs +0 -607
- package/esm2022/ngx-mask.mjs +0 -5
package/fesm2022/ngx-mask.mjs
CHANGED
|
@@ -3,6 +3,51 @@ import { InjectionToken, EventEmitter, inject, Injectable, ElementRef, Renderer2
|
|
|
3
3
|
import { DOCUMENT } from '@angular/common';
|
|
4
4
|
import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
|
|
5
5
|
|
|
6
|
+
var MaskExpression;
|
|
7
|
+
(function (MaskExpression) {
|
|
8
|
+
MaskExpression["SEPARATOR"] = "separator";
|
|
9
|
+
MaskExpression["PERCENT"] = "percent";
|
|
10
|
+
MaskExpression["IP"] = "IP";
|
|
11
|
+
MaskExpression["CPF_CNPJ"] = "CPF_CNPJ";
|
|
12
|
+
MaskExpression["MONTH"] = "M";
|
|
13
|
+
MaskExpression["MONTHS"] = "M0";
|
|
14
|
+
MaskExpression["MINUTE"] = "m";
|
|
15
|
+
MaskExpression["HOUR"] = "h";
|
|
16
|
+
MaskExpression["HOURS"] = "H";
|
|
17
|
+
MaskExpression["MINUTES"] = "m0";
|
|
18
|
+
MaskExpression["HOURS_HOUR"] = "Hh";
|
|
19
|
+
MaskExpression["SECONDS"] = "s0";
|
|
20
|
+
MaskExpression["HOURS_MINUTES_SECONDS"] = "Hh:m0:s0";
|
|
21
|
+
MaskExpression["EMAIL_MASK"] = "A*@A*.A*";
|
|
22
|
+
MaskExpression["HOURS_MINUTES"] = "Hh:m0";
|
|
23
|
+
MaskExpression["MINUTES_SECONDS"] = "m0:s0";
|
|
24
|
+
MaskExpression["DAYS_MONTHS_YEARS"] = "d0/M0/0000";
|
|
25
|
+
MaskExpression["DAYS_MONTHS"] = "d0/M0";
|
|
26
|
+
MaskExpression["DAYS"] = "d0";
|
|
27
|
+
MaskExpression["DAY"] = "d";
|
|
28
|
+
MaskExpression["SECOND"] = "s";
|
|
29
|
+
MaskExpression["LETTER_S"] = "S";
|
|
30
|
+
MaskExpression["DOT"] = ".";
|
|
31
|
+
MaskExpression["COMMA"] = ",";
|
|
32
|
+
MaskExpression["CURLY_BRACKETS_LEFT"] = "{";
|
|
33
|
+
MaskExpression["CURLY_BRACKETS_RIGHT"] = "}";
|
|
34
|
+
MaskExpression["MINUS"] = "-";
|
|
35
|
+
MaskExpression["OR"] = "||";
|
|
36
|
+
MaskExpression["HASH"] = "#";
|
|
37
|
+
MaskExpression["EMPTY_STRING"] = "";
|
|
38
|
+
MaskExpression["SYMBOL_STAR"] = "*";
|
|
39
|
+
MaskExpression["SYMBOL_QUESTION"] = "?";
|
|
40
|
+
MaskExpression["SLASH"] = "/";
|
|
41
|
+
MaskExpression["WHITE_SPACE"] = " ";
|
|
42
|
+
MaskExpression["NUMBER_ZERO"] = "0";
|
|
43
|
+
MaskExpression["NUMBER_NINE"] = "9";
|
|
44
|
+
MaskExpression["BACKSPACE"] = "Backspace";
|
|
45
|
+
MaskExpression["DELETE"] = "Delete";
|
|
46
|
+
MaskExpression["ARROW_LEFT"] = "ArrowLeft";
|
|
47
|
+
MaskExpression["ARROW_UP"] = "ArrowUp";
|
|
48
|
+
MaskExpression["DOUBLE_ZERO"] = "00";
|
|
49
|
+
})(MaskExpression || (MaskExpression = {}));
|
|
50
|
+
|
|
6
51
|
const NGX_MASK_CONFIG = new InjectionToken('ngx-mask config');
|
|
7
52
|
const NEW_CONFIG = new InjectionToken('new ngx-mask config');
|
|
8
53
|
const INITIAL_CONFIG = new InjectionToken('initial ngx-mask config');
|
|
@@ -16,7 +61,7 @@ const initialConfig = {
|
|
|
16
61
|
showMaskTyped: false,
|
|
17
62
|
placeHolderCharacter: '_',
|
|
18
63
|
dropSpecialCharacters: true,
|
|
19
|
-
hiddenInput:
|
|
64
|
+
hiddenInput: null,
|
|
20
65
|
shownMaskExpression: '',
|
|
21
66
|
separatorLimit: '',
|
|
22
67
|
allowNegativeNumbers: false,
|
|
@@ -75,147 +120,63 @@ const initialConfig = {
|
|
|
75
120
|
},
|
|
76
121
|
};
|
|
77
122
|
const timeMasks = [
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
123
|
+
MaskExpression.HOURS_MINUTES_SECONDS,
|
|
124
|
+
MaskExpression.HOURS_MINUTES,
|
|
125
|
+
MaskExpression.MINUTES_SECONDS,
|
|
81
126
|
];
|
|
82
127
|
const withoutValidation = [
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
128
|
+
MaskExpression.PERCENT,
|
|
129
|
+
MaskExpression.HOURS_HOUR,
|
|
130
|
+
MaskExpression.SECONDS,
|
|
131
|
+
MaskExpression.MINUTES,
|
|
132
|
+
MaskExpression.SEPARATOR,
|
|
133
|
+
MaskExpression.DAYS_MONTHS_YEARS,
|
|
134
|
+
MaskExpression.DAYS_MONTHS,
|
|
135
|
+
MaskExpression.DAYS,
|
|
136
|
+
MaskExpression.MONTHS,
|
|
92
137
|
];
|
|
93
138
|
|
|
94
139
|
class NgxMaskApplierService {
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
if (Array.isArray(decimalChars)) {
|
|
128
|
-
const regExp = new RegExp(decimalChars.map((v) => ('[\\^$.|?*+()'.indexOf(v) >= 0 ? `\\${v}` : v)).join('|'));
|
|
129
|
-
x = str.split(regExp);
|
|
130
|
-
decimalChar = str.match(regExp)?.[0] ?? "" /* MaskExpression.EMPTY_STRING */;
|
|
131
|
-
}
|
|
132
|
-
else {
|
|
133
|
-
x = str.split(decimalChars);
|
|
134
|
-
decimalChar = decimalChars;
|
|
135
|
-
}
|
|
136
|
-
const decimals = x.length > 1 ? `${decimalChar}${x[1]}` : "" /* MaskExpression.EMPTY_STRING */;
|
|
137
|
-
let res = x[0] ?? "" /* MaskExpression.EMPTY_STRING */;
|
|
138
|
-
const separatorLimit = this.separatorLimit.replace(/\s/g, "" /* MaskExpression.EMPTY_STRING */);
|
|
139
|
-
if (separatorLimit && +separatorLimit) {
|
|
140
|
-
if (res[0] === "-" /* MaskExpression.MINUS */) {
|
|
141
|
-
res = `-${res.slice(1, res.length).slice(0, separatorLimit.length)}`;
|
|
142
|
-
}
|
|
143
|
-
else {
|
|
144
|
-
res = res.slice(0, separatorLimit.length);
|
|
145
|
-
}
|
|
146
|
-
}
|
|
147
|
-
const rgx = /(\d+)(\d{3})/;
|
|
148
|
-
while (thousandSeparatorChar && rgx.test(res)) {
|
|
149
|
-
res = res.replace(rgx, '$1' + thousandSeparatorChar + '$2');
|
|
150
|
-
}
|
|
151
|
-
if (typeof precision === 'undefined') {
|
|
152
|
-
return res + decimals;
|
|
153
|
-
}
|
|
154
|
-
else if (precision === 0) {
|
|
155
|
-
return res;
|
|
156
|
-
}
|
|
157
|
-
return res + decimals.substring(0, precision + 1);
|
|
158
|
-
};
|
|
159
|
-
this.percentage = (str) => {
|
|
160
|
-
const sanitizedStr = str.replace(',', '.');
|
|
161
|
-
const value = Number(this.allowNegativeNumbers && str.includes("-" /* MaskExpression.MINUS */)
|
|
162
|
-
? sanitizedStr.slice(1, str.length)
|
|
163
|
-
: sanitizedStr);
|
|
164
|
-
return !isNaN(value) && value >= 0 && value <= 100;
|
|
165
|
-
};
|
|
166
|
-
this.getPrecision = (maskExpression) => {
|
|
167
|
-
const x = maskExpression.split("." /* MaskExpression.DOT */);
|
|
168
|
-
if (x.length > 1) {
|
|
169
|
-
return Number(x[x.length - 1]);
|
|
170
|
-
}
|
|
171
|
-
return Infinity;
|
|
172
|
-
};
|
|
173
|
-
this.checkAndRemoveSuffix = (inputValue) => {
|
|
174
|
-
for (let i = this.suffix?.length - 1; i >= 0; i--) {
|
|
175
|
-
const substr = this.suffix.substring(i, this.suffix?.length);
|
|
176
|
-
if (inputValue.includes(substr) &&
|
|
177
|
-
i !== this.suffix?.length - 1 &&
|
|
178
|
-
(i - 1 < 0 ||
|
|
179
|
-
!inputValue.includes(this.suffix.substring(i - 1, this.suffix?.length)))) {
|
|
180
|
-
return inputValue.replace(substr, "" /* MaskExpression.EMPTY_STRING */);
|
|
181
|
-
}
|
|
182
|
-
}
|
|
183
|
-
return inputValue;
|
|
184
|
-
};
|
|
185
|
-
this.checkInputPrecision = (inputValue, precision, decimalMarker) => {
|
|
186
|
-
let processedInputValue = inputValue;
|
|
187
|
-
let processedDecimalMarker = decimalMarker;
|
|
188
|
-
if (precision < Infinity) {
|
|
189
|
-
// TODO need think about decimalMarker
|
|
190
|
-
if (Array.isArray(processedDecimalMarker)) {
|
|
191
|
-
const marker = processedDecimalMarker.find((dm) => dm !== this.thousandSeparator);
|
|
192
|
-
processedDecimalMarker = marker ? marker : processedDecimalMarker[0];
|
|
193
|
-
}
|
|
194
|
-
const precisionRegEx = new RegExp(this._charToRegExpExpression(processedDecimalMarker) + `\\d{${precision}}.*$`);
|
|
195
|
-
const precisionMatch = processedInputValue.match(precisionRegEx);
|
|
196
|
-
const precisionMatchLength = (precisionMatch && precisionMatch[0]?.length) ?? 0;
|
|
197
|
-
if (precisionMatchLength - 1 > precision) {
|
|
198
|
-
const diff = precisionMatchLength - 1 - precision;
|
|
199
|
-
processedInputValue = processedInputValue.substring(0, processedInputValue.length - diff);
|
|
200
|
-
}
|
|
201
|
-
if (precision === 0 &&
|
|
202
|
-
this._compareOrIncludes(processedInputValue[processedInputValue.length - 1], processedDecimalMarker, this.thousandSeparator)) {
|
|
203
|
-
processedInputValue = processedInputValue.substring(0, processedInputValue.length - 1);
|
|
204
|
-
}
|
|
205
|
-
}
|
|
206
|
-
return processedInputValue;
|
|
207
|
-
};
|
|
208
|
-
}
|
|
140
|
+
_config = inject(NGX_MASK_CONFIG);
|
|
141
|
+
dropSpecialCharacters = this._config.dropSpecialCharacters;
|
|
142
|
+
hiddenInput = this._config.hiddenInput;
|
|
143
|
+
showTemplate;
|
|
144
|
+
clearIfNotMatch = this._config.clearIfNotMatch;
|
|
145
|
+
specialCharacters = this._config.specialCharacters;
|
|
146
|
+
patterns = this._config.patterns;
|
|
147
|
+
prefix = this._config.prefix;
|
|
148
|
+
suffix = this._config.suffix;
|
|
149
|
+
thousandSeparator = this._config.thousandSeparator;
|
|
150
|
+
decimalMarker = this._config.decimalMarker;
|
|
151
|
+
customPattern;
|
|
152
|
+
showMaskTyped = this._config.showMaskTyped;
|
|
153
|
+
placeHolderCharacter = this._config.placeHolderCharacter;
|
|
154
|
+
validation = this._config.validation;
|
|
155
|
+
separatorLimit = this._config.separatorLimit;
|
|
156
|
+
allowNegativeNumbers = this._config.allowNegativeNumbers;
|
|
157
|
+
leadZeroDateTime = this._config.leadZeroDateTime;
|
|
158
|
+
leadZero = this._config.leadZero;
|
|
159
|
+
apm = this._config.apm;
|
|
160
|
+
inputTransformFn = this._config.inputTransformFn;
|
|
161
|
+
outputTransformFn = this._config.outputTransformFn;
|
|
162
|
+
keepCharacterPositions = this._config.keepCharacterPositions;
|
|
163
|
+
_shift = new Set();
|
|
164
|
+
plusOnePosition = false;
|
|
165
|
+
maskExpression = '';
|
|
166
|
+
actualValue = '';
|
|
167
|
+
showKeepCharacterExp = '';
|
|
168
|
+
shownMaskExpression = '';
|
|
169
|
+
deletedSpecialCharacter = false;
|
|
170
|
+
ipError;
|
|
171
|
+
cpfCnpjError;
|
|
209
172
|
applyMaskWithPattern(inputValue, maskAndPattern) {
|
|
210
173
|
const [mask, customPattern] = maskAndPattern;
|
|
211
174
|
this.customPattern = customPattern;
|
|
212
175
|
return this.applyMask(inputValue, mask);
|
|
213
176
|
}
|
|
214
|
-
applyMask(inputValue, maskExpression, position = 0, justPasted = false, backspaced = false,
|
|
215
|
-
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
216
|
-
cb = () => { }) {
|
|
177
|
+
applyMask(inputValue, maskExpression, position = 0, justPasted = false, backspaced = false, cb = () => { }) {
|
|
217
178
|
if (!maskExpression || typeof inputValue !== 'string') {
|
|
218
|
-
return
|
|
179
|
+
return MaskExpression.EMPTY_STRING;
|
|
219
180
|
}
|
|
220
181
|
let cursor = 0;
|
|
221
182
|
let result = '';
|
|
@@ -234,59 +195,53 @@ class NgxMaskApplierService {
|
|
|
234
195
|
if (processedValue === '(' && this.prefix) {
|
|
235
196
|
processedValue = '';
|
|
236
197
|
}
|
|
237
|
-
const inputArray = processedValue.toString().split(
|
|
198
|
+
const inputArray = processedValue.toString().split(MaskExpression.EMPTY_STRING);
|
|
238
199
|
if (this.allowNegativeNumbers &&
|
|
239
|
-
processedValue.slice(cursor, cursor + 1) ===
|
|
200
|
+
processedValue.slice(cursor, cursor + 1) === MaskExpression.MINUS) {
|
|
240
201
|
result += processedValue.slice(cursor, cursor + 1);
|
|
241
202
|
}
|
|
242
|
-
if (maskExpression ===
|
|
243
|
-
const valuesIP = processedValue.split(
|
|
203
|
+
if (maskExpression === MaskExpression.IP) {
|
|
204
|
+
const valuesIP = processedValue.split(MaskExpression.DOT);
|
|
244
205
|
this.ipError = this._validIP(valuesIP);
|
|
245
|
-
// eslint-disable-next-line no-param-reassign
|
|
246
206
|
maskExpression = '099.099.099.099';
|
|
247
207
|
}
|
|
248
208
|
const arr = [];
|
|
249
|
-
// eslint-disable-next-line @typescript-eslint/prefer-for-of
|
|
250
209
|
for (let i = 0; i < processedValue.length; i++) {
|
|
251
210
|
if (processedValue[i]?.match('\\d')) {
|
|
252
|
-
arr.push(processedValue[i] ??
|
|
211
|
+
arr.push(processedValue[i] ?? MaskExpression.EMPTY_STRING);
|
|
253
212
|
}
|
|
254
213
|
}
|
|
255
|
-
if (maskExpression ===
|
|
214
|
+
if (maskExpression === MaskExpression.CPF_CNPJ) {
|
|
256
215
|
this.cpfCnpjError = arr.length !== 11 && arr.length !== 14;
|
|
257
216
|
if (arr.length > 11) {
|
|
258
|
-
// eslint-disable-next-line no-param-reassign
|
|
259
217
|
maskExpression = '00.000.000/0000-00';
|
|
260
218
|
}
|
|
261
219
|
else {
|
|
262
|
-
// eslint-disable-next-line no-param-reassign
|
|
263
220
|
maskExpression = '000.000.000-00';
|
|
264
221
|
}
|
|
265
222
|
}
|
|
266
|
-
if (maskExpression.startsWith(
|
|
223
|
+
if (maskExpression.startsWith(MaskExpression.PERCENT)) {
|
|
267
224
|
if (processedValue.match('[a-z]|[A-Z]') ||
|
|
268
|
-
// eslint-disable-next-line no-useless-escape
|
|
269
225
|
(processedValue.match(/[-!$%^&*()_+|~=`{}\[\]:";'<>?,\/.]/) && !backspaced)) {
|
|
270
226
|
processedValue = this._stripToDecimal(processedValue);
|
|
271
227
|
const precision = this.getPrecision(maskExpression);
|
|
272
228
|
processedValue = this.checkInputPrecision(processedValue, precision, this.decimalMarker);
|
|
273
229
|
}
|
|
274
|
-
const decimalMarker = typeof this.decimalMarker === 'string' ? this.decimalMarker :
|
|
230
|
+
const decimalMarker = typeof this.decimalMarker === 'string' ? this.decimalMarker : MaskExpression.DOT;
|
|
275
231
|
if (processedValue.indexOf(decimalMarker) > 0 &&
|
|
276
232
|
!this.percentage(processedValue.substring(0, processedValue.indexOf(decimalMarker)))) {
|
|
277
233
|
let base = processedValue.substring(0, processedValue.indexOf(decimalMarker) - 1);
|
|
278
234
|
if (this.allowNegativeNumbers &&
|
|
279
|
-
processedValue.slice(cursor, cursor + 1) ===
|
|
235
|
+
processedValue.slice(cursor, cursor + 1) === MaskExpression.MINUS &&
|
|
280
236
|
!backspaced) {
|
|
281
237
|
base = processedValue.substring(0, processedValue.indexOf(decimalMarker));
|
|
282
238
|
}
|
|
283
239
|
processedValue = `${base}${processedValue.substring(processedValue.indexOf(decimalMarker), processedValue.length)}`;
|
|
284
240
|
}
|
|
285
241
|
let value = '';
|
|
286
|
-
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
|
|
287
242
|
this.allowNegativeNumbers &&
|
|
288
|
-
processedValue.slice(cursor, cursor + 1) ===
|
|
289
|
-
? (value = `${
|
|
243
|
+
processedValue.slice(cursor, cursor + 1) === MaskExpression.MINUS
|
|
244
|
+
? (value = `${MaskExpression.MINUS}${processedValue.slice(cursor + 1, cursor + processedValue.length)}`)
|
|
290
245
|
: (value = processedValue);
|
|
291
246
|
if (this.percentage(value)) {
|
|
292
247
|
result = this._splitPercentZero(processedValue);
|
|
@@ -295,7 +250,7 @@ class NgxMaskApplierService {
|
|
|
295
250
|
result = this._splitPercentZero(processedValue.substring(0, processedValue.length - 1));
|
|
296
251
|
}
|
|
297
252
|
}
|
|
298
|
-
else if (maskExpression.startsWith(
|
|
253
|
+
else if (maskExpression.startsWith(MaskExpression.SEPARATOR)) {
|
|
299
254
|
if (processedValue.match('[wа-яА-Я]') ||
|
|
300
255
|
processedValue.match('[ЁёА-я]') ||
|
|
301
256
|
processedValue.match('[a-z]|[A-Z]') ||
|
|
@@ -305,42 +260,42 @@ class NgxMaskApplierService {
|
|
|
305
260
|
}
|
|
306
261
|
const precision = this.getPrecision(maskExpression);
|
|
307
262
|
const decimalMarker = Array.isArray(this.decimalMarker)
|
|
308
|
-
? this.thousandSeparator ===
|
|
309
|
-
?
|
|
310
|
-
:
|
|
263
|
+
? this.thousandSeparator === MaskExpression.DOT
|
|
264
|
+
? MaskExpression.COMMA
|
|
265
|
+
: MaskExpression.DOT
|
|
311
266
|
: this.decimalMarker;
|
|
312
267
|
if (precision === 0) {
|
|
313
268
|
processedValue = this.allowNegativeNumbers
|
|
314
269
|
? processedValue.length > 2 &&
|
|
315
|
-
processedValue[0] ===
|
|
316
|
-
processedValue[1] ===
|
|
270
|
+
processedValue[0] === MaskExpression.MINUS &&
|
|
271
|
+
processedValue[1] === MaskExpression.NUMBER_ZERO &&
|
|
317
272
|
processedValue[2] !== this.thousandSeparator &&
|
|
318
|
-
processedValue[2] !==
|
|
319
|
-
processedValue[2] !==
|
|
273
|
+
processedValue[2] !== MaskExpression.COMMA &&
|
|
274
|
+
processedValue[2] !== MaskExpression.DOT
|
|
320
275
|
? '-' + processedValue.slice(2, processedValue.length)
|
|
321
|
-
: processedValue[0] ===
|
|
276
|
+
: processedValue[0] === MaskExpression.NUMBER_ZERO &&
|
|
322
277
|
processedValue.length > 1 &&
|
|
323
278
|
processedValue[1] !== this.thousandSeparator &&
|
|
324
|
-
processedValue[1] !==
|
|
325
|
-
processedValue[1] !==
|
|
279
|
+
processedValue[1] !== MaskExpression.COMMA &&
|
|
280
|
+
processedValue[1] !== MaskExpression.DOT
|
|
326
281
|
? processedValue.slice(1, processedValue.length)
|
|
327
282
|
: processedValue
|
|
328
283
|
: processedValue.length > 1 &&
|
|
329
|
-
processedValue[0] ===
|
|
284
|
+
processedValue[0] === MaskExpression.NUMBER_ZERO &&
|
|
330
285
|
processedValue[1] !== this.thousandSeparator &&
|
|
331
|
-
processedValue[1] !==
|
|
332
|
-
processedValue[1] !==
|
|
286
|
+
processedValue[1] !== MaskExpression.COMMA &&
|
|
287
|
+
processedValue[1] !== MaskExpression.DOT
|
|
333
288
|
? processedValue.slice(1, processedValue.length)
|
|
334
289
|
: processedValue;
|
|
335
290
|
}
|
|
336
291
|
else {
|
|
337
292
|
if (processedValue[0] === decimalMarker && processedValue.length > 1) {
|
|
338
293
|
processedValue =
|
|
339
|
-
|
|
294
|
+
MaskExpression.NUMBER_ZERO +
|
|
340
295
|
processedValue.slice(0, processedValue.length + 1);
|
|
341
296
|
this.plusOnePosition = true;
|
|
342
297
|
}
|
|
343
|
-
if (processedValue[0] ===
|
|
298
|
+
if (processedValue[0] === MaskExpression.NUMBER_ZERO &&
|
|
344
299
|
processedValue[1] !== decimalMarker &&
|
|
345
300
|
processedValue[1] !== this.thousandSeparator) {
|
|
346
301
|
processedValue =
|
|
@@ -352,15 +307,15 @@ class NgxMaskApplierService {
|
|
|
352
307
|
this.plusOnePosition = true;
|
|
353
308
|
}
|
|
354
309
|
if (this.allowNegativeNumbers &&
|
|
355
|
-
processedValue[0] ===
|
|
310
|
+
processedValue[0] === MaskExpression.MINUS &&
|
|
356
311
|
(processedValue[1] === decimalMarker ||
|
|
357
|
-
processedValue[1] ===
|
|
312
|
+
processedValue[1] === MaskExpression.NUMBER_ZERO)) {
|
|
358
313
|
processedValue =
|
|
359
314
|
processedValue[1] === decimalMarker && processedValue.length > 2
|
|
360
315
|
? processedValue.slice(0, 1) +
|
|
361
|
-
|
|
316
|
+
MaskExpression.NUMBER_ZERO +
|
|
362
317
|
processedValue.slice(1, processedValue.length)
|
|
363
|
-
: processedValue[1] ===
|
|
318
|
+
: processedValue[1] === MaskExpression.NUMBER_ZERO &&
|
|
364
319
|
processedValue.length > 2 &&
|
|
365
320
|
processedValue[2] !== decimalMarker
|
|
366
321
|
? processedValue.slice(0, 2) +
|
|
@@ -372,13 +327,13 @@ class NgxMaskApplierService {
|
|
|
372
327
|
}
|
|
373
328
|
if (backspaced) {
|
|
374
329
|
const inputValueAfterZero = processedValue.slice(this._findFirstNonZeroDigitIndex(processedValue), processedValue.length);
|
|
375
|
-
const positionOfZeroOrDecimalMarker = processedValue[processedPosition] ===
|
|
330
|
+
const positionOfZeroOrDecimalMarker = processedValue[processedPosition] === MaskExpression.NUMBER_ZERO ||
|
|
376
331
|
processedValue[processedPosition] === decimalMarker;
|
|
377
|
-
const zeroIndexNumberZero = processedValue[0] ===
|
|
378
|
-
const zeroIndexMinus = processedValue[0] ===
|
|
332
|
+
const zeroIndexNumberZero = processedValue[0] === MaskExpression.NUMBER_ZERO;
|
|
333
|
+
const zeroIndexMinus = processedValue[0] === MaskExpression.MINUS;
|
|
379
334
|
const zeroIndexThousand = processedValue[0] === this.thousandSeparator;
|
|
380
335
|
const firstIndexDecimalMarker = processedValue[1] === decimalMarker;
|
|
381
|
-
const firstIndexNumberZero = processedValue[1] ===
|
|
336
|
+
const firstIndexNumberZero = processedValue[1] === MaskExpression.NUMBER_ZERO;
|
|
382
337
|
const secondIndexDecimalMarker = processedValue[2] === decimalMarker;
|
|
383
338
|
if (zeroIndexNumberZero &&
|
|
384
339
|
firstIndexDecimalMarker &&
|
|
@@ -391,27 +346,24 @@ class NgxMaskApplierService {
|
|
|
391
346
|
secondIndexDecimalMarker &&
|
|
392
347
|
positionOfZeroOrDecimalMarker &&
|
|
393
348
|
processedPosition < 3) {
|
|
394
|
-
processedValue =
|
|
349
|
+
processedValue = MaskExpression.MINUS + inputValueAfterZero;
|
|
395
350
|
}
|
|
396
|
-
if (inputValueAfterZero !==
|
|
351
|
+
if (inputValueAfterZero !== MaskExpression.MINUS &&
|
|
397
352
|
((processedPosition === 0 && (zeroIndexNumberZero || zeroIndexThousand)) ||
|
|
398
353
|
(this.allowNegativeNumbers &&
|
|
399
354
|
processedPosition === 1 &&
|
|
400
355
|
zeroIndexMinus &&
|
|
401
356
|
!firstIndexNumberZero))) {
|
|
402
357
|
processedValue = zeroIndexMinus
|
|
403
|
-
?
|
|
358
|
+
? MaskExpression.MINUS + inputValueAfterZero
|
|
404
359
|
: inputValueAfterZero;
|
|
405
360
|
}
|
|
406
361
|
}
|
|
407
|
-
// TODO: we had different rexexps here for the different cases... but tests dont seam to bother - check this
|
|
408
|
-
// separator: no COMMA, dot-sep: no SPACE, COMMA OK, comma-sep: no SPACE, COMMA OK
|
|
409
362
|
const thousandSeparatorCharEscaped = this._charToRegExpExpression(this.thousandSeparator);
|
|
410
363
|
let invalidChars = '@#!$%^&*()_+|~=`{}\\[\\]:\\s,\\.";<>?\\/'.replace(thousandSeparatorCharEscaped, '');
|
|
411
|
-
//.replace(decimalMarkerEscaped, '');
|
|
412
364
|
if (Array.isArray(this.decimalMarker)) {
|
|
413
365
|
for (const marker of this.decimalMarker) {
|
|
414
|
-
invalidChars = invalidChars.replace(this._charToRegExpExpression(marker),
|
|
366
|
+
invalidChars = invalidChars.replace(this._charToRegExpExpression(marker), MaskExpression.EMPTY_STRING);
|
|
415
367
|
}
|
|
416
368
|
}
|
|
417
369
|
else {
|
|
@@ -424,7 +376,7 @@ class NgxMaskApplierService {
|
|
|
424
376
|
processedValue = this.checkInputPrecision(processedValue, precision, this.decimalMarker);
|
|
425
377
|
const strForSep = processedValue.replace(new RegExp(thousandSeparatorCharEscaped, 'g'), '');
|
|
426
378
|
result = this._formatWithSeparators(strForSep, this.thousandSeparator, this.decimalMarker, precision);
|
|
427
|
-
const commaShift = result.indexOf(
|
|
379
|
+
const commaShift = result.indexOf(MaskExpression.COMMA) - processedValue.indexOf(MaskExpression.COMMA);
|
|
428
380
|
const shiftStep = result.length - processedValue.length;
|
|
429
381
|
const backspacedDecimalMarkerWithSeparatorLimit = backspaced && result.length < inputValue.length && this.separatorLimit;
|
|
430
382
|
if ((result[processedPosition - 1] === this.thousandSeparator ||
|
|
@@ -451,9 +403,9 @@ class NgxMaskApplierService {
|
|
|
451
403
|
}
|
|
452
404
|
else if ((commaShift !== 0 &&
|
|
453
405
|
processedPosition > 0 &&
|
|
454
|
-
!(result.indexOf(
|
|
406
|
+
!(result.indexOf(MaskExpression.COMMA) >= processedPosition &&
|
|
455
407
|
processedPosition > 3)) ||
|
|
456
|
-
(!(result.indexOf(
|
|
408
|
+
(!(result.indexOf(MaskExpression.DOT) >= processedPosition && processedPosition > 3) &&
|
|
457
409
|
shiftStep <= 0)) {
|
|
458
410
|
this._shift.clear();
|
|
459
411
|
backspaceShift = true;
|
|
@@ -466,38 +418,36 @@ class NgxMaskApplierService {
|
|
|
466
418
|
}
|
|
467
419
|
}
|
|
468
420
|
else {
|
|
469
|
-
for (
|
|
470
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
471
|
-
let i = 0, inputSymbol = inputArray[0]; i < inputArray.length; i++, inputSymbol = inputArray[i] ?? "" /* MaskExpression.EMPTY_STRING */) {
|
|
421
|
+
for (let i = 0, inputSymbol = inputArray[0]; i < inputArray.length; i++, inputSymbol = inputArray[i] ?? MaskExpression.EMPTY_STRING) {
|
|
472
422
|
if (cursor === maskExpression.length) {
|
|
473
423
|
break;
|
|
474
424
|
}
|
|
475
|
-
const symbolStarInPattern =
|
|
476
|
-
if (this._checkSymbolMask(inputSymbol, maskExpression[cursor] ??
|
|
477
|
-
maskExpression[cursor + 1] ===
|
|
425
|
+
const symbolStarInPattern = MaskExpression.SYMBOL_STAR in this.patterns;
|
|
426
|
+
if (this._checkSymbolMask(inputSymbol, maskExpression[cursor] ?? MaskExpression.EMPTY_STRING) &&
|
|
427
|
+
maskExpression[cursor + 1] === MaskExpression.SYMBOL_QUESTION) {
|
|
478
428
|
result += inputSymbol;
|
|
479
429
|
cursor += 2;
|
|
480
430
|
}
|
|
481
|
-
else if (maskExpression[cursor + 1] ===
|
|
431
|
+
else if (maskExpression[cursor + 1] === MaskExpression.SYMBOL_STAR &&
|
|
482
432
|
multi &&
|
|
483
|
-
this._checkSymbolMask(inputSymbol, maskExpression[cursor + 2] ??
|
|
433
|
+
this._checkSymbolMask(inputSymbol, maskExpression[cursor + 2] ?? MaskExpression.EMPTY_STRING)) {
|
|
484
434
|
result += inputSymbol;
|
|
485
435
|
cursor += 3;
|
|
486
436
|
multi = false;
|
|
487
437
|
}
|
|
488
|
-
else if (this._checkSymbolMask(inputSymbol, maskExpression[cursor] ??
|
|
489
|
-
maskExpression[cursor + 1] ===
|
|
438
|
+
else if (this._checkSymbolMask(inputSymbol, maskExpression[cursor] ?? MaskExpression.EMPTY_STRING) &&
|
|
439
|
+
maskExpression[cursor + 1] === MaskExpression.SYMBOL_STAR &&
|
|
490
440
|
!symbolStarInPattern) {
|
|
491
441
|
result += inputSymbol;
|
|
492
442
|
multi = true;
|
|
493
443
|
}
|
|
494
|
-
else if (maskExpression[cursor + 1] ===
|
|
495
|
-
this._checkSymbolMask(inputSymbol, maskExpression[cursor + 2] ??
|
|
444
|
+
else if (maskExpression[cursor + 1] === MaskExpression.SYMBOL_QUESTION &&
|
|
445
|
+
this._checkSymbolMask(inputSymbol, maskExpression[cursor + 2] ?? MaskExpression.EMPTY_STRING)) {
|
|
496
446
|
result += inputSymbol;
|
|
497
447
|
cursor += 3;
|
|
498
448
|
}
|
|
499
|
-
else if (this._checkSymbolMask(inputSymbol, maskExpression[cursor] ??
|
|
500
|
-
if (maskExpression[cursor] ===
|
|
449
|
+
else if (this._checkSymbolMask(inputSymbol, maskExpression[cursor] ?? MaskExpression.EMPTY_STRING)) {
|
|
450
|
+
if (maskExpression[cursor] === MaskExpression.HOURS) {
|
|
501
451
|
if (this.apm ? Number(inputSymbol) > 9 : Number(inputSymbol) > 2) {
|
|
502
452
|
processedPosition = !this.leadZeroDateTime
|
|
503
453
|
? processedPosition + 1
|
|
@@ -511,7 +461,7 @@ class NgxMaskApplierService {
|
|
|
511
461
|
continue;
|
|
512
462
|
}
|
|
513
463
|
}
|
|
514
|
-
if (maskExpression[cursor] ===
|
|
464
|
+
if (maskExpression[cursor] === MaskExpression.HOUR) {
|
|
515
465
|
if (this.apm
|
|
516
466
|
? (result.length === 1 && Number(result) > 1) ||
|
|
517
467
|
(result === '1' && Number(inputSymbol) > 2) ||
|
|
@@ -532,8 +482,8 @@ class NgxMaskApplierService {
|
|
|
532
482
|
continue;
|
|
533
483
|
}
|
|
534
484
|
}
|
|
535
|
-
if (maskExpression[cursor] ===
|
|
536
|
-
maskExpression[cursor] ===
|
|
485
|
+
if (maskExpression[cursor] === MaskExpression.MINUTE ||
|
|
486
|
+
maskExpression[cursor] === MaskExpression.SECOND) {
|
|
537
487
|
if (Number(inputSymbol) > 5) {
|
|
538
488
|
processedPosition = !this.leadZeroDateTime
|
|
539
489
|
? processedPosition + 1
|
|
@@ -557,9 +507,9 @@ class NgxMaskApplierService {
|
|
|
557
507
|
const inputValueSliceMinusOnePlusOne = processedValue.slice(cursor - 1, cursor + 1);
|
|
558
508
|
const inputValueSliceCursorPlusTwo = processedValue.slice(cursor, cursor + 2);
|
|
559
509
|
const inputValueSliceMinusTwoCursor = processedValue.slice(cursor - 2, cursor);
|
|
560
|
-
if (maskExpression[cursor] ===
|
|
561
|
-
const maskStartWithMonth = maskExpression.slice(0, 2) ===
|
|
562
|
-
const startWithMonthInput = maskExpression.slice(0, 2) ===
|
|
510
|
+
if (maskExpression[cursor] === MaskExpression.DAY) {
|
|
511
|
+
const maskStartWithMonth = maskExpression.slice(0, 2) === MaskExpression.MONTHS;
|
|
512
|
+
const startWithMonthInput = maskExpression.slice(0, 2) === MaskExpression.MONTHS &&
|
|
563
513
|
this.specialCharacters.includes(inputValueCursorMinusTwo);
|
|
564
514
|
if ((Number(inputSymbol) > 3 && this.leadZeroDateTime) ||
|
|
565
515
|
(!maskStartWithMonth &&
|
|
@@ -586,15 +536,13 @@ class NgxMaskApplierService {
|
|
|
586
536
|
continue;
|
|
587
537
|
}
|
|
588
538
|
}
|
|
589
|
-
if (maskExpression[cursor] ===
|
|
539
|
+
if (maskExpression[cursor] === MaskExpression.MONTH) {
|
|
590
540
|
const monthsCount = 12;
|
|
591
|
-
// mask without day
|
|
592
541
|
const withoutDays = cursor === 0 &&
|
|
593
542
|
(Number(inputSymbol) > 2 ||
|
|
594
543
|
Number(inputValueSliceCursorPlusTwo) > monthsCount ||
|
|
595
544
|
(this.specialCharacters.includes(inputValueCursorPlusOne) &&
|
|
596
545
|
!backspaced));
|
|
597
|
-
// day<10 && month<12 for input
|
|
598
546
|
const specialChart = maskExpression.slice(cursor + 2, cursor + 3);
|
|
599
547
|
const day1monthInput = inputValueSliceMinusThreeMinusOne.includes(specialChart) &&
|
|
600
548
|
maskExpression.includes('d0') &&
|
|
@@ -602,23 +550,19 @@ class NgxMaskApplierService {
|
|
|
602
550
|
Number(inputValueSliceMinusOnePlusOne) > monthsCount &&
|
|
603
551
|
!this.specialCharacters.includes(inputValueCursor)) ||
|
|
604
552
|
this.specialCharacters.includes(inputValueCursor));
|
|
605
|
-
// month<12 && day<10 for input
|
|
606
553
|
const day2monthInput = Number(inputValueSliceMinusThreeMinusOne) <= daysCount &&
|
|
607
554
|
!this.specialCharacters.includes(inputValueSliceMinusThreeMinusOne) &&
|
|
608
555
|
this.specialCharacters.includes(inputValueCursorMinusOne) &&
|
|
609
556
|
(Number(inputValueSliceCursorPlusTwo) > monthsCount ||
|
|
610
557
|
this.specialCharacters.includes(inputValueCursorPlusOne));
|
|
611
|
-
// cursor === 5 && without days
|
|
612
558
|
const day2monthInputDot = (Number(inputValueSliceCursorPlusTwo) > monthsCount && cursor === 5) ||
|
|
613
559
|
(this.specialCharacters.includes(inputValueCursorPlusOne) &&
|
|
614
560
|
cursor === 5);
|
|
615
|
-
// // day<10 && month<12 for paste whole data
|
|
616
561
|
const day1monthPaste = Number(inputValueSliceMinusThreeMinusOne) > daysCount &&
|
|
617
562
|
!this.specialCharacters.includes(inputValueSliceMinusThreeMinusOne) &&
|
|
618
563
|
!this.specialCharacters.includes(inputValueSliceMinusTwoCursor) &&
|
|
619
564
|
Number(inputValueSliceMinusTwoCursor) > monthsCount &&
|
|
620
565
|
maskExpression.includes('d0');
|
|
621
|
-
// 10<day<31 && month<12 for paste whole data
|
|
622
566
|
const day2monthPaste = Number(inputValueSliceMinusThreeMinusOne) <= daysCount &&
|
|
623
567
|
!this.specialCharacters.includes(inputValueSliceMinusThreeMinusOne) &&
|
|
624
568
|
!this.specialCharacters.includes(inputValueCursorMinusOne) &&
|
|
@@ -650,43 +594,43 @@ class NgxMaskApplierService {
|
|
|
650
594
|
result += inputSymbol;
|
|
651
595
|
cursor++;
|
|
652
596
|
}
|
|
653
|
-
else if (this.specialCharacters.indexOf(maskExpression[cursor] ??
|
|
597
|
+
else if (this.specialCharacters.indexOf(maskExpression[cursor] ?? MaskExpression.EMPTY_STRING) !== -1) {
|
|
654
598
|
result += maskExpression[cursor];
|
|
655
599
|
cursor++;
|
|
656
600
|
this._shiftStep(maskExpression, cursor, inputArray.length);
|
|
657
601
|
i--;
|
|
658
602
|
}
|
|
659
|
-
else if (maskExpression[cursor] ===
|
|
603
|
+
else if (maskExpression[cursor] === MaskExpression.NUMBER_NINE &&
|
|
660
604
|
this.showMaskTyped) {
|
|
661
605
|
this._shiftStep(maskExpression, cursor, inputArray.length);
|
|
662
606
|
}
|
|
663
|
-
else if (this.patterns[maskExpression[cursor] ??
|
|
664
|
-
this.patterns[maskExpression[cursor] ??
|
|
607
|
+
else if (this.patterns[maskExpression[cursor] ?? MaskExpression.EMPTY_STRING] &&
|
|
608
|
+
this.patterns[maskExpression[cursor] ?? MaskExpression.EMPTY_STRING]?.optional) {
|
|
665
609
|
if (!!inputArray[cursor] &&
|
|
666
610
|
maskExpression !== '099.099.099.099' &&
|
|
667
611
|
maskExpression !== '000.000.000-00' &&
|
|
668
612
|
maskExpression !== '00.000.000/0000-00' &&
|
|
669
613
|
!maskExpression.match(/^9+\.0+$/) &&
|
|
670
|
-
!this.patterns[maskExpression[cursor] ??
|
|
614
|
+
!this.patterns[maskExpression[cursor] ?? MaskExpression.EMPTY_STRING]
|
|
671
615
|
?.optional) {
|
|
672
616
|
result += inputArray[cursor];
|
|
673
617
|
}
|
|
674
|
-
if (maskExpression.includes(
|
|
675
|
-
maskExpression.includes(
|
|
618
|
+
if (maskExpression.includes(MaskExpression.NUMBER_NINE + MaskExpression.SYMBOL_STAR) &&
|
|
619
|
+
maskExpression.includes(MaskExpression.NUMBER_ZERO + MaskExpression.SYMBOL_STAR)) {
|
|
676
620
|
cursor++;
|
|
677
621
|
}
|
|
678
622
|
cursor++;
|
|
679
623
|
i--;
|
|
680
624
|
}
|
|
681
|
-
else if (this.maskExpression[cursor + 1] ===
|
|
682
|
-
this._findSpecialChar(this.maskExpression[cursor + 2] ??
|
|
625
|
+
else if (this.maskExpression[cursor + 1] === MaskExpression.SYMBOL_STAR &&
|
|
626
|
+
this._findSpecialChar(this.maskExpression[cursor + 2] ?? MaskExpression.EMPTY_STRING) &&
|
|
683
627
|
this._findSpecialChar(inputSymbol) === this.maskExpression[cursor + 2] &&
|
|
684
628
|
multi) {
|
|
685
629
|
cursor += 3;
|
|
686
630
|
result += inputSymbol;
|
|
687
631
|
}
|
|
688
|
-
else if (this.maskExpression[cursor + 1] ===
|
|
689
|
-
this._findSpecialChar(this.maskExpression[cursor + 2] ??
|
|
632
|
+
else if (this.maskExpression[cursor + 1] === MaskExpression.SYMBOL_QUESTION &&
|
|
633
|
+
this._findSpecialChar(this.maskExpression[cursor + 2] ?? MaskExpression.EMPTY_STRING) &&
|
|
690
634
|
this._findSpecialChar(inputSymbol) === this.maskExpression[cursor + 2] &&
|
|
691
635
|
multi) {
|
|
692
636
|
cursor += 3;
|
|
@@ -701,7 +645,7 @@ class NgxMaskApplierService {
|
|
|
701
645
|
}
|
|
702
646
|
}
|
|
703
647
|
if (result.length + 1 === maskExpression.length &&
|
|
704
|
-
this.specialCharacters.indexOf(maskExpression[maskExpression.length - 1] ??
|
|
648
|
+
this.specialCharacters.indexOf(maskExpression[maskExpression.length - 1] ?? MaskExpression.EMPTY_STRING) !== -1) {
|
|
705
649
|
result += maskExpression[maskExpression.length - 1];
|
|
706
650
|
}
|
|
707
651
|
let newPosition = processedPosition + 1;
|
|
@@ -709,7 +653,7 @@ class NgxMaskApplierService {
|
|
|
709
653
|
shift++;
|
|
710
654
|
newPosition++;
|
|
711
655
|
}
|
|
712
|
-
let actualShift = justPasted && !maskExpression.startsWith(
|
|
656
|
+
let actualShift = justPasted && !maskExpression.startsWith(MaskExpression.SEPARATOR)
|
|
713
657
|
? cursor
|
|
714
658
|
: this._shift.has(processedPosition)
|
|
715
659
|
? shift
|
|
@@ -725,7 +669,7 @@ class NgxMaskApplierService {
|
|
|
725
669
|
if (backspaced) {
|
|
726
670
|
onlySpecial = inputArray.every((char) => this.specialCharacters.includes(char));
|
|
727
671
|
}
|
|
728
|
-
let res = `${this.prefix}${onlySpecial ?
|
|
672
|
+
let res = `${this.prefix}${onlySpecial ? MaskExpression.EMPTY_STRING : result}${this.showMaskTyped ? '' : this.suffix}`;
|
|
729
673
|
if (result.length === 0) {
|
|
730
674
|
res = !this.dropSpecialCharacters ? `${this.prefix}${result}` : `${result}`;
|
|
731
675
|
}
|
|
@@ -736,13 +680,13 @@ class NgxMaskApplierService {
|
|
|
736
680
|
isSpecialCharacterMaskFirstSymbol) {
|
|
737
681
|
return '';
|
|
738
682
|
}
|
|
739
|
-
if (result.includes(
|
|
740
|
-
if (backspaced && result ===
|
|
683
|
+
if (result.includes(MaskExpression.MINUS) && this.prefix && this.allowNegativeNumbers) {
|
|
684
|
+
if (backspaced && result === MaskExpression.MINUS) {
|
|
741
685
|
return '';
|
|
742
686
|
}
|
|
743
|
-
res = `${
|
|
744
|
-
.split(
|
|
745
|
-
.join(
|
|
687
|
+
res = `${MaskExpression.MINUS}${this.prefix}${result
|
|
688
|
+
.split(MaskExpression.MINUS)
|
|
689
|
+
.join(MaskExpression.EMPTY_STRING)}${this.suffix}`;
|
|
746
690
|
}
|
|
747
691
|
return res;
|
|
748
692
|
}
|
|
@@ -761,25 +705,105 @@ class NgxMaskApplierService {
|
|
|
761
705
|
this.patterns[maskSymbol]?.pattern.test(inputSymbol)) ??
|
|
762
706
|
false);
|
|
763
707
|
}
|
|
708
|
+
_formatWithSeparators = (str, thousandSeparatorChar, decimalChars, precision) => {
|
|
709
|
+
let x = [];
|
|
710
|
+
let decimalChar = '';
|
|
711
|
+
if (Array.isArray(decimalChars)) {
|
|
712
|
+
const regExp = new RegExp(decimalChars.map((v) => ('[\\^$.|?*+()'.indexOf(v) >= 0 ? `\\${v}` : v)).join('|'));
|
|
713
|
+
x = str.split(regExp);
|
|
714
|
+
decimalChar = str.match(regExp)?.[0] ?? MaskExpression.EMPTY_STRING;
|
|
715
|
+
}
|
|
716
|
+
else {
|
|
717
|
+
x = str.split(decimalChars);
|
|
718
|
+
decimalChar = decimalChars;
|
|
719
|
+
}
|
|
720
|
+
const decimals = x.length > 1 ? `${decimalChar}${x[1]}` : MaskExpression.EMPTY_STRING;
|
|
721
|
+
let res = x[0] ?? MaskExpression.EMPTY_STRING;
|
|
722
|
+
const separatorLimit = this.separatorLimit.replace(/\s/g, MaskExpression.EMPTY_STRING);
|
|
723
|
+
if (separatorLimit && +separatorLimit) {
|
|
724
|
+
if (res[0] === MaskExpression.MINUS) {
|
|
725
|
+
res = `-${res.slice(1, res.length).slice(0, separatorLimit.length)}`;
|
|
726
|
+
}
|
|
727
|
+
else {
|
|
728
|
+
res = res.slice(0, separatorLimit.length);
|
|
729
|
+
}
|
|
730
|
+
}
|
|
731
|
+
const rgx = /(\d+)(\d{3})/;
|
|
732
|
+
while (thousandSeparatorChar && rgx.test(res)) {
|
|
733
|
+
res = res.replace(rgx, '$1' + thousandSeparatorChar + '$2');
|
|
734
|
+
}
|
|
735
|
+
if (typeof precision === 'undefined') {
|
|
736
|
+
return res + decimals;
|
|
737
|
+
}
|
|
738
|
+
else if (precision === 0) {
|
|
739
|
+
return res;
|
|
740
|
+
}
|
|
741
|
+
return res + decimals.substring(0, precision + 1);
|
|
742
|
+
};
|
|
743
|
+
percentage = (str) => {
|
|
744
|
+
const sanitizedStr = str.replace(',', '.');
|
|
745
|
+
const value = Number(this.allowNegativeNumbers && str.includes(MaskExpression.MINUS)
|
|
746
|
+
? sanitizedStr.slice(1, str.length)
|
|
747
|
+
: sanitizedStr);
|
|
748
|
+
return !isNaN(value) && value >= 0 && value <= 100;
|
|
749
|
+
};
|
|
750
|
+
getPrecision = (maskExpression) => {
|
|
751
|
+
const x = maskExpression.split(MaskExpression.DOT);
|
|
752
|
+
if (x.length > 1) {
|
|
753
|
+
return Number(x[x.length - 1]);
|
|
754
|
+
}
|
|
755
|
+
return Infinity;
|
|
756
|
+
};
|
|
757
|
+
checkAndRemoveSuffix = (inputValue) => {
|
|
758
|
+
for (let i = this.suffix?.length - 1; i >= 0; i--) {
|
|
759
|
+
const substr = this.suffix.substring(i, this.suffix?.length);
|
|
760
|
+
if (inputValue.includes(substr) &&
|
|
761
|
+
i !== this.suffix?.length - 1 &&
|
|
762
|
+
(i - 1 < 0 ||
|
|
763
|
+
!inputValue.includes(this.suffix.substring(i - 1, this.suffix?.length)))) {
|
|
764
|
+
return inputValue.replace(substr, MaskExpression.EMPTY_STRING);
|
|
765
|
+
}
|
|
766
|
+
}
|
|
767
|
+
return inputValue;
|
|
768
|
+
};
|
|
769
|
+
checkInputPrecision = (inputValue, precision, decimalMarker) => {
|
|
770
|
+
let processedInputValue = inputValue;
|
|
771
|
+
let processedDecimalMarker = decimalMarker;
|
|
772
|
+
if (precision < Infinity) {
|
|
773
|
+
if (Array.isArray(processedDecimalMarker)) {
|
|
774
|
+
const marker = processedDecimalMarker.find((dm) => dm !== this.thousandSeparator);
|
|
775
|
+
processedDecimalMarker = marker ? marker : processedDecimalMarker[0];
|
|
776
|
+
}
|
|
777
|
+
const precisionRegEx = new RegExp(this._charToRegExpExpression(processedDecimalMarker) + `\\d{${precision}}.*$`);
|
|
778
|
+
const precisionMatch = processedInputValue.match(precisionRegEx);
|
|
779
|
+
const precisionMatchLength = (precisionMatch && precisionMatch[0]?.length) ?? 0;
|
|
780
|
+
if (precisionMatchLength - 1 > precision) {
|
|
781
|
+
const diff = precisionMatchLength - 1 - precision;
|
|
782
|
+
processedInputValue = processedInputValue.substring(0, processedInputValue.length - diff);
|
|
783
|
+
}
|
|
784
|
+
if (precision === 0 &&
|
|
785
|
+
this._compareOrIncludes(processedInputValue[processedInputValue.length - 1], processedDecimalMarker, this.thousandSeparator)) {
|
|
786
|
+
processedInputValue = processedInputValue.substring(0, processedInputValue.length - 1);
|
|
787
|
+
}
|
|
788
|
+
}
|
|
789
|
+
return processedInputValue;
|
|
790
|
+
};
|
|
764
791
|
_stripToDecimal(str) {
|
|
765
792
|
return str
|
|
766
|
-
.split(
|
|
793
|
+
.split(MaskExpression.EMPTY_STRING)
|
|
767
794
|
.filter((i, idx) => {
|
|
768
795
|
const isDecimalMarker = typeof this.decimalMarker === 'string'
|
|
769
796
|
? i === this.decimalMarker
|
|
770
|
-
:
|
|
797
|
+
:
|
|
771
798
|
this.decimalMarker.includes(i);
|
|
772
799
|
return (i.match('^-?\\d') ||
|
|
773
800
|
i === this.thousandSeparator ||
|
|
774
801
|
isDecimalMarker ||
|
|
775
|
-
(i ===
|
|
802
|
+
(i === MaskExpression.MINUS && idx === 0 && this.allowNegativeNumbers));
|
|
776
803
|
})
|
|
777
|
-
.join(
|
|
804
|
+
.join(MaskExpression.EMPTY_STRING);
|
|
778
805
|
}
|
|
779
806
|
_charToRegExpExpression(char) {
|
|
780
|
-
// if (Array.isArray(char)) {
|
|
781
|
-
// return char.map((v) => ('[\\^$.|?*+()'.indexOf(v) >= 0 ? `\\${v}` : v)).join('|');
|
|
782
|
-
// }
|
|
783
807
|
if (char) {
|
|
784
808
|
const charsToEscape = '[\\^$.|?*+()';
|
|
785
809
|
return char === ' ' ? '\\s' : charsToEscape.indexOf(char) >= 0 ? `\\${char}` : char;
|
|
@@ -801,32 +825,32 @@ class NgxMaskApplierService {
|
|
|
801
825
|
return !(valuesIP.length === 4 &&
|
|
802
826
|
!valuesIP.some((value, index) => {
|
|
803
827
|
if (valuesIP.length !== index + 1) {
|
|
804
|
-
return value ===
|
|
828
|
+
return value === MaskExpression.EMPTY_STRING || Number(value) > 255;
|
|
805
829
|
}
|
|
806
|
-
return value ===
|
|
830
|
+
return value === MaskExpression.EMPTY_STRING || Number(value.substring(0, 3)) > 255;
|
|
807
831
|
}));
|
|
808
832
|
}
|
|
809
833
|
_splitPercentZero(value) {
|
|
810
|
-
if (value ===
|
|
834
|
+
if (value === MaskExpression.MINUS && this.allowNegativeNumbers) {
|
|
811
835
|
return value;
|
|
812
836
|
}
|
|
813
837
|
const decimalIndex = typeof this.decimalMarker === 'string'
|
|
814
838
|
? value.indexOf(this.decimalMarker)
|
|
815
|
-
: value.indexOf(
|
|
816
|
-
const emptyOrMinus = this.allowNegativeNumbers && value.includes(
|
|
839
|
+
: value.indexOf(MaskExpression.DOT);
|
|
840
|
+
const emptyOrMinus = this.allowNegativeNumbers && value.includes(MaskExpression.MINUS) ? '-' : '';
|
|
817
841
|
if (decimalIndex === -1) {
|
|
818
842
|
const parsedValue = parseInt(emptyOrMinus ? value.slice(1, value.length) : value, 10);
|
|
819
843
|
return isNaN(parsedValue)
|
|
820
|
-
?
|
|
844
|
+
? MaskExpression.EMPTY_STRING
|
|
821
845
|
: `${emptyOrMinus}${parsedValue}`;
|
|
822
846
|
}
|
|
823
847
|
else {
|
|
824
848
|
const integerPart = parseInt(value.replace('-', '').substring(0, decimalIndex), 10);
|
|
825
849
|
const decimalPart = value.substring(decimalIndex + 1);
|
|
826
850
|
const integerString = isNaN(integerPart) ? '' : integerPart.toString();
|
|
827
|
-
const decimal = typeof this.decimalMarker === 'string' ? this.decimalMarker :
|
|
828
|
-
return integerString ===
|
|
829
|
-
?
|
|
851
|
+
const decimal = typeof this.decimalMarker === 'string' ? this.decimalMarker : MaskExpression.DOT;
|
|
852
|
+
return integerString === MaskExpression.EMPTY_STRING
|
|
853
|
+
? MaskExpression.EMPTY_STRING
|
|
830
854
|
: `${emptyOrMinus}${integerString}${decimal}${decimalPart}`;
|
|
831
855
|
}
|
|
832
856
|
}
|
|
@@ -839,73 +863,64 @@ class NgxMaskApplierService {
|
|
|
839
863
|
}
|
|
840
864
|
return -1;
|
|
841
865
|
}
|
|
842
|
-
static
|
|
843
|
-
static
|
|
866
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskApplierService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
867
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskApplierService });
|
|
844
868
|
}
|
|
845
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
869
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskApplierService, decorators: [{
|
|
846
870
|
type: Injectable
|
|
847
871
|
}] });
|
|
848
872
|
|
|
849
873
|
class NgxMaskService extends NgxMaskApplierService {
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
this._elementRef = inject(ElementRef, { optional: true });
|
|
870
|
-
this.document = inject(DOCUMENT);
|
|
871
|
-
this._config = inject(NGX_MASK_CONFIG);
|
|
872
|
-
this._renderer = inject(Renderer2, { optional: true });
|
|
873
|
-
}
|
|
874
|
-
applyMask(inputValue, maskExpression, position = 0, justPasted = false, backspaced = false,
|
|
875
|
-
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
876
|
-
cb = () => { }) {
|
|
874
|
+
isNumberValue = false;
|
|
875
|
+
maskIsShown = '';
|
|
876
|
+
selStart = null;
|
|
877
|
+
selEnd = null;
|
|
878
|
+
writingValue = false;
|
|
879
|
+
maskChanged = false;
|
|
880
|
+
_maskExpressionArray = [];
|
|
881
|
+
triggerOnMaskChange = false;
|
|
882
|
+
_previousValue = '';
|
|
883
|
+
_currentValue = '';
|
|
884
|
+
_emitValue = false;
|
|
885
|
+
_start;
|
|
886
|
+
_end;
|
|
887
|
+
onChange = (_) => { };
|
|
888
|
+
_elementRef = inject(ElementRef, { optional: true });
|
|
889
|
+
document = inject(DOCUMENT);
|
|
890
|
+
_config = inject(NGX_MASK_CONFIG);
|
|
891
|
+
_renderer = inject(Renderer2, { optional: true });
|
|
892
|
+
applyMask(inputValue, maskExpression, position = 0, justPasted = false, backspaced = false, cb = () => { }) {
|
|
877
893
|
if (!maskExpression) {
|
|
878
894
|
return inputValue !== this.actualValue ? this.actualValue : inputValue;
|
|
879
895
|
}
|
|
880
896
|
this.maskIsShown = this.showMaskTyped
|
|
881
897
|
? this.showMaskInInput()
|
|
882
|
-
:
|
|
883
|
-
if (this.maskExpression ===
|
|
884
|
-
this.maskIsShown = this.showMaskInInput(inputValue ||
|
|
898
|
+
: MaskExpression.EMPTY_STRING;
|
|
899
|
+
if (this.maskExpression === MaskExpression.IP && this.showMaskTyped) {
|
|
900
|
+
this.maskIsShown = this.showMaskInInput(inputValue || MaskExpression.HASH);
|
|
885
901
|
}
|
|
886
|
-
if (this.maskExpression ===
|
|
887
|
-
this.maskIsShown = this.showMaskInInput(inputValue ||
|
|
902
|
+
if (this.maskExpression === MaskExpression.CPF_CNPJ && this.showMaskTyped) {
|
|
903
|
+
this.maskIsShown = this.showMaskInInput(inputValue || MaskExpression.HASH);
|
|
888
904
|
}
|
|
889
905
|
if (!inputValue && this.showMaskTyped) {
|
|
890
906
|
this.formControlResult(this.prefix);
|
|
891
907
|
return `${this.prefix}${this.maskIsShown}${this.suffix}`;
|
|
892
908
|
}
|
|
893
909
|
const getSymbol = !!inputValue && typeof this.selStart === 'number'
|
|
894
|
-
? (inputValue[this.selStart] ??
|
|
895
|
-
:
|
|
910
|
+
? (inputValue[this.selStart] ?? MaskExpression.EMPTY_STRING)
|
|
911
|
+
: MaskExpression.EMPTY_STRING;
|
|
896
912
|
let newInputValue = '';
|
|
897
913
|
let newPosition = position;
|
|
898
|
-
if (this.hiddenInput && !this.writingValue) {
|
|
914
|
+
if (this.hiddenInput !== null && !this.writingValue) {
|
|
899
915
|
let actualResult = inputValue && inputValue.length === 1
|
|
900
|
-
? inputValue.split(
|
|
901
|
-
: this.actualValue.split(
|
|
916
|
+
? inputValue.split(MaskExpression.EMPTY_STRING)
|
|
917
|
+
: this.actualValue.split(MaskExpression.EMPTY_STRING);
|
|
902
918
|
if (typeof this.selStart === 'object' && typeof this.selEnd === 'object') {
|
|
903
919
|
this.selStart = Number(this.selStart);
|
|
904
920
|
this.selEnd = Number(this.selEnd);
|
|
905
921
|
}
|
|
906
922
|
else {
|
|
907
|
-
|
|
908
|
-
inputValue !== "" /* MaskExpression.EMPTY_STRING */ && actualResult.length
|
|
923
|
+
inputValue !== MaskExpression.EMPTY_STRING && actualResult.length
|
|
909
924
|
? typeof this.selStart === 'number' && typeof this.selEnd === 'number'
|
|
910
925
|
? inputValue.length > actualResult.length
|
|
911
926
|
? actualResult.splice(this.selStart, 0, getSymbol)
|
|
@@ -924,14 +939,14 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
924
939
|
}
|
|
925
940
|
newInputValue =
|
|
926
941
|
this.actualValue.length && actualResult.length <= inputValue.length
|
|
927
|
-
? this.shiftTypedSymbols(actualResult.join(
|
|
942
|
+
? this.shiftTypedSymbols(actualResult.join(MaskExpression.EMPTY_STRING))
|
|
928
943
|
: inputValue;
|
|
929
944
|
}
|
|
930
945
|
if (justPasted && (this.hiddenInput || !this.hiddenInput)) {
|
|
931
946
|
newInputValue = inputValue;
|
|
932
947
|
}
|
|
933
948
|
if (backspaced &&
|
|
934
|
-
this.specialCharacters.indexOf(this.maskExpression[newPosition] ??
|
|
949
|
+
this.specialCharacters.indexOf(this.maskExpression[newPosition] ?? MaskExpression.EMPTY_STRING) !== -1 &&
|
|
935
950
|
this.showMaskTyped &&
|
|
936
951
|
!this.prefix) {
|
|
937
952
|
newInputValue = this._currentValue;
|
|
@@ -940,7 +955,7 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
940
955
|
if (this.specialCharacters.includes(this.actualValue.slice(newPosition, newPosition + 1))) {
|
|
941
956
|
newPosition = newPosition + 1;
|
|
942
957
|
}
|
|
943
|
-
else if (maskExpression.slice(newPosition - 1, newPosition + 1) !==
|
|
958
|
+
else if (maskExpression.slice(newPosition - 1, newPosition + 1) !== MaskExpression.MONTHS) {
|
|
944
959
|
newPosition = newPosition - 2;
|
|
945
960
|
}
|
|
946
961
|
this.deletedSpecialCharacter = false;
|
|
@@ -972,17 +987,13 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
972
987
|
}
|
|
973
988
|
const result = super.applyMask(newInputValue, maskExpression, newPosition, justPasted, backspaced, cb);
|
|
974
989
|
this.actualValue = this.getActualValue(result);
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
}
|
|
981
|
-
// b) remove decimal marker from list of special characters to mask
|
|
982
|
-
if (this.maskExpression.startsWith("separator" /* MaskExpression.SEPARATOR */) &&
|
|
990
|
+
if (this.thousandSeparator === MaskExpression.DOT &&
|
|
991
|
+
this.decimalMarker === MaskExpression.DOT) {
|
|
992
|
+
this.decimalMarker = MaskExpression.COMMA;
|
|
993
|
+
}
|
|
994
|
+
if (this.maskExpression.startsWith(MaskExpression.SEPARATOR) &&
|
|
983
995
|
this.dropSpecialCharacters === true) {
|
|
984
|
-
this.specialCharacters = this.specialCharacters.filter((item) => !this._compareOrIncludes(item, this.decimalMarker, this.thousandSeparator)
|
|
985
|
-
);
|
|
996
|
+
this.specialCharacters = this.specialCharacters.filter((item) => !this._compareOrIncludes(item, this.decimalMarker, this.thousandSeparator));
|
|
986
997
|
}
|
|
987
998
|
if (result || result === '') {
|
|
988
999
|
this._previousValue = this._currentValue;
|
|
@@ -993,7 +1004,6 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
993
1004
|
this.writingValue ||
|
|
994
1005
|
(this._previousValue === this._currentValue && justPasted);
|
|
995
1006
|
}
|
|
996
|
-
// eslint-disable-next-line no-unused-expressions,@typescript-eslint/no-unused-expressions
|
|
997
1007
|
this._emitValue
|
|
998
1008
|
? this.writingValue && this.triggerOnMaskChange
|
|
999
1009
|
? requestAnimationFrame(() => this.formControlResult(result))
|
|
@@ -1010,17 +1020,16 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1010
1020
|
}
|
|
1011
1021
|
const resLen = result.length;
|
|
1012
1022
|
const prefNmask = `${this.prefix}${this.maskIsShown}${this.suffix}`;
|
|
1013
|
-
if (this.maskExpression.includes(
|
|
1023
|
+
if (this.maskExpression.includes(MaskExpression.HOURS)) {
|
|
1014
1024
|
const countSkipedSymbol = this._numberSkipedSymbols(result);
|
|
1015
1025
|
return `${result}${prefNmask.slice(resLen + countSkipedSymbol)}`;
|
|
1016
1026
|
}
|
|
1017
|
-
else if (this.maskExpression ===
|
|
1018
|
-
this.maskExpression ===
|
|
1027
|
+
else if (this.maskExpression === MaskExpression.IP ||
|
|
1028
|
+
this.maskExpression === MaskExpression.CPF_CNPJ) {
|
|
1019
1029
|
return `${result}${prefNmask}`;
|
|
1020
1030
|
}
|
|
1021
1031
|
return `${result}${prefNmask.slice(resLen)}`;
|
|
1022
1032
|
}
|
|
1023
|
-
// get the number of characters that were shifted
|
|
1024
1033
|
_numberSkipedSymbols(value) {
|
|
1025
1034
|
const regex = /(^|\D)(\d\D)/g;
|
|
1026
1035
|
let match = regex.exec(value);
|
|
@@ -1031,9 +1040,7 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1031
1040
|
}
|
|
1032
1041
|
return countSkipedSymbol;
|
|
1033
1042
|
}
|
|
1034
|
-
applyValueChanges(position, justPasted, backspaced,
|
|
1035
|
-
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
1036
|
-
cb = () => { }) {
|
|
1043
|
+
applyValueChanges(position, justPasted, backspaced, cb = () => { }) {
|
|
1037
1044
|
const formElement = this._elementRef?.nativeElement;
|
|
1038
1045
|
if (!formElement) {
|
|
1039
1046
|
return;
|
|
@@ -1046,29 +1053,28 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1046
1053
|
}
|
|
1047
1054
|
hideInput(inputValue, maskExpression) {
|
|
1048
1055
|
return inputValue
|
|
1049
|
-
.split(
|
|
1056
|
+
.split(MaskExpression.EMPTY_STRING)
|
|
1050
1057
|
.map((curr, index) => {
|
|
1051
1058
|
if (this.patterns &&
|
|
1052
|
-
this.patterns[maskExpression[index] ??
|
|
1053
|
-
this.patterns[maskExpression[index] ??
|
|
1054
|
-
return this.patterns[maskExpression[index] ??
|
|
1059
|
+
this.patterns[maskExpression[index] ?? MaskExpression.EMPTY_STRING] &&
|
|
1060
|
+
this.patterns[maskExpression[index] ?? MaskExpression.EMPTY_STRING]?.symbol) {
|
|
1061
|
+
return this.patterns[maskExpression[index] ?? MaskExpression.EMPTY_STRING]
|
|
1055
1062
|
?.symbol;
|
|
1056
1063
|
}
|
|
1057
1064
|
return curr;
|
|
1058
1065
|
})
|
|
1059
|
-
.join(
|
|
1066
|
+
.join(MaskExpression.EMPTY_STRING);
|
|
1060
1067
|
}
|
|
1061
|
-
// this function is not necessary, it checks result against maskExpression
|
|
1062
1068
|
getActualValue(res) {
|
|
1063
1069
|
const compare = res
|
|
1064
|
-
.split(
|
|
1070
|
+
.split(MaskExpression.EMPTY_STRING)
|
|
1065
1071
|
.filter((symbol, i) => {
|
|
1066
|
-
const maskChar = this.maskExpression[i] ??
|
|
1072
|
+
const maskChar = this.maskExpression[i] ?? MaskExpression.EMPTY_STRING;
|
|
1067
1073
|
return (this._checkSymbolMask(symbol, maskChar) ||
|
|
1068
1074
|
(this.specialCharacters.includes(maskChar) && symbol === maskChar));
|
|
1069
1075
|
});
|
|
1070
|
-
if (compare.join(
|
|
1071
|
-
return compare.join(
|
|
1076
|
+
if (compare.join(MaskExpression.EMPTY_STRING) === res) {
|
|
1077
|
+
return compare.join(MaskExpression.EMPTY_STRING);
|
|
1072
1078
|
}
|
|
1073
1079
|
return res;
|
|
1074
1080
|
}
|
|
@@ -1076,33 +1082,28 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1076
1082
|
let symbolToReplace = '';
|
|
1077
1083
|
const newInputValue = (inputValue &&
|
|
1078
1084
|
inputValue
|
|
1079
|
-
.split(
|
|
1085
|
+
.split(MaskExpression.EMPTY_STRING)
|
|
1080
1086
|
.map((currSymbol, index) => {
|
|
1081
|
-
if (this.specialCharacters.includes(inputValue[index + 1] ??
|
|
1087
|
+
if (this.specialCharacters.includes(inputValue[index + 1] ?? MaskExpression.EMPTY_STRING) &&
|
|
1082
1088
|
inputValue[index + 1] !== this.maskExpression[index + 1]) {
|
|
1083
1089
|
symbolToReplace = currSymbol;
|
|
1084
1090
|
return inputValue[index + 1];
|
|
1085
1091
|
}
|
|
1086
1092
|
if (symbolToReplace.length) {
|
|
1087
1093
|
const replaceSymbol = symbolToReplace;
|
|
1088
|
-
symbolToReplace =
|
|
1094
|
+
symbolToReplace = MaskExpression.EMPTY_STRING;
|
|
1089
1095
|
return replaceSymbol;
|
|
1090
1096
|
}
|
|
1091
1097
|
return currSymbol;
|
|
1092
1098
|
})) ||
|
|
1093
1099
|
[];
|
|
1094
|
-
return newInputValue.join(
|
|
1100
|
+
return newInputValue.join(MaskExpression.EMPTY_STRING);
|
|
1095
1101
|
}
|
|
1096
|
-
/**
|
|
1097
|
-
* Convert number value to string
|
|
1098
|
-
* 3.1415 -> '3.1415'
|
|
1099
|
-
* 1e-7 -> '0.0000001'
|
|
1100
|
-
*/
|
|
1101
1102
|
numberToString(value) {
|
|
1102
1103
|
if ((!value && value !== 0) ||
|
|
1103
|
-
(this.maskExpression.startsWith(
|
|
1104
|
+
(this.maskExpression.startsWith(MaskExpression.SEPARATOR) &&
|
|
1104
1105
|
(this.leadZero || !this.dropSpecialCharacters)) ||
|
|
1105
|
-
(this.maskExpression.startsWith(
|
|
1106
|
+
(this.maskExpression.startsWith(MaskExpression.SEPARATOR) &&
|
|
1106
1107
|
this.separatorLimit.length > 14 &&
|
|
1107
1108
|
String(value).length > 14)) {
|
|
1108
1109
|
return String(value);
|
|
@@ -1112,7 +1113,7 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1112
1113
|
useGrouping: false,
|
|
1113
1114
|
maximumFractionDigits: 20,
|
|
1114
1115
|
})
|
|
1115
|
-
.replace(`/${
|
|
1116
|
+
.replace(`/${MaskExpression.MINUS}/`, MaskExpression.MINUS);
|
|
1116
1117
|
}
|
|
1117
1118
|
showMaskInInput(inputVal) {
|
|
1118
1119
|
if (this.showMaskTyped && !!this.shownMaskExpression) {
|
|
@@ -1125,10 +1126,10 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1125
1126
|
}
|
|
1126
1127
|
else if (this.showMaskTyped) {
|
|
1127
1128
|
if (inputVal) {
|
|
1128
|
-
if (this.maskExpression ===
|
|
1129
|
+
if (this.maskExpression === MaskExpression.IP) {
|
|
1129
1130
|
return this._checkForIp(inputVal);
|
|
1130
1131
|
}
|
|
1131
|
-
if (this.maskExpression ===
|
|
1132
|
+
if (this.maskExpression === MaskExpression.CPF_CNPJ) {
|
|
1132
1133
|
return this._checkForCpfCnpj(inputVal);
|
|
1133
1134
|
}
|
|
1134
1135
|
}
|
|
@@ -1146,9 +1147,9 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1146
1147
|
}
|
|
1147
1148
|
if (this.clearIfNotMatch &&
|
|
1148
1149
|
this.prefix.length + this.maskExpression.length + this.suffix.length !==
|
|
1149
|
-
formElement.value.replace(this.placeHolderCharacter,
|
|
1150
|
+
formElement.value.replace(this.placeHolderCharacter, MaskExpression.EMPTY_STRING)
|
|
1150
1151
|
.length) {
|
|
1151
|
-
this.formElementProperty = ['value',
|
|
1152
|
+
this.formElementProperty = ['value', MaskExpression.EMPTY_STRING];
|
|
1152
1153
|
this.applyMask('', this.maskExpression);
|
|
1153
1154
|
}
|
|
1154
1155
|
}
|
|
@@ -1156,12 +1157,11 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1156
1157
|
if (!this._renderer || !this._elementRef) {
|
|
1157
1158
|
return;
|
|
1158
1159
|
}
|
|
1159
|
-
//[TODO]: andriikamaldinov1 find better solution
|
|
1160
1160
|
Promise.resolve().then(() => this._renderer?.setProperty(this._elementRef?.nativeElement, name, value));
|
|
1161
1161
|
}
|
|
1162
1162
|
checkDropSpecialCharAmount(mask) {
|
|
1163
1163
|
const chars = mask
|
|
1164
|
-
.split(
|
|
1164
|
+
.split(MaskExpression.EMPTY_STRING)
|
|
1165
1165
|
.filter((item) => this._findDropSpecialChar(item));
|
|
1166
1166
|
return chars.length;
|
|
1167
1167
|
}
|
|
@@ -1169,13 +1169,12 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1169
1169
|
return this._removeMask(this._removeSuffix(this._removePrefix(inputValue)), this.specialCharacters.concat('_').concat(this.placeHolderCharacter));
|
|
1170
1170
|
}
|
|
1171
1171
|
_checkForIp(inputVal) {
|
|
1172
|
-
if (inputVal ===
|
|
1172
|
+
if (inputVal === MaskExpression.HASH) {
|
|
1173
1173
|
return `${this.placeHolderCharacter}.${this.placeHolderCharacter}.${this.placeHolderCharacter}.${this.placeHolderCharacter}`;
|
|
1174
1174
|
}
|
|
1175
1175
|
const arr = [];
|
|
1176
|
-
// eslint-disable-next-line @typescript-eslint/prefer-for-of
|
|
1177
1176
|
for (let i = 0; i < inputVal.length; i++) {
|
|
1178
|
-
const value = inputVal[i] ??
|
|
1177
|
+
const value = inputVal[i] ?? MaskExpression.EMPTY_STRING;
|
|
1179
1178
|
if (!value) {
|
|
1180
1179
|
continue;
|
|
1181
1180
|
}
|
|
@@ -1207,13 +1206,12 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1207
1206
|
`.${this.placeHolderCharacter}${this.placeHolderCharacter}${this.placeHolderCharacter}` +
|
|
1208
1207
|
`/${this.placeHolderCharacter}${this.placeHolderCharacter}${this.placeHolderCharacter}${this.placeHolderCharacter}` +
|
|
1209
1208
|
`-${this.placeHolderCharacter}${this.placeHolderCharacter}`;
|
|
1210
|
-
if (inputVal ===
|
|
1209
|
+
if (inputVal === MaskExpression.HASH) {
|
|
1211
1210
|
return cpf;
|
|
1212
1211
|
}
|
|
1213
1212
|
const arr = [];
|
|
1214
|
-
// eslint-disable-next-line @typescript-eslint/prefer-for-of
|
|
1215
1213
|
for (let i = 0; i < inputVal.length; i++) {
|
|
1216
|
-
const value = inputVal[i] ??
|
|
1214
|
+
const value = inputVal[i] ?? MaskExpression.EMPTY_STRING;
|
|
1217
1215
|
if (!value) {
|
|
1218
1216
|
continue;
|
|
1219
1217
|
}
|
|
@@ -1247,9 +1245,6 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1247
1245
|
}
|
|
1248
1246
|
return '';
|
|
1249
1247
|
}
|
|
1250
|
-
/**
|
|
1251
|
-
* Recursively determine the current active element by navigating the Shadow DOM until the Active Element is found.
|
|
1252
|
-
*/
|
|
1253
1248
|
_getActiveElement(document = this.document) {
|
|
1254
1249
|
const shadowRootEl = document?.activeElement?.shadowRoot;
|
|
1255
1250
|
if (!shadowRootEl?.activeElement) {
|
|
@@ -1259,20 +1254,12 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1259
1254
|
return this._getActiveElement(shadowRootEl);
|
|
1260
1255
|
}
|
|
1261
1256
|
}
|
|
1262
|
-
/**
|
|
1263
|
-
* Propogates the input value back to the Angular model by triggering the onChange function. It won't do this if writingValue
|
|
1264
|
-
* is true. If that is true it means we are currently in the writeValue function, which is supposed to only update the actual
|
|
1265
|
-
* DOM element based on the Angular model value. It should be a one way process, i.e. writeValue should not be modifying the Angular
|
|
1266
|
-
* model value too. Therefore, we don't trigger onChange in this scenario.
|
|
1267
|
-
* @param inputValue the current form input value
|
|
1268
|
-
*/
|
|
1269
1257
|
formControlResult(inputValue) {
|
|
1270
1258
|
if (this.writingValue && !inputValue) {
|
|
1271
1259
|
this.onChange('');
|
|
1272
1260
|
return;
|
|
1273
1261
|
}
|
|
1274
1262
|
if (this.writingValue || (!this.triggerOnMaskChange && this.maskChanged)) {
|
|
1275
|
-
// eslint-disable-next-line no-unused-expressions,@typescript-eslint/no-unused-expressions
|
|
1276
1263
|
this.triggerOnMaskChange && this.maskChanged
|
|
1277
1264
|
? this.onChange(this.outputTransformFn(this._toNumber(this._checkSymbols(this._removeSuffix(this._removePrefix(inputValue))))))
|
|
1278
1265
|
: '';
|
|
@@ -1291,43 +1278,43 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1291
1278
|
}
|
|
1292
1279
|
}
|
|
1293
1280
|
_toNumber(value) {
|
|
1294
|
-
if (!this.isNumberValue || value ===
|
|
1281
|
+
if (!this.isNumberValue || value === MaskExpression.EMPTY_STRING) {
|
|
1295
1282
|
return value;
|
|
1296
1283
|
}
|
|
1297
|
-
if (this.maskExpression.startsWith(
|
|
1284
|
+
if (this.maskExpression.startsWith(MaskExpression.SEPARATOR) &&
|
|
1298
1285
|
(this.leadZero || !this.dropSpecialCharacters)) {
|
|
1299
1286
|
return value;
|
|
1300
1287
|
}
|
|
1301
|
-
if (String(value).length > 14 && this.maskExpression.startsWith(
|
|
1288
|
+
if (String(value).length > 14 && this.maskExpression.startsWith(MaskExpression.SEPARATOR)) {
|
|
1302
1289
|
return String(value);
|
|
1303
1290
|
}
|
|
1304
1291
|
const num = Number(value);
|
|
1305
|
-
if (this.maskExpression.startsWith(
|
|
1292
|
+
if (this.maskExpression.startsWith(MaskExpression.SEPARATOR) && Number.isNaN(num)) {
|
|
1306
1293
|
const val = String(value).replace(',', '.');
|
|
1307
1294
|
return Number(val);
|
|
1308
1295
|
}
|
|
1309
1296
|
return Number.isNaN(num) ? value : num;
|
|
1310
1297
|
}
|
|
1311
1298
|
_removeMask(value, specialCharactersForRemove) {
|
|
1312
|
-
if (this.maskExpression.startsWith(
|
|
1313
|
-
value.includes(
|
|
1299
|
+
if (this.maskExpression.startsWith(MaskExpression.PERCENT) &&
|
|
1300
|
+
value.includes(MaskExpression.DOT)) {
|
|
1314
1301
|
return value;
|
|
1315
1302
|
}
|
|
1316
1303
|
return value
|
|
1317
|
-
? value.replace(this._regExpForRemove(specialCharactersForRemove),
|
|
1304
|
+
? value.replace(this._regExpForRemove(specialCharactersForRemove), MaskExpression.EMPTY_STRING)
|
|
1318
1305
|
: value;
|
|
1319
1306
|
}
|
|
1320
1307
|
_removePrefix(value) {
|
|
1321
1308
|
if (!this.prefix) {
|
|
1322
1309
|
return value;
|
|
1323
1310
|
}
|
|
1324
|
-
return value ? value.replace(this.prefix,
|
|
1311
|
+
return value ? value.replace(this.prefix, MaskExpression.EMPTY_STRING) : value;
|
|
1325
1312
|
}
|
|
1326
1313
|
_removeSuffix(value) {
|
|
1327
1314
|
if (!this.suffix) {
|
|
1328
1315
|
return value;
|
|
1329
1316
|
}
|
|
1330
|
-
return value ? value.replace(this.suffix,
|
|
1317
|
+
return value ? value.replace(this.suffix, MaskExpression.EMPTY_STRING) : value;
|
|
1331
1318
|
}
|
|
1332
1319
|
_retrieveSeparatorValue(result) {
|
|
1333
1320
|
let specialCharacters = Array.isArray(this.dropSpecialCharacters)
|
|
@@ -1337,9 +1324,9 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1337
1324
|
: this.specialCharacters;
|
|
1338
1325
|
if (!this.deletedSpecialCharacter &&
|
|
1339
1326
|
this._checkPatternForSpace() &&
|
|
1340
|
-
result.includes(
|
|
1341
|
-
this.maskExpression.includes(
|
|
1342
|
-
specialCharacters = specialCharacters.filter((char) => char !==
|
|
1327
|
+
result.includes(MaskExpression.WHITE_SPACE) &&
|
|
1328
|
+
this.maskExpression.includes(MaskExpression.SYMBOL_STAR)) {
|
|
1329
|
+
specialCharacters = specialCharacters.filter((char) => char !== MaskExpression.WHITE_SPACE);
|
|
1343
1330
|
}
|
|
1344
1331
|
return this._removeMask(result, specialCharacters);
|
|
1345
1332
|
}
|
|
@@ -1350,16 +1337,16 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1350
1337
|
const markers = Array.isArray(this.decimalMarker)
|
|
1351
1338
|
? this.decimalMarker
|
|
1352
1339
|
: [this.decimalMarker];
|
|
1353
|
-
return value.replace(this._regExpForRemove(markers),
|
|
1340
|
+
return value.replace(this._regExpForRemove(markers), MaskExpression.DOT);
|
|
1354
1341
|
}
|
|
1355
1342
|
_checkSymbols(result) {
|
|
1356
1343
|
let processedResult = result;
|
|
1357
|
-
if (processedResult ===
|
|
1344
|
+
if (processedResult === MaskExpression.EMPTY_STRING) {
|
|
1358
1345
|
return processedResult;
|
|
1359
1346
|
}
|
|
1360
|
-
if (this.maskExpression.startsWith(
|
|
1361
|
-
this.decimalMarker ===
|
|
1362
|
-
processedResult = processedResult.replace(
|
|
1347
|
+
if (this.maskExpression.startsWith(MaskExpression.PERCENT) &&
|
|
1348
|
+
this.decimalMarker === MaskExpression.COMMA) {
|
|
1349
|
+
processedResult = processedResult.replace(MaskExpression.COMMA, MaskExpression.DOT);
|
|
1363
1350
|
}
|
|
1364
1351
|
const separatorPrecision = this._retrieveSeparatorPrecision(this.maskExpression);
|
|
1365
1352
|
const separatorValue = this._replaceDecimalMarkerToDot(this._retrieveSeparatorValue(processedResult));
|
|
@@ -1381,11 +1368,10 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1381
1368
|
}
|
|
1382
1369
|
_checkPatternForSpace() {
|
|
1383
1370
|
for (const key in this.patterns) {
|
|
1384
|
-
// eslint-disable-next-line no-prototype-builtins
|
|
1385
1371
|
if (this.patterns[key] && this.patterns[key]?.hasOwnProperty('pattern')) {
|
|
1386
1372
|
const patternString = this.patterns[key]?.pattern.toString();
|
|
1387
1373
|
const pattern = this.patterns[key]?.pattern;
|
|
1388
|
-
if (patternString?.includes(
|
|
1374
|
+
if (patternString?.includes(MaskExpression.WHITE_SPACE) &&
|
|
1389
1375
|
pattern?.test(this.maskExpression)) {
|
|
1390
1376
|
return true;
|
|
1391
1377
|
}
|
|
@@ -1393,7 +1379,6 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1393
1379
|
}
|
|
1394
1380
|
return false;
|
|
1395
1381
|
}
|
|
1396
|
-
// TODO should think about helpers or separting decimal precision to own property
|
|
1397
1382
|
_retrieveSeparatorPrecision(maskExpretion) {
|
|
1398
1383
|
const matcher = maskExpretion.match(new RegExp(`^separator\\.([^d]*)`));
|
|
1399
1384
|
return matcher ? Number(matcher[1]) : null;
|
|
@@ -1403,7 +1388,7 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1403
1388
|
let value = separatorValue;
|
|
1404
1389
|
if (separatorExpression.indexOf('2') > 0 ||
|
|
1405
1390
|
(this.leadZero && Number(separatorPrecision) > 0)) {
|
|
1406
|
-
if (this.decimalMarker ===
|
|
1391
|
+
if (this.decimalMarker === MaskExpression.COMMA && this.leadZero) {
|
|
1407
1392
|
value = value.replace(',', '.');
|
|
1408
1393
|
}
|
|
1409
1394
|
return this.leadZero
|
|
@@ -1415,20 +1400,20 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1415
1400
|
_repeatPatternSymbols(maskExp) {
|
|
1416
1401
|
return ((maskExp.match(/{[0-9]+}/) &&
|
|
1417
1402
|
maskExp
|
|
1418
|
-
.split(
|
|
1403
|
+
.split(MaskExpression.EMPTY_STRING)
|
|
1419
1404
|
.reduce((accum, currVal, index) => {
|
|
1420
1405
|
this._start =
|
|
1421
|
-
currVal ===
|
|
1422
|
-
if (currVal !==
|
|
1406
|
+
currVal === MaskExpression.CURLY_BRACKETS_LEFT ? index : this._start;
|
|
1407
|
+
if (currVal !== MaskExpression.CURLY_BRACKETS_RIGHT) {
|
|
1423
1408
|
return this._findSpecialChar(currVal) ? accum + currVal : accum;
|
|
1424
1409
|
}
|
|
1425
1410
|
this._end = index;
|
|
1426
1411
|
const repeatNumber = Number(maskExp.slice(this._start + 1, this._end));
|
|
1427
1412
|
const replaceWith = new Array(repeatNumber + 1).join(maskExp[this._start - 1]);
|
|
1428
1413
|
if (maskExp.slice(0, this._start).length > 1 &&
|
|
1429
|
-
maskExp.includes(
|
|
1414
|
+
maskExp.includes(MaskExpression.LETTER_S)) {
|
|
1430
1415
|
const symbols = maskExp.slice(0, this._start - 1);
|
|
1431
|
-
return symbols.includes(
|
|
1416
|
+
return symbols.includes(MaskExpression.CURLY_BRACKETS_LEFT)
|
|
1432
1417
|
? accum + replaceWith
|
|
1433
1418
|
: symbols + accum + replaceWith;
|
|
1434
1419
|
}
|
|
@@ -1441,16 +1426,13 @@ class NgxMaskService extends NgxMaskApplierService {
|
|
|
1441
1426
|
currentLocaleDecimalMarker() {
|
|
1442
1427
|
return (1.1).toLocaleString().substring(1, 2);
|
|
1443
1428
|
}
|
|
1444
|
-
static
|
|
1445
|
-
static
|
|
1429
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
|
|
1430
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskService });
|
|
1446
1431
|
}
|
|
1447
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1432
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskService, decorators: [{
|
|
1448
1433
|
type: Injectable
|
|
1449
1434
|
}] });
|
|
1450
1435
|
|
|
1451
|
-
/**
|
|
1452
|
-
* @internal
|
|
1453
|
-
*/
|
|
1454
1436
|
function _configFactory() {
|
|
1455
1437
|
const initConfig = inject(INITIAL_CONFIG);
|
|
1456
1438
|
const configValue = inject(NEW_CONFIG);
|
|
@@ -1480,48 +1462,45 @@ function provideEnvironmentNgxMask(configValue) {
|
|
|
1480
1462
|
}
|
|
1481
1463
|
|
|
1482
1464
|
class NgxMaskDirective {
|
|
1483
|
-
|
|
1484
|
-
|
|
1485
|
-
|
|
1486
|
-
|
|
1487
|
-
|
|
1488
|
-
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
|
|
1500
|
-
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
|
|
1518
|
-
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1522
|
-
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
1523
|
-
this.onTouch = () => { };
|
|
1524
|
-
}
|
|
1465
|
+
maskExpression = '';
|
|
1466
|
+
specialCharacters = [];
|
|
1467
|
+
patterns = {};
|
|
1468
|
+
prefix = '';
|
|
1469
|
+
suffix = '';
|
|
1470
|
+
thousandSeparator = ' ';
|
|
1471
|
+
decimalMarker = '.';
|
|
1472
|
+
dropSpecialCharacters = null;
|
|
1473
|
+
hiddenInput = null;
|
|
1474
|
+
showMaskTyped = null;
|
|
1475
|
+
placeHolderCharacter = null;
|
|
1476
|
+
shownMaskExpression = null;
|
|
1477
|
+
showTemplate = null;
|
|
1478
|
+
clearIfNotMatch = null;
|
|
1479
|
+
validation = null;
|
|
1480
|
+
separatorLimit = null;
|
|
1481
|
+
allowNegativeNumbers = null;
|
|
1482
|
+
leadZeroDateTime = null;
|
|
1483
|
+
leadZero = null;
|
|
1484
|
+
triggerOnMaskChange = null;
|
|
1485
|
+
apm = null;
|
|
1486
|
+
inputTransformFn = null;
|
|
1487
|
+
outputTransformFn = null;
|
|
1488
|
+
keepCharacterPositions = null;
|
|
1489
|
+
maskFilled = new EventEmitter();
|
|
1490
|
+
_maskValue = '';
|
|
1491
|
+
_inputValue;
|
|
1492
|
+
_position = null;
|
|
1493
|
+
_code;
|
|
1494
|
+
_maskExpressionArray = [];
|
|
1495
|
+
_allowFewMaskChangeMask = false;
|
|
1496
|
+
_justPasted = false;
|
|
1497
|
+
_isFocused = false;
|
|
1498
|
+
_isComposing = false;
|
|
1499
|
+
document = inject(DOCUMENT);
|
|
1500
|
+
_maskService = inject(NgxMaskService, { self: true });
|
|
1501
|
+
_config = inject(NGX_MASK_CONFIG);
|
|
1502
|
+
onChange = (_) => { };
|
|
1503
|
+
onTouch = () => { };
|
|
1525
1504
|
ngOnChanges(changes) {
|
|
1526
1505
|
const { maskExpression, specialCharacters, patterns, prefix, suffix, thousandSeparator, decimalMarker, dropSpecialCharacters, hiddenInput, showMaskTyped, placeHolderCharacter, shownMaskExpression, showTemplate, clearIfNotMatch, validation, separatorLimit, allowNegativeNumbers, leadZeroDateTime, leadZero, triggerOnMaskChange, apm, inputTransformFn, outputTransformFn, keepCharacterPositions, } = changes;
|
|
1527
1506
|
if (maskExpression) {
|
|
@@ -1530,9 +1509,9 @@ class NgxMaskDirective {
|
|
|
1530
1509
|
this._maskService.maskChanged = true;
|
|
1531
1510
|
}
|
|
1532
1511
|
if (maskExpression.currentValue &&
|
|
1533
|
-
maskExpression.currentValue.split(
|
|
1512
|
+
maskExpression.currentValue.split(MaskExpression.OR).length > 1) {
|
|
1534
1513
|
this._maskExpressionArray = maskExpression.currentValue
|
|
1535
|
-
.split(
|
|
1514
|
+
.split(MaskExpression.OR)
|
|
1536
1515
|
.sort((a, b) => {
|
|
1537
1516
|
return a.length - b.length;
|
|
1538
1517
|
});
|
|
@@ -1540,7 +1519,7 @@ class NgxMaskDirective {
|
|
|
1540
1519
|
}
|
|
1541
1520
|
else {
|
|
1542
1521
|
this._maskExpressionArray = [];
|
|
1543
|
-
this._maskValue = maskExpression.currentValue ||
|
|
1522
|
+
this._maskValue = maskExpression.currentValue || MaskExpression.EMPTY_STRING;
|
|
1544
1523
|
this._maskService.maskExpression = this._maskValue;
|
|
1545
1524
|
}
|
|
1546
1525
|
}
|
|
@@ -1555,10 +1534,9 @@ class NgxMaskDirective {
|
|
|
1555
1534
|
if (allowNegativeNumbers) {
|
|
1556
1535
|
this._maskService.allowNegativeNumbers = allowNegativeNumbers.currentValue;
|
|
1557
1536
|
if (this._maskService.allowNegativeNumbers) {
|
|
1558
|
-
this._maskService.specialCharacters = this._maskService.specialCharacters.filter((c) => c !==
|
|
1537
|
+
this._maskService.specialCharacters = this._maskService.specialCharacters.filter((c) => c !== MaskExpression.MINUS);
|
|
1559
1538
|
}
|
|
1560
1539
|
}
|
|
1561
|
-
// Only overwrite the mask available patterns if a pattern has actually been passed in
|
|
1562
1540
|
if (patterns && patterns.currentValue) {
|
|
1563
1541
|
this._maskService.patterns = patterns.currentValue;
|
|
1564
1542
|
}
|
|
@@ -1642,7 +1620,7 @@ class NgxMaskDirective {
|
|
|
1642
1620
|
if (this._maskService.cpfCnpjError) {
|
|
1643
1621
|
return this._createValidationError(processedValue);
|
|
1644
1622
|
}
|
|
1645
|
-
if (this._maskValue.startsWith(
|
|
1623
|
+
if (this._maskValue.startsWith(MaskExpression.SEPARATOR)) {
|
|
1646
1624
|
return null;
|
|
1647
1625
|
}
|
|
1648
1626
|
if (withoutValidation.includes(this._maskValue)) {
|
|
@@ -1654,7 +1632,7 @@ class NgxMaskDirective {
|
|
|
1654
1632
|
if (timeMasks.includes(this._maskValue)) {
|
|
1655
1633
|
return this._validateTime(processedValue);
|
|
1656
1634
|
}
|
|
1657
|
-
if (this._maskValue ===
|
|
1635
|
+
if (this._maskValue === MaskExpression.EMAIL_MASK) {
|
|
1658
1636
|
const emailPattern = /^[^@]+@[^@]+\.[^@]+$/;
|
|
1659
1637
|
if (!emailPattern.test(processedValue) && processedValue) {
|
|
1660
1638
|
return this._createValidationError(processedValue);
|
|
@@ -1665,23 +1643,23 @@ class NgxMaskDirective {
|
|
|
1665
1643
|
}
|
|
1666
1644
|
if (processedValue && processedValue.length >= 1) {
|
|
1667
1645
|
let counterOfOpt = 0;
|
|
1668
|
-
if (this._maskValue.includes(
|
|
1669
|
-
this._maskValue.includes(
|
|
1670
|
-
const lengthInsideCurlyBrackets = this._maskValue.slice(this._maskValue.indexOf(
|
|
1646
|
+
if (this._maskValue.includes(MaskExpression.CURLY_BRACKETS_LEFT) &&
|
|
1647
|
+
this._maskValue.includes(MaskExpression.CURLY_BRACKETS_RIGHT)) {
|
|
1648
|
+
const lengthInsideCurlyBrackets = this._maskValue.slice(this._maskValue.indexOf(MaskExpression.CURLY_BRACKETS_LEFT) + 1, this._maskValue.indexOf(MaskExpression.CURLY_BRACKETS_RIGHT));
|
|
1671
1649
|
return lengthInsideCurlyBrackets === String(processedValue.length)
|
|
1672
1650
|
? null
|
|
1673
1651
|
: this._createValidationError(processedValue);
|
|
1674
1652
|
}
|
|
1675
|
-
if (this._maskValue.startsWith(
|
|
1653
|
+
if (this._maskValue.startsWith(MaskExpression.PERCENT)) {
|
|
1676
1654
|
return null;
|
|
1677
1655
|
}
|
|
1678
1656
|
for (const key in this._maskService.patterns) {
|
|
1679
1657
|
if (this._maskService.patterns[key]?.optional) {
|
|
1680
1658
|
if (this._maskValue.indexOf(key) !== this._maskValue.lastIndexOf(key)) {
|
|
1681
1659
|
const opt = this._maskValue
|
|
1682
|
-
.split(
|
|
1660
|
+
.split(MaskExpression.EMPTY_STRING)
|
|
1683
1661
|
.filter((i) => i === key)
|
|
1684
|
-
.join(
|
|
1662
|
+
.join(MaskExpression.EMPTY_STRING);
|
|
1685
1663
|
counterOfOpt += opt.length;
|
|
1686
1664
|
}
|
|
1687
1665
|
else if (this._maskValue.indexOf(key) !== -1) {
|
|
@@ -1696,14 +1674,14 @@ class NgxMaskDirective {
|
|
|
1696
1674
|
}
|
|
1697
1675
|
}
|
|
1698
1676
|
}
|
|
1699
|
-
if ((this._maskValue.indexOf(
|
|
1700
|
-
processedValue.length < this._maskValue.indexOf(
|
|
1701
|
-
(this._maskValue.indexOf(
|
|
1702
|
-
processedValue.length < this._maskValue.indexOf(
|
|
1677
|
+
if ((this._maskValue.indexOf(MaskExpression.SYMBOL_STAR) > 1 &&
|
|
1678
|
+
processedValue.length < this._maskValue.indexOf(MaskExpression.SYMBOL_STAR)) ||
|
|
1679
|
+
(this._maskValue.indexOf(MaskExpression.SYMBOL_QUESTION) > 1 &&
|
|
1680
|
+
processedValue.length < this._maskValue.indexOf(MaskExpression.SYMBOL_QUESTION))) {
|
|
1703
1681
|
return this._createValidationError(processedValue);
|
|
1704
1682
|
}
|
|
1705
|
-
if (this._maskValue.indexOf(
|
|
1706
|
-
this._maskValue.indexOf(
|
|
1683
|
+
if (this._maskValue.indexOf(MaskExpression.SYMBOL_STAR) === -1 ||
|
|
1684
|
+
this._maskValue.indexOf(MaskExpression.SYMBOL_QUESTION) === -1) {
|
|
1707
1685
|
const array = this._maskValue.split('*');
|
|
1708
1686
|
const length = this._maskService.dropSpecialCharacters
|
|
1709
1687
|
? this._maskValue.length -
|
|
@@ -1740,8 +1718,8 @@ class NgxMaskDirective {
|
|
|
1740
1718
|
}
|
|
1741
1719
|
}
|
|
1742
1720
|
}
|
|
1743
|
-
if (this._maskValue.indexOf(
|
|
1744
|
-
this._maskValue.indexOf(
|
|
1721
|
+
if (this._maskValue.indexOf(MaskExpression.SYMBOL_STAR) === 1 ||
|
|
1722
|
+
this._maskValue.indexOf(MaskExpression.SYMBOL_QUESTION) === 1) {
|
|
1745
1723
|
return null;
|
|
1746
1724
|
}
|
|
1747
1725
|
}
|
|
@@ -1758,16 +1736,14 @@ class NgxMaskDirective {
|
|
|
1758
1736
|
this._isFocused = true;
|
|
1759
1737
|
}
|
|
1760
1738
|
onModelChange(value) {
|
|
1761
|
-
|
|
1762
|
-
if ((value === "" /* MaskExpression.EMPTY_STRING */ ||
|
|
1739
|
+
if ((value === MaskExpression.EMPTY_STRING ||
|
|
1763
1740
|
value === null ||
|
|
1764
1741
|
typeof value === 'undefined') &&
|
|
1765
1742
|
this._maskService.actualValue) {
|
|
1766
|
-
this._maskService.actualValue = this._maskService.getActualValue(
|
|
1743
|
+
this._maskService.actualValue = this._maskService.getActualValue(MaskExpression.EMPTY_STRING);
|
|
1767
1744
|
}
|
|
1768
1745
|
}
|
|
1769
1746
|
onInput(e) {
|
|
1770
|
-
// If IME is composing text, we wait for the composed text.
|
|
1771
1747
|
if (this._isComposing) {
|
|
1772
1748
|
return;
|
|
1773
1749
|
}
|
|
@@ -1791,14 +1767,14 @@ class NgxMaskDirective {
|
|
|
1791
1767
|
const inputSymbol = el.value.slice(position - 1, position);
|
|
1792
1768
|
const prefixLength = this.prefix.length;
|
|
1793
1769
|
const checkSymbols = this._maskService._checkSymbolMask(inputSymbol, this._maskService.maskExpression[position - 1 - prefixLength] ??
|
|
1794
|
-
|
|
1770
|
+
MaskExpression.EMPTY_STRING);
|
|
1795
1771
|
const checkSpecialCharacter = this._maskService._checkSymbolMask(inputSymbol, this._maskService.maskExpression[position + 1 - prefixLength] ??
|
|
1796
|
-
|
|
1772
|
+
MaskExpression.EMPTY_STRING);
|
|
1797
1773
|
const selectRangeBackspace = this._maskService.selStart === this._maskService.selEnd;
|
|
1798
1774
|
const selStart = Number(this._maskService.selStart) - prefixLength;
|
|
1799
1775
|
const selEnd = Number(this._maskService.selEnd) - prefixLength;
|
|
1800
|
-
const backspaceOrDelete = this._code ===
|
|
1801
|
-
this._code ===
|
|
1776
|
+
const backspaceOrDelete = this._code === MaskExpression.BACKSPACE ||
|
|
1777
|
+
this._code === MaskExpression.DELETE;
|
|
1802
1778
|
if (backspaceOrDelete) {
|
|
1803
1779
|
if (!selectRangeBackspace) {
|
|
1804
1780
|
if (this._maskService.selStart === prefixLength) {
|
|
@@ -1831,7 +1807,7 @@ class NgxMaskDirective {
|
|
|
1831
1807
|
this._maskService.actualValue = `${part1}${this._maskService.placeHolderCharacter}${part2}`;
|
|
1832
1808
|
}
|
|
1833
1809
|
}
|
|
1834
|
-
position = this._code ===
|
|
1810
|
+
position = this._code === MaskExpression.DELETE ? position + 1 : position;
|
|
1835
1811
|
}
|
|
1836
1812
|
if (!backspaceOrDelete) {
|
|
1837
1813
|
if (!checkSymbols && !checkSpecialCharacter && selectRangeBackspace) {
|
|
@@ -1858,19 +1834,19 @@ class NgxMaskDirective {
|
|
|
1858
1834
|
el.value.length === 1 &&
|
|
1859
1835
|
position - prefixLength === 1 &&
|
|
1860
1836
|
this._maskService._checkSymbolMask(el.value, this._maskService.maskExpression[position - 1 - prefixLength] ??
|
|
1861
|
-
|
|
1837
|
+
MaskExpression.EMPTY_STRING)) {
|
|
1862
1838
|
this._maskService.actualValue = `${this.prefix}${el.value}${this._maskService.maskIsShown.slice(1, this._maskService.maskIsShown.length)}${this.suffix}`;
|
|
1863
1839
|
}
|
|
1864
1840
|
}
|
|
1865
1841
|
}
|
|
1866
1842
|
let caretShift = 0;
|
|
1867
1843
|
let backspaceShift = false;
|
|
1868
|
-
if (this._code ===
|
|
1844
|
+
if (this._code === MaskExpression.DELETE && MaskExpression.SEPARATOR) {
|
|
1869
1845
|
this._maskService.deletedSpecialCharacter = true;
|
|
1870
1846
|
}
|
|
1871
1847
|
if (this._inputValue.length >= this._maskService.maskExpression.length - 1 &&
|
|
1872
|
-
this._code !==
|
|
1873
|
-
this._maskService.maskExpression ===
|
|
1848
|
+
this._code !== MaskExpression.BACKSPACE &&
|
|
1849
|
+
this._maskService.maskExpression === MaskExpression.DAYS_MONTHS_YEARS &&
|
|
1874
1850
|
position < 10) {
|
|
1875
1851
|
const inputSymbol = this._inputValue.slice(position - 1, position);
|
|
1876
1852
|
el.value =
|
|
@@ -1878,29 +1854,28 @@ class NgxMaskDirective {
|
|
|
1878
1854
|
inputSymbol +
|
|
1879
1855
|
this._inputValue.slice(position + 1);
|
|
1880
1856
|
}
|
|
1881
|
-
if (this._maskService.maskExpression ===
|
|
1857
|
+
if (this._maskService.maskExpression === MaskExpression.DAYS_MONTHS_YEARS &&
|
|
1882
1858
|
this.leadZeroDateTime) {
|
|
1883
1859
|
if ((position < 3 && Number(el.value) > 31 && Number(el.value) < 40) ||
|
|
1884
1860
|
(position === 5 && Number(el.value.slice(3, 5)) > 12)) {
|
|
1885
1861
|
position = position + 2;
|
|
1886
1862
|
}
|
|
1887
1863
|
}
|
|
1888
|
-
if (this._maskService.maskExpression ===
|
|
1864
|
+
if (this._maskService.maskExpression === MaskExpression.HOURS_MINUTES_SECONDS &&
|
|
1889
1865
|
this.apm) {
|
|
1890
|
-
if (this._justPasted && el.value.slice(0, 2) ===
|
|
1866
|
+
if (this._justPasted && el.value.slice(0, 2) === MaskExpression.DOUBLE_ZERO) {
|
|
1891
1867
|
el.value = el.value.slice(1, 2) + el.value.slice(2, el.value.length);
|
|
1892
1868
|
}
|
|
1893
1869
|
el.value =
|
|
1894
|
-
el.value ===
|
|
1895
|
-
?
|
|
1870
|
+
el.value === MaskExpression.DOUBLE_ZERO
|
|
1871
|
+
? MaskExpression.NUMBER_ZERO
|
|
1896
1872
|
: el.value;
|
|
1897
1873
|
}
|
|
1898
|
-
this._maskService.applyValueChanges(position, this._justPasted, this._code ===
|
|
1874
|
+
this._maskService.applyValueChanges(position, this._justPasted, this._code === MaskExpression.BACKSPACE || this._code === MaskExpression.DELETE, (shift, _backspaceShift) => {
|
|
1899
1875
|
this._justPasted = false;
|
|
1900
1876
|
caretShift = shift;
|
|
1901
1877
|
backspaceShift = _backspaceShift;
|
|
1902
1878
|
});
|
|
1903
|
-
// only set the selection if the element is active
|
|
1904
1879
|
if (this._getActiveElement() !== el) {
|
|
1905
1880
|
return;
|
|
1906
1881
|
}
|
|
@@ -1908,9 +1883,8 @@ class NgxMaskDirective {
|
|
|
1908
1883
|
position = position + 1;
|
|
1909
1884
|
this._maskService.plusOnePosition = false;
|
|
1910
1885
|
}
|
|
1911
|
-
// update position after applyValueChanges to prevent cursor on wrong position when it has an array of maskExpression
|
|
1912
1886
|
if (this._maskExpressionArray.length) {
|
|
1913
|
-
if (this._code ===
|
|
1887
|
+
if (this._code === MaskExpression.BACKSPACE) {
|
|
1914
1888
|
const specialChartMinusOne = this.specialCharacters.includes(this._maskService.actualValue.slice(position - 1, position));
|
|
1915
1889
|
const specialChartPlusOne = this.specialCharacters.includes(this._maskService.actualValue.slice(position, position + 1));
|
|
1916
1890
|
if (this._allowFewMaskChangeMask && !specialChartPlusOne) {
|
|
@@ -1933,7 +1907,7 @@ class NgxMaskDirective {
|
|
|
1933
1907
|
let positionToApply = this._position
|
|
1934
1908
|
? this._inputValue.length + position + caretShift
|
|
1935
1909
|
: position +
|
|
1936
|
-
(this._code ===
|
|
1910
|
+
(this._code === MaskExpression.BACKSPACE && !backspaceShift ? 0 : caretShift);
|
|
1937
1911
|
if (positionToApply > this._getActualInputLength()) {
|
|
1938
1912
|
positionToApply =
|
|
1939
1913
|
el.value === this._maskService.decimalMarker && el.value.length === 1
|
|
@@ -1947,7 +1921,6 @@ class NgxMaskDirective {
|
|
|
1947
1921
|
this._position = null;
|
|
1948
1922
|
}
|
|
1949
1923
|
else {
|
|
1950
|
-
// eslint-disable-next-line no-console
|
|
1951
1924
|
console.warn('Ngx-mask writeValue work with string | number, your current value:', typeof transformedValue);
|
|
1952
1925
|
}
|
|
1953
1926
|
}
|
|
@@ -1956,14 +1929,12 @@ class NgxMaskDirective {
|
|
|
1956
1929
|
this.onChange(el.value);
|
|
1957
1930
|
return;
|
|
1958
1931
|
}
|
|
1959
|
-
this._maskService.applyValueChanges(el.value.length, this._justPasted, this._code ===
|
|
1932
|
+
this._maskService.applyValueChanges(el.value.length, this._justPasted, this._code === MaskExpression.BACKSPACE || this._code === MaskExpression.DELETE);
|
|
1960
1933
|
}
|
|
1961
1934
|
}
|
|
1962
|
-
// IME starts
|
|
1963
1935
|
onCompositionStart() {
|
|
1964
1936
|
this._isComposing = true;
|
|
1965
1937
|
}
|
|
1966
|
-
// IME completes
|
|
1967
1938
|
onCompositionEnd(e) {
|
|
1968
1939
|
this._isComposing = false;
|
|
1969
1940
|
this._justPasted = true;
|
|
@@ -1984,11 +1955,11 @@ class NgxMaskDirective {
|
|
|
1984
1955
|
const decimalPart = el.value.split(this._maskService.decimalMarker)[1];
|
|
1985
1956
|
el.value = el.value.includes(this._maskService.decimalMarker)
|
|
1986
1957
|
? el.value +
|
|
1987
|
-
|
|
1958
|
+
MaskExpression.NUMBER_ZERO.repeat(precision - decimalPart.length) +
|
|
1988
1959
|
this._maskService.suffix
|
|
1989
1960
|
: el.value +
|
|
1990
1961
|
this._maskService.decimalMarker +
|
|
1991
|
-
|
|
1962
|
+
MaskExpression.NUMBER_ZERO.repeat(precision) +
|
|
1992
1963
|
this._maskService.suffix;
|
|
1993
1964
|
this._maskService.actualValue = el.value;
|
|
1994
1965
|
}
|
|
@@ -2011,18 +1982,14 @@ class NgxMaskDirective {
|
|
|
2011
1982
|
el.selectionStart > this._maskService.prefix.length &&
|
|
2012
1983
|
e.keyCode !== 38) {
|
|
2013
1984
|
if (this._maskService.showMaskTyped && !this.keepCharacterPositions) {
|
|
2014
|
-
// We are showing the mask in the input
|
|
2015
1985
|
this._maskService.maskIsShown = this._maskService.showMaskInInput();
|
|
2016
1986
|
if (el.setSelectionRange &&
|
|
2017
1987
|
this._maskService.prefix + this._maskService.maskIsShown === el.value) {
|
|
2018
|
-
// the input ONLY contains the mask, so position the cursor at the start
|
|
2019
1988
|
el.focus();
|
|
2020
1989
|
el.setSelectionRange(posStart, posEnd);
|
|
2021
1990
|
}
|
|
2022
1991
|
else {
|
|
2023
|
-
// the input contains some characters already
|
|
2024
1992
|
if (el.selectionStart > this._maskService.actualValue.length) {
|
|
2025
|
-
// if the user clicked beyond our value's length, position the cursor at the end of our value
|
|
2026
1993
|
el.setSelectionRange(this._maskService.actualValue.length, this._maskService.actualValue.length);
|
|
2027
1994
|
}
|
|
2028
1995
|
}
|
|
@@ -2032,11 +1999,9 @@ class NgxMaskDirective {
|
|
|
2032
1999
|
(el.value === this._maskService.prefix
|
|
2033
2000
|
? this._maskService.prefix + this._maskService.maskIsShown
|
|
2034
2001
|
: el.value);
|
|
2035
|
-
/** Fix of cursor position jumping to end in most browsers no matter where cursor is inserted onFocus */
|
|
2036
2002
|
if (el && el.value !== nextValue) {
|
|
2037
2003
|
el.value = nextValue;
|
|
2038
2004
|
}
|
|
2039
|
-
/** fix of cursor position with prefix when mouse click occur */
|
|
2040
2005
|
if (el &&
|
|
2041
2006
|
el.type !== 'number' &&
|
|
2042
2007
|
(el.selectionStart || el.selectionEnd) <=
|
|
@@ -2045,7 +2010,6 @@ class NgxMaskDirective {
|
|
|
2045
2010
|
el.selectionStart = this._maskService.prefix.length + specialCharactersAtTheStart;
|
|
2046
2011
|
return;
|
|
2047
2012
|
}
|
|
2048
|
-
/** select only inserted text */
|
|
2049
2013
|
if (el && el.selectionEnd > this._getActualInputLength()) {
|
|
2050
2014
|
el.selectionEnd = this._getActualInputLength();
|
|
2051
2015
|
}
|
|
@@ -2055,7 +2019,6 @@ class NgxMaskDirective {
|
|
|
2055
2019
|
return;
|
|
2056
2020
|
}
|
|
2057
2021
|
if (this._isComposing) {
|
|
2058
|
-
// User finalize their choice from IME composition, so trigger onInput() for the composed text.
|
|
2059
2022
|
if (e.key === 'Enter') {
|
|
2060
2023
|
this.onCompositionEnd(e);
|
|
2061
2024
|
}
|
|
@@ -2066,17 +2029,16 @@ class NgxMaskDirective {
|
|
|
2066
2029
|
this._inputValue = el.value;
|
|
2067
2030
|
this._setMask();
|
|
2068
2031
|
if (el.type !== 'number') {
|
|
2069
|
-
if (e.key ===
|
|
2032
|
+
if (e.key === MaskExpression.ARROW_UP) {
|
|
2070
2033
|
e.preventDefault();
|
|
2071
2034
|
}
|
|
2072
|
-
if (e.key ===
|
|
2073
|
-
e.key ===
|
|
2074
|
-
e.key ===
|
|
2075
|
-
if (e.key ===
|
|
2035
|
+
if (e.key === MaskExpression.ARROW_LEFT ||
|
|
2036
|
+
e.key === MaskExpression.BACKSPACE ||
|
|
2037
|
+
e.key === MaskExpression.DELETE) {
|
|
2038
|
+
if (e.key === MaskExpression.BACKSPACE && el.value.length === 0) {
|
|
2076
2039
|
el.selectionStart = el.selectionEnd;
|
|
2077
2040
|
}
|
|
2078
|
-
if (e.key ===
|
|
2079
|
-
// If specialChars is false, (shouldn't ever happen) then set to the defaults
|
|
2041
|
+
if (e.key === MaskExpression.BACKSPACE && el.selectionStart !== 0) {
|
|
2080
2042
|
this.specialCharacters = this.specialCharacters?.length
|
|
2081
2043
|
? this.specialCharacters
|
|
2082
2044
|
: this._config.specialCharacters;
|
|
@@ -2088,7 +2050,7 @@ class NgxMaskDirective {
|
|
|
2088
2050
|
if (this._inputValue.length !== el.selectionStart &&
|
|
2089
2051
|
el.selectionStart !== 1) {
|
|
2090
2052
|
while (this.specialCharacters.includes((this._inputValue[el.selectionStart - 1] ??
|
|
2091
|
-
|
|
2053
|
+
MaskExpression.EMPTY_STRING).toString()) &&
|
|
2092
2054
|
((this.prefix.length >= 1 &&
|
|
2093
2055
|
el.selectionStart > this.prefix.length) ||
|
|
2094
2056
|
this.prefix.length === 0)) {
|
|
@@ -2104,7 +2066,7 @@ class NgxMaskDirective {
|
|
|
2104
2066
|
e.preventDefault();
|
|
2105
2067
|
}
|
|
2106
2068
|
const cursorStart = el.selectionStart;
|
|
2107
|
-
if (e.key ===
|
|
2069
|
+
if (e.key === MaskExpression.BACKSPACE &&
|
|
2108
2070
|
!el.readOnly &&
|
|
2109
2071
|
cursorStart === 0 &&
|
|
2110
2072
|
el.selectionEnd === el.value.length &&
|
|
@@ -2119,8 +2081,7 @@ class NgxMaskDirective {
|
|
|
2119
2081
|
el.setSelectionRange(this._inputValue.length - this.suffix.length, this._inputValue.length);
|
|
2120
2082
|
}
|
|
2121
2083
|
else if ((e.code === 'KeyA' && e.ctrlKey) ||
|
|
2122
|
-
(e.code === 'KeyA' && e.metaKey)
|
|
2123
|
-
) {
|
|
2084
|
+
(e.code === 'KeyA' && e.metaKey)) {
|
|
2124
2085
|
el.setSelectionRange(0, this._getActualInputLength());
|
|
2125
2086
|
e.preventDefault();
|
|
2126
2087
|
}
|
|
@@ -2128,7 +2089,6 @@ class NgxMaskDirective {
|
|
|
2128
2089
|
this._maskService.selEnd = el.selectionEnd;
|
|
2129
2090
|
}
|
|
2130
2091
|
}
|
|
2131
|
-
/** It writes the value in the input */
|
|
2132
2092
|
async writeValue(controlValue) {
|
|
2133
2093
|
let value = controlValue;
|
|
2134
2094
|
if (typeof value === 'object' && value !== null && 'value' in value) {
|
|
@@ -2150,7 +2110,7 @@ class NgxMaskDirective {
|
|
|
2150
2110
|
}
|
|
2151
2111
|
let inputValue = value;
|
|
2152
2112
|
if (typeof inputValue === 'number' ||
|
|
2153
|
-
this._maskValue.startsWith(
|
|
2113
|
+
this._maskValue.startsWith(MaskExpression.SEPARATOR)) {
|
|
2154
2114
|
inputValue = String(inputValue);
|
|
2155
2115
|
const localeDecimalMarker = this._maskService.currentLocaleDecimalMarker();
|
|
2156
2116
|
if (!Array.isArray(this._maskService.decimalMarker)) {
|
|
@@ -2165,14 +2125,14 @@ class NgxMaskDirective {
|
|
|
2165
2125
|
this.dropSpecialCharacters !== false) {
|
|
2166
2126
|
inputValue = this._maskService._checkPrecision(this._maskService.maskExpression, inputValue);
|
|
2167
2127
|
}
|
|
2168
|
-
if (this._maskService.decimalMarker ===
|
|
2128
|
+
if (this._maskService.decimalMarker === MaskExpression.COMMA ||
|
|
2169
2129
|
(Array.isArray(this._maskService.decimalMarker) &&
|
|
2170
|
-
this._maskService.thousandSeparator ===
|
|
2130
|
+
this._maskService.thousandSeparator === MaskExpression.DOT)) {
|
|
2171
2131
|
inputValue = inputValue
|
|
2172
2132
|
.toString()
|
|
2173
|
-
.replace(
|
|
2133
|
+
.replace(MaskExpression.DOT, MaskExpression.COMMA);
|
|
2174
2134
|
}
|
|
2175
|
-
if (this.maskExpression?.startsWith(
|
|
2135
|
+
if (this.maskExpression?.startsWith(MaskExpression.SEPARATOR) && this.leadZero) {
|
|
2176
2136
|
requestAnimationFrame(() => {
|
|
2177
2137
|
this._maskService.applyMask(inputValue?.toString() ?? '', this._maskService.maskExpression);
|
|
2178
2138
|
});
|
|
@@ -2187,7 +2147,6 @@ class NgxMaskDirective {
|
|
|
2187
2147
|
if ((inputValue && this._maskService.maskExpression) ||
|
|
2188
2148
|
(this._maskService.maskExpression &&
|
|
2189
2149
|
(this._maskService.prefix || this._maskService.showMaskTyped))) {
|
|
2190
|
-
// Let the service we know we are writing value so that triggering onChange function won't happen during applyMask
|
|
2191
2150
|
if (typeof this.inputTransformFn !== 'function') {
|
|
2192
2151
|
this._maskService.writingValue = true;
|
|
2193
2152
|
}
|
|
@@ -2195,7 +2154,6 @@ class NgxMaskDirective {
|
|
|
2195
2154
|
'value',
|
|
2196
2155
|
this._maskService.applyMask(inputValue, this._maskService.maskExpression),
|
|
2197
2156
|
];
|
|
2198
|
-
// Let the service know we've finished writing value
|
|
2199
2157
|
if (typeof this.inputTransformFn !== 'function') {
|
|
2200
2158
|
this._maskService.writingValue = false;
|
|
2201
2159
|
}
|
|
@@ -2206,7 +2164,6 @@ class NgxMaskDirective {
|
|
|
2206
2164
|
this._inputValue = inputValue;
|
|
2207
2165
|
}
|
|
2208
2166
|
else {
|
|
2209
|
-
// eslint-disable-next-line no-console
|
|
2210
2167
|
console.warn('Ngx-mask writeValue work with string | number, your current value:', typeof value);
|
|
2211
2168
|
}
|
|
2212
2169
|
}
|
|
@@ -2229,7 +2186,6 @@ class NgxMaskDirective {
|
|
|
2229
2186
|
el.selectionStart = Math.min(Math.max(this.prefix.length, el.selectionStart), this._inputValue.length - this.suffix.length);
|
|
2230
2187
|
el.selectionEnd = Math.min(Math.max(this.prefix.length, el.selectionEnd), this._inputValue.length - this.suffix.length);
|
|
2231
2188
|
}
|
|
2232
|
-
/** It disables the input element */
|
|
2233
2189
|
setDisabledState(isDisabled) {
|
|
2234
2190
|
this._maskService.formElementProperty = ['disabled', isDisabled];
|
|
2235
2191
|
}
|
|
@@ -2242,10 +2198,10 @@ class NgxMaskDirective {
|
|
|
2242
2198
|
}
|
|
2243
2199
|
_validateTime(value) {
|
|
2244
2200
|
const rowMaskLen = this._maskValue
|
|
2245
|
-
.split(
|
|
2201
|
+
.split(MaskExpression.EMPTY_STRING)
|
|
2246
2202
|
.filter((s) => s !== ':').length;
|
|
2247
2203
|
if (!value) {
|
|
2248
|
-
return null;
|
|
2204
|
+
return null;
|
|
2249
2205
|
}
|
|
2250
2206
|
if ((+(value[value.length - 1] ?? -1) === 0 && value.length < rowMaskLen) ||
|
|
2251
2207
|
value.length <= rowMaskLen - 2) {
|
|
@@ -2268,33 +2224,33 @@ class NgxMaskDirective {
|
|
|
2268
2224
|
_setMask() {
|
|
2269
2225
|
this._maskExpressionArray.some((mask) => {
|
|
2270
2226
|
const specialChart = mask
|
|
2271
|
-
.split(
|
|
2227
|
+
.split(MaskExpression.EMPTY_STRING)
|
|
2272
2228
|
.some((char) => this._maskService.specialCharacters.includes(char));
|
|
2273
2229
|
if ((specialChart &&
|
|
2274
2230
|
this._inputValue &&
|
|
2275
2231
|
this._areAllCharactersInEachStringSame(this._maskExpressionArray)) ||
|
|
2276
|
-
mask.includes(
|
|
2232
|
+
mask.includes(MaskExpression.CURLY_BRACKETS_LEFT)) {
|
|
2277
2233
|
const test = this._maskService.removeMask(this._inputValue)?.length <=
|
|
2278
2234
|
this._maskService.removeMask(mask)?.length;
|
|
2279
2235
|
if (test) {
|
|
2280
2236
|
this._maskValue =
|
|
2281
2237
|
this.maskExpression =
|
|
2282
2238
|
this._maskService.maskExpression =
|
|
2283
|
-
mask.includes(
|
|
2239
|
+
mask.includes(MaskExpression.CURLY_BRACKETS_LEFT)
|
|
2284
2240
|
? this._maskService._repeatPatternSymbols(mask)
|
|
2285
2241
|
: mask;
|
|
2286
2242
|
return test;
|
|
2287
2243
|
}
|
|
2288
2244
|
else {
|
|
2289
|
-
if (this._code ===
|
|
2245
|
+
if (this._code === MaskExpression.BACKSPACE) {
|
|
2290
2246
|
this._allowFewMaskChangeMask = true;
|
|
2291
2247
|
}
|
|
2292
2248
|
const expression = this._maskExpressionArray[this._maskExpressionArray.length - 1] ??
|
|
2293
|
-
|
|
2249
|
+
MaskExpression.EMPTY_STRING;
|
|
2294
2250
|
this._maskValue =
|
|
2295
2251
|
this.maskExpression =
|
|
2296
2252
|
this._maskService.maskExpression =
|
|
2297
|
-
expression.includes(
|
|
2253
|
+
expression.includes(MaskExpression.CURLY_BRACKETS_LEFT)
|
|
2298
2254
|
? this._maskService._repeatPatternSymbols(expression)
|
|
2299
2255
|
: expression;
|
|
2300
2256
|
}
|
|
@@ -2302,7 +2258,7 @@ class NgxMaskDirective {
|
|
|
2302
2258
|
else {
|
|
2303
2259
|
const check = this._maskService
|
|
2304
2260
|
.removeMask(this._inputValue)
|
|
2305
|
-
?.split(
|
|
2261
|
+
?.split(MaskExpression.EMPTY_STRING)
|
|
2306
2262
|
.every((character, index) => {
|
|
2307
2263
|
const indexMask = mask.charAt(index);
|
|
2308
2264
|
return this._maskService._checkSymbolMask(character, indexMask);
|
|
@@ -2326,8 +2282,8 @@ class NgxMaskDirective {
|
|
|
2326
2282
|
return uniqueCharacters.size === 1;
|
|
2327
2283
|
});
|
|
2328
2284
|
}
|
|
2329
|
-
static
|
|
2330
|
-
static
|
|
2285
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
2286
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0", type: NgxMaskDirective, isStandalone: true, selector: "input[mask], textarea[mask]", inputs: { maskExpression: ["mask", "maskExpression"], specialCharacters: "specialCharacters", patterns: "patterns", prefix: "prefix", suffix: "suffix", thousandSeparator: "thousandSeparator", decimalMarker: "decimalMarker", dropSpecialCharacters: "dropSpecialCharacters", hiddenInput: "hiddenInput", showMaskTyped: "showMaskTyped", placeHolderCharacter: "placeHolderCharacter", shownMaskExpression: "shownMaskExpression", showTemplate: "showTemplate", clearIfNotMatch: "clearIfNotMatch", validation: "validation", separatorLimit: "separatorLimit", allowNegativeNumbers: "allowNegativeNumbers", leadZeroDateTime: "leadZeroDateTime", leadZero: "leadZero", triggerOnMaskChange: "triggerOnMaskChange", apm: "apm", inputTransformFn: "inputTransformFn", outputTransformFn: "outputTransformFn", keepCharacterPositions: "keepCharacterPositions" }, outputs: { maskFilled: "maskFilled" }, host: { listeners: { "paste": "onPaste()", "focus": "onFocus($event)", "ngModelChange": "onModelChange($event)", "input": "onInput($event)", "compositionstart": "onCompositionStart($event)", "compositionend": "onCompositionEnd($event)", "blur": "onBlur($event)", "click": "onClick($event)", "keydown": "onKeyDown($event)" } }, providers: [
|
|
2331
2287
|
{
|
|
2332
2288
|
provide: NG_VALUE_ACCESSOR,
|
|
2333
2289
|
useExisting: NgxMaskDirective,
|
|
@@ -2339,9 +2295,9 @@ class NgxMaskDirective {
|
|
|
2339
2295
|
multi: true,
|
|
2340
2296
|
},
|
|
2341
2297
|
NgxMaskService,
|
|
2342
|
-
], exportAs: ["mask", "ngxMask"], usesOnChanges: true, ngImport: i0 });
|
|
2298
|
+
], exportAs: ["mask", "ngxMask"], usesOnChanges: true, ngImport: i0 });
|
|
2343
2299
|
}
|
|
2344
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2300
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskDirective, decorators: [{
|
|
2345
2301
|
type: Directive,
|
|
2346
2302
|
args: [{
|
|
2347
2303
|
selector: 'input[mask], textarea[mask]',
|
|
@@ -2442,12 +2398,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
|
|
|
2442
2398
|
}] } });
|
|
2443
2399
|
|
|
2444
2400
|
class NgxMaskPipe {
|
|
2445
|
-
|
|
2446
|
-
|
|
2447
|
-
|
|
2448
|
-
|
|
2449
|
-
this.mask = '';
|
|
2450
|
-
}
|
|
2401
|
+
defaultOptions = inject(NGX_MASK_CONFIG);
|
|
2402
|
+
_maskService = inject(NgxMaskService);
|
|
2403
|
+
_maskExpressionArray = [];
|
|
2404
|
+
mask = '';
|
|
2451
2405
|
transform(value, mask, { patterns, ...config } = {}) {
|
|
2452
2406
|
let processedValue = value;
|
|
2453
2407
|
const currentConfig = {
|
|
@@ -2474,10 +2428,10 @@ class NgxMaskPipe {
|
|
|
2474
2428
|
return this._maskService.applyMask(`${processedValue}`, this.mask);
|
|
2475
2429
|
}
|
|
2476
2430
|
}
|
|
2477
|
-
if (mask.includes(
|
|
2431
|
+
if (mask.includes(MaskExpression.CURLY_BRACKETS_LEFT)) {
|
|
2478
2432
|
return this._maskService.applyMask(`${processedValue}`, this._maskService._repeatPatternSymbols(mask));
|
|
2479
2433
|
}
|
|
2480
|
-
if (mask.startsWith(
|
|
2434
|
+
if (mask.startsWith(MaskExpression.SEPARATOR)) {
|
|
2481
2435
|
if (config.decimalMarker) {
|
|
2482
2436
|
this._maskService.decimalMarker = config.decimalMarker;
|
|
2483
2437
|
}
|
|
@@ -2500,8 +2454,8 @@ class NgxMaskPipe {
|
|
|
2500
2454
|
this._maskService.dropSpecialCharacters !== false) {
|
|
2501
2455
|
processedValue = this._maskService._checkPrecision(mask, processedValue);
|
|
2502
2456
|
}
|
|
2503
|
-
if (this._maskService.decimalMarker ===
|
|
2504
|
-
processedValue = processedValue.replace(
|
|
2457
|
+
if (this._maskService.decimalMarker === MaskExpression.COMMA) {
|
|
2458
|
+
processedValue = processedValue.replace(MaskExpression.DOT, MaskExpression.COMMA);
|
|
2505
2459
|
}
|
|
2506
2460
|
this._maskService.isNumberValue = true;
|
|
2507
2461
|
}
|
|
@@ -2521,16 +2475,16 @@ class NgxMaskPipe {
|
|
|
2521
2475
|
}
|
|
2522
2476
|
else {
|
|
2523
2477
|
const expression = this._maskExpressionArray[this._maskExpressionArray.length - 1] ??
|
|
2524
|
-
|
|
2478
|
+
MaskExpression.EMPTY_STRING;
|
|
2525
2479
|
this.mask = expression;
|
|
2526
2480
|
}
|
|
2527
2481
|
});
|
|
2528
2482
|
}
|
|
2529
2483
|
}
|
|
2530
|
-
static
|
|
2531
|
-
static
|
|
2484
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
2485
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskPipe, isStandalone: true, name: "mask" });
|
|
2532
2486
|
}
|
|
2533
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2487
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: NgxMaskPipe, decorators: [{
|
|
2534
2488
|
type: Pipe,
|
|
2535
2489
|
args: [{
|
|
2536
2490
|
name: 'mask',
|
|
@@ -2539,9 +2493,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
|
|
|
2539
2493
|
}]
|
|
2540
2494
|
}] });
|
|
2541
2495
|
|
|
2542
|
-
/**
|
|
2543
|
-
* Generated bundle index. Do not edit.
|
|
2544
|
-
*/
|
|
2545
|
-
|
|
2546
2496
|
export { INITIAL_CONFIG, NEW_CONFIG, NGX_MASK_CONFIG, NgxMaskDirective, NgxMaskPipe, NgxMaskService, initialConfig, provideEnvironmentNgxMask, provideNgxMask, timeMasks, withoutValidation };
|
|
2547
2497
|
//# sourceMappingURL=ngx-mask.mjs.map
|