first-npm-package-nicule/material-inputs/components/text/text-field.component.html

This isi first npm package

<label [ngClass]="'form-field-label-' + field.name" [for]="'form-field-' + field.name + '-' + uniqueIdentifier">{{label | translate}}<ng-container *ngIf="field.required">*</ng-container></label>
<mat-form-field [ngClass]="'form-field-input-' + field.name" floatLabel="never" [matTooltip]="tooltip" [matTooltipDisabled]="!(field.isDisabled || disabled)">
    <input matInput type="text"
            [id]="'form-field-' + field.name + '-' + uniqueIdentifier"
            [ngModel]="field.value"
            [placeholder]="placeholder"
            [name]="field.name"
            [required]="field.required"
            [maxlength]="field.maxlength"
            [minlength]="field.minlength"
            [pattern]="field.pattern"
            [disabled]="field.isDisabled || disabled"
            [matTooltip]="tooltip"
            [errorStateMatcher]="matcher"/>
    <mat-error>
        <span *ngFor="let error of errors">
            {{error.message | translate: error.payload }}
        </span>
    </mat-error>
    <span class="empty-placeholder" *ngIf="(field.isDisabled || disabled) && !ngModel.control.value">-</span>
</mat-form-field>