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.
@@ -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, input, output, signal, TemplateRef, Optional, ViewEncapsulation, NgModule, createComponent, Pipe } 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, 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 MatchaMaskDirective {
6367
+ class MatchaMaskCompatibleDirective {
6368
6368
  constructor() {
6369
- this.mask = input('', ...(ngDevMode ? [{ debugName: "mask" }] : []));
6370
- this.specialCharacters = input([], ...(ngDevMode ? [{ debugName: "specialCharacters" }] : []));
6371
- this.patterns = input({}, ...(ngDevMode ? [{ debugName: "patterns" }] : []));
6372
- this.prefix = input('', ...(ngDevMode ? [{ debugName: "prefix" }] : []));
6373
- this.suffix = input('', ...(ngDevMode ? [{ debugName: "suffix" }] : []));
6374
- this.thousandSeparator = input(' ', ...(ngDevMode ? [{ debugName: "thousandSeparator" }] : []));
6375
- this.decimalMarker = input('.', ...(ngDevMode ? [{ debugName: "decimalMarker" }] : []));
6376
- this.dropSpecialCharacters = input(null, ...(ngDevMode ? [{ debugName: "dropSpecialCharacters" }] : []));
6377
- this.hiddenInput = input(null, ...(ngDevMode ? [{ debugName: "hiddenInput" }] : []));
6378
- this.showMaskTyped = input(null, ...(ngDevMode ? [{ debugName: "showMaskTyped" }] : []));
6379
- this.placeHolderCharacter = input(null, ...(ngDevMode ? [{ debugName: "placeHolderCharacter" }] : []));
6380
- this.shownMaskExpression = input(null, ...(ngDevMode ? [{ debugName: "shownMaskExpression" }] : []));
6381
- this.clearIfNotMatch = input(null, ...(ngDevMode ? [{ debugName: "clearIfNotMatch" }] : []));
6382
- this.validation = input(null, ...(ngDevMode ? [{ debugName: "validation" }] : []));
6383
- this.separatorLimit = input('', ...(ngDevMode ? [{ debugName: "separatorLimit" }] : []));
6384
- this.allowNegativeNumbers = input(null, ...(ngDevMode ? [{ debugName: "allowNegativeNumbers" }] : []));
6385
- this.leadZeroDateTime = input(null, ...(ngDevMode ? [{ debugName: "leadZeroDateTime" }] : []));
6386
- this.leadZero = input(null, ...(ngDevMode ? [{ debugName: "leadZero" }] : []));
6387
- this.triggerOnMaskChange = input(null, ...(ngDevMode ? [{ debugName: "triggerOnMaskChange" }] : []));
6388
- this.apm = input(null, ...(ngDevMode ? [{ debugName: "apm" }] : []));
6389
- this.inputTransformFn = input(null, ...(ngDevMode ? [{ debugName: "inputTransformFn" }] : []));
6390
- this.outputTransformFn = input(null, ...(ngDevMode ? [{ debugName: "outputTransformFn" }] : []));
6391
- this.keepCharacterPositions = input(null, ...(ngDevMode ? [{ debugName: "keepCharacterPositions" }] : []));
6392
- this.instantPrefix = input(null, ...(ngDevMode ? [{ debugName: "instantPrefix" }] : []));
6393
- this.maskFilled = output();
6394
- this._maskValue = signal('', ...(ngDevMode ? [{ debugName: "_maskValue" }] : []));
6395
- this._inputValue = signal('', ...(ngDevMode ? [{ debugName: "_inputValue" }] : []));
6396
- this._position = signal(null, ...(ngDevMode ? [{ debugName: "_position" }] : []));
6397
- this._code = signal('', ...(ngDevMode ? [{ debugName: "_code" }] : []));
6398
- this._maskExpressionArray = signal([], ...(ngDevMode ? [{ debugName: "_maskExpressionArray" }] : []));
6399
- this._justPasted = signal(false, ...(ngDevMode ? [{ debugName: "_justPasted" }] : []));
6400
- this._isFocused = signal(false, ...(ngDevMode ? [{ debugName: "_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 = signal(false, ...(ngDevMode ? [{ debugName: "_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
- if (mask.currentValue !== mask.previousValue && !mask.firstChange) {
6415
- this._maskService.maskChanged = true;
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
- if (!specialCharacters.currentValue || !Array.isArray(specialCharacters.currentValue)) {
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 (instantPrefix) {
6451
- this._maskService.instantPrefix = instantPrefix.currentValue;
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
- this._applyMask();
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
- if (timeMasks.includes(maskValue)) {
6562
- return this._validateTime(processedValue);
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
- if (maskValue === "A*@A*.A*" /* MaskExpression.EMAIL_MASK */) {
6565
- const emailPattern = /^[^@]+@[^@]+\.[^@]+$/;
6566
- if (!emailPattern.test(processedValue) && processedValue) {
6567
- return this._createValidationError(processedValue);
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
- return null;
6508
+ this._maskService.onChange(value);
6571
6509
  }
6572
6510
  }
6573
- if (processedValue && processedValue.length >= 1) {
6574
- let counterOfOpt = 0;
6575
- if (maskValue.includes("{" /* MaskExpression.CURLY_BRACKETS_LEFT */) &&
6576
- maskValue.includes("}" /* MaskExpression.CURLY_BRACKETS_RIGHT */)) {
6577
- const lengthInsideCurlyBrackets = maskValue.slice(maskValue.indexOf("{" /* MaskExpression.CURLY_BRACKETS_LEFT */) + 1, maskValue.indexOf("}" /* MaskExpression.CURLY_BRACKETS_RIGHT */));
6578
- return lengthInsideCurlyBrackets === String(processedValue.length)
6579
- ? null
6580
- : this._createValidationError(processedValue);
6581
- }
6582
- if (maskValue.startsWith("percent" /* MaskExpression.PERCENT */)) {
6583
- return null;
6584
- }
6585
- for (const key in this._maskService.patterns) {
6586
- if (this._maskService.patterns[key]?.optional) {
6587
- if (maskValue.indexOf(key) !== maskValue.lastIndexOf(key)) {
6588
- const opt = maskValue
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
- if (value) {
6656
- this.maskFilled.emit();
6657
- return null;
6529
+ else {
6530
+ this._maskService.onChange(value);
6658
6531
  }
6659
- return null;
6660
6532
  }
6661
- onPaste() {
6662
- this._justPasted.set(true);
6533
+ onCompositionStart(event) {
6534
+ this._isComposing = true;
6663
6535
  }
6664
- onFocus() {
6665
- this._isFocused.set(true);
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
- onModelChange(value) {
6668
- // on form reset we need to update the actualValue
6669
- if ((value === "" /* MaskExpression.EMPTY_STRING */ ||
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
- onInput(e) {
6677
- // If IME is composing text, we wait for the composed text.
6678
- if (this._isComposing()) {
6679
- return;
6680
- }
6681
- const el = e.target;
6682
- const transformedValue = this._maskService.inputTransformFn
6683
- ? this._maskService.inputTransformFn(el.value)
6684
- : el.value;
6685
- if (el.type !== 'number') {
6686
- if (typeof transformedValue === 'string' || typeof transformedValue === 'number') {
6687
- el.value = transformedValue.toString();
6688
- this._inputValue.set(el.value);
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
- if (!this._maskValue()) {
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
- // IME starts
6879
- onCompositionStart() {
6880
- this._isComposing.set(true);
6565
+ registerOnChange(fn) {
6566
+ this.onChange = fn;
6567
+ this._maskService.onChange = fn;
6881
6568
  }
6882
- // IME completes
6883
- onCompositionEnd(e) {
6884
- this._isComposing.set(false);
6885
- this._justPasted.set(true);
6886
- this.onInput(e);
6569
+ registerOnTouched(fn) {
6570
+ this.onTouch = fn;
6887
6571
  }
6888
- onBlur(e) {
6889
- if (this._maskValue()) {
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
- onClick(e) {
6918
- if (!this._maskValue()) {
6919
- return;
6920
- }
6921
- const el = e.target;
6922
- const posStart = 0;
6923
- const posEnd = 0;
6924
- if (el !== null &&
6925
- el.selectionStart !== null &&
6926
- el.selectionStart === el.selectionEnd &&
6927
- el.selectionStart > this._maskService.prefix.length &&
6928
- e.keyCode !== 38) {
6929
- if (this._maskService.showMaskTyped && !this.keepCharacterPositions()) {
6930
- // We are showing the mask in the input
6931
- this._maskService.maskIsShown = this._maskService.showMaskInInput();
6932
- if (el.setSelectionRange &&
6933
- this._maskService.prefix + this._maskService.maskIsShown === el.value) {
6934
- // the input ONLY contains the mask, so position the cursor at the start
6935
- el.focus();
6936
- el.setSelectionRange(posStart, posEnd);
6937
- }
6938
- else {
6939
- // the input contains some characters already
6940
- if (el.selectionStart > this._maskService.actualValue.length) {
6941
- // if the user clicked beyond our value's length, position the cursor at the end of our value
6942
- el.setSelectionRange(this._maskService.actualValue.length, this._maskService.actualValue.length);
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
- const nextValue = el &&
6948
- (el.value === this._maskService.prefix
6949
- ? this._maskService.prefix + this._maskService.maskIsShown
6950
- : el.value);
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
- /** select only inserted text */
6965
- if (el && el.selectionEnd > this._getActualInputLength()) {
6966
- el.selectionEnd = this._getActualInputLength();
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
- onKeyDown(e) {
6970
- if (!this._maskValue()) {
6971
- return;
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
- if (this._isComposing()) {
6974
- // User finalize their choice from IME composition, so trigger onInput() for the composed text.
6975
- if (e.key === 'Enter') {
6976
- this.onCompositionEnd(e);
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
- return;
6798
+ });
6799
+ if (matchingAreaCode.length === 1) {
6800
+ this.setCountryAndInputValue(matchingAreaCode[0].iso2, phoneWithoutDialCode);
6979
6801
  }
6980
- this._code.set(e.code ? e.code : e.key);
6981
- const el = e.target;
6982
- this._inputValue.set(el.value);
6983
- this._setMask();
6984
- if (el.type !== 'number') {
6985
- if (e.key === "ArrowUp" /* MaskExpression.ARROW_UP */) {
6986
- e.preventDefault();
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 (typeof value === 'string' ||
7061
- typeof value === 'number' ||
7062
- value === null ||
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
- this._inputValue.set(inputValue);
7103
- this._setMask();
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._maskService.formElementProperty = ['value', inputValue];
6829
+ this.typeMask = this.fallbackMask;
7118
6830
  }
7119
- this._inputValue.set(inputValue);
7120
6831
  }
7121
6832
  else {
7122
- // eslint-disable-next-line no-console
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
- registerOnChange(fn) {
7127
- this._maskService.onChange = this.onChange = fn;
7128
- }
7129
- registerOnTouched(fn) {
7130
- this.onTouch = fn;
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
- checkSelectionOnDeletion(el) {
7142
- const prefixLength = this.prefix().length;
7143
- const suffixLength = this.suffix().length;
7144
- const inputValueLength = this._inputValue().length;
7145
- el.selectionStart = Math.min(Math.max(prefixLength, el.selectionStart), inputValueLength - suffixLength);
7146
- el.selectionEnd = Math.min(Math.max(prefixLength, el.selectionEnd), inputValueLength - suffixLength);
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
- _applyMask() {
7153
- this._maskService.maskExpression = this._maskService._repeatPatternSymbols(this._maskValue() || '');
7154
- this._maskService.formElementProperty = [
7155
- 'value',
7156
- this._maskService.applyMask(this._inputValue(), this._maskService.maskExpression),
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
- _validateTime(value) {
7160
- const rowMaskLen = this._maskValue()
7161
- .split("" /* MaskExpression.EMPTY_STRING */)
7162
- .filter((s) => s !== ':').length;
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
- _getActualInputLength() {
7173
- return (this._maskService.actualValue.length ||
7174
- this._maskService.actualValue.length + this._maskService.prefix.length);
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
- _createValidationError(actualValue) {
7177
- return {
7178
- mask: {
7179
- requiredMask: this._maskValue(),
7180
- actualValue,
7181
- },
7182
- };
6882
+ ngOnDestroy() {
6883
+ this.removeClickListener();
7183
6884
  }
7184
- _setMask() {
7185
- this._maskExpressionArray().some((mask) => {
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: MatchaMaskDirective, decorators: [{
7258
- type: Directive,
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: 'input[mask], textarea[mask]',
7261
- standalone: false,
7262
- providers: [
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: { onPaste: [{
7278
- type: HostListener,
7279
- args: ['paste']
7280
- }], onFocus: [{
7281
- type: HostListener,
7282
- args: ['focus', ['$event']]
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
- * Componente MatchaInputPhone
7308
- *
7309
- * Componente Angular para entrada de telefone internacional com seleção de país, máscara dinâmica e exibição de bandeira.
7310
- *
7311
- * Funcionalidades:
7312
- * - Seleção de país com dropdown e bandeira.
7313
- * - Máscara dinâmica de acordo com o país e DDD digitado.
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
- ngOnChanges(changes) {
7359
- if (changes['value'] && !changes['value'].firstChange) {
7360
- this.value = changes['value'].currentValue;
7361
- if (!this.value) {
7362
- this.inputValueModel = this.value ?? '';
7363
- return;
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
- initCountryPhone(phone) {
7370
- if (!phone.startsWith('+')) {
7371
- this.setCountryAndInputValue('br', phone);
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
- const phoneWithoutPlus = phone.replace('+', '');
7375
- const countryDialCode = this.selectedCountry?.dialCode;
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
- setCountryAndInputValue(iso2, phone) {
7385
- this.selectedCountry = this.allCountries.find((country) => country.iso2 === iso2);
7386
- this.inputValueModel = phone.startsWith('0') ? phone.slice(1) : phone;
7387
- this.selectMaskForDialCode(this.selectedCountry.areaCodes ? this.selectedCountry.areaCodes[0] : '000', this.inputValueModel);
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
- getMatchingCountry(phoneWithoutPlus) {
7399
- return this.allCountries.filter((country) => {
7400
- const dialCode = country.dialCode;
7401
- return phoneWithoutPlus.startsWith(dialCode);
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
- class MatchaMaskPipe {
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 MatchaMaskModule {
12334
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
12335
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskModule, declarations: [MatchaMaskDirective, MatchaMaskPipe], imports: [CommonModule], exports: [MatchaMaskDirective,
12336
- MatchaMaskPipe] }); }
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: options }
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: MatchaMaskModule, decorators: [{
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: [MatchaMaskDirective, MatchaMaskPipe],
11633
+ declarations: [MatchaMaskCompatibleDirective],
12346
11634
  imports: [
12347
11635
  CommonModule
12348
11636
  ],
12349
11637
  exports: [
12350
- MatchaMaskDirective,
12351
- MatchaMaskPipe
11638
+ MatchaMaskCompatibleDirective
12352
11639
  ],
12353
11640
  providers: [
12354
11641
  MatchaMaskService,
12355
- { provide: MATCHA_MASK_CONFIG, useValue: options }
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
- MatchaMaskModule], exports: [MatchaInputPhoneComponent] }); }
12366
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaInputPhoneModule, providers: [MatchaMaskModule], imports: [CommonModule,
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
- MatchaMaskModule] }); }
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
- MatchaMaskModule,
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
- MatchaMaskModule], exports: [MatchaAccordionModule,
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
- MatchaMaskModule] }); }
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
- MatchaMaskModule, MatchaAccordionModule,
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
- MatchaMaskModule] }); }
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
- MatchaMaskModule
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
- MatchaMaskModule
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 MatchaSkeletonModule {
12817
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaSkeletonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
12818
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaSkeletonModule, declarations: [MatchaSkeletonComponent], imports: [CommonModule], exports: [MatchaSkeletonComponent] }); }
12819
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaSkeletonModule, imports: [CommonModule] }); }
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: MatchaSkeletonModule, decorators: [{
12822
- type: NgModule,
13176
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaMaskPipe, decorators: [{
13177
+ type: Pipe,
12823
13178
  args: [{
12824
- declarations: [MatchaSkeletonComponent],
12825
- imports: [
12826
- CommonModule
12827
- ],
12828
- exports: [MatchaSkeletonComponent],
13179
+ name: 'mask',
13180
+ pure: true,
13181
+ standalone: false,
12829
13182
  }]
12830
13183
  }] });
12831
13184
 
12832
- /**
12833
- * Módulo para o MatchaBreakpointObserver
12834
- *
12835
- * Este módulo fornece o serviço MatchaBreakpointObserver que pode ser usado
12836
- * em qualquer parte da aplicação para observar breakpoints CSS.
12837
- *
12838
- * O serviço é um singleton (providedIn: 'root') e não precisa ser importado
12839
- * explicitamente, mas este módulo pode ser usado para organização.
12840
- */
12841
- class MatchaBreakpointObservableModule {
12842
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaBreakpointObservableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
12843
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: MatchaBreakpointObservableModule, imports: [CommonModule] }); }
12844
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: MatchaBreakpointObservableModule, providers: [
12845
- // O serviço já é providedIn: 'root', mas incluímos aqui para clareza
12846
- MatchaBreakpointObserver
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: MatchaBreakpointObservableModule, decorators: [{
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
- // O serviço já é providedIn: 'root', mas incluímos aqui para clareza
12857
- MatchaBreakpointObserver
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