Stepper step-panels not lazily rendered
Describe the bug
We recently migrated from PrimeNG v17 to PrimeNG v21.
It seems like in v21, the contents of all the p-step-panels are rendered on the stepper initialisation, while they were lazily rendered at each step activation before.
There is closed bug for v20 that was fixed, #18561, but it seems like it is still eagerly rendered in v21, which breaks our application, because there are states updates and ngInit tasks in the components of each step-panel, that depend on each other, but are now executed on the first stepper step.
I could be wrong but it could be a side effect of the eagerly rendering of the Tabs panels, which could have been applied to the Stepper as well. But the Tabs has a global [lazy]="true" flag which can be used to render each panel lazily, which the Stepper is lacking at the moment.
Expected behaviour: Add lazy input prop to Stepper.
Pull Request Link
No response
Reason for not contributing a PR
- Lack of time
- Unsure how to implement the fix/feature
- Difficulty understanding the codebase
- Other
Other Reason
No response
Reproducer
https://stackblitz.com/edit/github-pjvaqhva
Environment
Angular 21, zoneless PrimeNG 21
Angular version
21.2.4
PrimeNG version
v21
Node version
22.13
Browser(s)
Edge
Steps to reproduce the behavior
- create a Stepper with at least 2 steps,
- in each of the step-panels' template add a child component, that has a ngOnInit with console log inside.
- check the console in devTools
Expected behavior
There must be lazy input like for Tabs, to lazily render the step panels
Source: primefaces/primeng