[Feature]: Dialog - add imperative API for setting virtual parent

[YuanboXue-Amber]

Library

React Components / v9 (@fluentui/react-components)

Describe the feature that you would like added

In this example: https://codesandbox.io/s/determined-aj-h8g7vh?file=/example.tsx

PopoverSurface contains a Button that opens Dialog. Dialog is not children of PopoverSurface in the react tree, and therefore not its virtual child. So when clicking 'close' button to close Dialog, Popover closes as well. The codesandbox sets Dialog to be the virtual child of PopoverSurface by calling setVirtualParent. So when Dialog closes, Popover can remain open.

What about having a more user friendly API on Dialog that sets the virtual parent? Maybe something like:

  React.useEffect(() => {
    if (dialogOpen) {
      dialogSurfaceRef.current?.setVirtualParent(parentNode);
    }
  }, [dialogOpen]);

Have you discussed this feature with our team

No response

Additional context

Please note that this is a new feature request. Fluent v0 does not handle this out of the box either: https://codesandbox.io/s/fluent-ui-example-forked-lqde9t?file=/example.js

Validations

• [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

[layershifter]

50 cents: I am not a big fun of imperative API idea, I would prefer a declarative option more, something like:

function App() {
  const connectionRef = React.useRef();

  return (
    <>
      <PopoverSurface>
        <VirtualInheritance.Parent ref={connectionRef} />
      </PopoverSurface>
      <Dialog>
        <VirtualInheritance.Child ref={connectionRef} />
      </Dialog>
    </>
  );
}

[miroslavstastny]

Before we progress we need to better understand partners' requirements. This feature has not been requested often, let's wait for more reports.

[microsoft-github-policy-service[bot]]

Because this issue has not had activity for over 180 days, we're automatically closing it for house-keeping purposes.

Still require assistance? Please, create a new issue with up-to date details.

[microsoft-github-policy-service[bot]]

Because this issue has not had activity for over 180 days, we're automatically closing it for house-keeping purposes.

Still require assistance? Please, create a new issue with up-to date details.

[microsoft-github-policy-service[bot]]

This issue has not had activity for over 180 days! We're adding Soft close label and will close it soon for house-keeping purposes. Still require assistance? Please add comment - "keep open".

[layershifter]

unstale