Flyout does not support isOverlayEnabled when isLightDismissEnabled=true

[afonso-tsx]

Problem Description

When isLightDismissEnabled=false, isOverlayEnabled darkens the background, when light dismiss is true, the background is no longer darkened, if this is by design it should be mentioned in the API.

Steps To Reproduce

const { height, width } = useWindowDimensions();

<Flyout
isLightDismissEnabled={false}
isOverlayEnabled={true}
style={{ width: width, height: height }}
verticalOffset={height / 2}
horizontalOffset={width / 2}
pointerEvents={'auto'}
>
test

Expected Results

No response

CLI version

10.2.4

Environment

System:
    OS: Windows 10 10.0.22621
    CPU: (12) x64 Intel(R) Core(TM) i7-10750H CPU @ 2.60GHz
    Memory: 3.09 GB / 15.77 GB
  Binaries:
    Node: 18.13.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - C:\Program Files\nodejs\yarn.CMD
    npm: 8.19.3 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK: Not Found
    Windows SDK:
      AllowDevelopmentWithoutDevLicense: Enabled
      AllowAllTrustedApps: Enabled
      Versions: 10.0.18362.0, 10.0.19041.0, 10.0.22000.0, 10.0.22621.0
  IDEs:
    Android Studio: AI-213.7172.25.2113.9123335
    Visual Studio: 16.11.33529.622 (Visual Studio Community 2019), 17.6.33723.286 (Visual Studio Community 2022)
  Languages:
    Java: 17.0.6 - C:\Program Files\Eclipse Adoptium\jdk-17.0.6.10-hotspot\bin\javac.EXE
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.2.0 => 18.2.0
    react-native: 0.71.11 => 0.71.11
    react-native-windows: 0.71.20 => 0.71.20
  npmGlobalPackages:
    *react-native*: Not Found

Target Platform Version

None

Target Device(s)

No response

Visual Studio Version

None

Build Configuration

None

Snack, code example, screenshot, or link to a repository

No response

[chrisglein]

Likely this is just an area for clarification in the documentation, because I'm assuming this is by design.
In WinUI if you create a modal ContentDialog, you get the darkened background. If you create a lightweight (light dismiss) Flyout, you do not.
I'm not sure how the RNW properties map through, but it makes sense this would be the behavior.

1. Need to validate this is by design
2. Need to update the docs here: https://microsoft.github.io/react-native-windows/docs/flyout-component#isoverlayenabled

[nimishmedatwal]

Hey, is this issue still open? If yes I would love to start working on it.