Set appendTo as body by default

[mertsincan]

Most of the time users need to set it as body so let's make it default.

• AutoComplete
• Calendar
• CascadeSelect
• ColorPicker
• ContextMenu
• Dialog
• Dropdown
• Menu
• MultiSelect
• OverlayPanel
• Password
• SlideMenu
• SplitButton
• TieredMenu

[vrinceanuv]

@mertsincan hello there. So overlay has changed pretty drastically. How can one achieve the same behaviour as before? Right now I see you always, but always have to provide an appendTo valid DOM element to the OverlayPanel, which is gonna break anyone's popover everywhere. How can the previous behaviour can be achieved after this update?

The solution for everyone else who want to behave as before would be to make wrapper for this component and use it like this:

<div ref={parent}>
  <OverlayPanel appendTo={parent.current}>
      content
  </OverlayPanel>
</div>

[mertsincan]

Thanks @vrinceanuv, I added "self" value to appendTo property. You can use it. Details;
#1949

Note: In all Prime* libraries, almost all users wanted the appendTo={document.body} by default. That's why we set it as default in all of them.

Best Regards,

[mertsincan]

Hi @vrinceanuv,

Also, I added appendTo option to PrimeReact api. You can change it for all overlay components. Details; #1964
Exp;

// in App or any wrapper component
PrimeReact.appendTo = 'self'

Best Regards,

[vrinceanuv]

Thank you a lot