Warning: React does not recognize the `iconPosition` prop on a DOM element. (v10.8.3)

[lekhnath]

Describe the bug

React does not recognize the iconPosition prop on a DOM element when iconPosition prop in IconField is used with AutoComplete component.

Reproducer

https://stackblitz.com/edit/vitejs-vite-o12afk

System Information

react: 18.3.1
primereact: 10.8.3
typescript: 5.6.2

Steps to reproduce the behavior

1. Go to issue reproducer link
2. Inspect the console.

Expected behavior

AutoComplete and IconField are not composable. We should be able to combine any React component with any other component seamlessly.

[melloware]

Looks like the IconField just blindly puts the iconPosition on all child elements.

<div {...rootProps} ref={elementRef}>
                {Children.map(props.children, (child, index) =>
                    cloneElement(child, {
                        iconPosition: props.iconPosition
                    })
                )}
            </div>

[Holgrabus]

To let you know, I used IconField without autocomplete and I also have the bug. It was working in v10.8.0, but not in v10.8.3

[Lerwox]

+1

[makushline]

+1 my team and I are encountering this bug as well. We were using v10.7.0 and updated to v10.8.3 and both versions have the issue, which makes me think it was not this commit https://github.com/primefaces/primereact/commit/2bc9397a2d5cf12652839f105e267e5af2390626 from @gcko.

If someone can provide some points on how to proceed I'm happy to take a stab at fixing the issue and opening a PR.

[melloware]

Well as i stated the code is right here: https://github.com/primefaces/primereact/blob/3dec07ff23191b509b3ae8f1dd65b3e7f1694b5e/components/lib/iconfield/IconField.js#L30-L40

Its blindly putting that field on ANY child not checking that its of a certain type.

[makushline]

@melloware I don't follow. We were also getting the error message while using v10.7.0, which was before the commit in August that introduced that code, which suggests that that snippet is not the culprit.

[melloware]

That code is only in two places IconField and InputIcon so its coming from one of those two spots...

[deepsweech]

Any update on this? We still have this issue on:

react: 18 primereact: 10.9.1

[Bastek333]

Still issue exist on

React 19 PrimeReact 10.9.2

[xGsManco]

I am also experiencing this issue.

• React: 19
• PrimeReact: 10.9.2
• Next.js: 15.1.7

The warning appears even after removing iconPosition from my code. Is there any update on this issue?

[melloware]

@xGsManco as you can see there is an open PR to fix it waiting on PrimeTek's review.

[SteveMugo]

@melloware , has PrimeTek managed to resolve the issue?

[melloware]

@SteveMugo no the PR is here and assigned to PrimeTek: https://github.com/primefaces/primereact/pull/7447

If you need immediate assistance from PrimeTek i would request it through your PRO account.