matcha-components 20.43.0 → 20.45.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/matcha-components.mjs +1618 -1237
- package/fesm2022/matcha-components.mjs.map +1 -1
- package/index.d.ts +141 -75
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Output, HostBinding, Input, Component, ContentChildren, ElementRef, Renderer2, Inject, PLATFORM_ID, Injectable, ViewChild, ContentChild, HostListener, Directive, forwardRef, ChangeDetectionStrategy, InjectionToken, inject, DOCUMENT,
|
|
2
|
+
import { EventEmitter, Output, HostBinding, Input, Component, ContentChildren, ElementRef, Renderer2, Inject, PLATFORM_ID, Injectable, ViewChild, ContentChild, HostListener, Directive, forwardRef, ChangeDetectionStrategy, InjectionToken, inject, DOCUMENT, TemplateRef, Optional, ViewEncapsulation, NgModule, createComponent, input, output, signal, Pipe } from '@angular/core';
|
|
3
3
|
import { animation, style, animate, trigger, transition, useAnimation, state, query, stagger, animateChild, sequence, group } from '@angular/animations';
|
|
4
4
|
import { Subscription, Subject, BehaviorSubject, of, fromEvent } from 'rxjs';
|
|
5
5
|
import { debounceTime, startWith, map, distinctUntilChanged, takeUntil, filter } from 'rxjs/operators';
|
|
@@ -6364,42 +6364,42 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
|
|
|
6364
6364
|
type: Injectable
|
|
6365
6365
|
}] });
|
|
6366
6366
|
|
|
6367
|
-
class
|
|
6367
|
+
class MatchaMaskCompatibleDirective {
|
|
6368
6368
|
constructor() {
|
|
6369
|
-
this.mask =
|
|
6370
|
-
this.specialCharacters =
|
|
6371
|
-
this.patterns =
|
|
6372
|
-
this.prefix =
|
|
6373
|
-
this.suffix =
|
|
6374
|
-
this.thousandSeparator =
|
|
6375
|
-
this.decimalMarker =
|
|
6376
|
-
this.dropSpecialCharacters =
|
|
6377
|
-
this.hiddenInput =
|
|
6378
|
-
this.showMaskTyped =
|
|
6379
|
-
this.placeHolderCharacter =
|
|
6380
|
-
this.shownMaskExpression =
|
|
6381
|
-
this.clearIfNotMatch =
|
|
6382
|
-
this.validation =
|
|
6383
|
-
this.separatorLimit =
|
|
6384
|
-
this.allowNegativeNumbers =
|
|
6385
|
-
this.leadZeroDateTime =
|
|
6386
|
-
this.leadZero =
|
|
6387
|
-
this.triggerOnMaskChange =
|
|
6388
|
-
this.apm =
|
|
6389
|
-
this.inputTransformFn =
|
|
6390
|
-
this.outputTransformFn =
|
|
6391
|
-
this.keepCharacterPositions =
|
|
6392
|
-
this.instantPrefix =
|
|
6393
|
-
this.maskFilled =
|
|
6394
|
-
this._maskValue =
|
|
6395
|
-
this._inputValue =
|
|
6396
|
-
this._position =
|
|
6397
|
-
this._code =
|
|
6398
|
-
this._maskExpressionArray =
|
|
6399
|
-
this._justPasted =
|
|
6400
|
-
this._isFocused =
|
|
6369
|
+
this.mask = '';
|
|
6370
|
+
this.specialCharacters = [];
|
|
6371
|
+
this.patterns = {};
|
|
6372
|
+
this.prefix = '';
|
|
6373
|
+
this.suffix = '';
|
|
6374
|
+
this.thousandSeparator = ' ';
|
|
6375
|
+
this.decimalMarker = '.';
|
|
6376
|
+
this.dropSpecialCharacters = null;
|
|
6377
|
+
this.hiddenInput = null;
|
|
6378
|
+
this.showMaskTyped = null;
|
|
6379
|
+
this.placeHolderCharacter = null;
|
|
6380
|
+
this.shownMaskExpression = null;
|
|
6381
|
+
this.clearIfNotMatch = null;
|
|
6382
|
+
this.validation = null;
|
|
6383
|
+
this.separatorLimit = '';
|
|
6384
|
+
this.allowNegativeNumbers = null;
|
|
6385
|
+
this.leadZeroDateTime = null;
|
|
6386
|
+
this.leadZero = null;
|
|
6387
|
+
this.triggerOnMaskChange = null;
|
|
6388
|
+
this.apm = null;
|
|
6389
|
+
this.inputTransformFn = null;
|
|
6390
|
+
this.outputTransformFn = null;
|
|
6391
|
+
this.keepCharacterPositions = null;
|
|
6392
|
+
this.instantPrefix = null;
|
|
6393
|
+
this.maskFilled = new EventEmitter();
|
|
6394
|
+
this._maskValue = '';
|
|
6395
|
+
this._inputValue = '';
|
|
6396
|
+
this._position = null;
|
|
6397
|
+
this._code = '';
|
|
6398
|
+
this._maskExpressionArray = [];
|
|
6399
|
+
this._justPasted = false;
|
|
6400
|
+
this._isFocused = false;
|
|
6401
6401
|
/**For IME composition event */
|
|
6402
|
-
this._isComposing =
|
|
6402
|
+
this._isComposing = false;
|
|
6403
6403
|
this._maskService = inject(MatchaMaskService, { self: true });
|
|
6404
6404
|
this.document = inject(DOCUMENT);
|
|
6405
6405
|
this._config = inject(MATCHA_MASK_CONFIG);
|
|
@@ -6411,96 +6411,35 @@ class MatchaMaskDirective {
|
|
|
6411
6411
|
ngOnChanges(changes) {
|
|
6412
6412
|
const { mask, specialCharacters, patterns, prefix, suffix, thousandSeparator, decimalMarker, dropSpecialCharacters, hiddenInput, showMaskTyped, placeHolderCharacter, shownMaskExpression, clearIfNotMatch, validation, separatorLimit, allowNegativeNumbers, leadZeroDateTime, leadZero, triggerOnMaskChange, apm, inputTransformFn, outputTransformFn, keepCharacterPositions, instantPrefix, } = changes;
|
|
6413
6413
|
if (mask) {
|
|
6414
|
-
|
|
6415
|
-
|
|
6416
|
-
}
|
|
6417
|
-
if (mask.currentValue && mask.currentValue.split("||" /* MaskExpression.OR */).length > 1) {
|
|
6418
|
-
this._maskExpressionArray.set(mask.currentValue.split("||" /* MaskExpression.OR */).sort((a, b) => {
|
|
6419
|
-
return a.length - b.length;
|
|
6420
|
-
}));
|
|
6421
|
-
this._setMask();
|
|
6422
|
-
}
|
|
6423
|
-
else {
|
|
6424
|
-
this._maskExpressionArray.set([]);
|
|
6425
|
-
this._maskValue.set(mask.currentValue || "" /* MaskExpression.EMPTY_STRING */);
|
|
6426
|
-
this._maskService.maskExpression = this._maskValue();
|
|
6427
|
-
}
|
|
6414
|
+
this._maskValue = mask.currentValue ?? '';
|
|
6415
|
+
this._maskExpressionArray = this._maskValue.split('');
|
|
6428
6416
|
}
|
|
6429
6417
|
if (specialCharacters) {
|
|
6430
|
-
|
|
6431
|
-
return;
|
|
6432
|
-
}
|
|
6433
|
-
else {
|
|
6434
|
-
this._maskService.specialCharacters = specialCharacters.currentValue || [];
|
|
6435
|
-
}
|
|
6436
|
-
}
|
|
6437
|
-
if (allowNegativeNumbers) {
|
|
6438
|
-
this._maskService.allowNegativeNumbers = allowNegativeNumbers.currentValue;
|
|
6439
|
-
if (this._maskService.allowNegativeNumbers) {
|
|
6440
|
-
this._maskService.specialCharacters = this._maskService.specialCharacters.filter((c) => c !== "-" /* MaskExpression.MINUS */);
|
|
6441
|
-
}
|
|
6442
|
-
}
|
|
6443
|
-
// Only overwrite the mask available patterns if a pattern has actually been passed in
|
|
6444
|
-
if (patterns && patterns.currentValue) {
|
|
6445
|
-
this._maskService.patterns = patterns.currentValue;
|
|
6446
|
-
}
|
|
6447
|
-
if (apm && apm.currentValue) {
|
|
6448
|
-
this._maskService.apm = apm.currentValue;
|
|
6418
|
+
this._maskService.specialCharacters = specialCharacters.currentValue ?? [];
|
|
6449
6419
|
}
|
|
6450
|
-
if (
|
|
6451
|
-
this._maskService.
|
|
6420
|
+
if (patterns) {
|
|
6421
|
+
this._maskService.patterns = patterns.currentValue ?? {};
|
|
6452
6422
|
}
|
|
6453
6423
|
if (prefix) {
|
|
6454
|
-
this._maskService.prefix = prefix.currentValue;
|
|
6424
|
+
this._maskService.prefix = prefix.currentValue ?? '';
|
|
6455
6425
|
}
|
|
6456
6426
|
if (suffix) {
|
|
6457
|
-
this._maskService.suffix = suffix.currentValue;
|
|
6427
|
+
this._maskService.suffix = suffix.currentValue ?? '';
|
|
6458
6428
|
}
|
|
6459
6429
|
if (thousandSeparator) {
|
|
6460
|
-
this._maskService.thousandSeparator = thousandSeparator.currentValue;
|
|
6461
|
-
if (thousandSeparator.previousValue && thousandSeparator.currentValue) {
|
|
6462
|
-
const previousDecimalMarker = this._maskService.decimalMarker;
|
|
6463
|
-
if (thousandSeparator.currentValue === this._maskService.decimalMarker) {
|
|
6464
|
-
this._maskService.decimalMarker =
|
|
6465
|
-
thousandSeparator.currentValue === "," /* MaskExpression.COMMA */
|
|
6466
|
-
? "." /* MaskExpression.DOT */
|
|
6467
|
-
: "," /* MaskExpression.COMMA */;
|
|
6468
|
-
}
|
|
6469
|
-
if (this._maskService.dropSpecialCharacters === true) {
|
|
6470
|
-
this._maskService.specialCharacters = this._config.specialCharacters;
|
|
6471
|
-
}
|
|
6472
|
-
if (typeof previousDecimalMarker === 'string' &&
|
|
6473
|
-
typeof this._maskService.decimalMarker === 'string') {
|
|
6474
|
-
this._inputValue.set(this._inputValue()
|
|
6475
|
-
.split(thousandSeparator.previousValue)
|
|
6476
|
-
.join('')
|
|
6477
|
-
.replace(previousDecimalMarker, this._maskService.decimalMarker));
|
|
6478
|
-
this._maskService.actualValue = this._inputValue();
|
|
6479
|
-
}
|
|
6480
|
-
this._maskService.writingValue = true;
|
|
6481
|
-
}
|
|
6430
|
+
this._maskService.thousandSeparator = thousandSeparator.currentValue ?? ' ';
|
|
6482
6431
|
}
|
|
6483
6432
|
if (decimalMarker) {
|
|
6484
|
-
this._maskService.decimalMarker = decimalMarker.currentValue;
|
|
6433
|
+
this._maskService.decimalMarker = decimalMarker.currentValue ?? '.';
|
|
6485
6434
|
}
|
|
6486
6435
|
if (dropSpecialCharacters) {
|
|
6487
6436
|
this._maskService.dropSpecialCharacters = dropSpecialCharacters.currentValue;
|
|
6488
6437
|
}
|
|
6489
6438
|
if (hiddenInput) {
|
|
6490
6439
|
this._maskService.hiddenInput = hiddenInput.currentValue;
|
|
6491
|
-
if (hiddenInput.previousValue === true && hiddenInput.currentValue === false) {
|
|
6492
|
-
this._inputValue.set(this._maskService.actualValue);
|
|
6493
|
-
}
|
|
6494
6440
|
}
|
|
6495
6441
|
if (showMaskTyped) {
|
|
6496
6442
|
this._maskService.showMaskTyped = showMaskTyped.currentValue;
|
|
6497
|
-
if (showMaskTyped.previousValue === false &&
|
|
6498
|
-
showMaskTyped.currentValue === true &&
|
|
6499
|
-
this._isFocused()) {
|
|
6500
|
-
requestAnimationFrame(() => {
|
|
6501
|
-
this._maskService._elementRef?.nativeElement.click();
|
|
6502
|
-
});
|
|
6503
|
-
}
|
|
6504
6443
|
}
|
|
6505
6444
|
if (placeHolderCharacter) {
|
|
6506
6445
|
this._maskService.placeHolderCharacter = placeHolderCharacter.currentValue;
|
|
@@ -6515,7 +6454,10 @@ class MatchaMaskDirective {
|
|
|
6515
6454
|
this._maskService.validation = validation.currentValue;
|
|
6516
6455
|
}
|
|
6517
6456
|
if (separatorLimit) {
|
|
6518
|
-
this._maskService.separatorLimit = separatorLimit.currentValue;
|
|
6457
|
+
this._maskService.separatorLimit = separatorLimit.currentValue ?? '';
|
|
6458
|
+
}
|
|
6459
|
+
if (allowNegativeNumbers) {
|
|
6460
|
+
this._maskService.allowNegativeNumbers = allowNegativeNumbers.currentValue;
|
|
6519
6461
|
}
|
|
6520
6462
|
if (leadZeroDateTime) {
|
|
6521
6463
|
this._maskService.leadZeroDateTime = leadZeroDateTime.currentValue;
|
|
@@ -6526,6 +6468,9 @@ class MatchaMaskDirective {
|
|
|
6526
6468
|
if (triggerOnMaskChange) {
|
|
6527
6469
|
this._maskService.triggerOnMaskChange = triggerOnMaskChange.currentValue;
|
|
6528
6470
|
}
|
|
6471
|
+
if (apm) {
|
|
6472
|
+
this._maskService.apm = apm.currentValue;
|
|
6473
|
+
}
|
|
6529
6474
|
if (inputTransformFn) {
|
|
6530
6475
|
this._maskService.inputTransformFn = inputTransformFn.currentValue;
|
|
6531
6476
|
}
|
|
@@ -6535,1045 +6480,487 @@ class MatchaMaskDirective {
|
|
|
6535
6480
|
if (keepCharacterPositions) {
|
|
6536
6481
|
this._maskService.keepCharacterPositions = keepCharacterPositions.currentValue;
|
|
6537
6482
|
}
|
|
6538
|
-
|
|
6539
|
-
|
|
6540
|
-
validate({ value }) {
|
|
6541
|
-
const processedValue = typeof value === 'number' ? String(value) : value;
|
|
6542
|
-
const maskValue = this._maskValue();
|
|
6543
|
-
if (!this._maskService.validation || !maskValue) {
|
|
6544
|
-
return null;
|
|
6545
|
-
}
|
|
6546
|
-
if (this._maskService.ipError) {
|
|
6547
|
-
return this._createValidationError(processedValue);
|
|
6548
|
-
}
|
|
6549
|
-
if (this._maskService.cpfCnpjError) {
|
|
6550
|
-
return this._createValidationError(processedValue);
|
|
6551
|
-
}
|
|
6552
|
-
if (maskValue.startsWith("separator" /* MaskExpression.SEPARATOR */)) {
|
|
6553
|
-
return null;
|
|
6554
|
-
}
|
|
6555
|
-
if (withoutValidation.includes(maskValue)) {
|
|
6556
|
-
return null;
|
|
6557
|
-
}
|
|
6558
|
-
if (this._maskService.clearIfNotMatch) {
|
|
6559
|
-
return null;
|
|
6483
|
+
if (instantPrefix) {
|
|
6484
|
+
this._maskService.instantPrefix = instantPrefix.currentValue;
|
|
6560
6485
|
}
|
|
6561
|
-
|
|
6562
|
-
|
|
6486
|
+
}
|
|
6487
|
+
onPaste() {
|
|
6488
|
+
this._justPasted = true;
|
|
6489
|
+
}
|
|
6490
|
+
onFocus(event) {
|
|
6491
|
+
this._isFocused = true;
|
|
6492
|
+
// Implementar lógica de foco se necessário
|
|
6493
|
+
}
|
|
6494
|
+
onModelChange(value) {
|
|
6495
|
+
if (this._maskService.writingValue) {
|
|
6496
|
+
return;
|
|
6563
6497
|
}
|
|
6564
|
-
|
|
6565
|
-
|
|
6566
|
-
|
|
6567
|
-
|
|
6498
|
+
this._inputValue = value;
|
|
6499
|
+
// Aplicar máscara se definida
|
|
6500
|
+
if (this.mask && this.mask.trim() !== '') {
|
|
6501
|
+
const maskedValue = this._maskService.applyMask(value, this.mask);
|
|
6502
|
+
if (maskedValue !== value) {
|
|
6503
|
+
this._maskService.writingValue = true;
|
|
6504
|
+
this._maskService.onChange(maskedValue);
|
|
6505
|
+
this._maskService.writingValue = false;
|
|
6568
6506
|
}
|
|
6569
6507
|
else {
|
|
6570
|
-
|
|
6508
|
+
this._maskService.onChange(value);
|
|
6571
6509
|
}
|
|
6572
6510
|
}
|
|
6573
|
-
|
|
6574
|
-
|
|
6575
|
-
|
|
6576
|
-
|
|
6577
|
-
|
|
6578
|
-
|
|
6579
|
-
|
|
6580
|
-
|
|
6581
|
-
|
|
6582
|
-
|
|
6583
|
-
|
|
6584
|
-
|
|
6585
|
-
|
|
6586
|
-
|
|
6587
|
-
|
|
6588
|
-
|
|
6589
|
-
.split("" /* MaskExpression.EMPTY_STRING */)
|
|
6590
|
-
.filter((i) => i === key)
|
|
6591
|
-
.join("" /* MaskExpression.EMPTY_STRING */);
|
|
6592
|
-
counterOfOpt += opt.length;
|
|
6593
|
-
}
|
|
6594
|
-
else if (maskValue.indexOf(key) !== -1) {
|
|
6595
|
-
counterOfOpt++;
|
|
6596
|
-
}
|
|
6597
|
-
if (maskValue.indexOf(key) !== -1 &&
|
|
6598
|
-
processedValue.length >= maskValue.indexOf(key)) {
|
|
6599
|
-
return null;
|
|
6600
|
-
}
|
|
6601
|
-
if (counterOfOpt === maskValue.length) {
|
|
6602
|
-
return null;
|
|
6603
|
-
}
|
|
6604
|
-
}
|
|
6605
|
-
}
|
|
6606
|
-
if ((maskValue.indexOf("*" /* MaskExpression.SYMBOL_STAR */) > 1 &&
|
|
6607
|
-
processedValue.length < maskValue.indexOf("*" /* MaskExpression.SYMBOL_STAR */)) ||
|
|
6608
|
-
(maskValue.indexOf("?" /* MaskExpression.SYMBOL_QUESTION */) > 1 &&
|
|
6609
|
-
processedValue.length < maskValue.indexOf("?" /* MaskExpression.SYMBOL_QUESTION */))) {
|
|
6610
|
-
return this._createValidationError(processedValue);
|
|
6611
|
-
}
|
|
6612
|
-
if (maskValue.indexOf("*" /* MaskExpression.SYMBOL_STAR */) === -1 ||
|
|
6613
|
-
maskValue.indexOf("?" /* MaskExpression.SYMBOL_QUESTION */) === -1) {
|
|
6614
|
-
const array = maskValue.split('*');
|
|
6615
|
-
const length = this._maskService.dropSpecialCharacters
|
|
6616
|
-
? maskValue.length -
|
|
6617
|
-
this._maskService.checkDropSpecialCharAmount(maskValue) -
|
|
6618
|
-
counterOfOpt
|
|
6619
|
-
: this.prefix()
|
|
6620
|
-
? maskValue.length + this.prefix().length - counterOfOpt
|
|
6621
|
-
: maskValue.length - counterOfOpt;
|
|
6622
|
-
if (array.length === 1) {
|
|
6623
|
-
if (processedValue.length < length) {
|
|
6624
|
-
return this._createValidationError(processedValue);
|
|
6625
|
-
}
|
|
6626
|
-
}
|
|
6627
|
-
if (array.length > 1) {
|
|
6628
|
-
const lastIndexArray = array[array.length - 1];
|
|
6629
|
-
if (lastIndexArray &&
|
|
6630
|
-
this._maskService.specialCharacters.includes(lastIndexArray[0]) &&
|
|
6631
|
-
String(processedValue).includes(lastIndexArray[0] ?? '') &&
|
|
6632
|
-
!this.dropSpecialCharacters()) {
|
|
6633
|
-
const special = value.split(lastIndexArray[0]);
|
|
6634
|
-
return special[special.length - 1].length === lastIndexArray.length - 1
|
|
6635
|
-
? null
|
|
6636
|
-
: this._createValidationError(processedValue);
|
|
6637
|
-
}
|
|
6638
|
-
else if (((lastIndexArray &&
|
|
6639
|
-
!this._maskService.specialCharacters.includes(lastIndexArray[0])) ||
|
|
6640
|
-
!lastIndexArray ||
|
|
6641
|
-
this._maskService.dropSpecialCharacters) &&
|
|
6642
|
-
processedValue.length >= length - 1) {
|
|
6643
|
-
return null;
|
|
6644
|
-
}
|
|
6645
|
-
else {
|
|
6646
|
-
return this._createValidationError(processedValue);
|
|
6647
|
-
}
|
|
6648
|
-
}
|
|
6649
|
-
}
|
|
6650
|
-
if (maskValue.indexOf("*" /* MaskExpression.SYMBOL_STAR */) === 1 ||
|
|
6651
|
-
maskValue.indexOf("?" /* MaskExpression.SYMBOL_QUESTION */) === 1) {
|
|
6652
|
-
return null;
|
|
6511
|
+
else {
|
|
6512
|
+
this._maskService.onChange(value);
|
|
6513
|
+
}
|
|
6514
|
+
}
|
|
6515
|
+
onInput(event) {
|
|
6516
|
+
if (this._isComposing) {
|
|
6517
|
+
return;
|
|
6518
|
+
}
|
|
6519
|
+
const target = event.target;
|
|
6520
|
+
const value = target.value;
|
|
6521
|
+
// Aplicar máscara se definida
|
|
6522
|
+
if (this.mask && this.mask.trim() !== '') {
|
|
6523
|
+
const maskedValue = this._maskService.applyMask(value, this.mask);
|
|
6524
|
+
if (maskedValue !== value) {
|
|
6525
|
+
target.value = maskedValue;
|
|
6526
|
+
this._maskService.onChange(maskedValue);
|
|
6653
6527
|
}
|
|
6654
6528
|
}
|
|
6655
|
-
|
|
6656
|
-
this.
|
|
6657
|
-
return null;
|
|
6529
|
+
else {
|
|
6530
|
+
this._maskService.onChange(value);
|
|
6658
6531
|
}
|
|
6659
|
-
return null;
|
|
6660
6532
|
}
|
|
6661
|
-
|
|
6662
|
-
this.
|
|
6533
|
+
onCompositionStart(event) {
|
|
6534
|
+
this._isComposing = true;
|
|
6663
6535
|
}
|
|
6664
|
-
|
|
6665
|
-
this.
|
|
6536
|
+
onCompositionEnd(event) {
|
|
6537
|
+
this._isComposing = false;
|
|
6538
|
+
const target = event.target;
|
|
6539
|
+
const value = target.value;
|
|
6540
|
+
this._maskService.onChange(value);
|
|
6666
6541
|
}
|
|
6667
|
-
|
|
6668
|
-
|
|
6669
|
-
|
|
6670
|
-
value === null ||
|
|
6671
|
-
typeof value === 'undefined') &&
|
|
6672
|
-
this._maskService.actualValue) {
|
|
6673
|
-
this._maskService.actualValue = this._maskService.getActualValue("" /* MaskExpression.EMPTY_STRING */);
|
|
6674
|
-
}
|
|
6542
|
+
onBlur(event) {
|
|
6543
|
+
this._isFocused = false;
|
|
6544
|
+
this.onTouch();
|
|
6675
6545
|
}
|
|
6676
|
-
|
|
6677
|
-
//
|
|
6678
|
-
|
|
6679
|
-
|
|
6680
|
-
|
|
6681
|
-
|
|
6682
|
-
|
|
6683
|
-
|
|
6684
|
-
|
|
6685
|
-
|
|
6686
|
-
|
|
6687
|
-
|
|
6688
|
-
|
|
6689
|
-
this._setMask();
|
|
6690
|
-
if (!this._maskValue()) {
|
|
6691
|
-
this.onChange(el.value);
|
|
6692
|
-
return;
|
|
6693
|
-
}
|
|
6694
|
-
let position = el.selectionStart === 1
|
|
6695
|
-
? el.selectionStart + this._maskService.prefix.length
|
|
6696
|
-
: el.selectionStart;
|
|
6697
|
-
if (this.showMaskTyped() &&
|
|
6698
|
-
this.keepCharacterPositions() &&
|
|
6699
|
-
this._maskService.placeHolderCharacter.length === 1) {
|
|
6700
|
-
const suffix = this.suffix();
|
|
6701
|
-
const prefix = this.prefix();
|
|
6702
|
-
const inputSymbol = el.value.slice(position - 1, position);
|
|
6703
|
-
const prefixLength = prefix.length;
|
|
6704
|
-
const checkSymbols = this._maskService._checkSymbolMask(inputSymbol, this._maskService.maskExpression[position - 1 - prefixLength] ??
|
|
6705
|
-
"" /* MaskExpression.EMPTY_STRING */);
|
|
6706
|
-
const checkSpecialCharacter = this._maskService._checkSymbolMask(inputSymbol, this._maskService.maskExpression[position + 1 - prefixLength] ??
|
|
6707
|
-
"" /* MaskExpression.EMPTY_STRING */);
|
|
6708
|
-
const selectRangeBackspace = this._maskService.selStart === this._maskService.selEnd;
|
|
6709
|
-
const selStart = Number(this._maskService.selStart) - prefixLength;
|
|
6710
|
-
const selEnd = Number(this._maskService.selEnd) - prefixLength;
|
|
6711
|
-
const backspaceOrDelete = this._code() === "Backspace" /* MaskExpression.BACKSPACE */ ||
|
|
6712
|
-
this._code() === "Delete" /* MaskExpression.DELETE */;
|
|
6713
|
-
if (backspaceOrDelete) {
|
|
6714
|
-
if (!selectRangeBackspace) {
|
|
6715
|
-
if (this._maskService.selStart === prefixLength) {
|
|
6716
|
-
this._maskService.actualValue = `${prefix}${this._maskService.maskIsShown.slice(0, selEnd)}${this._inputValue().split(prefix).join('')}`;
|
|
6717
|
-
}
|
|
6718
|
-
else if (this._maskService.selStart ===
|
|
6719
|
-
this._maskService.maskIsShown.length + prefixLength) {
|
|
6720
|
-
this._maskService.actualValue = `${this._inputValue()}${this._maskService.maskIsShown.slice(selStart, selEnd)}`;
|
|
6721
|
-
}
|
|
6722
|
-
else {
|
|
6723
|
-
this._maskService.actualValue = `${prefix}${this._inputValue()
|
|
6724
|
-
.split(prefix)
|
|
6725
|
-
.join('')
|
|
6726
|
-
.slice(0, selStart)}${this._maskService.maskIsShown.slice(selStart, selEnd)}${this._maskService.actualValue.slice(selEnd + prefixLength, this._maskService.maskIsShown.length + prefixLength)}${suffix}`;
|
|
6727
|
-
}
|
|
6728
|
-
}
|
|
6729
|
-
else if (!this._maskService.specialCharacters.includes(this._maskService.maskExpression.slice(position - prefixLength, position + 1 - prefixLength)) &&
|
|
6730
|
-
selectRangeBackspace) {
|
|
6731
|
-
if (selStart === 1 && prefix) {
|
|
6732
|
-
this._maskService.actualValue = `${prefix}${this._maskService.placeHolderCharacter}${el.value
|
|
6733
|
-
.split(prefix)
|
|
6734
|
-
.join('')
|
|
6735
|
-
.split(suffix)
|
|
6736
|
-
.join('')}${suffix}`;
|
|
6737
|
-
position = position - 1;
|
|
6738
|
-
}
|
|
6739
|
-
else {
|
|
6740
|
-
const part1 = el.value.substring(0, position);
|
|
6741
|
-
const part2 = el.value.substring(position);
|
|
6742
|
-
this._maskService.actualValue = `${part1}${this._maskService.placeHolderCharacter}${part2}`;
|
|
6743
|
-
}
|
|
6744
|
-
}
|
|
6745
|
-
position = this._code() === "Delete" /* MaskExpression.DELETE */ ? position + 1 : position;
|
|
6746
|
-
}
|
|
6747
|
-
if (!backspaceOrDelete) {
|
|
6748
|
-
if (!checkSymbols && !checkSpecialCharacter && selectRangeBackspace) {
|
|
6749
|
-
position = Number(el.selectionStart) - 1;
|
|
6750
|
-
}
|
|
6751
|
-
else if (this._maskService.specialCharacters.includes(el.value.slice(position, position + 1)) &&
|
|
6752
|
-
checkSpecialCharacter &&
|
|
6753
|
-
!this._maskService.specialCharacters.includes(el.value.slice(position + 1, position + 2))) {
|
|
6754
|
-
this._maskService.actualValue = `${el.value.slice(0, position - 1)}${el.value.slice(position, position + 1)}${inputSymbol}${el.value.slice(position + 2)}`;
|
|
6755
|
-
position = position + 1;
|
|
6756
|
-
}
|
|
6757
|
-
else if (checkSymbols) {
|
|
6758
|
-
if (el.value.length === 1 && position === 1) {
|
|
6759
|
-
this._maskService.actualValue = `${prefix}${inputSymbol}${this._maskService.maskIsShown.slice(1, this._maskService.maskIsShown.length)}${suffix}`;
|
|
6760
|
-
}
|
|
6761
|
-
else {
|
|
6762
|
-
this._maskService.actualValue = `${el.value.slice(0, position - 1)}${inputSymbol}${el.value
|
|
6763
|
-
.slice(position + 1)
|
|
6764
|
-
.split(suffix)
|
|
6765
|
-
.join('')}${suffix}`;
|
|
6766
|
-
}
|
|
6767
|
-
}
|
|
6768
|
-
else if (prefix &&
|
|
6769
|
-
el.value.length === 1 &&
|
|
6770
|
-
position - prefixLength === 1 &&
|
|
6771
|
-
this._maskService._checkSymbolMask(el.value, this._maskService.maskExpression[position - 1 - prefixLength] ??
|
|
6772
|
-
"" /* MaskExpression.EMPTY_STRING */)) {
|
|
6773
|
-
this._maskService.actualValue = `${prefix}${el.value}${this._maskService.maskIsShown.slice(1, this._maskService.maskIsShown.length)}${suffix}`;
|
|
6774
|
-
}
|
|
6775
|
-
}
|
|
6776
|
-
}
|
|
6777
|
-
let caretShift = 0;
|
|
6778
|
-
let backspaceShift = false;
|
|
6779
|
-
if (this._code() === "Delete" /* MaskExpression.DELETE */ && "separator" /* MaskExpression.SEPARATOR */) {
|
|
6780
|
-
this._maskService.deletedSpecialCharacter = true;
|
|
6781
|
-
}
|
|
6782
|
-
if (this._inputValue().length >= this._maskService.maskExpression.length - 1 &&
|
|
6783
|
-
this._code() !== "Backspace" /* MaskExpression.BACKSPACE */ &&
|
|
6784
|
-
this._maskService.maskExpression === "d0/M0/0000" /* MaskExpression.DAYS_MONTHS_YEARS */ &&
|
|
6785
|
-
position < 10) {
|
|
6786
|
-
const inputSymbol = this._inputValue().slice(position - 1, position);
|
|
6787
|
-
el.value =
|
|
6788
|
-
this._inputValue().slice(0, position - 1) +
|
|
6789
|
-
inputSymbol +
|
|
6790
|
-
this._inputValue().slice(position + 1);
|
|
6791
|
-
}
|
|
6792
|
-
if (this._maskService.maskExpression === "d0/M0/0000" /* MaskExpression.DAYS_MONTHS_YEARS */ &&
|
|
6793
|
-
this.leadZeroDateTime()) {
|
|
6794
|
-
if ((position < 3 && Number(el.value) > 31 && Number(el.value) < 40) ||
|
|
6795
|
-
(position === 5 && Number(el.value.slice(3, 5)) > 12)) {
|
|
6796
|
-
position = position + 2;
|
|
6797
|
-
}
|
|
6798
|
-
}
|
|
6799
|
-
if (this._maskService.maskExpression === "Hh:m0:s0" /* MaskExpression.HOURS_MINUTES_SECONDS */ &&
|
|
6800
|
-
this.apm()) {
|
|
6801
|
-
if (this._justPasted() && el.value.slice(0, 2) === "00" /* MaskExpression.DOUBLE_ZERO */) {
|
|
6802
|
-
el.value = el.value.slice(1, 2) + el.value.slice(2, el.value.length);
|
|
6803
|
-
}
|
|
6804
|
-
el.value =
|
|
6805
|
-
el.value === "00" /* MaskExpression.DOUBLE_ZERO */
|
|
6806
|
-
? "0" /* MaskExpression.NUMBER_ZERO */
|
|
6807
|
-
: el.value;
|
|
6808
|
-
}
|
|
6809
|
-
this._maskService.applyValueChanges(position, this._justPasted(), this._code() === "Backspace" /* MaskExpression.BACKSPACE */ ||
|
|
6810
|
-
this._code() === "Delete" /* MaskExpression.DELETE */, (shift, _backspaceShift) => {
|
|
6811
|
-
this._justPasted.set(false);
|
|
6812
|
-
caretShift = shift;
|
|
6813
|
-
backspaceShift = _backspaceShift;
|
|
6814
|
-
});
|
|
6815
|
-
// only set the selection if the element is active
|
|
6816
|
-
if (this._getActiveElement() !== el) {
|
|
6817
|
-
return;
|
|
6818
|
-
}
|
|
6819
|
-
if (this._maskService.plusOnePosition) {
|
|
6820
|
-
position = position + 1;
|
|
6821
|
-
this._maskService.plusOnePosition = false;
|
|
6822
|
-
}
|
|
6823
|
-
// update position after applyValueChanges to prevent cursor on wrong position when it has an array of maskExpression
|
|
6824
|
-
if (this._maskExpressionArray().length) {
|
|
6825
|
-
if (this._code() === "Backspace" /* MaskExpression.BACKSPACE */) {
|
|
6826
|
-
const specialChartMinusOne = this.specialCharacters().includes(this._maskService.actualValue.slice(position - 1, position));
|
|
6827
|
-
const allowFewMaskChangeMask = this._maskService.removeMask(this._inputValue())?.length ===
|
|
6828
|
-
this._maskService.removeMask(this._maskService.maskExpression)?.length;
|
|
6829
|
-
const specialChartPlusOne = this.specialCharacters().includes(this._maskService.actualValue.slice(position, position + 1));
|
|
6830
|
-
if (allowFewMaskChangeMask && !specialChartPlusOne) {
|
|
6831
|
-
position = el.selectionStart + 1;
|
|
6832
|
-
}
|
|
6833
|
-
else {
|
|
6834
|
-
position = specialChartMinusOne ? position - 1 : position;
|
|
6835
|
-
}
|
|
6836
|
-
}
|
|
6837
|
-
else {
|
|
6838
|
-
position =
|
|
6839
|
-
el.selectionStart === 1
|
|
6840
|
-
? el.selectionStart + this._maskService.prefix.length
|
|
6841
|
-
: el.selectionStart;
|
|
6842
|
-
}
|
|
6843
|
-
}
|
|
6844
|
-
this._position.set(this._position() === 1 && this._inputValue().length === 1
|
|
6845
|
-
? null
|
|
6846
|
-
: this._position());
|
|
6847
|
-
let positionToApply = this._position()
|
|
6848
|
-
? this._inputValue().length + position + caretShift
|
|
6849
|
-
: position +
|
|
6850
|
-
(this._code() === "Backspace" /* MaskExpression.BACKSPACE */ && !backspaceShift
|
|
6851
|
-
? 0
|
|
6852
|
-
: caretShift);
|
|
6853
|
-
if (positionToApply > this._getActualInputLength()) {
|
|
6854
|
-
positionToApply =
|
|
6855
|
-
el.value === this._maskService.decimalMarker && el.value.length === 1
|
|
6856
|
-
? this._getActualInputLength() + 1
|
|
6857
|
-
: this._getActualInputLength();
|
|
6858
|
-
}
|
|
6859
|
-
if (positionToApply < 0) {
|
|
6860
|
-
positionToApply = 0;
|
|
6861
|
-
}
|
|
6862
|
-
el.setSelectionRange(positionToApply, positionToApply);
|
|
6863
|
-
this._position.set(null);
|
|
6864
|
-
}
|
|
6865
|
-
else {
|
|
6866
|
-
// eslint-disable-next-line no-console
|
|
6867
|
-
console.warn('Matcha-mask writeValue work with string | number, your current value:', typeof transformedValue);
|
|
6868
|
-
}
|
|
6546
|
+
onClick(event) {
|
|
6547
|
+
// Implementar lógica de clique se necessário
|
|
6548
|
+
}
|
|
6549
|
+
onKeyDown(event) {
|
|
6550
|
+
// Implementar lógica de teclado se necessário
|
|
6551
|
+
}
|
|
6552
|
+
writeValue(value) {
|
|
6553
|
+
this._maskService.writingValue = true;
|
|
6554
|
+
this._inputValue = value;
|
|
6555
|
+
// Aplicar máscara se definida
|
|
6556
|
+
if (this.mask && this.mask.trim() !== '') {
|
|
6557
|
+
const maskedValue = this._maskService.applyMask(value, this.mask);
|
|
6558
|
+
this._maskService.onChange(maskedValue);
|
|
6869
6559
|
}
|
|
6870
6560
|
else {
|
|
6871
|
-
|
|
6872
|
-
this.onChange(el.value);
|
|
6873
|
-
return;
|
|
6874
|
-
}
|
|
6875
|
-
this._maskService.applyValueChanges(el.value.length, this._justPasted(), this._code() === "Backspace" /* MaskExpression.BACKSPACE */ || this._code() === "Delete" /* MaskExpression.DELETE */);
|
|
6561
|
+
this._maskService.onChange(value);
|
|
6876
6562
|
}
|
|
6563
|
+
this._maskService.writingValue = false;
|
|
6877
6564
|
}
|
|
6878
|
-
|
|
6879
|
-
|
|
6880
|
-
this.
|
|
6565
|
+
registerOnChange(fn) {
|
|
6566
|
+
this.onChange = fn;
|
|
6567
|
+
this._maskService.onChange = fn;
|
|
6881
6568
|
}
|
|
6882
|
-
|
|
6883
|
-
|
|
6884
|
-
this._isComposing.set(false);
|
|
6885
|
-
this._justPasted.set(true);
|
|
6886
|
-
this.onInput(e);
|
|
6569
|
+
registerOnTouched(fn) {
|
|
6570
|
+
this.onTouch = fn;
|
|
6887
6571
|
}
|
|
6888
|
-
|
|
6889
|
-
|
|
6890
|
-
const el = e.target;
|
|
6891
|
-
if (this._maskService.leadZero &&
|
|
6892
|
-
el.value.length > 0 &&
|
|
6893
|
-
typeof this._maskService.decimalMarker === 'string') {
|
|
6894
|
-
const maskExpression = this._maskService.maskExpression;
|
|
6895
|
-
const decimalMarker = this._maskService.decimalMarker;
|
|
6896
|
-
const suffix = this._maskService.suffix;
|
|
6897
|
-
const precision = Number(this._maskService.maskExpression.slice(maskExpression.length - 1, maskExpression.length));
|
|
6898
|
-
if (precision > 0) {
|
|
6899
|
-
el.value = suffix ? el.value.split(suffix).join('') : el.value;
|
|
6900
|
-
const decimalPart = el.value.split(decimalMarker)[1];
|
|
6901
|
-
el.value = el.value.includes(decimalMarker)
|
|
6902
|
-
? el.value +
|
|
6903
|
-
"0" /* MaskExpression.NUMBER_ZERO */.repeat(precision - decimalPart.length) +
|
|
6904
|
-
suffix
|
|
6905
|
-
: el.value +
|
|
6906
|
-
decimalMarker +
|
|
6907
|
-
"0" /* MaskExpression.NUMBER_ZERO */.repeat(precision) +
|
|
6908
|
-
suffix;
|
|
6909
|
-
this._maskService.actualValue = el.value;
|
|
6910
|
-
}
|
|
6911
|
-
}
|
|
6912
|
-
this._maskService.clearIfNotMatchFn();
|
|
6913
|
-
}
|
|
6914
|
-
this._isFocused.set(false);
|
|
6915
|
-
this.onTouch();
|
|
6572
|
+
setDisabledState(isDisabled) {
|
|
6573
|
+
// Implementar lógica de desabilitar se necessário
|
|
6916
6574
|
}
|
|
6917
|
-
|
|
6918
|
-
|
|
6919
|
-
|
|
6920
|
-
|
|
6921
|
-
|
|
6922
|
-
|
|
6923
|
-
|
|
6924
|
-
|
|
6925
|
-
|
|
6926
|
-
|
|
6927
|
-
|
|
6928
|
-
|
|
6929
|
-
|
|
6930
|
-
|
|
6931
|
-
|
|
6932
|
-
|
|
6933
|
-
|
|
6934
|
-
|
|
6935
|
-
|
|
6936
|
-
|
|
6937
|
-
|
|
6938
|
-
|
|
6939
|
-
|
|
6940
|
-
|
|
6941
|
-
|
|
6942
|
-
|
|
6943
|
-
|
|
6944
|
-
|
|
6575
|
+
validate(control) {
|
|
6576
|
+
// Implementar validação se necessário
|
|
6577
|
+
return null;
|
|
6578
|
+
}
|
|
6579
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskCompatibleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
6580
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.0", type: MatchaMaskCompatibleDirective, isStandalone: false, selector: "input[mask], textarea[mask]", inputs: { mask: "mask", specialCharacters: "specialCharacters", patterns: "patterns", prefix: "prefix", suffix: "suffix", thousandSeparator: "thousandSeparator", decimalMarker: "decimalMarker", dropSpecialCharacters: "dropSpecialCharacters", hiddenInput: "hiddenInput", showMaskTyped: "showMaskTyped", placeHolderCharacter: "placeHolderCharacter", shownMaskExpression: "shownMaskExpression", clearIfNotMatch: "clearIfNotMatch", validation: "validation", separatorLimit: "separatorLimit", allowNegativeNumbers: "allowNegativeNumbers", leadZeroDateTime: "leadZeroDateTime", leadZero: "leadZero", triggerOnMaskChange: "triggerOnMaskChange", apm: "apm", inputTransformFn: "inputTransformFn", outputTransformFn: "outputTransformFn", keepCharacterPositions: "keepCharacterPositions", instantPrefix: "instantPrefix" }, outputs: { maskFilled: "maskFilled" }, host: { listeners: { "paste": "onPaste($event)", "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: [
|
|
6581
|
+
{
|
|
6582
|
+
provide: NG_VALUE_ACCESSOR,
|
|
6583
|
+
useExisting: forwardRef(() => MatchaMaskCompatibleDirective),
|
|
6584
|
+
multi: true,
|
|
6585
|
+
},
|
|
6586
|
+
{
|
|
6587
|
+
provide: NG_VALIDATORS,
|
|
6588
|
+
useExisting: forwardRef(() => MatchaMaskCompatibleDirective),
|
|
6589
|
+
multi: true,
|
|
6590
|
+
},
|
|
6591
|
+
MatchaMaskService,
|
|
6592
|
+
], exportAs: ["mask", "matchaMask"], usesOnChanges: true, ngImport: i0 }); }
|
|
6593
|
+
}
|
|
6594
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskCompatibleDirective, decorators: [{
|
|
6595
|
+
type: Directive,
|
|
6596
|
+
args: [{
|
|
6597
|
+
selector: 'input[mask], textarea[mask]',
|
|
6598
|
+
standalone: false,
|
|
6599
|
+
providers: [
|
|
6600
|
+
{
|
|
6601
|
+
provide: NG_VALUE_ACCESSOR,
|
|
6602
|
+
useExisting: forwardRef(() => MatchaMaskCompatibleDirective),
|
|
6603
|
+
multi: true,
|
|
6604
|
+
},
|
|
6605
|
+
{
|
|
6606
|
+
provide: NG_VALIDATORS,
|
|
6607
|
+
useExisting: forwardRef(() => MatchaMaskCompatibleDirective),
|
|
6608
|
+
multi: true,
|
|
6609
|
+
},
|
|
6610
|
+
MatchaMaskService,
|
|
6611
|
+
],
|
|
6612
|
+
exportAs: 'mask,matchaMask',
|
|
6613
|
+
}]
|
|
6614
|
+
}], propDecorators: { mask: [{
|
|
6615
|
+
type: Input
|
|
6616
|
+
}], specialCharacters: [{
|
|
6617
|
+
type: Input
|
|
6618
|
+
}], patterns: [{
|
|
6619
|
+
type: Input
|
|
6620
|
+
}], prefix: [{
|
|
6621
|
+
type: Input
|
|
6622
|
+
}], suffix: [{
|
|
6623
|
+
type: Input
|
|
6624
|
+
}], thousandSeparator: [{
|
|
6625
|
+
type: Input
|
|
6626
|
+
}], decimalMarker: [{
|
|
6627
|
+
type: Input
|
|
6628
|
+
}], dropSpecialCharacters: [{
|
|
6629
|
+
type: Input
|
|
6630
|
+
}], hiddenInput: [{
|
|
6631
|
+
type: Input
|
|
6632
|
+
}], showMaskTyped: [{
|
|
6633
|
+
type: Input
|
|
6634
|
+
}], placeHolderCharacter: [{
|
|
6635
|
+
type: Input
|
|
6636
|
+
}], shownMaskExpression: [{
|
|
6637
|
+
type: Input
|
|
6638
|
+
}], clearIfNotMatch: [{
|
|
6639
|
+
type: Input
|
|
6640
|
+
}], validation: [{
|
|
6641
|
+
type: Input
|
|
6642
|
+
}], separatorLimit: [{
|
|
6643
|
+
type: Input
|
|
6644
|
+
}], allowNegativeNumbers: [{
|
|
6645
|
+
type: Input
|
|
6646
|
+
}], leadZeroDateTime: [{
|
|
6647
|
+
type: Input
|
|
6648
|
+
}], leadZero: [{
|
|
6649
|
+
type: Input
|
|
6650
|
+
}], triggerOnMaskChange: [{
|
|
6651
|
+
type: Input
|
|
6652
|
+
}], apm: [{
|
|
6653
|
+
type: Input
|
|
6654
|
+
}], inputTransformFn: [{
|
|
6655
|
+
type: Input
|
|
6656
|
+
}], outputTransformFn: [{
|
|
6657
|
+
type: Input
|
|
6658
|
+
}], keepCharacterPositions: [{
|
|
6659
|
+
type: Input
|
|
6660
|
+
}], instantPrefix: [{
|
|
6661
|
+
type: Input
|
|
6662
|
+
}], maskFilled: [{
|
|
6663
|
+
type: Output
|
|
6664
|
+
}], onPaste: [{
|
|
6665
|
+
type: HostListener,
|
|
6666
|
+
args: ['paste', ['$event']]
|
|
6667
|
+
}], onFocus: [{
|
|
6668
|
+
type: HostListener,
|
|
6669
|
+
args: ['focus', ['$event']]
|
|
6670
|
+
}], onModelChange: [{
|
|
6671
|
+
type: HostListener,
|
|
6672
|
+
args: ['ngModelChange', ['$event']]
|
|
6673
|
+
}], onInput: [{
|
|
6674
|
+
type: HostListener,
|
|
6675
|
+
args: ['input', ['$event']]
|
|
6676
|
+
}], onCompositionStart: [{
|
|
6677
|
+
type: HostListener,
|
|
6678
|
+
args: ['compositionstart', ['$event']]
|
|
6679
|
+
}], onCompositionEnd: [{
|
|
6680
|
+
type: HostListener,
|
|
6681
|
+
args: ['compositionend', ['$event']]
|
|
6682
|
+
}], onBlur: [{
|
|
6683
|
+
type: HostListener,
|
|
6684
|
+
args: ['blur', ['$event']]
|
|
6685
|
+
}], onClick: [{
|
|
6686
|
+
type: HostListener,
|
|
6687
|
+
args: ['click', ['$event']]
|
|
6688
|
+
}], onKeyDown: [{
|
|
6689
|
+
type: HostListener,
|
|
6690
|
+
args: ['keydown', ['$event']]
|
|
6691
|
+
}] } });
|
|
6692
|
+
|
|
6693
|
+
/**
|
|
6694
|
+
* Componente MatchaInputPhone
|
|
6695
|
+
*
|
|
6696
|
+
* Componente Angular para entrada de telefone internacional com seleção de país, máscara dinâmica e exibição de bandeira.
|
|
6697
|
+
*
|
|
6698
|
+
* Funcionalidades:
|
|
6699
|
+
* - Seleção de país com dropdown e bandeira.
|
|
6700
|
+
* - Máscara dinâmica de acordo com o país e DDD digitado.
|
|
6701
|
+
* - Suporte a diferentes formatos de telefone (fixo/celular) para o Brasil.
|
|
6702
|
+
* - Emissão de evento ao alterar o valor do telefone.
|
|
6703
|
+
* - Inicialização automática pelo valor informado ou pelo idioma do navegador.
|
|
6704
|
+
*
|
|
6705
|
+
* Inputs:
|
|
6706
|
+
* - fallbackMask: string - Máscara padrão caso não seja encontrada uma específica.
|
|
6707
|
+
* - label: string - Rótulo do campo (padrão: 'Telefone').
|
|
6708
|
+
* - value: string - Valor inicial do telefone (com ou sem DDI).
|
|
6709
|
+
*
|
|
6710
|
+
* Outputs:
|
|
6711
|
+
* - onChange: EventEmitter<string> - Emite o valor do telefone completo (com DDI) ao alterar.
|
|
6712
|
+
*
|
|
6713
|
+
* ViewChild:
|
|
6714
|
+
* - inputSelector: ElementRef - Referência ao container do input (usado para fechar o dropdown).
|
|
6715
|
+
* - phoneRef: ElementRef - Referência ao input do telefone.
|
|
6716
|
+
*
|
|
6717
|
+
* Métodos principais:
|
|
6718
|
+
* - ngOnInit: Inicializa o componente pelo valor ou idioma.
|
|
6719
|
+
* - ngOnChanges: Atualiza o valor ao receber novo input externo.
|
|
6720
|
+
* - initCountryPhone: Inicializa país e máscara pelo valor do telefone.
|
|
6721
|
+
* - selectMaskForDialCode: Seleciona a máscara conforme país e DDD.
|
|
6722
|
+
* - selectCountry: Troca o país selecionado e atualiza máscara.
|
|
6723
|
+
* - onInput: Atualiza máscara e emite evento ao digitar.
|
|
6724
|
+
* - toggleDropdown: Abre/fecha o dropdown de países.
|
|
6725
|
+
*/
|
|
6726
|
+
class MatchaInputPhoneComponent {
|
|
6727
|
+
constructor(renderer, cdr) {
|
|
6728
|
+
this.renderer = renderer;
|
|
6729
|
+
this.cdr = cdr;
|
|
6730
|
+
this.fallbackMask = '00 0000 0000';
|
|
6731
|
+
this.onChange = new EventEmitter();
|
|
6732
|
+
this.typeMask = '';
|
|
6733
|
+
this.labelHover = 'su';
|
|
6734
|
+
this.allCountries = getCountryISO2();
|
|
6735
|
+
this.isOpen = false;
|
|
6736
|
+
this.inputValueModel = '';
|
|
6737
|
+
this.clickListener = null;
|
|
6738
|
+
this.isInitialized = false;
|
|
6739
|
+
}
|
|
6740
|
+
ngOnInit() {
|
|
6741
|
+
this.value ? this.initCountryPhone(this.value) : this.initCountrylanguageNavigator();
|
|
6742
|
+
this.cdr.detectChanges();
|
|
6743
|
+
this.isInitialized = true;
|
|
6744
|
+
}
|
|
6745
|
+
ngOnChanges(changes) {
|
|
6746
|
+
if (changes['value'] && !changes['value'].firstChange) {
|
|
6747
|
+
this.value = changes['value'].currentValue;
|
|
6748
|
+
if (!this.value) {
|
|
6749
|
+
this.inputValueModel = this.value ?? '';
|
|
6750
|
+
return;
|
|
6945
6751
|
}
|
|
6752
|
+
this.initCountryPhone(this.value);
|
|
6753
|
+
this.cdr.detectChanges();
|
|
6946
6754
|
}
|
|
6947
|
-
|
|
6948
|
-
|
|
6949
|
-
|
|
6950
|
-
|
|
6951
|
-
/** Fix of cursor position jumping to end in most browsers no matter where cursor is inserted onFocus */
|
|
6952
|
-
if (el && el.value !== nextValue) {
|
|
6953
|
-
el.value = nextValue;
|
|
6954
|
-
}
|
|
6955
|
-
/** fix of cursor position with prefix when mouse click occur */
|
|
6956
|
-
if (el &&
|
|
6957
|
-
el.type !== 'number' &&
|
|
6958
|
-
(el.selectionStart || el.selectionEnd) <=
|
|
6959
|
-
this._maskService.prefix.length) {
|
|
6960
|
-
const specialCharactersAtTheStart = this._maskService.maskExpression.match(new RegExp(`^[${this._maskService.specialCharacters.map((c) => `\\${c}`).join('')}]+`))?.[0].length || 0;
|
|
6961
|
-
el.selectionStart = this._maskService.prefix.length + specialCharactersAtTheStart;
|
|
6755
|
+
}
|
|
6756
|
+
initCountryPhone(phone) {
|
|
6757
|
+
if (!phone.startsWith('+')) {
|
|
6758
|
+
this.setCountryAndInputValue('br', phone);
|
|
6962
6759
|
return;
|
|
6963
6760
|
}
|
|
6964
|
-
|
|
6965
|
-
|
|
6966
|
-
|
|
6761
|
+
const phoneWithoutPlus = phone.replace('+', '');
|
|
6762
|
+
const countryDialCode = this.selectedCountry?.dialCode;
|
|
6763
|
+
if (phoneWithoutPlus.startsWith(countryDialCode)) {
|
|
6764
|
+
this.setCountryAndInputValue(this.selectedCountry.iso2, phoneWithoutPlus.replace(countryDialCode, ''));
|
|
6765
|
+
this.inputValueModel = phoneWithoutPlus.replace(countryDialCode, '');
|
|
6766
|
+
}
|
|
6767
|
+
else {
|
|
6768
|
+
this.matchCountryAndSetInputValue(phoneWithoutPlus);
|
|
6967
6769
|
}
|
|
6968
6770
|
}
|
|
6969
|
-
|
|
6970
|
-
|
|
6971
|
-
|
|
6771
|
+
setCountryAndInputValue(iso2, phone) {
|
|
6772
|
+
this.selectedCountry = this.allCountries.find((country) => country.iso2 === iso2);
|
|
6773
|
+
this.inputValueModel = phone.startsWith('0') ? phone.slice(1) : phone;
|
|
6774
|
+
this.selectMaskForDialCode(this.selectedCountry.areaCodes ? this.selectedCountry.areaCodes[0] : '000', this.inputValueModel);
|
|
6775
|
+
}
|
|
6776
|
+
matchCountryAndSetInputValue(phoneWithoutPlus) {
|
|
6777
|
+
const matchingCountry = this.getMatchingCountry(phoneWithoutPlus);
|
|
6778
|
+
if (matchingCountry.length === 1) {
|
|
6779
|
+
this.setCountryAndInputValue(matchingCountry[0].iso2, phoneWithoutPlus.replace(matchingCountry[0].dialCode, ''));
|
|
6972
6780
|
}
|
|
6973
|
-
|
|
6974
|
-
|
|
6975
|
-
|
|
6976
|
-
|
|
6781
|
+
else {
|
|
6782
|
+
this.matchAreaCodeAndSetInputValue(phoneWithoutPlus, matchingCountry);
|
|
6783
|
+
}
|
|
6784
|
+
}
|
|
6785
|
+
getMatchingCountry(phoneWithoutPlus) {
|
|
6786
|
+
return this.allCountries.filter((country) => {
|
|
6787
|
+
const dialCode = country.dialCode;
|
|
6788
|
+
return phoneWithoutPlus.startsWith(dialCode);
|
|
6789
|
+
});
|
|
6790
|
+
}
|
|
6791
|
+
matchAreaCodeAndSetInputValue(phoneWithoutPlus, matchingCountry) {
|
|
6792
|
+
const phoneWithoutDialCode = phoneWithoutPlus.replace(matchingCountry[0].dialCode, '');
|
|
6793
|
+
const filterAreaCode = phoneWithoutDialCode.substring(0, 3);
|
|
6794
|
+
const matchingAreaCode = matchingCountry.filter((country) => {
|
|
6795
|
+
if (country.areaCodes) {
|
|
6796
|
+
return country.areaCodes.includes(filterAreaCode);
|
|
6977
6797
|
}
|
|
6978
|
-
|
|
6798
|
+
});
|
|
6799
|
+
if (matchingAreaCode.length === 1) {
|
|
6800
|
+
this.setCountryAndInputValue(matchingAreaCode[0].iso2, phoneWithoutDialCode);
|
|
6979
6801
|
}
|
|
6980
|
-
|
|
6981
|
-
|
|
6982
|
-
|
|
6983
|
-
|
|
6984
|
-
|
|
6985
|
-
|
|
6986
|
-
|
|
6802
|
+
else {
|
|
6803
|
+
const defaultCountry = matchingCountry.find((country) => country.priority === 0);
|
|
6804
|
+
this.setCountryAndInputValue(defaultCountry.iso2, phoneWithoutDialCode);
|
|
6805
|
+
}
|
|
6806
|
+
}
|
|
6807
|
+
selectMaskForDialCode(inputDigits, targetValuePhone) {
|
|
6808
|
+
const previousMask = this.typeMask;
|
|
6809
|
+
const maskArray = this.selectedCountry?.mask;
|
|
6810
|
+
const maskIndex = this.selectedCountry?.areaCodes
|
|
6811
|
+
? this.selectedCountry.areaCodes.findIndex((code) => inputDigits === code)
|
|
6812
|
+
: -1;
|
|
6813
|
+
if (this.selectedCountry?.iso2 === 'br' && (targetValuePhone && targetValuePhone.length > 2)) {
|
|
6814
|
+
const eventInput = targetValuePhone.substring(2);
|
|
6815
|
+
if (eventInput && eventInput[0] === '9') {
|
|
6816
|
+
this.typeMask = "00 0 0000 0000";
|
|
6817
|
+
this.cdr.detectChanges();
|
|
6818
|
+
return;
|
|
6987
6819
|
}
|
|
6988
|
-
if (e.key === "ArrowLeft" /* MaskExpression.ARROW_LEFT */ ||
|
|
6989
|
-
e.key === "Backspace" /* MaskExpression.BACKSPACE */ ||
|
|
6990
|
-
e.key === "Delete" /* MaskExpression.DELETE */) {
|
|
6991
|
-
if (e.key === "Backspace" /* MaskExpression.BACKSPACE */ && el.value.length === 0) {
|
|
6992
|
-
el.selectionStart = el.selectionEnd;
|
|
6993
|
-
}
|
|
6994
|
-
if (e.key === "Backspace" /* MaskExpression.BACKSPACE */ && el.selectionStart !== 0) {
|
|
6995
|
-
const prefixLength = this.prefix().length;
|
|
6996
|
-
// If specialChars is false, (shouldn't ever happen) then set to the defaults
|
|
6997
|
-
const specialCharacters = this.specialCharacters().length
|
|
6998
|
-
? this.specialCharacters()
|
|
6999
|
-
: this._config.specialCharacters;
|
|
7000
|
-
if (prefixLength > 1 && el.selectionStart <= prefixLength) {
|
|
7001
|
-
el.setSelectionRange(prefixLength, el.selectionEnd);
|
|
7002
|
-
}
|
|
7003
|
-
else {
|
|
7004
|
-
if (this._inputValue().length !== el.selectionStart &&
|
|
7005
|
-
el.selectionStart !== 1) {
|
|
7006
|
-
while (specialCharacters.includes((this._inputValue()[el.selectionStart - 1] ??
|
|
7007
|
-
"" /* MaskExpression.EMPTY_STRING */).toString()) &&
|
|
7008
|
-
((prefixLength >= 1 &&
|
|
7009
|
-
el.selectionStart > prefixLength) ||
|
|
7010
|
-
prefixLength === 0)) {
|
|
7011
|
-
el.setSelectionRange(el.selectionStart - 1, el.selectionEnd);
|
|
7012
|
-
}
|
|
7013
|
-
}
|
|
7014
|
-
}
|
|
7015
|
-
}
|
|
7016
|
-
this.checkSelectionOnDeletion(el);
|
|
7017
|
-
if (this._maskService.prefix.length &&
|
|
7018
|
-
el.selectionStart <= this._maskService.prefix.length &&
|
|
7019
|
-
el.selectionEnd <= this._maskService.prefix.length) {
|
|
7020
|
-
e.preventDefault();
|
|
7021
|
-
}
|
|
7022
|
-
const cursorStart = el.selectionStart;
|
|
7023
|
-
if (e.key === "Backspace" /* MaskExpression.BACKSPACE */ &&
|
|
7024
|
-
!el.readOnly &&
|
|
7025
|
-
cursorStart === 0 &&
|
|
7026
|
-
el.selectionEnd === el.value.length &&
|
|
7027
|
-
el.value.length !== 0) {
|
|
7028
|
-
this._position.set(this._maskService.prefix ? this._maskService.prefix.length : 0);
|
|
7029
|
-
this._maskService.applyMask(this._maskService.prefix, this._maskService.maskExpression, this._position());
|
|
7030
|
-
}
|
|
7031
|
-
}
|
|
7032
|
-
if (!!this.suffix() &&
|
|
7033
|
-
this.suffix().length > 1 &&
|
|
7034
|
-
this._inputValue().length - this.suffix().length < el.selectionStart) {
|
|
7035
|
-
el.setSelectionRange(this._inputValue().length - this.suffix().length, this._inputValue().length);
|
|
7036
|
-
}
|
|
7037
|
-
else if ((e.code === 'KeyA' && e.ctrlKey) ||
|
|
7038
|
-
(e.code === 'KeyA' && e.metaKey) // Cmd + A (Mac)
|
|
7039
|
-
) {
|
|
7040
|
-
el.setSelectionRange(0, this._getActualInputLength());
|
|
7041
|
-
e.preventDefault();
|
|
7042
|
-
}
|
|
7043
|
-
this._maskService.selStart = el.selectionStart;
|
|
7044
|
-
this._maskService.selEnd = el.selectionEnd;
|
|
7045
|
-
}
|
|
7046
|
-
}
|
|
7047
|
-
/** It writes the value in the input */
|
|
7048
|
-
async writeValue(controlValue) {
|
|
7049
|
-
let value = controlValue;
|
|
7050
|
-
const inputTransformFn = this._maskService.inputTransformFn;
|
|
7051
|
-
if (typeof value === 'object' && value !== null && 'value' in value) {
|
|
7052
|
-
if ('disable' in value) {
|
|
7053
|
-
this.setDisabledState(Boolean(value.disable));
|
|
7054
|
-
}
|
|
7055
|
-
value = value.value;
|
|
7056
|
-
}
|
|
7057
|
-
if (value !== null) {
|
|
7058
|
-
value = inputTransformFn ? inputTransformFn(value) : value;
|
|
7059
6820
|
}
|
|
7060
|
-
if (
|
|
7061
|
-
|
|
7062
|
-
|
|
7063
|
-
typeof value === 'undefined') {
|
|
7064
|
-
if (value === null || typeof value === 'undefined' || value === '') {
|
|
7065
|
-
this._maskService.currentValue = '';
|
|
7066
|
-
this._maskService.previousValue = '';
|
|
7067
|
-
}
|
|
7068
|
-
let inputValue = value;
|
|
7069
|
-
if (typeof inputValue === 'number' ||
|
|
7070
|
-
this._maskValue().startsWith("separator" /* MaskExpression.SEPARATOR */)) {
|
|
7071
|
-
inputValue = String(inputValue);
|
|
7072
|
-
const localeDecimalMarker = this._maskService.currentLocaleDecimalMarker();
|
|
7073
|
-
if (!Array.isArray(this._maskService.decimalMarker)) {
|
|
7074
|
-
inputValue =
|
|
7075
|
-
this._maskService.decimalMarker !== localeDecimalMarker
|
|
7076
|
-
? inputValue.replace(localeDecimalMarker, this._maskService.decimalMarker)
|
|
7077
|
-
: inputValue;
|
|
7078
|
-
}
|
|
7079
|
-
if (this._maskService.leadZero &&
|
|
7080
|
-
inputValue &&
|
|
7081
|
-
this.mask() &&
|
|
7082
|
-
this.dropSpecialCharacters() !== false) {
|
|
7083
|
-
inputValue = this._maskService._checkPrecision(this._maskService.maskExpression, inputValue);
|
|
7084
|
-
}
|
|
7085
|
-
if (this._maskService.decimalMarker === "," /* MaskExpression.COMMA */ ||
|
|
7086
|
-
(Array.isArray(this._maskService.decimalMarker) &&
|
|
7087
|
-
this._maskService.thousandSeparator === "." /* MaskExpression.DOT */)) {
|
|
7088
|
-
inputValue = inputValue
|
|
7089
|
-
.toString()
|
|
7090
|
-
.replace("." /* MaskExpression.DOT */, "," /* MaskExpression.COMMA */);
|
|
7091
|
-
}
|
|
7092
|
-
if (this.mask()?.startsWith("separator" /* MaskExpression.SEPARATOR */) && this.leadZero()) {
|
|
7093
|
-
requestAnimationFrame(() => {
|
|
7094
|
-
this._maskService.applyMask(inputValue?.toString() ?? '', this._maskService.maskExpression);
|
|
7095
|
-
});
|
|
7096
|
-
}
|
|
7097
|
-
this._maskService.isNumberValue = true;
|
|
7098
|
-
}
|
|
7099
|
-
if (typeof inputValue !== 'string' || value === null || typeof value === 'undefined') {
|
|
7100
|
-
inputValue = '';
|
|
6821
|
+
if (Array.isArray(maskArray)) {
|
|
6822
|
+
if (maskIndex !== -1 && maskArray[maskIndex]) {
|
|
6823
|
+
this.typeMask = maskArray[maskIndex];
|
|
7101
6824
|
}
|
|
7102
|
-
|
|
7103
|
-
|
|
7104
|
-
if ((inputValue && this._maskService.maskExpression) ||
|
|
7105
|
-
(this._maskService.maskExpression &&
|
|
7106
|
-
(this._maskService.prefix || this._maskService.showMaskTyped))) {
|
|
7107
|
-
// Let the service we know we are writing value so that triggering onChange function won't happen during applyMask
|
|
7108
|
-
this._maskService.writingValue = true;
|
|
7109
|
-
this._maskService.formElementProperty = [
|
|
7110
|
-
'value',
|
|
7111
|
-
this._maskService.applyMask(inputValue, this._maskService.maskExpression),
|
|
7112
|
-
];
|
|
7113
|
-
// Let the service know we've finished writing value
|
|
7114
|
-
this._maskService.writingValue = false;
|
|
6825
|
+
else if (maskArray[0]) {
|
|
6826
|
+
this.typeMask = maskArray[0];
|
|
7115
6827
|
}
|
|
7116
6828
|
else {
|
|
7117
|
-
this.
|
|
6829
|
+
this.typeMask = this.fallbackMask;
|
|
7118
6830
|
}
|
|
7119
|
-
this._inputValue.set(inputValue);
|
|
7120
6831
|
}
|
|
7121
6832
|
else {
|
|
7122
|
-
|
|
7123
|
-
console.warn('Matcha-mask writeValue work with string | number, your current value:', typeof value);
|
|
6833
|
+
this.typeMask = this.fallbackMask;
|
|
7124
6834
|
}
|
|
6835
|
+
if (previousMask !== this.typeMask)
|
|
6836
|
+
this.inputValueModel = '';
|
|
6837
|
+
this.cdr.detectChanges();
|
|
7125
6838
|
}
|
|
7126
|
-
|
|
7127
|
-
|
|
7128
|
-
|
|
7129
|
-
|
|
7130
|
-
|
|
7131
|
-
}
|
|
7132
|
-
_getActiveElement(document = this.document) {
|
|
7133
|
-
const shadowRootEl = document?.activeElement?.shadowRoot;
|
|
7134
|
-
if (!shadowRootEl?.activeElement) {
|
|
7135
|
-
return document.activeElement;
|
|
7136
|
-
}
|
|
7137
|
-
else {
|
|
7138
|
-
return this._getActiveElement(shadowRootEl);
|
|
6839
|
+
initCountrylanguageNavigator() {
|
|
6840
|
+
let lang = navigator.language;
|
|
6841
|
+
if (lang.includes('-')) {
|
|
6842
|
+
const langParts = lang.split('-');
|
|
6843
|
+
lang = langParts[1];
|
|
7139
6844
|
}
|
|
6845
|
+
this.selectedCountry = this.allCountries.find((country) => country.iso2 === lang.toLocaleLowerCase());
|
|
6846
|
+
this.selectMaskForDialCode(this.selectedCountry.areaCodes ? this.selectedCountry.areaCodes[0] : '000');
|
|
7140
6847
|
}
|
|
7141
|
-
|
|
7142
|
-
|
|
7143
|
-
|
|
7144
|
-
|
|
7145
|
-
|
|
7146
|
-
|
|
7147
|
-
|
|
7148
|
-
/** It disables the input element */
|
|
7149
|
-
setDisabledState(isDisabled) {
|
|
7150
|
-
this._maskService.formElementProperty = ['disabled', isDisabled];
|
|
6848
|
+
selectCountry(country) {
|
|
6849
|
+
this.selectedCountry = country;
|
|
6850
|
+
this.selectMaskForDialCode(this.selectedCountry.areaCodes ? this.selectedCountry.areaCodes[0] : '000');
|
|
6851
|
+
this.isOpen = false;
|
|
6852
|
+
this.onChange.emit('+' + this.selectedCountry.dialCode + this.inputValueModel);
|
|
6853
|
+
this.removeClickListener();
|
|
6854
|
+
this.cdr.detectChanges();
|
|
7151
6855
|
}
|
|
7152
|
-
|
|
7153
|
-
this.
|
|
7154
|
-
this.
|
|
7155
|
-
|
|
7156
|
-
|
|
7157
|
-
|
|
6856
|
+
toggleDropdown() {
|
|
6857
|
+
this.isOpen = !this.isOpen;
|
|
6858
|
+
this.clickListener = this.renderer.listen('window', 'click', (event) => {
|
|
6859
|
+
if (this.isOpen && !this.inputSelector.nativeElement.contains(event.target)) {
|
|
6860
|
+
this.isOpen = false;
|
|
6861
|
+
this.removeClickListener();
|
|
6862
|
+
}
|
|
6863
|
+
});
|
|
6864
|
+
this.cdr.detectChanges();
|
|
7158
6865
|
}
|
|
7159
|
-
|
|
7160
|
-
|
|
7161
|
-
.
|
|
7162
|
-
.
|
|
7163
|
-
if (!value) {
|
|
7164
|
-
return null; // Don't validate empty values to allow for optional form control
|
|
7165
|
-
}
|
|
7166
|
-
if ((+(value[value.length - 1] ?? -1) === 0 && value.length < rowMaskLen) ||
|
|
7167
|
-
value.length <= rowMaskLen - 2) {
|
|
7168
|
-
return this._createValidationError(value);
|
|
6866
|
+
removeClickListener() {
|
|
6867
|
+
if (this.clickListener) {
|
|
6868
|
+
this.clickListener();
|
|
6869
|
+
this.clickListener = null;
|
|
7169
6870
|
}
|
|
7170
|
-
return null;
|
|
7171
6871
|
}
|
|
7172
|
-
|
|
7173
|
-
|
|
7174
|
-
|
|
6872
|
+
onInput(event) {
|
|
6873
|
+
this.phoneRef.nativeElement.value = event.target.value.replace(/[^\d\s]/g, '');
|
|
6874
|
+
let targetValuePhone = event.target.value.replace(/\D/g, '');
|
|
6875
|
+
this.onChange.emit('+' + this.selectedCountry.dialCode + this.inputValueModel);
|
|
6876
|
+
const inputDigits = targetValuePhone.substring(0, 3);
|
|
6877
|
+
if (inputDigits) {
|
|
6878
|
+
this.selectMaskForDialCode(inputDigits, targetValuePhone);
|
|
6879
|
+
}
|
|
6880
|
+
this.cdr.detectChanges();
|
|
7175
6881
|
}
|
|
7176
|
-
|
|
7177
|
-
|
|
7178
|
-
mask: {
|
|
7179
|
-
requiredMask: this._maskValue(),
|
|
7180
|
-
actualValue,
|
|
7181
|
-
},
|
|
7182
|
-
};
|
|
6882
|
+
ngOnDestroy() {
|
|
6883
|
+
this.removeClickListener();
|
|
7183
6884
|
}
|
|
7184
|
-
|
|
7185
|
-
|
|
7186
|
-
const specialChart = mask
|
|
7187
|
-
.split("" /* MaskExpression.EMPTY_STRING */)
|
|
7188
|
-
.some((char) => this._maskService.specialCharacters.includes(char));
|
|
7189
|
-
if ((specialChart &&
|
|
7190
|
-
this._inputValue() &&
|
|
7191
|
-
this._areAllCharactersInEachStringSame(this._maskExpressionArray())) ||
|
|
7192
|
-
mask.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */)) {
|
|
7193
|
-
const test = this._maskService.removeMask(this._inputValue())?.length <=
|
|
7194
|
-
this._maskService.removeMask(mask)?.length;
|
|
7195
|
-
if (test) {
|
|
7196
|
-
const maskValue = mask.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */)
|
|
7197
|
-
? this._maskService._repeatPatternSymbols(mask)
|
|
7198
|
-
: mask;
|
|
7199
|
-
this._maskValue.set(maskValue);
|
|
7200
|
-
this._maskService.maskExpression = maskValue;
|
|
7201
|
-
return test;
|
|
7202
|
-
}
|
|
7203
|
-
else {
|
|
7204
|
-
const expression = this._maskExpressionArray()[this._maskExpressionArray().length - 1] ??
|
|
7205
|
-
"" /* MaskExpression.EMPTY_STRING */;
|
|
7206
|
-
const maskValue = expression.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */)
|
|
7207
|
-
? this._maskService._repeatPatternSymbols(expression)
|
|
7208
|
-
: expression;
|
|
7209
|
-
this._maskValue.set(maskValue);
|
|
7210
|
-
this._maskService.maskExpression = maskValue;
|
|
7211
|
-
}
|
|
7212
|
-
}
|
|
7213
|
-
else {
|
|
7214
|
-
const cleanMask = this._maskService.removeMask(mask);
|
|
7215
|
-
const check = this._maskService
|
|
7216
|
-
.removeMask(this._inputValue())
|
|
7217
|
-
?.split("" /* MaskExpression.EMPTY_STRING */)
|
|
7218
|
-
.every((character, index) => {
|
|
7219
|
-
const indexMask = cleanMask.charAt(index);
|
|
7220
|
-
return this._maskService._checkSymbolMask(character, indexMask);
|
|
7221
|
-
});
|
|
7222
|
-
if (check || this._justPasted()) {
|
|
7223
|
-
this._maskValue.set(mask);
|
|
7224
|
-
this._maskService.maskExpression = mask;
|
|
7225
|
-
return check;
|
|
7226
|
-
}
|
|
7227
|
-
}
|
|
7228
|
-
});
|
|
7229
|
-
}
|
|
7230
|
-
_areAllCharactersInEachStringSame(array) {
|
|
7231
|
-
const specialCharacters = this._maskService.specialCharacters;
|
|
7232
|
-
function removeSpecialCharacters(str) {
|
|
7233
|
-
const regex = new RegExp(`[${specialCharacters.map((ch) => `\\${ch}`).join('')}]`, 'g');
|
|
7234
|
-
return str.replace(regex, '');
|
|
7235
|
-
}
|
|
7236
|
-
const processedArr = array.map(removeSpecialCharacters);
|
|
7237
|
-
return processedArr.every((str) => {
|
|
7238
|
-
const uniqueCharacters = new Set(str);
|
|
7239
|
-
return uniqueCharacters.size === 1;
|
|
7240
|
-
});
|
|
7241
|
-
}
|
|
7242
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
7243
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.0", type: MatchaMaskDirective, isStandalone: false, selector: "input[mask], textarea[mask]", inputs: { mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, specialCharacters: { classPropertyName: "specialCharacters", publicName: "specialCharacters", isSignal: true, isRequired: false, transformFunction: null }, patterns: { classPropertyName: "patterns", publicName: "patterns", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, thousandSeparator: { classPropertyName: "thousandSeparator", publicName: "thousandSeparator", isSignal: true, isRequired: false, transformFunction: null }, decimalMarker: { classPropertyName: "decimalMarker", publicName: "decimalMarker", isSignal: true, isRequired: false, transformFunction: null }, dropSpecialCharacters: { classPropertyName: "dropSpecialCharacters", publicName: "dropSpecialCharacters", isSignal: true, isRequired: false, transformFunction: null }, hiddenInput: { classPropertyName: "hiddenInput", publicName: "hiddenInput", isSignal: true, isRequired: false, transformFunction: null }, showMaskTyped: { classPropertyName: "showMaskTyped", publicName: "showMaskTyped", isSignal: true, isRequired: false, transformFunction: null }, placeHolderCharacter: { classPropertyName: "placeHolderCharacter", publicName: "placeHolderCharacter", isSignal: true, isRequired: false, transformFunction: null }, shownMaskExpression: { classPropertyName: "shownMaskExpression", publicName: "shownMaskExpression", isSignal: true, isRequired: false, transformFunction: null }, clearIfNotMatch: { classPropertyName: "clearIfNotMatch", publicName: "clearIfNotMatch", isSignal: true, isRequired: false, transformFunction: null }, validation: { classPropertyName: "validation", publicName: "validation", isSignal: true, isRequired: false, transformFunction: null }, separatorLimit: { classPropertyName: "separatorLimit", publicName: "separatorLimit", isSignal: true, isRequired: false, transformFunction: null }, allowNegativeNumbers: { classPropertyName: "allowNegativeNumbers", publicName: "allowNegativeNumbers", isSignal: true, isRequired: false, transformFunction: null }, leadZeroDateTime: { classPropertyName: "leadZeroDateTime", publicName: "leadZeroDateTime", isSignal: true, isRequired: false, transformFunction: null }, leadZero: { classPropertyName: "leadZero", publicName: "leadZero", isSignal: true, isRequired: false, transformFunction: null }, triggerOnMaskChange: { classPropertyName: "triggerOnMaskChange", publicName: "triggerOnMaskChange", isSignal: true, isRequired: false, transformFunction: null }, apm: { classPropertyName: "apm", publicName: "apm", isSignal: true, isRequired: false, transformFunction: null }, inputTransformFn: { classPropertyName: "inputTransformFn", publicName: "inputTransformFn", isSignal: true, isRequired: false, transformFunction: null }, outputTransformFn: { classPropertyName: "outputTransformFn", publicName: "outputTransformFn", isSignal: true, isRequired: false, transformFunction: null }, keepCharacterPositions: { classPropertyName: "keepCharacterPositions", publicName: "keepCharacterPositions", isSignal: true, isRequired: false, transformFunction: null }, instantPrefix: { classPropertyName: "instantPrefix", publicName: "instantPrefix", isSignal: true, isRequired: false, transformFunction: null } }, 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: [
|
|
7244
|
-
{
|
|
7245
|
-
provide: NG_VALUE_ACCESSOR,
|
|
7246
|
-
useExisting: forwardRef(() => MatchaMaskDirective),
|
|
7247
|
-
multi: true,
|
|
7248
|
-
},
|
|
7249
|
-
{
|
|
7250
|
-
provide: NG_VALIDATORS,
|
|
7251
|
-
useExisting: forwardRef(() => MatchaMaskDirective),
|
|
7252
|
-
multi: true,
|
|
7253
|
-
},
|
|
7254
|
-
MatchaMaskService,
|
|
7255
|
-
], exportAs: ["mask", "matchaMask"], usesOnChanges: true, ngImport: i0 }); }
|
|
6885
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaInputPhoneComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6886
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: MatchaInputPhoneComponent, isStandalone: false, selector: "matcha-input-phone", inputs: { fallbackMask: "fallbackMask", value: "value" }, outputs: { onChange: "onChange" }, viewQueries: [{ propertyName: "inputSelector", first: true, predicate: ["inputSelector"], descendants: true }, { propertyName: "phoneRef", first: true, predicate: ["phoneRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\n<div class=\"flex-row position-relative px-16 gap-8\" #inputSelector>\n <div class=\"min-h-24 radius-8 cursor-pointer d-flex gap-8 flex-align-center fs-16\" (click)=\"toggleDropdown()\">\n <div class=\"d-flex-row flex-align-center\">\n <img alt=\"\" [src]=\"'https://flagcdn.com/16x12/'+ selectedCountry?.iso2?.toLowerCase() + '.png'\"\n height=\"16\">\n </div>\n <span class=\"w-16 fs-16\"\n [ngClass]=\"isOpen ? 'i-matcha-action_arrow_up': 'i-matcha-action_arrow_down'\"></span>\n\n </div>\n <input *ngIf=\"isInitialized\" #phoneRef type=\"text\" placeholder=\"{{ typeMask }}\"\n [(ngModel)]=\"inputValueModel\"\n pattern=\"[0-9]*\" (keyup)=\"onInput($event)\" [mask]=\"typeMask\">\n\n <ng-container *ngIf=\"isOpen\">\n <div class=\"position-absolute z-index-10\">\n <div class=\"grid-1 gap-16 radius-8 z-index-10 p-8 w-300 position-absolute background-surface elevation-z-1\"\n style=\"top: calc(100% + 10px); overflow: hidden; height: 300px; overflow-y: auto;\">\n\n <label *ngFor=\"let country of allCountries; let i = index\"\n class=\"fs-16 lh-18 cursor-pointer d-flex-align-center p-8 ts-300-l\"\n [ngClass]=\"labelHover === i+'bg' ? 'background-bg' : 'background-surface'\"\n (mouseover)=\"labelHover = i+'bg'\" (mouseout)=\"labelHover = i+'su'\"\n (click)=\"selectCountry(country)\">\n <img alt=\"\" class=\"mr-8\"\n [src]=\"'https://flagcdn.com/16x12/'+ country?.iso2?.toLowerCase() + '.png'\" height=\"16\">\n {{country.name}}\n </label>\n </div>\n </div>\n </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: MatchaMaskCompatibleDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions", "instantPrefix"], outputs: ["maskFilled"], exportAs: ["mask", "matchaMask"] }] }); }
|
|
7256
6887
|
}
|
|
7257
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type:
|
|
7258
|
-
type:
|
|
6888
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaInputPhoneComponent, decorators: [{
|
|
6889
|
+
type: Component,
|
|
6890
|
+
args: [{ selector: 'matcha-input-phone', standalone: false, template: "\n<div class=\"flex-row position-relative px-16 gap-8\" #inputSelector>\n <div class=\"min-h-24 radius-8 cursor-pointer d-flex gap-8 flex-align-center fs-16\" (click)=\"toggleDropdown()\">\n <div class=\"d-flex-row flex-align-center\">\n <img alt=\"\" [src]=\"'https://flagcdn.com/16x12/'+ selectedCountry?.iso2?.toLowerCase() + '.png'\"\n height=\"16\">\n </div>\n <span class=\"w-16 fs-16\"\n [ngClass]=\"isOpen ? 'i-matcha-action_arrow_up': 'i-matcha-action_arrow_down'\"></span>\n\n </div>\n <input *ngIf=\"isInitialized\" #phoneRef type=\"text\" placeholder=\"{{ typeMask }}\"\n [(ngModel)]=\"inputValueModel\"\n pattern=\"[0-9]*\" (keyup)=\"onInput($event)\" [mask]=\"typeMask\">\n\n <ng-container *ngIf=\"isOpen\">\n <div class=\"position-absolute z-index-10\">\n <div class=\"grid-1 gap-16 radius-8 z-index-10 p-8 w-300 position-absolute background-surface elevation-z-1\"\n style=\"top: calc(100% + 10px); overflow: hidden; height: 300px; overflow-y: auto;\">\n\n <label *ngFor=\"let country of allCountries; let i = index\"\n class=\"fs-16 lh-18 cursor-pointer d-flex-align-center p-8 ts-300-l\"\n [ngClass]=\"labelHover === i+'bg' ? 'background-bg' : 'background-surface'\"\n (mouseover)=\"labelHover = i+'bg'\" (mouseout)=\"labelHover = i+'su'\"\n (click)=\"selectCountry(country)\">\n <img alt=\"\" class=\"mr-8\"\n [src]=\"'https://flagcdn.com/16x12/'+ country?.iso2?.toLowerCase() + '.png'\" height=\"16\">\n {{country.name}}\n </label>\n </div>\n </div>\n </ng-container>\n</div>\n" }]
|
|
6891
|
+
}], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }], propDecorators: { inputSelector: [{
|
|
6892
|
+
type: ViewChild,
|
|
6893
|
+
args: ['inputSelector']
|
|
6894
|
+
}], phoneRef: [{
|
|
6895
|
+
type: ViewChild,
|
|
6896
|
+
args: ['phoneRef']
|
|
6897
|
+
}], fallbackMask: [{
|
|
6898
|
+
type: Input,
|
|
6899
|
+
args: ['fallbackMask']
|
|
6900
|
+
}], value: [{
|
|
6901
|
+
type: Input,
|
|
6902
|
+
args: ['value']
|
|
6903
|
+
}], onChange: [{
|
|
6904
|
+
type: Output
|
|
6905
|
+
}] } });
|
|
6906
|
+
|
|
6907
|
+
class StepComponent {
|
|
6908
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: StepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6909
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: StepComponent, isStandalone: false, selector: "matcha-step", inputs: { step: ["title", "step"] }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: `<ng-template><ng-content></ng-content></ng-template>`, isInline: true }); }
|
|
6910
|
+
}
|
|
6911
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: StepComponent, decorators: [{
|
|
6912
|
+
type: Component,
|
|
7259
6913
|
args: [{
|
|
7260
|
-
selector: '
|
|
7261
|
-
|
|
7262
|
-
|
|
7263
|
-
{
|
|
7264
|
-
provide: NG_VALUE_ACCESSOR,
|
|
7265
|
-
useExisting: forwardRef(() => MatchaMaskDirective),
|
|
7266
|
-
multi: true,
|
|
7267
|
-
},
|
|
7268
|
-
{
|
|
7269
|
-
provide: NG_VALIDATORS,
|
|
7270
|
-
useExisting: forwardRef(() => MatchaMaskDirective),
|
|
7271
|
-
multi: true,
|
|
7272
|
-
},
|
|
7273
|
-
MatchaMaskService,
|
|
7274
|
-
],
|
|
7275
|
-
exportAs: 'mask,matchaMask',
|
|
6914
|
+
selector: 'matcha-step',
|
|
6915
|
+
template: `<ng-template><ng-content></ng-content></ng-template>`,
|
|
6916
|
+
standalone: false
|
|
7276
6917
|
}]
|
|
7277
|
-
}], propDecorators: {
|
|
7278
|
-
type:
|
|
7279
|
-
args: ['
|
|
7280
|
-
}],
|
|
7281
|
-
type:
|
|
7282
|
-
args: [
|
|
7283
|
-
}], onModelChange: [{
|
|
7284
|
-
type: HostListener,
|
|
7285
|
-
args: ['ngModelChange', ['$event']]
|
|
7286
|
-
}], onInput: [{
|
|
7287
|
-
type: HostListener,
|
|
7288
|
-
args: ['input', ['$event']]
|
|
7289
|
-
}], onCompositionStart: [{
|
|
7290
|
-
type: HostListener,
|
|
7291
|
-
args: ['compositionstart', ['$event']]
|
|
7292
|
-
}], onCompositionEnd: [{
|
|
7293
|
-
type: HostListener,
|
|
7294
|
-
args: ['compositionend', ['$event']]
|
|
7295
|
-
}], onBlur: [{
|
|
7296
|
-
type: HostListener,
|
|
7297
|
-
args: ['blur', ['$event']]
|
|
7298
|
-
}], onClick: [{
|
|
7299
|
-
type: HostListener,
|
|
7300
|
-
args: ['click', ['$event']]
|
|
7301
|
-
}], onKeyDown: [{
|
|
7302
|
-
type: HostListener,
|
|
7303
|
-
args: ['keydown', ['$event']]
|
|
6918
|
+
}], propDecorators: { step: [{
|
|
6919
|
+
type: Input,
|
|
6920
|
+
args: ['title']
|
|
6921
|
+
}], template: [{
|
|
6922
|
+
type: ViewChild,
|
|
6923
|
+
args: [TemplateRef, { static: true }]
|
|
7304
6924
|
}] } });
|
|
7305
6925
|
|
|
7306
|
-
|
|
7307
|
-
|
|
7308
|
-
|
|
7309
|
-
|
|
7310
|
-
|
|
7311
|
-
|
|
7312
|
-
|
|
7313
|
-
|
|
7314
|
-
* - Suporte a diferentes formatos de telefone (fixo/celular) para o Brasil.
|
|
7315
|
-
* - Emissão de evento ao alterar o valor do telefone.
|
|
7316
|
-
* - Inicialização automática pelo valor informado ou pelo idioma do navegador.
|
|
7317
|
-
*
|
|
7318
|
-
* Inputs:
|
|
7319
|
-
* - fallbackMask: string - Máscara padrão caso não seja encontrada uma específica.
|
|
7320
|
-
* - label: string - Rótulo do campo (padrão: 'Telefone').
|
|
7321
|
-
* - value: string - Valor inicial do telefone (com ou sem DDI).
|
|
7322
|
-
*
|
|
7323
|
-
* Outputs:
|
|
7324
|
-
* - onChange: EventEmitter<string> - Emite o valor do telefone completo (com DDI) ao alterar.
|
|
7325
|
-
*
|
|
7326
|
-
* ViewChild:
|
|
7327
|
-
* - inputSelector: ElementRef - Referência ao container do input (usado para fechar o dropdown).
|
|
7328
|
-
* - phoneRef: ElementRef - Referência ao input do telefone.
|
|
7329
|
-
*
|
|
7330
|
-
* Métodos principais:
|
|
7331
|
-
* - ngOnInit: Inicializa o componente pelo valor ou idioma.
|
|
7332
|
-
* - ngOnChanges: Atualiza o valor ao receber novo input externo.
|
|
7333
|
-
* - initCountryPhone: Inicializa país e máscara pelo valor do telefone.
|
|
7334
|
-
* - selectMaskForDialCode: Seleciona a máscara conforme país e DDD.
|
|
7335
|
-
* - selectCountry: Troca o país selecionado e atualiza máscara.
|
|
7336
|
-
* - onInput: Atualiza máscara e emite evento ao digitar.
|
|
7337
|
-
* - toggleDropdown: Abre/fecha o dropdown de países.
|
|
7338
|
-
*/
|
|
7339
|
-
class MatchaInputPhoneComponent {
|
|
7340
|
-
constructor(renderer, cdr) {
|
|
7341
|
-
this.renderer = renderer;
|
|
7342
|
-
this.cdr = cdr;
|
|
7343
|
-
this.fallbackMask = '00 0000 0000';
|
|
7344
|
-
this.onChange = new EventEmitter();
|
|
7345
|
-
this.typeMask = '';
|
|
7346
|
-
this.labelHover = 'su';
|
|
7347
|
-
this.allCountries = getCountryISO2();
|
|
7348
|
-
this.isOpen = false;
|
|
7349
|
-
this.inputValueModel = '';
|
|
7350
|
-
this.clickListener = null;
|
|
7351
|
-
this.isInitialized = false;
|
|
7352
|
-
}
|
|
7353
|
-
ngOnInit() {
|
|
7354
|
-
this.value ? this.initCountryPhone(this.value) : this.initCountrylanguageNavigator();
|
|
7355
|
-
this.cdr.detectChanges();
|
|
7356
|
-
this.isInitialized = true;
|
|
6926
|
+
class MatchaStepperStateService {
|
|
6927
|
+
constructor() {
|
|
6928
|
+
this.steps = [];
|
|
6929
|
+
this._steps$ = new BehaviorSubject([]);
|
|
6930
|
+
this.steps$ = this._steps$.asObservable();
|
|
6931
|
+
this._activeStep$ = new BehaviorSubject(0);
|
|
6932
|
+
this.activeStep$ = this._activeStep$.asObservable();
|
|
6933
|
+
this.pendingActiveStep = null;
|
|
7357
6934
|
}
|
|
7358
|
-
|
|
7359
|
-
|
|
7360
|
-
|
|
7361
|
-
|
|
7362
|
-
|
|
7363
|
-
|
|
7364
|
-
|
|
7365
|
-
this.initCountryPhone(this.value);
|
|
7366
|
-
this.cdr.detectChanges();
|
|
6935
|
+
setSteps(steps) {
|
|
6936
|
+
this.steps = steps;
|
|
6937
|
+
this._steps$.next(steps);
|
|
6938
|
+
// Se havia um índice pendente, aplica agora
|
|
6939
|
+
if (this.pendingActiveStep !== null) {
|
|
6940
|
+
this.setActiveStep(this.pendingActiveStep);
|
|
6941
|
+
this.pendingActiveStep = null;
|
|
7367
6942
|
}
|
|
7368
6943
|
}
|
|
7369
|
-
|
|
7370
|
-
if (
|
|
7371
|
-
|
|
6944
|
+
setActiveStep(index) {
|
|
6945
|
+
if (this.steps.length === 0) {
|
|
6946
|
+
// Steps ainda não definidos, guarda para depois
|
|
6947
|
+
this.pendingActiveStep = index;
|
|
7372
6948
|
return;
|
|
7373
6949
|
}
|
|
7374
|
-
|
|
7375
|
-
|
|
7376
|
-
if (phoneWithoutPlus.startsWith(countryDialCode)) {
|
|
7377
|
-
this.setCountryAndInputValue(this.selectedCountry.iso2, phoneWithoutPlus.replace(countryDialCode, ''));
|
|
7378
|
-
this.inputValueModel = phoneWithoutPlus.replace(countryDialCode, '');
|
|
7379
|
-
}
|
|
7380
|
-
else {
|
|
7381
|
-
this.matchCountryAndSetInputValue(phoneWithoutPlus);
|
|
6950
|
+
if (index >= 0 && index < this.steps.length) {
|
|
6951
|
+
this._activeStep$.next(index);
|
|
7382
6952
|
}
|
|
7383
6953
|
}
|
|
7384
|
-
|
|
7385
|
-
|
|
7386
|
-
|
|
7387
|
-
|
|
7388
|
-
}
|
|
7389
|
-
matchCountryAndSetInputValue(phoneWithoutPlus) {
|
|
7390
|
-
const matchingCountry = this.getMatchingCountry(phoneWithoutPlus);
|
|
7391
|
-
if (matchingCountry.length === 1) {
|
|
7392
|
-
this.setCountryAndInputValue(matchingCountry[0].iso2, phoneWithoutPlus.replace(matchingCountry[0].dialCode, ''));
|
|
7393
|
-
}
|
|
7394
|
-
else {
|
|
7395
|
-
this.matchAreaCodeAndSetInputValue(phoneWithoutPlus, matchingCountry);
|
|
6954
|
+
nextStep() {
|
|
6955
|
+
const current = this._activeStep$.value;
|
|
6956
|
+
if (current < this.steps.length - 1) {
|
|
6957
|
+
this._activeStep$.next(current + 1);
|
|
7396
6958
|
}
|
|
7397
6959
|
}
|
|
7398
|
-
|
|
7399
|
-
|
|
7400
|
-
|
|
7401
|
-
|
|
7402
|
-
});
|
|
7403
|
-
}
|
|
7404
|
-
matchAreaCodeAndSetInputValue(phoneWithoutPlus, matchingCountry) {
|
|
7405
|
-
const phoneWithoutDialCode = phoneWithoutPlus.replace(matchingCountry[0].dialCode, '');
|
|
7406
|
-
const filterAreaCode = phoneWithoutDialCode.substring(0, 3);
|
|
7407
|
-
const matchingAreaCode = matchingCountry.filter((country) => {
|
|
7408
|
-
if (country.areaCodes) {
|
|
7409
|
-
return country.areaCodes.includes(filterAreaCode);
|
|
7410
|
-
}
|
|
7411
|
-
});
|
|
7412
|
-
if (matchingAreaCode.length === 1) {
|
|
7413
|
-
this.setCountryAndInputValue(matchingAreaCode[0].iso2, phoneWithoutDialCode);
|
|
7414
|
-
}
|
|
7415
|
-
else {
|
|
7416
|
-
const defaultCountry = matchingCountry.find((country) => country.priority === 0);
|
|
7417
|
-
this.setCountryAndInputValue(defaultCountry.iso2, phoneWithoutDialCode);
|
|
7418
|
-
}
|
|
7419
|
-
}
|
|
7420
|
-
selectMaskForDialCode(inputDigits, targetValuePhone) {
|
|
7421
|
-
const previousMask = this.typeMask;
|
|
7422
|
-
const maskArray = this.selectedCountry?.mask;
|
|
7423
|
-
const maskIndex = this.selectedCountry?.areaCodes
|
|
7424
|
-
? this.selectedCountry.areaCodes.findIndex((code) => inputDigits === code)
|
|
7425
|
-
: -1;
|
|
7426
|
-
if (this.selectedCountry?.iso2 === 'br' && (targetValuePhone && targetValuePhone.length > 2)) {
|
|
7427
|
-
const eventInput = targetValuePhone.substring(2);
|
|
7428
|
-
if (eventInput && eventInput[0] === '9') {
|
|
7429
|
-
this.typeMask = "00 0 0000 0000";
|
|
7430
|
-
this.cdr.detectChanges();
|
|
7431
|
-
return;
|
|
7432
|
-
}
|
|
7433
|
-
}
|
|
7434
|
-
if (Array.isArray(maskArray)) {
|
|
7435
|
-
if (maskIndex !== -1 && maskArray[maskIndex]) {
|
|
7436
|
-
this.typeMask = maskArray[maskIndex];
|
|
7437
|
-
}
|
|
7438
|
-
else if (maskArray[0]) {
|
|
7439
|
-
this.typeMask = maskArray[0];
|
|
7440
|
-
}
|
|
7441
|
-
else {
|
|
7442
|
-
this.typeMask = this.fallbackMask;
|
|
7443
|
-
}
|
|
7444
|
-
}
|
|
7445
|
-
else {
|
|
7446
|
-
this.typeMask = this.fallbackMask;
|
|
7447
|
-
}
|
|
7448
|
-
if (previousMask !== this.typeMask)
|
|
7449
|
-
this.inputValueModel = '';
|
|
7450
|
-
this.cdr.detectChanges();
|
|
7451
|
-
}
|
|
7452
|
-
initCountrylanguageNavigator() {
|
|
7453
|
-
let lang = navigator.language;
|
|
7454
|
-
if (lang.includes('-')) {
|
|
7455
|
-
const langParts = lang.split('-');
|
|
7456
|
-
lang = langParts[1];
|
|
7457
|
-
}
|
|
7458
|
-
this.selectedCountry = this.allCountries.find((country) => country.iso2 === lang.toLocaleLowerCase());
|
|
7459
|
-
this.selectMaskForDialCode(this.selectedCountry.areaCodes ? this.selectedCountry.areaCodes[0] : '000');
|
|
7460
|
-
}
|
|
7461
|
-
selectCountry(country) {
|
|
7462
|
-
this.selectedCountry = country;
|
|
7463
|
-
this.selectMaskForDialCode(this.selectedCountry.areaCodes ? this.selectedCountry.areaCodes[0] : '000');
|
|
7464
|
-
this.isOpen = false;
|
|
7465
|
-
this.onChange.emit('+' + this.selectedCountry.dialCode + this.inputValueModel);
|
|
7466
|
-
this.removeClickListener();
|
|
7467
|
-
this.cdr.detectChanges();
|
|
7468
|
-
}
|
|
7469
|
-
toggleDropdown() {
|
|
7470
|
-
this.isOpen = !this.isOpen;
|
|
7471
|
-
this.clickListener = this.renderer.listen('window', 'click', (event) => {
|
|
7472
|
-
if (this.isOpen && !this.inputSelector.nativeElement.contains(event.target)) {
|
|
7473
|
-
this.isOpen = false;
|
|
7474
|
-
this.removeClickListener();
|
|
7475
|
-
}
|
|
7476
|
-
});
|
|
7477
|
-
this.cdr.detectChanges();
|
|
7478
|
-
}
|
|
7479
|
-
removeClickListener() {
|
|
7480
|
-
if (this.clickListener) {
|
|
7481
|
-
this.clickListener();
|
|
7482
|
-
this.clickListener = null;
|
|
7483
|
-
}
|
|
7484
|
-
}
|
|
7485
|
-
onInput(event) {
|
|
7486
|
-
this.phoneRef.nativeElement.value = event.target.value.replace(/[^\d\s]/g, '');
|
|
7487
|
-
let targetValuePhone = event.target.value.replace(/\D/g, '');
|
|
7488
|
-
this.onChange.emit('+' + this.selectedCountry.dialCode + this.inputValueModel);
|
|
7489
|
-
const inputDigits = targetValuePhone.substring(0, 3);
|
|
7490
|
-
if (inputDigits) {
|
|
7491
|
-
this.selectMaskForDialCode(inputDigits, targetValuePhone);
|
|
7492
|
-
}
|
|
7493
|
-
this.cdr.detectChanges();
|
|
7494
|
-
}
|
|
7495
|
-
ngOnDestroy() {
|
|
7496
|
-
this.removeClickListener();
|
|
7497
|
-
}
|
|
7498
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaInputPhoneComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7499
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: MatchaInputPhoneComponent, isStandalone: false, selector: "matcha-input-phone", inputs: { fallbackMask: "fallbackMask", value: "value" }, outputs: { onChange: "onChange" }, viewQueries: [{ propertyName: "inputSelector", first: true, predicate: ["inputSelector"], descendants: true }, { propertyName: "phoneRef", first: true, predicate: ["phoneRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\n<div class=\"flex-row position-relative px-16 gap-8\" #inputSelector>\n <div class=\"min-h-24 radius-8 cursor-pointer d-flex gap-8 flex-align-center fs-16\" (click)=\"toggleDropdown()\">\n <div class=\"d-flex-row flex-align-center\">\n <img alt=\"\" [src]=\"'https://flagcdn.com/16x12/'+ selectedCountry?.iso2?.toLowerCase() + '.png'\"\n height=\"16\">\n </div>\n <span class=\"w-16 fs-16\"\n [ngClass]=\"isOpen ? 'i-matcha-action_arrow_up': 'i-matcha-action_arrow_down'\"></span>\n\n </div>\n <input *ngIf=\"isInitialized\" #phoneRef type=\"text\" placeholder=\"{{ typeMask }}\"\n [(ngModel)]=\"inputValueModel\"\n pattern=\"[0-9]*\" (keyup)=\"onInput($event)\" [mask]=\"typeMask\">\n\n <ng-container *ngIf=\"isOpen\">\n <div class=\"position-absolute z-index-10\">\n <div class=\"grid-1 gap-16 radius-8 z-index-10 p-8 w-300 position-absolute background-surface elevation-z-1\"\n style=\"top: calc(100% + 10px); overflow: hidden; height: 300px; overflow-y: auto;\">\n\n <label *ngFor=\"let country of allCountries; let i = index\"\n class=\"fs-16 lh-18 cursor-pointer d-flex-align-center p-8 ts-300-l\"\n [ngClass]=\"labelHover === i+'bg' ? 'background-bg' : 'background-surface'\"\n (mouseover)=\"labelHover = i+'bg'\" (mouseout)=\"labelHover = i+'su'\"\n (click)=\"selectCountry(country)\">\n <img alt=\"\" class=\"mr-8\"\n [src]=\"'https://flagcdn.com/16x12/'+ country?.iso2?.toLowerCase() + '.png'\" height=\"16\">\n {{country.name}}\n </label>\n </div>\n </div>\n </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: MatchaMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions", "instantPrefix"], outputs: ["maskFilled"], exportAs: ["mask", "matchaMask"] }] }); }
|
|
7500
|
-
}
|
|
7501
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaInputPhoneComponent, decorators: [{
|
|
7502
|
-
type: Component,
|
|
7503
|
-
args: [{ selector: 'matcha-input-phone', standalone: false, template: "\n<div class=\"flex-row position-relative px-16 gap-8\" #inputSelector>\n <div class=\"min-h-24 radius-8 cursor-pointer d-flex gap-8 flex-align-center fs-16\" (click)=\"toggleDropdown()\">\n <div class=\"d-flex-row flex-align-center\">\n <img alt=\"\" [src]=\"'https://flagcdn.com/16x12/'+ selectedCountry?.iso2?.toLowerCase() + '.png'\"\n height=\"16\">\n </div>\n <span class=\"w-16 fs-16\"\n [ngClass]=\"isOpen ? 'i-matcha-action_arrow_up': 'i-matcha-action_arrow_down'\"></span>\n\n </div>\n <input *ngIf=\"isInitialized\" #phoneRef type=\"text\" placeholder=\"{{ typeMask }}\"\n [(ngModel)]=\"inputValueModel\"\n pattern=\"[0-9]*\" (keyup)=\"onInput($event)\" [mask]=\"typeMask\">\n\n <ng-container *ngIf=\"isOpen\">\n <div class=\"position-absolute z-index-10\">\n <div class=\"grid-1 gap-16 radius-8 z-index-10 p-8 w-300 position-absolute background-surface elevation-z-1\"\n style=\"top: calc(100% + 10px); overflow: hidden; height: 300px; overflow-y: auto;\">\n\n <label *ngFor=\"let country of allCountries; let i = index\"\n class=\"fs-16 lh-18 cursor-pointer d-flex-align-center p-8 ts-300-l\"\n [ngClass]=\"labelHover === i+'bg' ? 'background-bg' : 'background-surface'\"\n (mouseover)=\"labelHover = i+'bg'\" (mouseout)=\"labelHover = i+'su'\"\n (click)=\"selectCountry(country)\">\n <img alt=\"\" class=\"mr-8\"\n [src]=\"'https://flagcdn.com/16x12/'+ country?.iso2?.toLowerCase() + '.png'\" height=\"16\">\n {{country.name}}\n </label>\n </div>\n </div>\n </ng-container>\n</div>\n" }]
|
|
7504
|
-
}], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }], propDecorators: { inputSelector: [{
|
|
7505
|
-
type: ViewChild,
|
|
7506
|
-
args: ['inputSelector']
|
|
7507
|
-
}], phoneRef: [{
|
|
7508
|
-
type: ViewChild,
|
|
7509
|
-
args: ['phoneRef']
|
|
7510
|
-
}], fallbackMask: [{
|
|
7511
|
-
type: Input,
|
|
7512
|
-
args: ['fallbackMask']
|
|
7513
|
-
}], value: [{
|
|
7514
|
-
type: Input,
|
|
7515
|
-
args: ['value']
|
|
7516
|
-
}], onChange: [{
|
|
7517
|
-
type: Output
|
|
7518
|
-
}] } });
|
|
7519
|
-
|
|
7520
|
-
class StepComponent {
|
|
7521
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: StepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7522
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.0", type: StepComponent, isStandalone: false, selector: "matcha-step", inputs: { step: ["title", "step"] }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: `<ng-template><ng-content></ng-content></ng-template>`, isInline: true }); }
|
|
7523
|
-
}
|
|
7524
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: StepComponent, decorators: [{
|
|
7525
|
-
type: Component,
|
|
7526
|
-
args: [{
|
|
7527
|
-
selector: 'matcha-step',
|
|
7528
|
-
template: `<ng-template><ng-content></ng-content></ng-template>`,
|
|
7529
|
-
standalone: false
|
|
7530
|
-
}]
|
|
7531
|
-
}], propDecorators: { step: [{
|
|
7532
|
-
type: Input,
|
|
7533
|
-
args: ['title']
|
|
7534
|
-
}], template: [{
|
|
7535
|
-
type: ViewChild,
|
|
7536
|
-
args: [TemplateRef, { static: true }]
|
|
7537
|
-
}] } });
|
|
7538
|
-
|
|
7539
|
-
class MatchaStepperStateService {
|
|
7540
|
-
constructor() {
|
|
7541
|
-
this.steps = [];
|
|
7542
|
-
this._steps$ = new BehaviorSubject([]);
|
|
7543
|
-
this.steps$ = this._steps$.asObservable();
|
|
7544
|
-
this._activeStep$ = new BehaviorSubject(0);
|
|
7545
|
-
this.activeStep$ = this._activeStep$.asObservable();
|
|
7546
|
-
this.pendingActiveStep = null;
|
|
7547
|
-
}
|
|
7548
|
-
setSteps(steps) {
|
|
7549
|
-
this.steps = steps;
|
|
7550
|
-
this._steps$.next(steps);
|
|
7551
|
-
// Se havia um índice pendente, aplica agora
|
|
7552
|
-
if (this.pendingActiveStep !== null) {
|
|
7553
|
-
this.setActiveStep(this.pendingActiveStep);
|
|
7554
|
-
this.pendingActiveStep = null;
|
|
7555
|
-
}
|
|
7556
|
-
}
|
|
7557
|
-
setActiveStep(index) {
|
|
7558
|
-
if (this.steps.length === 0) {
|
|
7559
|
-
// Steps ainda não definidos, guarda para depois
|
|
7560
|
-
this.pendingActiveStep = index;
|
|
7561
|
-
return;
|
|
7562
|
-
}
|
|
7563
|
-
if (index >= 0 && index < this.steps.length) {
|
|
7564
|
-
this._activeStep$.next(index);
|
|
7565
|
-
}
|
|
7566
|
-
}
|
|
7567
|
-
nextStep() {
|
|
7568
|
-
const current = this._activeStep$.value;
|
|
7569
|
-
if (current < this.steps.length - 1) {
|
|
7570
|
-
this._activeStep$.next(current + 1);
|
|
7571
|
-
}
|
|
7572
|
-
}
|
|
7573
|
-
prevStep() {
|
|
7574
|
-
const current = this._activeStep$.value;
|
|
7575
|
-
if (current > 0) {
|
|
7576
|
-
this._activeStep$.next(current - 1);
|
|
6960
|
+
prevStep() {
|
|
6961
|
+
const current = this._activeStep$.value;
|
|
6962
|
+
if (current > 0) {
|
|
6963
|
+
this._activeStep$.next(current - 1);
|
|
7577
6964
|
}
|
|
7578
6965
|
}
|
|
7579
6966
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaStepperStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
@@ -12201,105 +11588,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
|
|
|
12201
11588
|
}]
|
|
12202
11589
|
}] });
|
|
12203
11590
|
|
|
12204
|
-
|
|
12205
|
-
constructor() {
|
|
12206
|
-
this.defaultOptions = inject(MATCHA_MASK_CONFIG);
|
|
12207
|
-
this._maskService = inject(MatchaMaskService);
|
|
12208
|
-
this._maskExpressionArray = [];
|
|
12209
|
-
this.mask = '';
|
|
12210
|
-
}
|
|
12211
|
-
transform(value, mask, { patterns, ...config } = {}) {
|
|
12212
|
-
let processedValue = value;
|
|
12213
|
-
const currentConfig = {
|
|
12214
|
-
maskExpression: mask,
|
|
12215
|
-
...this.defaultOptions,
|
|
12216
|
-
...config,
|
|
12217
|
-
patterns: {
|
|
12218
|
-
...this._maskService.patterns,
|
|
12219
|
-
...patterns,
|
|
12220
|
-
},
|
|
12221
|
-
};
|
|
12222
|
-
Object.entries(currentConfig).forEach(([key, val]) => {
|
|
12223
|
-
this._maskService[key] = val;
|
|
12224
|
-
});
|
|
12225
|
-
if (mask.includes('||')) {
|
|
12226
|
-
const maskParts = mask.split('||');
|
|
12227
|
-
if (maskParts.length > 1) {
|
|
12228
|
-
this._maskExpressionArray = maskParts.sort((a, b) => a.length - b.length);
|
|
12229
|
-
this._setMask(`${processedValue}`);
|
|
12230
|
-
return this._maskService.applyMask(`${processedValue}`, this.mask);
|
|
12231
|
-
}
|
|
12232
|
-
else {
|
|
12233
|
-
this._maskExpressionArray = [];
|
|
12234
|
-
return this._maskService.applyMask(`${processedValue}`, this.mask);
|
|
12235
|
-
}
|
|
12236
|
-
}
|
|
12237
|
-
if (mask.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */)) {
|
|
12238
|
-
return this._maskService.applyMask(`${processedValue}`, this._maskService._repeatPatternSymbols(mask));
|
|
12239
|
-
}
|
|
12240
|
-
if (mask.startsWith("separator" /* MaskExpression.SEPARATOR */)) {
|
|
12241
|
-
if (config.decimalMarker) {
|
|
12242
|
-
this._maskService.decimalMarker = config.decimalMarker;
|
|
12243
|
-
}
|
|
12244
|
-
if (config.thousandSeparator) {
|
|
12245
|
-
this._maskService.thousandSeparator = config.thousandSeparator;
|
|
12246
|
-
}
|
|
12247
|
-
if (config.leadZero) {
|
|
12248
|
-
this._maskService.leadZero = config.leadZero;
|
|
12249
|
-
}
|
|
12250
|
-
processedValue = String(processedValue);
|
|
12251
|
-
const localeDecimalMarker = this._maskService.currentLocaleDecimalMarker();
|
|
12252
|
-
if (!Array.isArray(this._maskService.decimalMarker)) {
|
|
12253
|
-
processedValue =
|
|
12254
|
-
this._maskService.decimalMarker !== localeDecimalMarker
|
|
12255
|
-
? processedValue.replace(localeDecimalMarker, this._maskService.decimalMarker)
|
|
12256
|
-
: processedValue;
|
|
12257
|
-
}
|
|
12258
|
-
if (this._maskService.leadZero &&
|
|
12259
|
-
processedValue &&
|
|
12260
|
-
this._maskService.dropSpecialCharacters !== false) {
|
|
12261
|
-
processedValue = this._maskService._checkPrecision(mask, processedValue);
|
|
12262
|
-
}
|
|
12263
|
-
if (this._maskService.decimalMarker === "," /* MaskExpression.COMMA */) {
|
|
12264
|
-
processedValue = processedValue.replace("." /* MaskExpression.DOT */, "," /* MaskExpression.COMMA */);
|
|
12265
|
-
}
|
|
12266
|
-
this._maskService.isNumberValue = true;
|
|
12267
|
-
}
|
|
12268
|
-
if (processedValue === null || typeof processedValue === 'undefined') {
|
|
12269
|
-
return this._maskService.applyMask('', mask);
|
|
12270
|
-
}
|
|
12271
|
-
return this._maskService.applyMask(`${processedValue}`, mask);
|
|
12272
|
-
}
|
|
12273
|
-
_setMask(value) {
|
|
12274
|
-
if (this._maskExpressionArray.length > 0) {
|
|
12275
|
-
this._maskExpressionArray.some((mask) => {
|
|
12276
|
-
const test = this._maskService.removeMask(value)?.length <=
|
|
12277
|
-
this._maskService.removeMask(mask)?.length;
|
|
12278
|
-
if (value && test) {
|
|
12279
|
-
this.mask = mask;
|
|
12280
|
-
return test;
|
|
12281
|
-
}
|
|
12282
|
-
else {
|
|
12283
|
-
this.mask =
|
|
12284
|
-
this._maskExpressionArray[this._maskExpressionArray.length - 1] ??
|
|
12285
|
-
"" /* MaskExpression.EMPTY_STRING */;
|
|
12286
|
-
}
|
|
12287
|
-
});
|
|
12288
|
-
}
|
|
12289
|
-
}
|
|
12290
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
12291
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskPipe, isStandalone: false, name: "mask" }); }
|
|
12292
|
-
}
|
|
12293
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskPipe, decorators: [{
|
|
12294
|
-
type: Pipe,
|
|
12295
|
-
args: [{
|
|
12296
|
-
name: 'mask',
|
|
12297
|
-
pure: true,
|
|
12298
|
-
standalone: false,
|
|
12299
|
-
}]
|
|
12300
|
-
}] });
|
|
12301
|
-
|
|
12302
|
-
const options = {
|
|
11591
|
+
const compatibleOptions = {
|
|
12303
11592
|
specialCharacters: ['/', '(', ')', '.', ':', '-', ' ', '+', ',', '@', '[', ']', '"', "'", '*'],
|
|
12304
11593
|
patterns: {
|
|
12305
11594
|
'0': { pattern: /\d/ },
|
|
@@ -12330,29 +11619,27 @@ const options = {
|
|
|
12330
11619
|
outputTransformFn: (v) => v,
|
|
12331
11620
|
maskFilled: new EventEmitter()
|
|
12332
11621
|
};
|
|
12333
|
-
class
|
|
12334
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type:
|
|
12335
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type:
|
|
12336
|
-
|
|
12337
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskModule, providers: [
|
|
11622
|
+
class MatchaMaskCompatibleModule {
|
|
11623
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskCompatibleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
11624
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskCompatibleModule, declarations: [MatchaMaskCompatibleDirective], imports: [CommonModule], exports: [MatchaMaskCompatibleDirective] }); }
|
|
11625
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskCompatibleModule, providers: [
|
|
12338
11626
|
MatchaMaskService,
|
|
12339
|
-
{ provide: MATCHA_MASK_CONFIG, useValue:
|
|
11627
|
+
{ provide: MATCHA_MASK_CONFIG, useValue: compatibleOptions }
|
|
12340
11628
|
], imports: [CommonModule] }); }
|
|
12341
11629
|
}
|
|
12342
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type:
|
|
11630
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskCompatibleModule, decorators: [{
|
|
12343
11631
|
type: NgModule,
|
|
12344
11632
|
args: [{
|
|
12345
|
-
declarations: [
|
|
11633
|
+
declarations: [MatchaMaskCompatibleDirective],
|
|
12346
11634
|
imports: [
|
|
12347
11635
|
CommonModule
|
|
12348
11636
|
],
|
|
12349
11637
|
exports: [
|
|
12350
|
-
|
|
12351
|
-
MatchaMaskPipe
|
|
11638
|
+
MatchaMaskCompatibleDirective
|
|
12352
11639
|
],
|
|
12353
11640
|
providers: [
|
|
12354
11641
|
MatchaMaskService,
|
|
12355
|
-
{ provide: MATCHA_MASK_CONFIG, useValue:
|
|
11642
|
+
{ provide: MATCHA_MASK_CONFIG, useValue: compatibleOptions }
|
|
12356
11643
|
]
|
|
12357
11644
|
}]
|
|
12358
11645
|
}] });
|
|
@@ -12362,11 +11649,11 @@ class MatchaInputPhoneModule {
|
|
|
12362
11649
|
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaInputPhoneModule, declarations: [MatchaInputPhoneComponent], imports: [CommonModule,
|
|
12363
11650
|
MatchaFormFieldModule,
|
|
12364
11651
|
FormsModule,
|
|
12365
|
-
|
|
12366
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaInputPhoneModule,
|
|
11652
|
+
MatchaMaskCompatibleModule], exports: [MatchaInputPhoneComponent] }); }
|
|
11653
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaInputPhoneModule, imports: [CommonModule,
|
|
12367
11654
|
MatchaFormFieldModule,
|
|
12368
11655
|
FormsModule,
|
|
12369
|
-
|
|
11656
|
+
MatchaMaskCompatibleModule] }); }
|
|
12370
11657
|
}
|
|
12371
11658
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaInputPhoneModule, decorators: [{
|
|
12372
11659
|
type: NgModule,
|
|
@@ -12376,10 +11663,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
|
|
|
12376
11663
|
CommonModule,
|
|
12377
11664
|
MatchaFormFieldModule,
|
|
12378
11665
|
FormsModule,
|
|
12379
|
-
|
|
11666
|
+
MatchaMaskCompatibleModule
|
|
12380
11667
|
],
|
|
12381
|
-
exports: [MatchaInputPhoneComponent]
|
|
12382
|
-
providers: [MatchaMaskModule],
|
|
11668
|
+
exports: [MatchaInputPhoneComponent]
|
|
12383
11669
|
}]
|
|
12384
11670
|
}] });
|
|
12385
11671
|
|
|
@@ -12569,7 +11855,7 @@ class MatchaComponentsModule {
|
|
|
12569
11855
|
MatchaPageLayoutModule,
|
|
12570
11856
|
MatchaDrawerModule,
|
|
12571
11857
|
MatchaHighlightModule,
|
|
12572
|
-
|
|
11858
|
+
MatchaMaskCompatibleModule], exports: [MatchaAccordionModule,
|
|
12573
11859
|
MatchaAutocompleteModule,
|
|
12574
11860
|
MatchaOptionModule,
|
|
12575
11861
|
MatchaPanelModule,
|
|
@@ -12614,7 +11900,7 @@ class MatchaComponentsModule {
|
|
|
12614
11900
|
MatchaAvatarModule,
|
|
12615
11901
|
MatchaDrawerModule,
|
|
12616
11902
|
MatchaHighlightModule,
|
|
12617
|
-
|
|
11903
|
+
MatchaMaskCompatibleModule] }); }
|
|
12618
11904
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaComponentsModule, imports: [CommonModule,
|
|
12619
11905
|
FormsModule,
|
|
12620
11906
|
ReactiveFormsModule,
|
|
@@ -12662,7 +11948,7 @@ class MatchaComponentsModule {
|
|
|
12662
11948
|
MatchaPageLayoutModule,
|
|
12663
11949
|
MatchaDrawerModule,
|
|
12664
11950
|
MatchaHighlightModule,
|
|
12665
|
-
|
|
11951
|
+
MatchaMaskCompatibleModule, MatchaAccordionModule,
|
|
12666
11952
|
MatchaAutocompleteModule,
|
|
12667
11953
|
MatchaOptionModule,
|
|
12668
11954
|
MatchaPanelModule,
|
|
@@ -12707,7 +11993,7 @@ class MatchaComponentsModule {
|
|
|
12707
11993
|
MatchaAvatarModule,
|
|
12708
11994
|
MatchaDrawerModule,
|
|
12709
11995
|
MatchaHighlightModule,
|
|
12710
|
-
|
|
11996
|
+
MatchaMaskCompatibleModule] }); }
|
|
12711
11997
|
}
|
|
12712
11998
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaComponentsModule, decorators: [{
|
|
12713
11999
|
type: NgModule,
|
|
@@ -12761,7 +12047,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
|
|
|
12761
12047
|
MatchaPageLayoutModule,
|
|
12762
12048
|
MatchaDrawerModule,
|
|
12763
12049
|
MatchaHighlightModule,
|
|
12764
|
-
|
|
12050
|
+
MatchaMaskCompatibleModule
|
|
12765
12051
|
],
|
|
12766
12052
|
exports: [MatchaAccordionModule,
|
|
12767
12053
|
MatchaAutocompleteModule,
|
|
@@ -12808,53 +12094,1148 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
|
|
|
12808
12094
|
MatchaAvatarModule,
|
|
12809
12095
|
MatchaDrawerModule,
|
|
12810
12096
|
MatchaHighlightModule,
|
|
12811
|
-
|
|
12097
|
+
MatchaMaskCompatibleModule
|
|
12098
|
+
],
|
|
12099
|
+
}]
|
|
12100
|
+
}] });
|
|
12101
|
+
|
|
12102
|
+
class MatchaSkeletonModule {
|
|
12103
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaSkeletonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
12104
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaSkeletonModule, declarations: [MatchaSkeletonComponent], imports: [CommonModule], exports: [MatchaSkeletonComponent] }); }
|
|
12105
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaSkeletonModule, imports: [CommonModule] }); }
|
|
12106
|
+
}
|
|
12107
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaSkeletonModule, decorators: [{
|
|
12108
|
+
type: NgModule,
|
|
12109
|
+
args: [{
|
|
12110
|
+
declarations: [MatchaSkeletonComponent],
|
|
12111
|
+
imports: [
|
|
12112
|
+
CommonModule
|
|
12113
|
+
],
|
|
12114
|
+
exports: [MatchaSkeletonComponent],
|
|
12115
|
+
}]
|
|
12116
|
+
}] });
|
|
12117
|
+
|
|
12118
|
+
/**
|
|
12119
|
+
* Módulo para o MatchaBreakpointObserver
|
|
12120
|
+
*
|
|
12121
|
+
* Este módulo fornece o serviço MatchaBreakpointObserver que pode ser usado
|
|
12122
|
+
* em qualquer parte da aplicação para observar breakpoints CSS.
|
|
12123
|
+
*
|
|
12124
|
+
* O serviço é um singleton (providedIn: 'root') e não precisa ser importado
|
|
12125
|
+
* explicitamente, mas este módulo pode ser usado para organização.
|
|
12126
|
+
*/
|
|
12127
|
+
class MatchaBreakpointObservableModule {
|
|
12128
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaBreakpointObservableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
12129
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaBreakpointObservableModule, imports: [CommonModule] }); }
|
|
12130
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaBreakpointObservableModule, providers: [
|
|
12131
|
+
// O serviço já é providedIn: 'root', mas incluímos aqui para clareza
|
|
12132
|
+
MatchaBreakpointObserver
|
|
12133
|
+
], imports: [CommonModule] }); }
|
|
12134
|
+
}
|
|
12135
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaBreakpointObservableModule, decorators: [{
|
|
12136
|
+
type: NgModule,
|
|
12137
|
+
args: [{
|
|
12138
|
+
imports: [
|
|
12139
|
+
CommonModule
|
|
12140
|
+
],
|
|
12141
|
+
providers: [
|
|
12142
|
+
// O serviço já é providedIn: 'root', mas incluímos aqui para clareza
|
|
12143
|
+
MatchaBreakpointObserver
|
|
12144
|
+
]
|
|
12145
|
+
}]
|
|
12146
|
+
}] });
|
|
12147
|
+
|
|
12148
|
+
class MatchaMaskDirective {
|
|
12149
|
+
constructor() {
|
|
12150
|
+
this.mask = input('', ...(ngDevMode ? [{ debugName: "mask" }] : []));
|
|
12151
|
+
this.specialCharacters = input([], ...(ngDevMode ? [{ debugName: "specialCharacters" }] : []));
|
|
12152
|
+
this.patterns = input({}, ...(ngDevMode ? [{ debugName: "patterns" }] : []));
|
|
12153
|
+
this.prefix = input('', ...(ngDevMode ? [{ debugName: "prefix" }] : []));
|
|
12154
|
+
this.suffix = input('', ...(ngDevMode ? [{ debugName: "suffix" }] : []));
|
|
12155
|
+
this.thousandSeparator = input(' ', ...(ngDevMode ? [{ debugName: "thousandSeparator" }] : []));
|
|
12156
|
+
this.decimalMarker = input('.', ...(ngDevMode ? [{ debugName: "decimalMarker" }] : []));
|
|
12157
|
+
this.dropSpecialCharacters = input(null, ...(ngDevMode ? [{ debugName: "dropSpecialCharacters" }] : []));
|
|
12158
|
+
this.hiddenInput = input(null, ...(ngDevMode ? [{ debugName: "hiddenInput" }] : []));
|
|
12159
|
+
this.showMaskTyped = input(null, ...(ngDevMode ? [{ debugName: "showMaskTyped" }] : []));
|
|
12160
|
+
this.placeHolderCharacter = input(null, ...(ngDevMode ? [{ debugName: "placeHolderCharacter" }] : []));
|
|
12161
|
+
this.shownMaskExpression = input(null, ...(ngDevMode ? [{ debugName: "shownMaskExpression" }] : []));
|
|
12162
|
+
this.clearIfNotMatch = input(null, ...(ngDevMode ? [{ debugName: "clearIfNotMatch" }] : []));
|
|
12163
|
+
this.validation = input(null, ...(ngDevMode ? [{ debugName: "validation" }] : []));
|
|
12164
|
+
this.separatorLimit = input('', ...(ngDevMode ? [{ debugName: "separatorLimit" }] : []));
|
|
12165
|
+
this.allowNegativeNumbers = input(null, ...(ngDevMode ? [{ debugName: "allowNegativeNumbers" }] : []));
|
|
12166
|
+
this.leadZeroDateTime = input(null, ...(ngDevMode ? [{ debugName: "leadZeroDateTime" }] : []));
|
|
12167
|
+
this.leadZero = input(null, ...(ngDevMode ? [{ debugName: "leadZero" }] : []));
|
|
12168
|
+
this.triggerOnMaskChange = input(null, ...(ngDevMode ? [{ debugName: "triggerOnMaskChange" }] : []));
|
|
12169
|
+
this.apm = input(null, ...(ngDevMode ? [{ debugName: "apm" }] : []));
|
|
12170
|
+
this.inputTransformFn = input(null, ...(ngDevMode ? [{ debugName: "inputTransformFn" }] : []));
|
|
12171
|
+
this.outputTransformFn = input(null, ...(ngDevMode ? [{ debugName: "outputTransformFn" }] : []));
|
|
12172
|
+
this.keepCharacterPositions = input(null, ...(ngDevMode ? [{ debugName: "keepCharacterPositions" }] : []));
|
|
12173
|
+
this.instantPrefix = input(null, ...(ngDevMode ? [{ debugName: "instantPrefix" }] : []));
|
|
12174
|
+
this.maskFilled = output();
|
|
12175
|
+
this._maskValue = signal('', ...(ngDevMode ? [{ debugName: "_maskValue" }] : []));
|
|
12176
|
+
this._inputValue = signal('', ...(ngDevMode ? [{ debugName: "_inputValue" }] : []));
|
|
12177
|
+
this._position = signal(null, ...(ngDevMode ? [{ debugName: "_position" }] : []));
|
|
12178
|
+
this._code = signal('', ...(ngDevMode ? [{ debugName: "_code" }] : []));
|
|
12179
|
+
this._maskExpressionArray = signal([], ...(ngDevMode ? [{ debugName: "_maskExpressionArray" }] : []));
|
|
12180
|
+
this._justPasted = signal(false, ...(ngDevMode ? [{ debugName: "_justPasted" }] : []));
|
|
12181
|
+
this._isFocused = signal(false, ...(ngDevMode ? [{ debugName: "_isFocused" }] : []));
|
|
12182
|
+
/**For IME composition event */
|
|
12183
|
+
this._isComposing = signal(false, ...(ngDevMode ? [{ debugName: "_isComposing" }] : []));
|
|
12184
|
+
this._maskService = inject(MatchaMaskService, { self: true });
|
|
12185
|
+
this.document = inject(DOCUMENT);
|
|
12186
|
+
this._config = inject(MATCHA_MASK_CONFIG);
|
|
12187
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
12188
|
+
this.onChange = (_) => { };
|
|
12189
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
12190
|
+
this.onTouch = () => { };
|
|
12191
|
+
}
|
|
12192
|
+
ngOnChanges(changes) {
|
|
12193
|
+
const { mask, specialCharacters, patterns, prefix, suffix, thousandSeparator, decimalMarker, dropSpecialCharacters, hiddenInput, showMaskTyped, placeHolderCharacter, shownMaskExpression, clearIfNotMatch, validation, separatorLimit, allowNegativeNumbers, leadZeroDateTime, leadZero, triggerOnMaskChange, apm, inputTransformFn, outputTransformFn, keepCharacterPositions, instantPrefix, } = changes;
|
|
12194
|
+
if (mask) {
|
|
12195
|
+
if (mask.currentValue !== mask.previousValue && !mask.firstChange) {
|
|
12196
|
+
this._maskService.maskChanged = true;
|
|
12197
|
+
}
|
|
12198
|
+
if (mask.currentValue && mask.currentValue.split("||" /* MaskExpression.OR */).length > 1) {
|
|
12199
|
+
this._maskExpressionArray.set(mask.currentValue.split("||" /* MaskExpression.OR */).sort((a, b) => {
|
|
12200
|
+
return a.length - b.length;
|
|
12201
|
+
}));
|
|
12202
|
+
this._setMask();
|
|
12203
|
+
}
|
|
12204
|
+
else {
|
|
12205
|
+
this._maskExpressionArray.set([]);
|
|
12206
|
+
this._maskValue.set(mask.currentValue || "" /* MaskExpression.EMPTY_STRING */);
|
|
12207
|
+
this._maskService.maskExpression = this._maskValue();
|
|
12208
|
+
}
|
|
12209
|
+
}
|
|
12210
|
+
if (specialCharacters) {
|
|
12211
|
+
if (!specialCharacters.currentValue || !Array.isArray(specialCharacters.currentValue)) {
|
|
12212
|
+
return;
|
|
12213
|
+
}
|
|
12214
|
+
else {
|
|
12215
|
+
this._maskService.specialCharacters = specialCharacters.currentValue || [];
|
|
12216
|
+
}
|
|
12217
|
+
}
|
|
12218
|
+
if (allowNegativeNumbers) {
|
|
12219
|
+
this._maskService.allowNegativeNumbers = allowNegativeNumbers.currentValue;
|
|
12220
|
+
if (this._maskService.allowNegativeNumbers) {
|
|
12221
|
+
this._maskService.specialCharacters = this._maskService.specialCharacters.filter((c) => c !== "-" /* MaskExpression.MINUS */);
|
|
12222
|
+
}
|
|
12223
|
+
}
|
|
12224
|
+
// Only overwrite the mask available patterns if a pattern has actually been passed in
|
|
12225
|
+
if (patterns && patterns.currentValue) {
|
|
12226
|
+
this._maskService.patterns = patterns.currentValue;
|
|
12227
|
+
}
|
|
12228
|
+
if (apm && apm.currentValue) {
|
|
12229
|
+
this._maskService.apm = apm.currentValue;
|
|
12230
|
+
}
|
|
12231
|
+
if (instantPrefix) {
|
|
12232
|
+
this._maskService.instantPrefix = instantPrefix.currentValue;
|
|
12233
|
+
}
|
|
12234
|
+
if (prefix) {
|
|
12235
|
+
this._maskService.prefix = prefix.currentValue;
|
|
12236
|
+
}
|
|
12237
|
+
if (suffix) {
|
|
12238
|
+
this._maskService.suffix = suffix.currentValue;
|
|
12239
|
+
}
|
|
12240
|
+
if (thousandSeparator) {
|
|
12241
|
+
this._maskService.thousandSeparator = thousandSeparator.currentValue;
|
|
12242
|
+
if (thousandSeparator.previousValue && thousandSeparator.currentValue) {
|
|
12243
|
+
const previousDecimalMarker = this._maskService.decimalMarker;
|
|
12244
|
+
if (thousandSeparator.currentValue === this._maskService.decimalMarker) {
|
|
12245
|
+
this._maskService.decimalMarker =
|
|
12246
|
+
thousandSeparator.currentValue === "," /* MaskExpression.COMMA */
|
|
12247
|
+
? "." /* MaskExpression.DOT */
|
|
12248
|
+
: "," /* MaskExpression.COMMA */;
|
|
12249
|
+
}
|
|
12250
|
+
if (this._maskService.dropSpecialCharacters === true) {
|
|
12251
|
+
this._maskService.specialCharacters = this._config.specialCharacters;
|
|
12252
|
+
}
|
|
12253
|
+
if (typeof previousDecimalMarker === 'string' &&
|
|
12254
|
+
typeof this._maskService.decimalMarker === 'string') {
|
|
12255
|
+
this._inputValue.set(this._inputValue()
|
|
12256
|
+
.split(thousandSeparator.previousValue)
|
|
12257
|
+
.join('')
|
|
12258
|
+
.replace(previousDecimalMarker, this._maskService.decimalMarker));
|
|
12259
|
+
this._maskService.actualValue = this._inputValue();
|
|
12260
|
+
}
|
|
12261
|
+
this._maskService.writingValue = true;
|
|
12262
|
+
}
|
|
12263
|
+
}
|
|
12264
|
+
if (decimalMarker) {
|
|
12265
|
+
this._maskService.decimalMarker = decimalMarker.currentValue;
|
|
12266
|
+
}
|
|
12267
|
+
if (dropSpecialCharacters) {
|
|
12268
|
+
this._maskService.dropSpecialCharacters = dropSpecialCharacters.currentValue;
|
|
12269
|
+
}
|
|
12270
|
+
if (hiddenInput) {
|
|
12271
|
+
this._maskService.hiddenInput = hiddenInput.currentValue;
|
|
12272
|
+
if (hiddenInput.previousValue === true && hiddenInput.currentValue === false) {
|
|
12273
|
+
this._inputValue.set(this._maskService.actualValue);
|
|
12274
|
+
}
|
|
12275
|
+
}
|
|
12276
|
+
if (showMaskTyped) {
|
|
12277
|
+
this._maskService.showMaskTyped = showMaskTyped.currentValue;
|
|
12278
|
+
if (showMaskTyped.previousValue === false &&
|
|
12279
|
+
showMaskTyped.currentValue === true &&
|
|
12280
|
+
this._isFocused()) {
|
|
12281
|
+
requestAnimationFrame(() => {
|
|
12282
|
+
this._maskService._elementRef?.nativeElement.click();
|
|
12283
|
+
});
|
|
12284
|
+
}
|
|
12285
|
+
}
|
|
12286
|
+
if (placeHolderCharacter) {
|
|
12287
|
+
this._maskService.placeHolderCharacter = placeHolderCharacter.currentValue;
|
|
12288
|
+
}
|
|
12289
|
+
if (shownMaskExpression) {
|
|
12290
|
+
this._maskService.shownMaskExpression = shownMaskExpression.currentValue;
|
|
12291
|
+
}
|
|
12292
|
+
if (clearIfNotMatch) {
|
|
12293
|
+
this._maskService.clearIfNotMatch = clearIfNotMatch.currentValue;
|
|
12294
|
+
}
|
|
12295
|
+
if (validation) {
|
|
12296
|
+
this._maskService.validation = validation.currentValue;
|
|
12297
|
+
}
|
|
12298
|
+
if (separatorLimit) {
|
|
12299
|
+
this._maskService.separatorLimit = separatorLimit.currentValue;
|
|
12300
|
+
}
|
|
12301
|
+
if (leadZeroDateTime) {
|
|
12302
|
+
this._maskService.leadZeroDateTime = leadZeroDateTime.currentValue;
|
|
12303
|
+
}
|
|
12304
|
+
if (leadZero) {
|
|
12305
|
+
this._maskService.leadZero = leadZero.currentValue;
|
|
12306
|
+
}
|
|
12307
|
+
if (triggerOnMaskChange) {
|
|
12308
|
+
this._maskService.triggerOnMaskChange = triggerOnMaskChange.currentValue;
|
|
12309
|
+
}
|
|
12310
|
+
if (inputTransformFn) {
|
|
12311
|
+
this._maskService.inputTransformFn = inputTransformFn.currentValue;
|
|
12312
|
+
}
|
|
12313
|
+
if (outputTransformFn) {
|
|
12314
|
+
this._maskService.outputTransformFn = outputTransformFn.currentValue;
|
|
12315
|
+
}
|
|
12316
|
+
if (keepCharacterPositions) {
|
|
12317
|
+
this._maskService.keepCharacterPositions = keepCharacterPositions.currentValue;
|
|
12318
|
+
}
|
|
12319
|
+
this._applyMask();
|
|
12320
|
+
}
|
|
12321
|
+
validate({ value }) {
|
|
12322
|
+
const processedValue = typeof value === 'number' ? String(value) : value;
|
|
12323
|
+
const maskValue = this._maskValue();
|
|
12324
|
+
if (!this._maskService.validation || !maskValue) {
|
|
12325
|
+
return null;
|
|
12326
|
+
}
|
|
12327
|
+
if (this._maskService.ipError) {
|
|
12328
|
+
return this._createValidationError(processedValue);
|
|
12329
|
+
}
|
|
12330
|
+
if (this._maskService.cpfCnpjError) {
|
|
12331
|
+
return this._createValidationError(processedValue);
|
|
12332
|
+
}
|
|
12333
|
+
if (maskValue.startsWith("separator" /* MaskExpression.SEPARATOR */)) {
|
|
12334
|
+
return null;
|
|
12335
|
+
}
|
|
12336
|
+
if (withoutValidation.includes(maskValue)) {
|
|
12337
|
+
return null;
|
|
12338
|
+
}
|
|
12339
|
+
if (this._maskService.clearIfNotMatch) {
|
|
12340
|
+
return null;
|
|
12341
|
+
}
|
|
12342
|
+
if (timeMasks.includes(maskValue)) {
|
|
12343
|
+
return this._validateTime(processedValue);
|
|
12344
|
+
}
|
|
12345
|
+
if (maskValue === "A*@A*.A*" /* MaskExpression.EMAIL_MASK */) {
|
|
12346
|
+
const emailPattern = /^[^@]+@[^@]+\.[^@]+$/;
|
|
12347
|
+
if (!emailPattern.test(processedValue) && processedValue) {
|
|
12348
|
+
return this._createValidationError(processedValue);
|
|
12349
|
+
}
|
|
12350
|
+
else {
|
|
12351
|
+
return null;
|
|
12352
|
+
}
|
|
12353
|
+
}
|
|
12354
|
+
if (processedValue && processedValue.length >= 1) {
|
|
12355
|
+
let counterOfOpt = 0;
|
|
12356
|
+
if (maskValue.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */) &&
|
|
12357
|
+
maskValue.includes("}" /* MaskExpression.CURLY_BRACKETS_RIGHT */)) {
|
|
12358
|
+
const lengthInsideCurlyBrackets = maskValue.slice(maskValue.indexOf("{" /* MaskExpression.CURLY_BRACKETS_LEFT */) + 1, maskValue.indexOf("}" /* MaskExpression.CURLY_BRACKETS_RIGHT */));
|
|
12359
|
+
return lengthInsideCurlyBrackets === String(processedValue.length)
|
|
12360
|
+
? null
|
|
12361
|
+
: this._createValidationError(processedValue);
|
|
12362
|
+
}
|
|
12363
|
+
if (maskValue.startsWith("percent" /* MaskExpression.PERCENT */)) {
|
|
12364
|
+
return null;
|
|
12365
|
+
}
|
|
12366
|
+
for (const key in this._maskService.patterns) {
|
|
12367
|
+
if (this._maskService.patterns[key]?.optional) {
|
|
12368
|
+
if (maskValue.indexOf(key) !== maskValue.lastIndexOf(key)) {
|
|
12369
|
+
const opt = maskValue
|
|
12370
|
+
.split("" /* MaskExpression.EMPTY_STRING */)
|
|
12371
|
+
.filter((i) => i === key)
|
|
12372
|
+
.join("" /* MaskExpression.EMPTY_STRING */);
|
|
12373
|
+
counterOfOpt += opt.length;
|
|
12374
|
+
}
|
|
12375
|
+
else if (maskValue.indexOf(key) !== -1) {
|
|
12376
|
+
counterOfOpt++;
|
|
12377
|
+
}
|
|
12378
|
+
if (maskValue.indexOf(key) !== -1 &&
|
|
12379
|
+
processedValue.length >= maskValue.indexOf(key)) {
|
|
12380
|
+
return null;
|
|
12381
|
+
}
|
|
12382
|
+
if (counterOfOpt === maskValue.length) {
|
|
12383
|
+
return null;
|
|
12384
|
+
}
|
|
12385
|
+
}
|
|
12386
|
+
}
|
|
12387
|
+
if ((maskValue.indexOf("*" /* MaskExpression.SYMBOL_STAR */) > 1 &&
|
|
12388
|
+
processedValue.length < maskValue.indexOf("*" /* MaskExpression.SYMBOL_STAR */)) ||
|
|
12389
|
+
(maskValue.indexOf("?" /* MaskExpression.SYMBOL_QUESTION */) > 1 &&
|
|
12390
|
+
processedValue.length < maskValue.indexOf("?" /* MaskExpression.SYMBOL_QUESTION */))) {
|
|
12391
|
+
return this._createValidationError(processedValue);
|
|
12392
|
+
}
|
|
12393
|
+
if (maskValue.indexOf("*" /* MaskExpression.SYMBOL_STAR */) === -1 ||
|
|
12394
|
+
maskValue.indexOf("?" /* MaskExpression.SYMBOL_QUESTION */) === -1) {
|
|
12395
|
+
const array = maskValue.split('*');
|
|
12396
|
+
const length = this._maskService.dropSpecialCharacters
|
|
12397
|
+
? maskValue.length -
|
|
12398
|
+
this._maskService.checkDropSpecialCharAmount(maskValue) -
|
|
12399
|
+
counterOfOpt
|
|
12400
|
+
: this.prefix()
|
|
12401
|
+
? maskValue.length + this.prefix().length - counterOfOpt
|
|
12402
|
+
: maskValue.length - counterOfOpt;
|
|
12403
|
+
if (array.length === 1) {
|
|
12404
|
+
if (processedValue.length < length) {
|
|
12405
|
+
return this._createValidationError(processedValue);
|
|
12406
|
+
}
|
|
12407
|
+
}
|
|
12408
|
+
if (array.length > 1) {
|
|
12409
|
+
const lastIndexArray = array[array.length - 1];
|
|
12410
|
+
if (lastIndexArray &&
|
|
12411
|
+
this._maskService.specialCharacters.includes(lastIndexArray[0]) &&
|
|
12412
|
+
String(processedValue).includes(lastIndexArray[0] ?? '') &&
|
|
12413
|
+
!this.dropSpecialCharacters()) {
|
|
12414
|
+
const special = value.split(lastIndexArray[0]);
|
|
12415
|
+
return special[special.length - 1].length === lastIndexArray.length - 1
|
|
12416
|
+
? null
|
|
12417
|
+
: this._createValidationError(processedValue);
|
|
12418
|
+
}
|
|
12419
|
+
else if (((lastIndexArray &&
|
|
12420
|
+
!this._maskService.specialCharacters.includes(lastIndexArray[0])) ||
|
|
12421
|
+
!lastIndexArray ||
|
|
12422
|
+
this._maskService.dropSpecialCharacters) &&
|
|
12423
|
+
processedValue.length >= length - 1) {
|
|
12424
|
+
return null;
|
|
12425
|
+
}
|
|
12426
|
+
else {
|
|
12427
|
+
return this._createValidationError(processedValue);
|
|
12428
|
+
}
|
|
12429
|
+
}
|
|
12430
|
+
}
|
|
12431
|
+
if (maskValue.indexOf("*" /* MaskExpression.SYMBOL_STAR */) === 1 ||
|
|
12432
|
+
maskValue.indexOf("?" /* MaskExpression.SYMBOL_QUESTION */) === 1) {
|
|
12433
|
+
return null;
|
|
12434
|
+
}
|
|
12435
|
+
}
|
|
12436
|
+
if (value) {
|
|
12437
|
+
this.maskFilled.emit();
|
|
12438
|
+
return null;
|
|
12439
|
+
}
|
|
12440
|
+
return null;
|
|
12441
|
+
}
|
|
12442
|
+
onPaste() {
|
|
12443
|
+
this._justPasted.set(true);
|
|
12444
|
+
}
|
|
12445
|
+
onFocus() {
|
|
12446
|
+
this._isFocused.set(true);
|
|
12447
|
+
}
|
|
12448
|
+
onModelChange(value) {
|
|
12449
|
+
// on form reset we need to update the actualValue
|
|
12450
|
+
if ((value === "" /* MaskExpression.EMPTY_STRING */ ||
|
|
12451
|
+
value === null ||
|
|
12452
|
+
typeof value === 'undefined') &&
|
|
12453
|
+
this._maskService.actualValue) {
|
|
12454
|
+
this._maskService.actualValue = this._maskService.getActualValue("" /* MaskExpression.EMPTY_STRING */);
|
|
12455
|
+
}
|
|
12456
|
+
}
|
|
12457
|
+
onInput(e) {
|
|
12458
|
+
// If IME is composing text, we wait for the composed text.
|
|
12459
|
+
if (this._isComposing()) {
|
|
12460
|
+
return;
|
|
12461
|
+
}
|
|
12462
|
+
const el = e.target;
|
|
12463
|
+
const transformedValue = this._maskService.inputTransformFn
|
|
12464
|
+
? this._maskService.inputTransformFn(el.value)
|
|
12465
|
+
: el.value;
|
|
12466
|
+
if (el.type !== 'number') {
|
|
12467
|
+
if (typeof transformedValue === 'string' || typeof transformedValue === 'number') {
|
|
12468
|
+
el.value = transformedValue.toString();
|
|
12469
|
+
this._inputValue.set(el.value);
|
|
12470
|
+
this._setMask();
|
|
12471
|
+
if (!this._maskValue()) {
|
|
12472
|
+
this.onChange(el.value);
|
|
12473
|
+
return;
|
|
12474
|
+
}
|
|
12475
|
+
let position = el.selectionStart === 1
|
|
12476
|
+
? el.selectionStart + this._maskService.prefix.length
|
|
12477
|
+
: el.selectionStart;
|
|
12478
|
+
if (this.showMaskTyped() &&
|
|
12479
|
+
this.keepCharacterPositions() &&
|
|
12480
|
+
this._maskService.placeHolderCharacter.length === 1) {
|
|
12481
|
+
const suffix = this.suffix();
|
|
12482
|
+
const prefix = this.prefix();
|
|
12483
|
+
const inputSymbol = el.value.slice(position - 1, position);
|
|
12484
|
+
const prefixLength = prefix.length;
|
|
12485
|
+
const checkSymbols = this._maskService._checkSymbolMask(inputSymbol, this._maskService.maskExpression[position - 1 - prefixLength] ??
|
|
12486
|
+
"" /* MaskExpression.EMPTY_STRING */);
|
|
12487
|
+
const checkSpecialCharacter = this._maskService._checkSymbolMask(inputSymbol, this._maskService.maskExpression[position + 1 - prefixLength] ??
|
|
12488
|
+
"" /* MaskExpression.EMPTY_STRING */);
|
|
12489
|
+
const selectRangeBackspace = this._maskService.selStart === this._maskService.selEnd;
|
|
12490
|
+
const selStart = Number(this._maskService.selStart) - prefixLength;
|
|
12491
|
+
const selEnd = Number(this._maskService.selEnd) - prefixLength;
|
|
12492
|
+
const backspaceOrDelete = this._code() === "Backspace" /* MaskExpression.BACKSPACE */ ||
|
|
12493
|
+
this._code() === "Delete" /* MaskExpression.DELETE */;
|
|
12494
|
+
if (backspaceOrDelete) {
|
|
12495
|
+
if (!selectRangeBackspace) {
|
|
12496
|
+
if (this._maskService.selStart === prefixLength) {
|
|
12497
|
+
this._maskService.actualValue = `${prefix}${this._maskService.maskIsShown.slice(0, selEnd)}${this._inputValue().split(prefix).join('')}`;
|
|
12498
|
+
}
|
|
12499
|
+
else if (this._maskService.selStart ===
|
|
12500
|
+
this._maskService.maskIsShown.length + prefixLength) {
|
|
12501
|
+
this._maskService.actualValue = `${this._inputValue()}${this._maskService.maskIsShown.slice(selStart, selEnd)}`;
|
|
12502
|
+
}
|
|
12503
|
+
else {
|
|
12504
|
+
this._maskService.actualValue = `${prefix}${this._inputValue()
|
|
12505
|
+
.split(prefix)
|
|
12506
|
+
.join('')
|
|
12507
|
+
.slice(0, selStart)}${this._maskService.maskIsShown.slice(selStart, selEnd)}${this._maskService.actualValue.slice(selEnd + prefixLength, this._maskService.maskIsShown.length + prefixLength)}${suffix}`;
|
|
12508
|
+
}
|
|
12509
|
+
}
|
|
12510
|
+
else if (!this._maskService.specialCharacters.includes(this._maskService.maskExpression.slice(position - prefixLength, position + 1 - prefixLength)) &&
|
|
12511
|
+
selectRangeBackspace) {
|
|
12512
|
+
if (selStart === 1 && prefix) {
|
|
12513
|
+
this._maskService.actualValue = `${prefix}${this._maskService.placeHolderCharacter}${el.value
|
|
12514
|
+
.split(prefix)
|
|
12515
|
+
.join('')
|
|
12516
|
+
.split(suffix)
|
|
12517
|
+
.join('')}${suffix}`;
|
|
12518
|
+
position = position - 1;
|
|
12519
|
+
}
|
|
12520
|
+
else {
|
|
12521
|
+
const part1 = el.value.substring(0, position);
|
|
12522
|
+
const part2 = el.value.substring(position);
|
|
12523
|
+
this._maskService.actualValue = `${part1}${this._maskService.placeHolderCharacter}${part2}`;
|
|
12524
|
+
}
|
|
12525
|
+
}
|
|
12526
|
+
position = this._code() === "Delete" /* MaskExpression.DELETE */ ? position + 1 : position;
|
|
12527
|
+
}
|
|
12528
|
+
if (!backspaceOrDelete) {
|
|
12529
|
+
if (!checkSymbols && !checkSpecialCharacter && selectRangeBackspace) {
|
|
12530
|
+
position = Number(el.selectionStart) - 1;
|
|
12531
|
+
}
|
|
12532
|
+
else if (this._maskService.specialCharacters.includes(el.value.slice(position, position + 1)) &&
|
|
12533
|
+
checkSpecialCharacter &&
|
|
12534
|
+
!this._maskService.specialCharacters.includes(el.value.slice(position + 1, position + 2))) {
|
|
12535
|
+
this._maskService.actualValue = `${el.value.slice(0, position - 1)}${el.value.slice(position, position + 1)}${inputSymbol}${el.value.slice(position + 2)}`;
|
|
12536
|
+
position = position + 1;
|
|
12537
|
+
}
|
|
12538
|
+
else if (checkSymbols) {
|
|
12539
|
+
if (el.value.length === 1 && position === 1) {
|
|
12540
|
+
this._maskService.actualValue = `${prefix}${inputSymbol}${this._maskService.maskIsShown.slice(1, this._maskService.maskIsShown.length)}${suffix}`;
|
|
12541
|
+
}
|
|
12542
|
+
else {
|
|
12543
|
+
this._maskService.actualValue = `${el.value.slice(0, position - 1)}${inputSymbol}${el.value
|
|
12544
|
+
.slice(position + 1)
|
|
12545
|
+
.split(suffix)
|
|
12546
|
+
.join('')}${suffix}`;
|
|
12547
|
+
}
|
|
12548
|
+
}
|
|
12549
|
+
else if (prefix &&
|
|
12550
|
+
el.value.length === 1 &&
|
|
12551
|
+
position - prefixLength === 1 &&
|
|
12552
|
+
this._maskService._checkSymbolMask(el.value, this._maskService.maskExpression[position - 1 - prefixLength] ??
|
|
12553
|
+
"" /* MaskExpression.EMPTY_STRING */)) {
|
|
12554
|
+
this._maskService.actualValue = `${prefix}${el.value}${this._maskService.maskIsShown.slice(1, this._maskService.maskIsShown.length)}${suffix}`;
|
|
12555
|
+
}
|
|
12556
|
+
}
|
|
12557
|
+
}
|
|
12558
|
+
let caretShift = 0;
|
|
12559
|
+
let backspaceShift = false;
|
|
12560
|
+
if (this._code() === "Delete" /* MaskExpression.DELETE */ && "separator" /* MaskExpression.SEPARATOR */) {
|
|
12561
|
+
this._maskService.deletedSpecialCharacter = true;
|
|
12562
|
+
}
|
|
12563
|
+
if (this._inputValue().length >= this._maskService.maskExpression.length - 1 &&
|
|
12564
|
+
this._code() !== "Backspace" /* MaskExpression.BACKSPACE */ &&
|
|
12565
|
+
this._maskService.maskExpression === "d0/M0/0000" /* MaskExpression.DAYS_MONTHS_YEARS */ &&
|
|
12566
|
+
position < 10) {
|
|
12567
|
+
const inputSymbol = this._inputValue().slice(position - 1, position);
|
|
12568
|
+
el.value =
|
|
12569
|
+
this._inputValue().slice(0, position - 1) +
|
|
12570
|
+
inputSymbol +
|
|
12571
|
+
this._inputValue().slice(position + 1);
|
|
12572
|
+
}
|
|
12573
|
+
if (this._maskService.maskExpression === "d0/M0/0000" /* MaskExpression.DAYS_MONTHS_YEARS */ &&
|
|
12574
|
+
this.leadZeroDateTime()) {
|
|
12575
|
+
if ((position < 3 && Number(el.value) > 31 && Number(el.value) < 40) ||
|
|
12576
|
+
(position === 5 && Number(el.value.slice(3, 5)) > 12)) {
|
|
12577
|
+
position = position + 2;
|
|
12578
|
+
}
|
|
12579
|
+
}
|
|
12580
|
+
if (this._maskService.maskExpression === "Hh:m0:s0" /* MaskExpression.HOURS_MINUTES_SECONDS */ &&
|
|
12581
|
+
this.apm()) {
|
|
12582
|
+
if (this._justPasted() && el.value.slice(0, 2) === "00" /* MaskExpression.DOUBLE_ZERO */) {
|
|
12583
|
+
el.value = el.value.slice(1, 2) + el.value.slice(2, el.value.length);
|
|
12584
|
+
}
|
|
12585
|
+
el.value =
|
|
12586
|
+
el.value === "00" /* MaskExpression.DOUBLE_ZERO */
|
|
12587
|
+
? "0" /* MaskExpression.NUMBER_ZERO */
|
|
12588
|
+
: el.value;
|
|
12589
|
+
}
|
|
12590
|
+
this._maskService.applyValueChanges(position, this._justPasted(), this._code() === "Backspace" /* MaskExpression.BACKSPACE */ ||
|
|
12591
|
+
this._code() === "Delete" /* MaskExpression.DELETE */, (shift, _backspaceShift) => {
|
|
12592
|
+
this._justPasted.set(false);
|
|
12593
|
+
caretShift = shift;
|
|
12594
|
+
backspaceShift = _backspaceShift;
|
|
12595
|
+
});
|
|
12596
|
+
// only set the selection if the element is active
|
|
12597
|
+
if (this._getActiveElement() !== el) {
|
|
12598
|
+
return;
|
|
12599
|
+
}
|
|
12600
|
+
if (this._maskService.plusOnePosition) {
|
|
12601
|
+
position = position + 1;
|
|
12602
|
+
this._maskService.plusOnePosition = false;
|
|
12603
|
+
}
|
|
12604
|
+
// update position after applyValueChanges to prevent cursor on wrong position when it has an array of maskExpression
|
|
12605
|
+
if (this._maskExpressionArray().length) {
|
|
12606
|
+
if (this._code() === "Backspace" /* MaskExpression.BACKSPACE */) {
|
|
12607
|
+
const specialChartMinusOne = this.specialCharacters().includes(this._maskService.actualValue.slice(position - 1, position));
|
|
12608
|
+
const allowFewMaskChangeMask = this._maskService.removeMask(this._inputValue())?.length ===
|
|
12609
|
+
this._maskService.removeMask(this._maskService.maskExpression)?.length;
|
|
12610
|
+
const specialChartPlusOne = this.specialCharacters().includes(this._maskService.actualValue.slice(position, position + 1));
|
|
12611
|
+
if (allowFewMaskChangeMask && !specialChartPlusOne) {
|
|
12612
|
+
position = el.selectionStart + 1;
|
|
12613
|
+
}
|
|
12614
|
+
else {
|
|
12615
|
+
position = specialChartMinusOne ? position - 1 : position;
|
|
12616
|
+
}
|
|
12617
|
+
}
|
|
12618
|
+
else {
|
|
12619
|
+
position =
|
|
12620
|
+
el.selectionStart === 1
|
|
12621
|
+
? el.selectionStart + this._maskService.prefix.length
|
|
12622
|
+
: el.selectionStart;
|
|
12623
|
+
}
|
|
12624
|
+
}
|
|
12625
|
+
this._position.set(this._position() === 1 && this._inputValue().length === 1
|
|
12626
|
+
? null
|
|
12627
|
+
: this._position());
|
|
12628
|
+
let positionToApply = this._position()
|
|
12629
|
+
? this._inputValue().length + position + caretShift
|
|
12630
|
+
: position +
|
|
12631
|
+
(this._code() === "Backspace" /* MaskExpression.BACKSPACE */ && !backspaceShift
|
|
12632
|
+
? 0
|
|
12633
|
+
: caretShift);
|
|
12634
|
+
if (positionToApply > this._getActualInputLength()) {
|
|
12635
|
+
positionToApply =
|
|
12636
|
+
el.value === this._maskService.decimalMarker && el.value.length === 1
|
|
12637
|
+
? this._getActualInputLength() + 1
|
|
12638
|
+
: this._getActualInputLength();
|
|
12639
|
+
}
|
|
12640
|
+
if (positionToApply < 0) {
|
|
12641
|
+
positionToApply = 0;
|
|
12642
|
+
}
|
|
12643
|
+
el.setSelectionRange(positionToApply, positionToApply);
|
|
12644
|
+
this._position.set(null);
|
|
12645
|
+
}
|
|
12646
|
+
else {
|
|
12647
|
+
// eslint-disable-next-line no-console
|
|
12648
|
+
console.warn('Matcha-mask writeValue work with string | number, your current value:', typeof transformedValue);
|
|
12649
|
+
}
|
|
12650
|
+
}
|
|
12651
|
+
else {
|
|
12652
|
+
if (!this._maskValue()) {
|
|
12653
|
+
this.onChange(el.value);
|
|
12654
|
+
return;
|
|
12655
|
+
}
|
|
12656
|
+
this._maskService.applyValueChanges(el.value.length, this._justPasted(), this._code() === "Backspace" /* MaskExpression.BACKSPACE */ || this._code() === "Delete" /* MaskExpression.DELETE */);
|
|
12657
|
+
}
|
|
12658
|
+
}
|
|
12659
|
+
// IME starts
|
|
12660
|
+
onCompositionStart() {
|
|
12661
|
+
this._isComposing.set(true);
|
|
12662
|
+
}
|
|
12663
|
+
// IME completes
|
|
12664
|
+
onCompositionEnd(e) {
|
|
12665
|
+
this._isComposing.set(false);
|
|
12666
|
+
this._justPasted.set(true);
|
|
12667
|
+
this.onInput(e);
|
|
12668
|
+
}
|
|
12669
|
+
onBlur(e) {
|
|
12670
|
+
if (this._maskValue()) {
|
|
12671
|
+
const el = e.target;
|
|
12672
|
+
if (this._maskService.leadZero &&
|
|
12673
|
+
el.value.length > 0 &&
|
|
12674
|
+
typeof this._maskService.decimalMarker === 'string') {
|
|
12675
|
+
const maskExpression = this._maskService.maskExpression;
|
|
12676
|
+
const decimalMarker = this._maskService.decimalMarker;
|
|
12677
|
+
const suffix = this._maskService.suffix;
|
|
12678
|
+
const precision = Number(this._maskService.maskExpression.slice(maskExpression.length - 1, maskExpression.length));
|
|
12679
|
+
if (precision > 0) {
|
|
12680
|
+
el.value = suffix ? el.value.split(suffix).join('') : el.value;
|
|
12681
|
+
const decimalPart = el.value.split(decimalMarker)[1];
|
|
12682
|
+
el.value = el.value.includes(decimalMarker)
|
|
12683
|
+
? el.value +
|
|
12684
|
+
"0" /* MaskExpression.NUMBER_ZERO */.repeat(precision - decimalPart.length) +
|
|
12685
|
+
suffix
|
|
12686
|
+
: el.value +
|
|
12687
|
+
decimalMarker +
|
|
12688
|
+
"0" /* MaskExpression.NUMBER_ZERO */.repeat(precision) +
|
|
12689
|
+
suffix;
|
|
12690
|
+
this._maskService.actualValue = el.value;
|
|
12691
|
+
}
|
|
12692
|
+
}
|
|
12693
|
+
this._maskService.clearIfNotMatchFn();
|
|
12694
|
+
}
|
|
12695
|
+
this._isFocused.set(false);
|
|
12696
|
+
this.onTouch();
|
|
12697
|
+
}
|
|
12698
|
+
onClick(e) {
|
|
12699
|
+
if (!this._maskValue()) {
|
|
12700
|
+
return;
|
|
12701
|
+
}
|
|
12702
|
+
const el = e.target;
|
|
12703
|
+
const posStart = 0;
|
|
12704
|
+
const posEnd = 0;
|
|
12705
|
+
if (el !== null &&
|
|
12706
|
+
el.selectionStart !== null &&
|
|
12707
|
+
el.selectionStart === el.selectionEnd &&
|
|
12708
|
+
el.selectionStart > this._maskService.prefix.length &&
|
|
12709
|
+
e.keyCode !== 38) {
|
|
12710
|
+
if (this._maskService.showMaskTyped && !this.keepCharacterPositions()) {
|
|
12711
|
+
// We are showing the mask in the input
|
|
12712
|
+
this._maskService.maskIsShown = this._maskService.showMaskInInput();
|
|
12713
|
+
if (el.setSelectionRange &&
|
|
12714
|
+
this._maskService.prefix + this._maskService.maskIsShown === el.value) {
|
|
12715
|
+
// the input ONLY contains the mask, so position the cursor at the start
|
|
12716
|
+
el.focus();
|
|
12717
|
+
el.setSelectionRange(posStart, posEnd);
|
|
12718
|
+
}
|
|
12719
|
+
else {
|
|
12720
|
+
// the input contains some characters already
|
|
12721
|
+
if (el.selectionStart > this._maskService.actualValue.length) {
|
|
12722
|
+
// if the user clicked beyond our value's length, position the cursor at the end of our value
|
|
12723
|
+
el.setSelectionRange(this._maskService.actualValue.length, this._maskService.actualValue.length);
|
|
12724
|
+
}
|
|
12725
|
+
}
|
|
12726
|
+
}
|
|
12727
|
+
}
|
|
12728
|
+
const nextValue = el &&
|
|
12729
|
+
(el.value === this._maskService.prefix
|
|
12730
|
+
? this._maskService.prefix + this._maskService.maskIsShown
|
|
12731
|
+
: el.value);
|
|
12732
|
+
/** Fix of cursor position jumping to end in most browsers no matter where cursor is inserted onFocus */
|
|
12733
|
+
if (el && el.value !== nextValue) {
|
|
12734
|
+
el.value = nextValue;
|
|
12735
|
+
}
|
|
12736
|
+
/** fix of cursor position with prefix when mouse click occur */
|
|
12737
|
+
if (el &&
|
|
12738
|
+
el.type !== 'number' &&
|
|
12739
|
+
(el.selectionStart || el.selectionEnd) <=
|
|
12740
|
+
this._maskService.prefix.length) {
|
|
12741
|
+
const specialCharactersAtTheStart = this._maskService.maskExpression.match(new RegExp(`^[${this._maskService.specialCharacters.map((c) => `\\${c}`).join('')}]+`))?.[0].length || 0;
|
|
12742
|
+
el.selectionStart = this._maskService.prefix.length + specialCharactersAtTheStart;
|
|
12743
|
+
return;
|
|
12744
|
+
}
|
|
12745
|
+
/** select only inserted text */
|
|
12746
|
+
if (el && el.selectionEnd > this._getActualInputLength()) {
|
|
12747
|
+
el.selectionEnd = this._getActualInputLength();
|
|
12748
|
+
}
|
|
12749
|
+
}
|
|
12750
|
+
onKeyDown(e) {
|
|
12751
|
+
if (!this._maskValue()) {
|
|
12752
|
+
return;
|
|
12753
|
+
}
|
|
12754
|
+
if (this._isComposing()) {
|
|
12755
|
+
// User finalize their choice from IME composition, so trigger onInput() for the composed text.
|
|
12756
|
+
if (e.key === 'Enter') {
|
|
12757
|
+
this.onCompositionEnd(e);
|
|
12758
|
+
}
|
|
12759
|
+
return;
|
|
12760
|
+
}
|
|
12761
|
+
this._code.set(e.code ? e.code : e.key);
|
|
12762
|
+
const el = e.target;
|
|
12763
|
+
this._inputValue.set(el.value);
|
|
12764
|
+
this._setMask();
|
|
12765
|
+
if (el.type !== 'number') {
|
|
12766
|
+
if (e.key === "ArrowUp" /* MaskExpression.ARROW_UP */) {
|
|
12767
|
+
e.preventDefault();
|
|
12768
|
+
}
|
|
12769
|
+
if (e.key === "ArrowLeft" /* MaskExpression.ARROW_LEFT */ ||
|
|
12770
|
+
e.key === "Backspace" /* MaskExpression.BACKSPACE */ ||
|
|
12771
|
+
e.key === "Delete" /* MaskExpression.DELETE */) {
|
|
12772
|
+
if (e.key === "Backspace" /* MaskExpression.BACKSPACE */ && el.value.length === 0) {
|
|
12773
|
+
el.selectionStart = el.selectionEnd;
|
|
12774
|
+
}
|
|
12775
|
+
if (e.key === "Backspace" /* MaskExpression.BACKSPACE */ && el.selectionStart !== 0) {
|
|
12776
|
+
const prefixLength = this.prefix().length;
|
|
12777
|
+
// If specialChars is false, (shouldn't ever happen) then set to the defaults
|
|
12778
|
+
const specialCharacters = this.specialCharacters().length
|
|
12779
|
+
? this.specialCharacters()
|
|
12780
|
+
: this._config.specialCharacters;
|
|
12781
|
+
if (prefixLength > 1 && el.selectionStart <= prefixLength) {
|
|
12782
|
+
el.setSelectionRange(prefixLength, el.selectionEnd);
|
|
12783
|
+
}
|
|
12784
|
+
else {
|
|
12785
|
+
if (this._inputValue().length !== el.selectionStart &&
|
|
12786
|
+
el.selectionStart !== 1) {
|
|
12787
|
+
while (specialCharacters.includes((this._inputValue()[el.selectionStart - 1] ??
|
|
12788
|
+
"" /* MaskExpression.EMPTY_STRING */).toString()) &&
|
|
12789
|
+
((prefixLength >= 1 &&
|
|
12790
|
+
el.selectionStart > prefixLength) ||
|
|
12791
|
+
prefixLength === 0)) {
|
|
12792
|
+
el.setSelectionRange(el.selectionStart - 1, el.selectionEnd);
|
|
12793
|
+
}
|
|
12794
|
+
}
|
|
12795
|
+
}
|
|
12796
|
+
}
|
|
12797
|
+
this.checkSelectionOnDeletion(el);
|
|
12798
|
+
if (this._maskService.prefix.length &&
|
|
12799
|
+
el.selectionStart <= this._maskService.prefix.length &&
|
|
12800
|
+
el.selectionEnd <= this._maskService.prefix.length) {
|
|
12801
|
+
e.preventDefault();
|
|
12802
|
+
}
|
|
12803
|
+
const cursorStart = el.selectionStart;
|
|
12804
|
+
if (e.key === "Backspace" /* MaskExpression.BACKSPACE */ &&
|
|
12805
|
+
!el.readOnly &&
|
|
12806
|
+
cursorStart === 0 &&
|
|
12807
|
+
el.selectionEnd === el.value.length &&
|
|
12808
|
+
el.value.length !== 0) {
|
|
12809
|
+
this._position.set(this._maskService.prefix ? this._maskService.prefix.length : 0);
|
|
12810
|
+
this._maskService.applyMask(this._maskService.prefix, this._maskService.maskExpression, this._position());
|
|
12811
|
+
}
|
|
12812
|
+
}
|
|
12813
|
+
if (!!this.suffix() &&
|
|
12814
|
+
this.suffix().length > 1 &&
|
|
12815
|
+
this._inputValue().length - this.suffix().length < el.selectionStart) {
|
|
12816
|
+
el.setSelectionRange(this._inputValue().length - this.suffix().length, this._inputValue().length);
|
|
12817
|
+
}
|
|
12818
|
+
else if ((e.code === 'KeyA' && e.ctrlKey) ||
|
|
12819
|
+
(e.code === 'KeyA' && e.metaKey) // Cmd + A (Mac)
|
|
12820
|
+
) {
|
|
12821
|
+
el.setSelectionRange(0, this._getActualInputLength());
|
|
12822
|
+
e.preventDefault();
|
|
12823
|
+
}
|
|
12824
|
+
this._maskService.selStart = el.selectionStart;
|
|
12825
|
+
this._maskService.selEnd = el.selectionEnd;
|
|
12826
|
+
}
|
|
12827
|
+
}
|
|
12828
|
+
/** It writes the value in the input */
|
|
12829
|
+
async writeValue(controlValue) {
|
|
12830
|
+
let value = controlValue;
|
|
12831
|
+
const inputTransformFn = this._maskService.inputTransformFn;
|
|
12832
|
+
if (typeof value === 'object' && value !== null && 'value' in value) {
|
|
12833
|
+
if ('disable' in value) {
|
|
12834
|
+
this.setDisabledState(Boolean(value.disable));
|
|
12835
|
+
}
|
|
12836
|
+
value = value.value;
|
|
12837
|
+
}
|
|
12838
|
+
if (value !== null) {
|
|
12839
|
+
value = inputTransformFn ? inputTransformFn(value) : value;
|
|
12840
|
+
}
|
|
12841
|
+
if (typeof value === 'string' ||
|
|
12842
|
+
typeof value === 'number' ||
|
|
12843
|
+
value === null ||
|
|
12844
|
+
typeof value === 'undefined') {
|
|
12845
|
+
if (value === null || typeof value === 'undefined' || value === '') {
|
|
12846
|
+
this._maskService.currentValue = '';
|
|
12847
|
+
this._maskService.previousValue = '';
|
|
12848
|
+
}
|
|
12849
|
+
let inputValue = value;
|
|
12850
|
+
if (typeof inputValue === 'number' ||
|
|
12851
|
+
this._maskValue().startsWith("separator" /* MaskExpression.SEPARATOR */)) {
|
|
12852
|
+
inputValue = String(inputValue);
|
|
12853
|
+
const localeDecimalMarker = this._maskService.currentLocaleDecimalMarker();
|
|
12854
|
+
if (!Array.isArray(this._maskService.decimalMarker)) {
|
|
12855
|
+
inputValue =
|
|
12856
|
+
this._maskService.decimalMarker !== localeDecimalMarker
|
|
12857
|
+
? inputValue.replace(localeDecimalMarker, this._maskService.decimalMarker)
|
|
12858
|
+
: inputValue;
|
|
12859
|
+
}
|
|
12860
|
+
if (this._maskService.leadZero &&
|
|
12861
|
+
inputValue &&
|
|
12862
|
+
this.mask() &&
|
|
12863
|
+
this.dropSpecialCharacters() !== false) {
|
|
12864
|
+
inputValue = this._maskService._checkPrecision(this._maskService.maskExpression, inputValue);
|
|
12865
|
+
}
|
|
12866
|
+
if (this._maskService.decimalMarker === "," /* MaskExpression.COMMA */ ||
|
|
12867
|
+
(Array.isArray(this._maskService.decimalMarker) &&
|
|
12868
|
+
this._maskService.thousandSeparator === "." /* MaskExpression.DOT */)) {
|
|
12869
|
+
inputValue = inputValue
|
|
12870
|
+
.toString()
|
|
12871
|
+
.replace("." /* MaskExpression.DOT */, "," /* MaskExpression.COMMA */);
|
|
12872
|
+
}
|
|
12873
|
+
if (this.mask()?.startsWith("separator" /* MaskExpression.SEPARATOR */) && this.leadZero()) {
|
|
12874
|
+
requestAnimationFrame(() => {
|
|
12875
|
+
this._maskService.applyMask(inputValue?.toString() ?? '', this._maskService.maskExpression);
|
|
12876
|
+
});
|
|
12877
|
+
}
|
|
12878
|
+
this._maskService.isNumberValue = true;
|
|
12879
|
+
}
|
|
12880
|
+
if (typeof inputValue !== 'string' || value === null || typeof value === 'undefined') {
|
|
12881
|
+
inputValue = '';
|
|
12882
|
+
}
|
|
12883
|
+
this._inputValue.set(inputValue);
|
|
12884
|
+
this._setMask();
|
|
12885
|
+
if ((inputValue && this._maskService.maskExpression) ||
|
|
12886
|
+
(this._maskService.maskExpression &&
|
|
12887
|
+
(this._maskService.prefix || this._maskService.showMaskTyped))) {
|
|
12888
|
+
// Let the service we know we are writing value so that triggering onChange function won't happen during applyMask
|
|
12889
|
+
this._maskService.writingValue = true;
|
|
12890
|
+
this._maskService.formElementProperty = [
|
|
12891
|
+
'value',
|
|
12892
|
+
this._maskService.applyMask(inputValue, this._maskService.maskExpression),
|
|
12893
|
+
];
|
|
12894
|
+
// Let the service know we've finished writing value
|
|
12895
|
+
this._maskService.writingValue = false;
|
|
12896
|
+
}
|
|
12897
|
+
else {
|
|
12898
|
+
this._maskService.formElementProperty = ['value', inputValue];
|
|
12899
|
+
}
|
|
12900
|
+
this._inputValue.set(inputValue);
|
|
12901
|
+
}
|
|
12902
|
+
else {
|
|
12903
|
+
// eslint-disable-next-line no-console
|
|
12904
|
+
console.warn('Matcha-mask writeValue work with string | number, your current value:', typeof value);
|
|
12905
|
+
}
|
|
12906
|
+
}
|
|
12907
|
+
registerOnChange(fn) {
|
|
12908
|
+
this._maskService.onChange = this.onChange = fn;
|
|
12909
|
+
}
|
|
12910
|
+
registerOnTouched(fn) {
|
|
12911
|
+
this.onTouch = fn;
|
|
12912
|
+
}
|
|
12913
|
+
_getActiveElement(document = this.document) {
|
|
12914
|
+
const shadowRootEl = document?.activeElement?.shadowRoot;
|
|
12915
|
+
if (!shadowRootEl?.activeElement) {
|
|
12916
|
+
return document.activeElement;
|
|
12917
|
+
}
|
|
12918
|
+
else {
|
|
12919
|
+
return this._getActiveElement(shadowRootEl);
|
|
12920
|
+
}
|
|
12921
|
+
}
|
|
12922
|
+
checkSelectionOnDeletion(el) {
|
|
12923
|
+
const prefixLength = this.prefix().length;
|
|
12924
|
+
const suffixLength = this.suffix().length;
|
|
12925
|
+
const inputValueLength = this._inputValue().length;
|
|
12926
|
+
el.selectionStart = Math.min(Math.max(prefixLength, el.selectionStart), inputValueLength - suffixLength);
|
|
12927
|
+
el.selectionEnd = Math.min(Math.max(prefixLength, el.selectionEnd), inputValueLength - suffixLength);
|
|
12928
|
+
}
|
|
12929
|
+
/** It disables the input element */
|
|
12930
|
+
setDisabledState(isDisabled) {
|
|
12931
|
+
this._maskService.formElementProperty = ['disabled', isDisabled];
|
|
12932
|
+
}
|
|
12933
|
+
_applyMask() {
|
|
12934
|
+
this._maskService.maskExpression = this._maskService._repeatPatternSymbols(this._maskValue() || '');
|
|
12935
|
+
this._maskService.formElementProperty = [
|
|
12936
|
+
'value',
|
|
12937
|
+
this._maskService.applyMask(this._inputValue(), this._maskService.maskExpression),
|
|
12938
|
+
];
|
|
12939
|
+
}
|
|
12940
|
+
_validateTime(value) {
|
|
12941
|
+
const rowMaskLen = this._maskValue()
|
|
12942
|
+
.split("" /* MaskExpression.EMPTY_STRING */)
|
|
12943
|
+
.filter((s) => s !== ':').length;
|
|
12944
|
+
if (!value) {
|
|
12945
|
+
return null; // Don't validate empty values to allow for optional form control
|
|
12946
|
+
}
|
|
12947
|
+
if ((+(value[value.length - 1] ?? -1) === 0 && value.length < rowMaskLen) ||
|
|
12948
|
+
value.length <= rowMaskLen - 2) {
|
|
12949
|
+
return this._createValidationError(value);
|
|
12950
|
+
}
|
|
12951
|
+
return null;
|
|
12952
|
+
}
|
|
12953
|
+
_getActualInputLength() {
|
|
12954
|
+
return (this._maskService.actualValue.length ||
|
|
12955
|
+
this._maskService.actualValue.length + this._maskService.prefix.length);
|
|
12956
|
+
}
|
|
12957
|
+
_createValidationError(actualValue) {
|
|
12958
|
+
return {
|
|
12959
|
+
mask: {
|
|
12960
|
+
requiredMask: this._maskValue(),
|
|
12961
|
+
actualValue,
|
|
12962
|
+
},
|
|
12963
|
+
};
|
|
12964
|
+
}
|
|
12965
|
+
_setMask() {
|
|
12966
|
+
this._maskExpressionArray().some((mask) => {
|
|
12967
|
+
const specialChart = mask
|
|
12968
|
+
.split("" /* MaskExpression.EMPTY_STRING */)
|
|
12969
|
+
.some((char) => this._maskService.specialCharacters.includes(char));
|
|
12970
|
+
if ((specialChart &&
|
|
12971
|
+
this._inputValue() &&
|
|
12972
|
+
this._areAllCharactersInEachStringSame(this._maskExpressionArray())) ||
|
|
12973
|
+
mask.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */)) {
|
|
12974
|
+
const test = this._maskService.removeMask(this._inputValue())?.length <=
|
|
12975
|
+
this._maskService.removeMask(mask)?.length;
|
|
12976
|
+
if (test) {
|
|
12977
|
+
const maskValue = mask.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */)
|
|
12978
|
+
? this._maskService._repeatPatternSymbols(mask)
|
|
12979
|
+
: mask;
|
|
12980
|
+
this._maskValue.set(maskValue);
|
|
12981
|
+
this._maskService.maskExpression = maskValue;
|
|
12982
|
+
return test;
|
|
12983
|
+
}
|
|
12984
|
+
else {
|
|
12985
|
+
const expression = this._maskExpressionArray()[this._maskExpressionArray().length - 1] ??
|
|
12986
|
+
"" /* MaskExpression.EMPTY_STRING */;
|
|
12987
|
+
const maskValue = expression.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */)
|
|
12988
|
+
? this._maskService._repeatPatternSymbols(expression)
|
|
12989
|
+
: expression;
|
|
12990
|
+
this._maskValue.set(maskValue);
|
|
12991
|
+
this._maskService.maskExpression = maskValue;
|
|
12992
|
+
}
|
|
12993
|
+
}
|
|
12994
|
+
else {
|
|
12995
|
+
const cleanMask = this._maskService.removeMask(mask);
|
|
12996
|
+
const check = this._maskService
|
|
12997
|
+
.removeMask(this._inputValue())
|
|
12998
|
+
?.split("" /* MaskExpression.EMPTY_STRING */)
|
|
12999
|
+
.every((character, index) => {
|
|
13000
|
+
const indexMask = cleanMask.charAt(index);
|
|
13001
|
+
return this._maskService._checkSymbolMask(character, indexMask);
|
|
13002
|
+
});
|
|
13003
|
+
if (check || this._justPasted()) {
|
|
13004
|
+
this._maskValue.set(mask);
|
|
13005
|
+
this._maskService.maskExpression = mask;
|
|
13006
|
+
return check;
|
|
13007
|
+
}
|
|
13008
|
+
}
|
|
13009
|
+
});
|
|
13010
|
+
}
|
|
13011
|
+
_areAllCharactersInEachStringSame(array) {
|
|
13012
|
+
const specialCharacters = this._maskService.specialCharacters;
|
|
13013
|
+
function removeSpecialCharacters(str) {
|
|
13014
|
+
const regex = new RegExp(`[${specialCharacters.map((ch) => `\\${ch}`).join('')}]`, 'g');
|
|
13015
|
+
return str.replace(regex, '');
|
|
13016
|
+
}
|
|
13017
|
+
const processedArr = array.map(removeSpecialCharacters);
|
|
13018
|
+
return processedArr.every((str) => {
|
|
13019
|
+
const uniqueCharacters = new Set(str);
|
|
13020
|
+
return uniqueCharacters.size === 1;
|
|
13021
|
+
});
|
|
13022
|
+
}
|
|
13023
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
13024
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.0", type: MatchaMaskDirective, isStandalone: false, selector: "input[mask], textarea[mask]", inputs: { mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, specialCharacters: { classPropertyName: "specialCharacters", publicName: "specialCharacters", isSignal: true, isRequired: false, transformFunction: null }, patterns: { classPropertyName: "patterns", publicName: "patterns", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, thousandSeparator: { classPropertyName: "thousandSeparator", publicName: "thousandSeparator", isSignal: true, isRequired: false, transformFunction: null }, decimalMarker: { classPropertyName: "decimalMarker", publicName: "decimalMarker", isSignal: true, isRequired: false, transformFunction: null }, dropSpecialCharacters: { classPropertyName: "dropSpecialCharacters", publicName: "dropSpecialCharacters", isSignal: true, isRequired: false, transformFunction: null }, hiddenInput: { classPropertyName: "hiddenInput", publicName: "hiddenInput", isSignal: true, isRequired: false, transformFunction: null }, showMaskTyped: { classPropertyName: "showMaskTyped", publicName: "showMaskTyped", isSignal: true, isRequired: false, transformFunction: null }, placeHolderCharacter: { classPropertyName: "placeHolderCharacter", publicName: "placeHolderCharacter", isSignal: true, isRequired: false, transformFunction: null }, shownMaskExpression: { classPropertyName: "shownMaskExpression", publicName: "shownMaskExpression", isSignal: true, isRequired: false, transformFunction: null }, clearIfNotMatch: { classPropertyName: "clearIfNotMatch", publicName: "clearIfNotMatch", isSignal: true, isRequired: false, transformFunction: null }, validation: { classPropertyName: "validation", publicName: "validation", isSignal: true, isRequired: false, transformFunction: null }, separatorLimit: { classPropertyName: "separatorLimit", publicName: "separatorLimit", isSignal: true, isRequired: false, transformFunction: null }, allowNegativeNumbers: { classPropertyName: "allowNegativeNumbers", publicName: "allowNegativeNumbers", isSignal: true, isRequired: false, transformFunction: null }, leadZeroDateTime: { classPropertyName: "leadZeroDateTime", publicName: "leadZeroDateTime", isSignal: true, isRequired: false, transformFunction: null }, leadZero: { classPropertyName: "leadZero", publicName: "leadZero", isSignal: true, isRequired: false, transformFunction: null }, triggerOnMaskChange: { classPropertyName: "triggerOnMaskChange", publicName: "triggerOnMaskChange", isSignal: true, isRequired: false, transformFunction: null }, apm: { classPropertyName: "apm", publicName: "apm", isSignal: true, isRequired: false, transformFunction: null }, inputTransformFn: { classPropertyName: "inputTransformFn", publicName: "inputTransformFn", isSignal: true, isRequired: false, transformFunction: null }, outputTransformFn: { classPropertyName: "outputTransformFn", publicName: "outputTransformFn", isSignal: true, isRequired: false, transformFunction: null }, keepCharacterPositions: { classPropertyName: "keepCharacterPositions", publicName: "keepCharacterPositions", isSignal: true, isRequired: false, transformFunction: null }, instantPrefix: { classPropertyName: "instantPrefix", publicName: "instantPrefix", isSignal: true, isRequired: false, transformFunction: null } }, 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: [
|
|
13025
|
+
{
|
|
13026
|
+
provide: NG_VALUE_ACCESSOR,
|
|
13027
|
+
useExisting: forwardRef(() => MatchaMaskDirective),
|
|
13028
|
+
multi: true,
|
|
13029
|
+
},
|
|
13030
|
+
{
|
|
13031
|
+
provide: NG_VALIDATORS,
|
|
13032
|
+
useExisting: forwardRef(() => MatchaMaskDirective),
|
|
13033
|
+
multi: true,
|
|
13034
|
+
},
|
|
13035
|
+
MatchaMaskService,
|
|
13036
|
+
], exportAs: ["mask", "matchaMask"], usesOnChanges: true, ngImport: i0 }); }
|
|
13037
|
+
}
|
|
13038
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskDirective, decorators: [{
|
|
13039
|
+
type: Directive,
|
|
13040
|
+
args: [{
|
|
13041
|
+
selector: 'input[mask], textarea[mask]',
|
|
13042
|
+
standalone: false,
|
|
13043
|
+
providers: [
|
|
13044
|
+
{
|
|
13045
|
+
provide: NG_VALUE_ACCESSOR,
|
|
13046
|
+
useExisting: forwardRef(() => MatchaMaskDirective),
|
|
13047
|
+
multi: true,
|
|
13048
|
+
},
|
|
13049
|
+
{
|
|
13050
|
+
provide: NG_VALIDATORS,
|
|
13051
|
+
useExisting: forwardRef(() => MatchaMaskDirective),
|
|
13052
|
+
multi: true,
|
|
13053
|
+
},
|
|
13054
|
+
MatchaMaskService,
|
|
12812
13055
|
],
|
|
13056
|
+
exportAs: 'mask,matchaMask',
|
|
12813
13057
|
}]
|
|
12814
|
-
}]
|
|
13058
|
+
}], propDecorators: { onPaste: [{
|
|
13059
|
+
type: HostListener,
|
|
13060
|
+
args: ['paste']
|
|
13061
|
+
}], onFocus: [{
|
|
13062
|
+
type: HostListener,
|
|
13063
|
+
args: ['focus', ['$event']]
|
|
13064
|
+
}], onModelChange: [{
|
|
13065
|
+
type: HostListener,
|
|
13066
|
+
args: ['ngModelChange', ['$event']]
|
|
13067
|
+
}], onInput: [{
|
|
13068
|
+
type: HostListener,
|
|
13069
|
+
args: ['input', ['$event']]
|
|
13070
|
+
}], onCompositionStart: [{
|
|
13071
|
+
type: HostListener,
|
|
13072
|
+
args: ['compositionstart', ['$event']]
|
|
13073
|
+
}], onCompositionEnd: [{
|
|
13074
|
+
type: HostListener,
|
|
13075
|
+
args: ['compositionend', ['$event']]
|
|
13076
|
+
}], onBlur: [{
|
|
13077
|
+
type: HostListener,
|
|
13078
|
+
args: ['blur', ['$event']]
|
|
13079
|
+
}], onClick: [{
|
|
13080
|
+
type: HostListener,
|
|
13081
|
+
args: ['click', ['$event']]
|
|
13082
|
+
}], onKeyDown: [{
|
|
13083
|
+
type: HostListener,
|
|
13084
|
+
args: ['keydown', ['$event']]
|
|
13085
|
+
}] } });
|
|
12815
13086
|
|
|
12816
|
-
class
|
|
12817
|
-
|
|
12818
|
-
|
|
12819
|
-
|
|
13087
|
+
class MatchaMaskPipe {
|
|
13088
|
+
constructor() {
|
|
13089
|
+
this.defaultOptions = inject(MATCHA_MASK_CONFIG);
|
|
13090
|
+
this._maskService = inject(MatchaMaskService);
|
|
13091
|
+
this._maskExpressionArray = [];
|
|
13092
|
+
this.mask = '';
|
|
13093
|
+
}
|
|
13094
|
+
transform(value, mask, { patterns, ...config } = {}) {
|
|
13095
|
+
let processedValue = value;
|
|
13096
|
+
const currentConfig = {
|
|
13097
|
+
maskExpression: mask,
|
|
13098
|
+
...this.defaultOptions,
|
|
13099
|
+
...config,
|
|
13100
|
+
patterns: {
|
|
13101
|
+
...this._maskService.patterns,
|
|
13102
|
+
...patterns,
|
|
13103
|
+
},
|
|
13104
|
+
};
|
|
13105
|
+
Object.entries(currentConfig).forEach(([key, val]) => {
|
|
13106
|
+
this._maskService[key] = val;
|
|
13107
|
+
});
|
|
13108
|
+
if (mask.includes('||')) {
|
|
13109
|
+
const maskParts = mask.split('||');
|
|
13110
|
+
if (maskParts.length > 1) {
|
|
13111
|
+
this._maskExpressionArray = maskParts.sort((a, b) => a.length - b.length);
|
|
13112
|
+
this._setMask(`${processedValue}`);
|
|
13113
|
+
return this._maskService.applyMask(`${processedValue}`, this.mask);
|
|
13114
|
+
}
|
|
13115
|
+
else {
|
|
13116
|
+
this._maskExpressionArray = [];
|
|
13117
|
+
return this._maskService.applyMask(`${processedValue}`, this.mask);
|
|
13118
|
+
}
|
|
13119
|
+
}
|
|
13120
|
+
if (mask.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */)) {
|
|
13121
|
+
return this._maskService.applyMask(`${processedValue}`, this._maskService._repeatPatternSymbols(mask));
|
|
13122
|
+
}
|
|
13123
|
+
if (mask.startsWith("separator" /* MaskExpression.SEPARATOR */)) {
|
|
13124
|
+
if (config.decimalMarker) {
|
|
13125
|
+
this._maskService.decimalMarker = config.decimalMarker;
|
|
13126
|
+
}
|
|
13127
|
+
if (config.thousandSeparator) {
|
|
13128
|
+
this._maskService.thousandSeparator = config.thousandSeparator;
|
|
13129
|
+
}
|
|
13130
|
+
if (config.leadZero) {
|
|
13131
|
+
this._maskService.leadZero = config.leadZero;
|
|
13132
|
+
}
|
|
13133
|
+
processedValue = String(processedValue);
|
|
13134
|
+
const localeDecimalMarker = this._maskService.currentLocaleDecimalMarker();
|
|
13135
|
+
if (!Array.isArray(this._maskService.decimalMarker)) {
|
|
13136
|
+
processedValue =
|
|
13137
|
+
this._maskService.decimalMarker !== localeDecimalMarker
|
|
13138
|
+
? processedValue.replace(localeDecimalMarker, this._maskService.decimalMarker)
|
|
13139
|
+
: processedValue;
|
|
13140
|
+
}
|
|
13141
|
+
if (this._maskService.leadZero &&
|
|
13142
|
+
processedValue &&
|
|
13143
|
+
this._maskService.dropSpecialCharacters !== false) {
|
|
13144
|
+
processedValue = this._maskService._checkPrecision(mask, processedValue);
|
|
13145
|
+
}
|
|
13146
|
+
if (this._maskService.decimalMarker === "," /* MaskExpression.COMMA */) {
|
|
13147
|
+
processedValue = processedValue.replace("." /* MaskExpression.DOT */, "," /* MaskExpression.COMMA */);
|
|
13148
|
+
}
|
|
13149
|
+
this._maskService.isNumberValue = true;
|
|
13150
|
+
}
|
|
13151
|
+
if (processedValue === null || typeof processedValue === 'undefined') {
|
|
13152
|
+
return this._maskService.applyMask('', mask);
|
|
13153
|
+
}
|
|
13154
|
+
return this._maskService.applyMask(`${processedValue}`, mask);
|
|
13155
|
+
}
|
|
13156
|
+
_setMask(value) {
|
|
13157
|
+
if (this._maskExpressionArray.length > 0) {
|
|
13158
|
+
this._maskExpressionArray.some((mask) => {
|
|
13159
|
+
const test = this._maskService.removeMask(value)?.length <=
|
|
13160
|
+
this._maskService.removeMask(mask)?.length;
|
|
13161
|
+
if (value && test) {
|
|
13162
|
+
this.mask = mask;
|
|
13163
|
+
return test;
|
|
13164
|
+
}
|
|
13165
|
+
else {
|
|
13166
|
+
this.mask =
|
|
13167
|
+
this._maskExpressionArray[this._maskExpressionArray.length - 1] ??
|
|
13168
|
+
"" /* MaskExpression.EMPTY_STRING */;
|
|
13169
|
+
}
|
|
13170
|
+
});
|
|
13171
|
+
}
|
|
13172
|
+
}
|
|
13173
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
13174
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskPipe, isStandalone: false, name: "mask" }); }
|
|
12820
13175
|
}
|
|
12821
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type:
|
|
12822
|
-
type:
|
|
13176
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskPipe, decorators: [{
|
|
13177
|
+
type: Pipe,
|
|
12823
13178
|
args: [{
|
|
12824
|
-
|
|
12825
|
-
|
|
12826
|
-
|
|
12827
|
-
],
|
|
12828
|
-
exports: [MatchaSkeletonComponent],
|
|
13179
|
+
name: 'mask',
|
|
13180
|
+
pure: true,
|
|
13181
|
+
standalone: false,
|
|
12829
13182
|
}]
|
|
12830
13183
|
}] });
|
|
12831
13184
|
|
|
12832
|
-
|
|
12833
|
-
|
|
12834
|
-
|
|
12835
|
-
|
|
12836
|
-
|
|
12837
|
-
|
|
12838
|
-
|
|
12839
|
-
|
|
12840
|
-
|
|
12841
|
-
|
|
12842
|
-
|
|
12843
|
-
|
|
12844
|
-
|
|
12845
|
-
|
|
12846
|
-
|
|
13185
|
+
const options = {
|
|
13186
|
+
specialCharacters: ['/', '(', ')', '.', ':', '-', ' ', '+', ',', '@', '[', ']', '"', "'", '*'],
|
|
13187
|
+
patterns: {
|
|
13188
|
+
'0': { pattern: /\d/ },
|
|
13189
|
+
'9': { pattern: /\d/, optional: true },
|
|
13190
|
+
'A': { pattern: /[a-zA-Z0-9]/ },
|
|
13191
|
+
'S': { pattern: /[a-zA-Z]/ }
|
|
13192
|
+
},
|
|
13193
|
+
prefix: '',
|
|
13194
|
+
suffix: '',
|
|
13195
|
+
thousandSeparator: '',
|
|
13196
|
+
decimalMarker: '.',
|
|
13197
|
+
clearIfNotMatch: false,
|
|
13198
|
+
showMaskTyped: false,
|
|
13199
|
+
placeHolderCharacter: '_',
|
|
13200
|
+
shownMaskExpression: '',
|
|
13201
|
+
dropSpecialCharacters: true,
|
|
13202
|
+
hiddenInput: false,
|
|
13203
|
+
validation: true,
|
|
13204
|
+
instantPrefix: false,
|
|
13205
|
+
separatorLimit: '',
|
|
13206
|
+
apm: false,
|
|
13207
|
+
allowNegativeNumbers: false,
|
|
13208
|
+
leadZeroDateTime: false,
|
|
13209
|
+
leadZero: false,
|
|
13210
|
+
triggerOnMaskChange: false,
|
|
13211
|
+
keepCharacterPositions: false,
|
|
13212
|
+
inputTransformFn: (v) => v,
|
|
13213
|
+
outputTransformFn: (v) => v,
|
|
13214
|
+
maskFilled: new EventEmitter()
|
|
13215
|
+
};
|
|
13216
|
+
class MatchaMaskModule {
|
|
13217
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
13218
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskModule, declarations: [MatchaMaskDirective, MatchaMaskPipe], imports: [CommonModule], exports: [MatchaMaskDirective,
|
|
13219
|
+
MatchaMaskPipe] }); }
|
|
13220
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskModule, providers: [
|
|
13221
|
+
MatchaMaskService,
|
|
13222
|
+
{ provide: MATCHA_MASK_CONFIG, useValue: options }
|
|
12847
13223
|
], imports: [CommonModule] }); }
|
|
12848
13224
|
}
|
|
12849
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type:
|
|
13225
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskModule, decorators: [{
|
|
12850
13226
|
type: NgModule,
|
|
12851
13227
|
args: [{
|
|
13228
|
+
declarations: [MatchaMaskDirective, MatchaMaskPipe],
|
|
12852
13229
|
imports: [
|
|
12853
13230
|
CommonModule
|
|
12854
13231
|
],
|
|
13232
|
+
exports: [
|
|
13233
|
+
MatchaMaskDirective,
|
|
13234
|
+
MatchaMaskPipe
|
|
13235
|
+
],
|
|
12855
13236
|
providers: [
|
|
12856
|
-
|
|
12857
|
-
|
|
13237
|
+
MatchaMaskService,
|
|
13238
|
+
{ provide: MATCHA_MASK_CONFIG, useValue: options }
|
|
12858
13239
|
]
|
|
12859
13240
|
}]
|
|
12860
13241
|
}] });
|
|
@@ -12890,5 +13271,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImpor
|
|
|
12890
13271
|
* Generated bundle index. Do not edit.
|
|
12891
13272
|
*/
|
|
12892
13273
|
|
|
12893
|
-
export { CopyButtonComponent, INITIAL_CONFIG, MATCHA_MASK_CONFIG, MATCHA_OPTION_PARENT, MatchaAccordionComponent, MatchaAccordionContentComponent, MatchaAccordionHeaderComponent, MatchaAccordionItemComponent, MatchaAccordionModule, MatchaAutocompleteComponent, MatchaAutocompleteModule, MatchaAutocompleteTriggerDirective, MatchaAvatarComponent, MatchaAvatarModule, MatchaBadgeDirective, MatchaBadgeModule, MatchaBreakpointObservableModule, MatchaBreakpointObserver, MatchaButtonComponent, MatchaButtonModule, MatchaButtonToggleComponent, MatchaButtonToggleModule, MatchaCardComponent, MatchaCardModule, MatchaCheckboxComponent, MatchaCheckboxModule, MatchaComponentsModule, MatchaDateRangeComponent, MatchaDateRangeModule, MatchaDividerComponent, MatchaDividerModule, MatchaDragDirective, MatchaDragHandleDirective, MatchaDrawerComponent, MatchaDrawerContainerComponent, MatchaDrawerContentComponent, MatchaDrawerModule, MatchaDropListComponent, MatchaDropListModule, MatchaElevationDirective, MatchaElevationModule, MatchaErrorComponent, MatchaFormFieldComponent, MatchaFormFieldModule, MatchaGridComponent, MatchaGridModule, MatchaHighlightComponent, MatchaHighlightModule, MatchaHintTextComponent, MatchaHintTextModule, MatchaIconComponent, MatchaIconModule, MatchaInfiniteScrollComponent, MatchaInfiniteScrollDataComponent, MatchaInfiniteScrollModule, MatchaInputDirective, MatchaInputModule, MatchaInputPhoneComponent, MatchaInputPhoneModule, MatchaLabelComponent, MatchaLazyloadComponent, MatchaLazyloadDataComponent, MatchaLazyloadModule, MatchaMaskApplierService, MatchaMaskDirective, MatchaMaskModule, MatchaMaskPipe, MatchaMaskService, MatchaMasonryComponent, MatchaMasonryModule, MatchaMenuComponent, MatchaMenuModule, MatchaMenuTriggerForDirective, MatchaModalComponent, MatchaModalContentComponent, MatchaModalFooterComponent, MatchaModalHeaderComponent, MatchaModalModule, MatchaModalOptionsComponent, MatchaModalService, MatchaOptionComponent, MatchaOptionModule, MatchaOverlayService, MatchaPageLayoutComponent, MatchaPageLayoutModule, MatchaPaginatorComponent, MatchaPaginatorIntl, MatchaPaginatorModule, MatchaPanelComponent, MatchaPanelModule, MatchaProgressBarDirective, MatchaProgressBarModule, MatchaRadioComponent, MatchaRadioModule, MatchaRippleDirective, MatchaRippleModule, MatchaSelectComponent, MatchaSelectModule, MatchaSelectTriggerDirective, MatchaSidenavDirective, MatchaSidenavModule, MatchaSkeletonComponent, MatchaSkeletonModule, MatchaSlideToggleComponent, MatchaSlideToggleModule, MatchaSliderComponent, MatchaSliderModule, MatchaSnackBarDirective, MatchaSnackBarModule, MatchaSortHeaderDirective, MatchaSortHeaderModule, MatchaSpinComponent, MatchaSpinModule, MatchaSpinnerComponent, MatchaSpinnerModule, MatchaStepperComponent, MatchaStepperContentComponent, MatchaStepperControllerComponent, MatchaStepperModule, MatchaStepperStateService, MatchaTabItemComponent, MatchaTableDirective, MatchaTableModule, MatchaTabsComponent, MatchaTabsModule, MatchaTimeComponent, MatchaTimeModule, MatchaTitleComponent, MatchaTitleModule, MatchaToolbarButtonComponent, MatchaToolbarComponent, MatchaToolbarContentComponent, MatchaToolbarCustomButtonComponent, MatchaToolbarMainButtonComponent, MatchaToolbarModule, MatchaTooltipDirective, MatchaTooltipModule, NEW_CONFIG, NextStepDirective, PrevStepDirective, StepComponent, StepContentDirective, initialConfig, options, timeMasks, withoutValidation };
|
|
13274
|
+
export { CopyButtonComponent, INITIAL_CONFIG, MATCHA_MASK_CONFIG, MATCHA_OPTION_PARENT, MatchaAccordionComponent, MatchaAccordionContentComponent, MatchaAccordionHeaderComponent, MatchaAccordionItemComponent, MatchaAccordionModule, MatchaAutocompleteComponent, MatchaAutocompleteModule, MatchaAutocompleteTriggerDirective, MatchaAvatarComponent, MatchaAvatarModule, MatchaBadgeDirective, MatchaBadgeModule, MatchaBreakpointObservableModule, MatchaBreakpointObserver, MatchaButtonComponent, MatchaButtonModule, MatchaButtonToggleComponent, MatchaButtonToggleModule, MatchaCardComponent, MatchaCardModule, MatchaCheckboxComponent, MatchaCheckboxModule, MatchaComponentsModule, MatchaDateRangeComponent, MatchaDateRangeModule, MatchaDividerComponent, MatchaDividerModule, MatchaDragDirective, MatchaDragHandleDirective, MatchaDrawerComponent, MatchaDrawerContainerComponent, MatchaDrawerContentComponent, MatchaDrawerModule, MatchaDropListComponent, MatchaDropListModule, MatchaElevationDirective, MatchaElevationModule, MatchaErrorComponent, MatchaFormFieldComponent, MatchaFormFieldModule, MatchaGridComponent, MatchaGridModule, MatchaHighlightComponent, MatchaHighlightModule, MatchaHintTextComponent, MatchaHintTextModule, MatchaIconComponent, MatchaIconModule, MatchaInfiniteScrollComponent, MatchaInfiniteScrollDataComponent, MatchaInfiniteScrollModule, MatchaInputDirective, MatchaInputModule, MatchaInputPhoneComponent, MatchaInputPhoneModule, MatchaLabelComponent, MatchaLazyloadComponent, MatchaLazyloadDataComponent, MatchaLazyloadModule, MatchaMaskApplierService, MatchaMaskCompatibleDirective, MatchaMaskCompatibleModule, MatchaMaskDirective, MatchaMaskModule, MatchaMaskPipe, MatchaMaskService, MatchaMasonryComponent, MatchaMasonryModule, MatchaMenuComponent, MatchaMenuModule, MatchaMenuTriggerForDirective, MatchaModalComponent, MatchaModalContentComponent, MatchaModalFooterComponent, MatchaModalHeaderComponent, MatchaModalModule, MatchaModalOptionsComponent, MatchaModalService, MatchaOptionComponent, MatchaOptionModule, MatchaOverlayService, MatchaPageLayoutComponent, MatchaPageLayoutModule, MatchaPaginatorComponent, MatchaPaginatorIntl, MatchaPaginatorModule, MatchaPanelComponent, MatchaPanelModule, MatchaProgressBarDirective, MatchaProgressBarModule, MatchaRadioComponent, MatchaRadioModule, MatchaRippleDirective, MatchaRippleModule, MatchaSelectComponent, MatchaSelectModule, MatchaSelectTriggerDirective, MatchaSidenavDirective, MatchaSidenavModule, MatchaSkeletonComponent, MatchaSkeletonModule, MatchaSlideToggleComponent, MatchaSlideToggleModule, MatchaSliderComponent, MatchaSliderModule, MatchaSnackBarDirective, MatchaSnackBarModule, MatchaSortHeaderDirective, MatchaSortHeaderModule, MatchaSpinComponent, MatchaSpinModule, MatchaSpinnerComponent, MatchaSpinnerModule, MatchaStepperComponent, MatchaStepperContentComponent, MatchaStepperControllerComponent, MatchaStepperModule, MatchaStepperStateService, MatchaTabItemComponent, MatchaTableDirective, MatchaTableModule, MatchaTabsComponent, MatchaTabsModule, MatchaTimeComponent, MatchaTimeModule, MatchaTitleComponent, MatchaTitleModule, MatchaToolbarButtonComponent, MatchaToolbarComponent, MatchaToolbarContentComponent, MatchaToolbarCustomButtonComponent, MatchaToolbarMainButtonComponent, MatchaToolbarModule, MatchaTooltipDirective, MatchaTooltipModule, NEW_CONFIG, NextStepDirective, PrevStepDirective, StepComponent, StepContentDirective, compatibleOptions, initialConfig, options, timeMasks, withoutValidation };
|
|
12894
13275
|
//# sourceMappingURL=matcha-components.mjs.map
|