Sidebar: Components z-index behind control

Describe the defect When trying to use the DatePicker or autoComplete components within the sidebar they do not work, Another problem is that when adding a form with several fields the sidebar does not create a scroll.

Environment:

• PF Version: 8.0.7
• Affected browsers: Chrome, iOS, ALL

To Reproduce Steps to reproduce the behavior:

Just add within a page the button that will call the sidebar and add the DatePicker or autoComplete components and the error will be simulated.

You can use your demo: http://www.primefaces.org:8080/showcase/ui/overlay/sidebar.xhtml

And add something like this:

Expected behavior Run all existing Primefaces components within the sidebar, in addition to creating scrolling for cases where the form is large.

Example XHTML

<p:sidebar style="width: 80em" modal="true" position="right" baseZIndex="10000"
                                  widgetVar="Test" blockScroll="true">
<h3>Test Sidebar</h3>

<p:outputLabel value="Data da emissão"/>
                                                <p:datePicker value="#"
                                                              id="idDataEmissao" locale="br" pattern="dd/MM/yyyy"/>

  <p:outputLabel value="Simple" for="@next"/>
                <p:autoComplete id="acSimple" value="#{autoCompleteView.txt1}"
                            completeMethod="#{autoCompleteView.completeText}" scrollHeight="250"/>

</p:sidebar>

[jarciano]

I prefer to work directly on the component, and it worked just by adding border: none; <p:scrollPanel mode="native" style="width:100%; height:100%; border:none;">

[melloware]

body .ui-scrollpanel {
    border: none;
}