react-native-windows icon indicating copy to clipboard operation
react-native-windows copied to clipboard

[Fabric] Get Modal to host RN components in new hwnd

Open TatianaKapos opened this issue 1 year ago • 2 comments

Description

Adds a very basic Modal that can host UI.

Limitations:

  • Modal has a default height/width of 500px
  • Modal is still missing onDismiss/onShow events
  • Need to implement closing Modal with window's "X" button

Screenshot

Playground-composition_9AHAofhsOW

Modal in rnTester image

TatianaKapos avatar Jul 25 '24 23:07 TatianaKapos

Another question, I don't see anything in here that actually disables the outer window. So, this isn't really a modal dialog at all, but just a window? This probably needs more thought too.

We likely need some kind of notification back to the app so that they can disable any other windows that they own if they want to.

acoates-ms avatar Oct 11 '24 23:10 acoates-ms

Another question, I don't see anything in here that actually disables the outer window. So, this isn't really a modal dialog at all, but just a window? This probably needs more thought too.

We likely need some kind of notification back to the app so that they can disable any other windows that they own if they want to.

My memory from when we looked at the RN core expectations around Modal is that it's not a true modal in that sense. It's just a layering mechanism. I think for deep Win32 clients there is more we can/should do here. But for a first pass on compatibility with the cross-platform expectation... UI in another window is the bar?

chrisglein avatar Oct 12 '24 01:10 chrisglein

@acoates-ms should be ready for another review! I added some updated screenshot to the PR description and listed out some future work for Modal. Let me know what you think!

TatianaKapos avatar Oct 23 '24 20:10 TatianaKapos

For the modal sizing, I was thinking more along the lines of where we would control the size of the modal dialog window based on the size of the content within the dialog.

See m_sizeToContent in Playground-Composition.cpp. (You can turn on this mode in the settings dialog of the playground app). Having said that, it maybe that we need both options. Providing an initial size on the show modal call, and having an option to instead size the modal based on content.

We can probably hold off on doing the 2nd on for an initial checkin.

acoates-ms avatar Oct 29 '24 17:10 acoates-ms