Line up a number field without a prefix with the other fields

An empty matPrefix container still made Material reserve room for an
icon, pulling the text 12px left of every other field. The prefix is
only rendered when a pi-prefix is projected.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

libs/ui/src/lib/ui/form-field/number-field/number-field.component.html

@@ -1,9 +1,16 @@
 <mat-form-field [appearance]="appearance()" floatLabel="always">
   <mat-label><ng-content select="pi-label"></ng-content></mat-label>
 
+  <!--
+    Only when something is actually projected. An empty `matPrefix` container
+    still makes Material treat the field as having an icon prefix, which
+    reserves space and pulls the text 12px left of every other field.
+  -->
+  @if (hasPrefix()) {
     <ng-container matPrefix>
       <ng-content select="pi-prefix"></ng-content>
     </ng-container>
+  }
 
   <ng-container matSuffix>
     <ng-content select="pi-suffix"></ng-content>

libs/ui/src/lib/ui/form-field/number-field/number-field.component.ts

@@ -1,6 +1,7 @@
 import {
   ChangeDetectionStrategy,
   Component,
+  contentChild,
   HostBinding,
   Injectable,
 } from '@angular/core';
@@ -15,6 +16,7 @@ import {
 import { MatInput } from '@angular/material/input';
 import { PiAutofocusDirective } from '../directives/autofocus.directive';
 import { numericValue } from '../numeric-value';
+import { PiPrefixDirective } from '../../../util/affix/affix.directive';
 
 import { TranslatePipe } from '@ngx-translate/core';
 
@@ -40,4 +42,7 @@ export class PiNumberFieldComponent extends PiBaseFormFieldComponent<
   @HostBinding('class') className = `pi-form-field__number`;
 
   protected readonly rawValue = numericValue(this.value);
+
+  /** Whether a consumer projected a `pi-prefix`; see the template. */
+  protected readonly hasPrefix = contentChild(PiPrefixDirective);
 }