bug(form-field): form field prefix in overlay

[adumitrescu-plenty]

Is this a regression?

• [ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

The issue is about the missing padding for the label when using a form field inside an overlay with ng-content. It can be easily reproduced in stackblitz, I will provide a link where it can be seen how is misbehaving. Without ng-content, everything works fine.

Reproduction

StackBlitz link: Steps to reproduce:

1. click on open

https://stackblitz.com/edit/ipwssz-9pucs5?file=src%2Fexample%2Fcdk-overlay-basic-example.html

Expected Behavior

The label should be positioned after the prefix.

Actual Behavior

The label transition is not working properly.

Environment

 _                      _                 ____ _     ___
/ \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|

/ △ \ | '_ \ / | | | | |/ _ | '__| | | | | | | / ___ | | | | (| | || | | (| | | | || | | | // __| ||_, |_,||_,|| _||| |___/

Angular CLI: 17.3.0 Node: 18.18.0 Package Manager: yarn 1.22.19 OS: linux x64

Angular: 17.3.0 ... animations, cli, common, compiler, compiler-cli, core, forms ... localize, platform-browser, platform-browser-dynamic, router

Package Version

@angular-devkit/architect 0.1703.0 @angular-devkit/build-angular 17.3.0 @angular-devkit/core 17.3.0 @angular-devkit/schematics 17.3.0 @angular/cdk 17.3.6 @angular/material 17.3.6 @angular/material-experimental 17.3.6 @angular/material-moment-adapter 17.3.6 @schematics/angular 17.3.0 rxjs 7.4.0 typescript 5.4.2 zone.js 0.14.0