v19 poseidon form layout - p-icon-field doesn't display correctly

[turnquist1]

I am using the angular 19 version of the poseidon template. When I try to use an icon field, it doesn't display correctly.

To demonstrate the issue, I edited the formlayoutdemo.ts file to add a icon field (p-icon-field) in the first row of the "Advanced" card. The code and a screenshot are below. The field no longer aligns below the label and the icon itself is not centered vertically on the input field. Is there anything I can do to fix this issue to that the p-icon-field displays correctly?

            <div class="flex mt-8">
                <div class="card flex flex-col gap-4 w-full">
                    <div class="font-semibold text-xl">Advanced</div>
                    <div class="flex flex-col md:flex-row gap-4">
                        <div class="flex flex-wrap gap-2 w-full">
                            <label for="iconfield">Icon Field</label>
                            <p-icon-field>
                                <input type="text" id="iconfield" pInputText />
                                <p-inputicon styleClass="pi pi-search"></p-inputicon>
                            </p-icon-field>
                        </div>
                        <div class="flex flex-wrap gap-2 w-full">
                            <label for="firstname2">Firstname</label>
                            <input pInputText id="firstname2" type="text"/>
                        </div>
                        <div class="flex flex-wrap gap-2 w-full">
                            <label for="lastname2">Lastname</label>
                            <input pInputText id="lastname2" type="text"/>
                        </div>
                    </div>