fix(ref: no-ref): fix issues

CHANGELOG.md

@@ -1,8 +1,12 @@
-https://github.com/JsDaddy/ngx-mask/issues/1372
-https://github.com/JsDaddy/ngx-mask/issues/1441
-https://github.com/JsDaddy/ngx-mask/issues/1442
-https://github.com/JsDaddy/ngx-mask/issues/1440
+# 18.0.3(2024-11-05)
 
+### Fix
+
+-   Fix ([#1372](https://github.com/JsDaddy/ngx-mask/issues/1372))
+-   Fix ([#1441](https://github.com/JsDaddy/ngx-mask/issues/1441))
+-   Fix ([#1442](https://github.com/JsDaddy/ngx-mask/issues/1442))
+-   Fix ([#1440](https://github.com/JsDaddy/ngx-mask/issues/1440))
+-   Fix ([#1409](https://github.com/JsDaddy/ngx-mask/issues/1409))
 
 # 18.0.2(2024-11-01)
 

src/app/options/options.component.html

@@ -1,87 +1,3 @@
-<div class="flex flex-col bg-black">
-    <input
-        mask="A*@A*.A*"
-        [validation]="true"
-        [formControl]="formControl1"
-        [dropSpecialCharacters]="false" />
-    <span>{{ formControl1.errors | json }}</span>
-    <span>{{ formControl1.valid | json }}</span>
-
-    <!--    <input-->
-    <!--        mask="separator.2"-->
-    <!--        [(ngModel)]="input"-->
-    <!--        [decimalMarker]="','"-->
-    <!--        [allowNegativeNumbers]="true"-->
-    <!--        [dropSpecialCharacters]="false"-->
-    <!--        [thousandSeparator]="thousand" />-->
-    <!--    <span>{{ input }}</span>-->
-
-    <input
-        mask="separator.2"
-        [(ngModel)]="input1"
-        [decimalMarker]="','"
-        [separatorLimit]="'100000000000000'"
-        [allowNegativeNumbers]="true"
-        [thousandSeparator]="thousand" />
-    <span>{{ input1 }}</span>
-    <button (click)="fill()">change</button>
-
-    <!--    <input-->
-    <!--        [mask]="mask"-->
-    <!--        [leadZero]="true"-->
-    <!--        [decimalMarker]="','"-->
-    <!--        [thousandSeparator]="'.'"-->
-    <!--        [ngModel]="testValue1"-->
-    <!--        (ngModelChange)="updateValueWithLeadZero($event)" />-->
-    <!--    <span>{{ testValue1 }}</span>-->
-    <!--    <hr />-->
-
-    <!--    <input-->
-    <!--        [mask]="mask"-->
-    <!--        [leadZero]="false"-->
-    <!--        [decimalMarker]="','"-->
-    <!--        [thousandSeparator]="'.'"-->
-    <!--        [ngModel]="testValue2"-->
-    <!--        (ngModelChange)="updateValueWithoutLeadZero($event)" />-->
-    <!--    <span>{{ testValue2 }}</span>-->
-
-    <!--    <input-->
-    <!--        type="text"-->
-    <!--        mask="000-000-000"-->
-    <!--        [formControl]="formControl"-->
-    <!--        [showMaskTyped]="true"-->
-    <!--        [keepCharacterPositions]="true" />-->
-
-    <!--    <input-->
-    <!--        type="text"-->
-    <!--        mask="000-000-000"-->
-    <!--        [formControl]="formControl"-->
-    <!--        [showMaskTyped]="true"-->
-    <!--        prefix="+387 "-->
-    <!--        [keepCharacterPositions]="true" />-->
-    <!--    <span>{{ formControl.value }}</span>-->
-
-    <!--    <input type="text" mask="d0.M0." [dropSpecialCharacters]="false" />-->
-    <!--    <input type="text" mask="M0.d0." [dropSpecialCharacters]="false" />-->
-
-    <!--    <br />-->
-    <!--    <span>Workaround</span>-->
-    <!--    <input type="text" mask="d0.M0." [dropSpecialCharacters]="false" [leadZeroDateTime]="true" />-->
-    <!--    <input type="text" mask="M0.d0." [dropSpecialCharacters]="false" [leadZeroDateTime]="true" />-->
-
-    <!--    <div>-->
-    <!--        <p>Mask set to 'SSS-SSS-SSS'</p>-->
-    <!--        <input-->
-    <!--            [formControl]="formControl"-->
-    <!--            [showMaskTyped]="true"-->
-    <!--            [validation]="true"-->
-    <!--            type="text"-->
-    <!--            [mask]="'SSS-SSS-SSS'" />-->
-    <!--    </div>-->
-    <!--    <span>{{ formControl.value }}</span>-->
-    <!--    <button (click)="onClick()" class="text-full-white">Set value to: 978-1-93624-386-0</button>-->
-</div>
-
 @for (tile of cardDocs(); track tile.id; let i = $index) {
     <div
         class="flex flex-col p-2.5 gap-2.5 bg-dark/[.02] rounded-15px"

src/app/options/options.component.scss

@@ -1,10 +1,3 @@
 :host {
     @apply flex flex-col gap-4 p-4 bg-full-white box-border border-t border-t-black/10 py-5 pl-[22px] pr-4;
-    input {
-        @apply w-full h-[51px] placeholder:text-white/25 text-full-white py-3 px-5 outline-none bg-black border-b-2px border-b-white rounded-10px focus:border-b-yellow hover:border-b-yellow hover:bg-full-white/25 focus:bg-full-white/25;
-    }
-    span,
-    button {
-        @apply text-full-white;
-    }
 }

src/app/options/options.component.ts

@@ -1,6 +1,6 @@
 import { Component, effect, ElementRef, inject, input, viewChildren } from '@angular/core';
 import { JsonPipe, NgOptimizedImage, NgTemplateOutlet } from '@angular/common';
-import { FormControl, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { initialConfig, NgxMaskDirective, NgxMaskPipe } from 'ngx-mask';
 import { HighlightModule } from 'ngx-highlightjs';
 import { AssetPipe } from '@libraries/asset/asset.pipe';
@@ -59,29 +59,4 @@ export class OptionsComponent {
             this.accordionService.onChangeAccordion(this.cards());
         });
     }
-
-    public formControl = new FormControl('123 456 789 999 999 9');
-
-    public onClick() {
-        this.formControl.setValue('978-1-93624-386-0');
-    }
-
-    public testValue1 = 100.12;
-    public formControl1 = new FormControl('', Validators.required);
-    public testValue2 = 100.12;
-    public mask = 'separator.2';
-    public thousand = '.';
-    public input = '60.04';
-    public input1 = '-60.04';
-    public updateValueWithLeadZero(value: any) {
-        this.testValue1 = parseFloat(value);
-    }
-
-    public updateValueWithoutLeadZero(value: any) {
-        this.testValue2 = parseFloat(value);
-    }
-
-    public fill() {
-        this.thousand = ',';
-    }
 }