fixed asktrix placement on new line

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firestitch/form",
   "title": "Form",
-  "version": "18.0.8",
+  "version": "18.0.9",
   "repository": {
     "type": "git",
     "url": "https://github.com/Firestitch/ngx-form"

playground/app/components/first-example/first-example.component.html

@@ -45,7 +45,7 @@
       </ng-template>
     </fs-autocomplete-chips>
     <div
-        class="fs-row"
+        class="fs-row.gap-xs"
         *ngIf="render">
       <mat-form-field>
         <mat-label>
@@ -54,6 +54,7 @@
         <input
           #passwordInput
           name="password"
+          [required]="required && validations"
           [(ngModel)]="password"
           matInput>
       </mat-form-field>
@@ -64,6 +65,7 @@
         <input
           [(ngModel)]="passwordConfirm"
           name="confirm"
+          [required]="required && validations"
           [fsFormCompare]="passwordInput"
           [fsFormNumeric]="validations"
           matInput>
@@ -324,4 +326,4 @@
       </button>
     </div>
   </div>
-</form>
+</form>

src/app/styles.scss

@@ -6,12 +6,17 @@
     but should not do that for simple matInputs, cuz since Material 18 its already added
     by mat-form-field, this is why first selector is such complicated
    */
-  mat-label:not(:has(+ .mat-mdc-form-field-required-marker)), .fs-form-label {
+  mat-label:not(:has(+ .mat-mdc-form-field-required-marker)), 
+  .fs-form-label {
     &.fs-form-label-required:after {
-      content: " *";
-      white-space: pre-wrap;
+      content: "*";
+      margin-left: 1px;
     }
   }
+
+  mat-label {
+    display: inline-flex;
+  }
 
   .fs-form-wrapper.ng-invalid.ng-dirty .fs-form-label,
   .ng-invalid.ng-dirty:not(form) .fs-form-label {