Fix #3302: Multiselect add overlayVisible property

[melloware]

Defect Fixes

Fix #3302: Multiselect add overlayVisible property

PrimeNG has this property

[kalinkrustev]

I think this is not a very good approach. The setTimeout here:

        React.useEffect(() => {
            setTimeout(() => {
                props.overlayVisible ? show() : hide();
            }, 100);
        }, [props.overlayVisible])

can potentially throw Can't perform a React state update on an unmounted component., as during these 100 milliseconds, the component could be unmounted. I am observing this in a Jest test, but it can potentially happen in the browser too.
While there is a solution to cancel the timeout (which will make tests more complicated), I think a better approach is to decide first about what is the purpose of props.overlayVisible. I think it should be one of these:

• it only controls the initial visibility of the overlay, in which case the setTimeout may not be needed
• it controls the visibility and it should not be stored in the local state, but instead a new property onOverlayVisibleChange (or other name) should be provided, so that the parent component can take the full responsibility of this state.

The current situation is halfway between the above and seems incorrect.

[melloware]

@kalinkrustev the original use case was they wanted to have the panel open on render. so if overlayVisible={true} the overlay is displayed on render. However because of how the overlay positioning works the overlay is not in the right position and that is why the 100ms delay to allow the component to render and then position the overlay properly.

If you have a better solution a PR is welcome.

[kalinkrustev]

So we aim for the initial visibility case? This should be reflected in the docs.

[melloware]

Yes for initial visibility.