react-native-windows 0.76.0-preview.3 → 0.76.0-preview.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/Libraries/Components/AccessibilityInfo/AccessibilityInfo.windows.js +15 -15
  2. package/Libraries/Components/Button.windows.js +18 -18
  3. package/Libraries/Components/Flyout/FlyoutNativeComponent.js +5 -1
  4. package/Libraries/Components/Keyboard/KeyboardExt.js +1 -1
  5. package/Libraries/Components/Keyboard/KeyboardExt.js.map +1 -1
  6. package/Libraries/Components/TextInput/TextInput.windows.js +16 -11
  7. package/Libraries/Components/Touchable/Touchable.windows.js +2 -2
  8. package/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js +5 -3
  9. package/Libraries/Components/View/View.windows.js +1 -3
  10. package/Libraries/Text/Text.windows.js +13 -9
  11. package/Libraries/Utilities/Platform.windows.js +4 -4
  12. package/Microsoft.ReactNative/ReactNativeAppBuilder.cpp +25 -129
  13. package/Microsoft.ReactNative/ReactNativeAppBuilder.h +5 -13
  14. package/Microsoft.ReactNative/ReactNativeAppBuilder.idl +13 -34
  15. package/Microsoft.ReactNative/ReactNativeWin32App.cpp +129 -18
  16. package/Microsoft.ReactNative/ReactNativeWin32App.h +14 -5
  17. package/PropertySheets/External/Microsoft.ReactNative.CppLib.props +17 -0
  18. package/PropertySheets/External/Microsoft.ReactNative.CppLib.targets +17 -0
  19. package/PropertySheets/Generated/PackageVersion.g.props +2 -2
  20. package/PropertySheets/WebView2.props +7 -0
  21. package/PropertySheets/WinUI.props +1 -1
  22. package/Shared/Shared.vcxitems +0 -10
  23. package/just-task.js +1 -1
  24. package/package.json +4 -5
  25. package/templates/cpp-app/template.config.js +8 -3
  26. package/templates/cpp-app/windows/MyApp/MyApp.cpp +46 -131
  27. package/templates/cpp-lib/template.config.js +8 -3
  28. package/templates/cpp-lib/windows/MyLib/MyLib.vcxproj +4 -4
  29. package/templates/templateUtils.js +2 -3
  30. package/Microsoft.ReactNative/ReactInstanceSettingsBuilder.cpp +0 -59
  31. package/Microsoft.ReactNative/ReactInstanceSettingsBuilder.h +0 -23
@@ -55,21 +55,21 @@ const EventNames: Map<
55
55
  ['accessibilityServiceChanged', 'accessibilityServiceDidChange'],
56
56
  ])
57
57
  : Platform.OS === 'windows'
58
- ? new Map([
59
- ['change', 'TOUCH_EXPLORATION_EVENT'],
60
- ['reduceMotionChanged', 'REDUCE_MOTION_EVENT'],
61
- ['screenReaderChanged', 'TOUCH_EXPLORATION_EVENT'],
62
- ])
63
- : new Map([
64
- ['announcementFinished', 'announcementFinished'],
65
- ['boldTextChanged', 'boldTextChanged'],
66
- ['change', 'screenReaderChanged'],
67
- ['grayscaleChanged', 'grayscaleChanged'],
68
- ['invertColorsChanged', 'invertColorsChanged'],
69
- ['reduceMotionChanged', 'reduceMotionChanged'],
70
- ['reduceTransparencyChanged', 'reduceTransparencyChanged'],
71
- ['screenReaderChanged', 'screenReaderChanged'],
72
- ]);
58
+ ? new Map([
59
+ ['change', 'TOUCH_EXPLORATION_EVENT'],
60
+ ['reduceMotionChanged', 'REDUCE_MOTION_EVENT'],
61
+ ['screenReaderChanged', 'TOUCH_EXPLORATION_EVENT'],
62
+ ])
63
+ : new Map([
64
+ ['announcementFinished', 'announcementFinished'],
65
+ ['boldTextChanged', 'boldTextChanged'],
66
+ ['change', 'screenReaderChanged'],
67
+ ['grayscaleChanged', 'grayscaleChanged'],
68
+ ['invertColorsChanged', 'invertColorsChanged'],
69
+ ['reduceMotionChanged', 'reduceMotionChanged'],
70
+ ['reduceTransparencyChanged', 'reduceTransparencyChanged'],
71
+ ['screenReaderChanged', 'screenReaderChanged'],
72
+ ]);
73
73
 
74
74
  /**
75
75
  * Sometimes it's useful to know whether or not the device has a screen reader
@@ -407,10 +407,10 @@ const Button: React.AbstractComponent<
407
407
  color
408
408
  ? {borderRadius: 3}
409
409
  : pressed
410
- ? [buttonStyles, styles.buttonPressed]
411
- : hover
412
- ? [buttonStyles, styles.buttonHover]
413
- : buttonStyles
410
+ ? [buttonStyles, styles.buttonPressed]
411
+ : hover
412
+ ? [buttonStyles, styles.buttonHover]
413
+ : buttonStyles
414
414
  }
415
415
  onMouseEnter={() => {
416
416
  if (!disabled) setHover(true);
@@ -445,20 +445,20 @@ const Button: React.AbstractComponent<
445
445
  color
446
446
  ? textStyles
447
447
  : pressed
448
- ? [
449
- textStyles,
450
- {
451
- color: PlatformColor('ButtonForegroundPressed'),
452
- },
453
- ]
454
- : hover
455
- ? [
456
- textStyles,
457
- {
458
- color: PlatformColor('ButtonForegroundPointerOver'),
459
- },
460
- ]
461
- : textStyles
448
+ ? [
449
+ textStyles,
450
+ {
451
+ color: PlatformColor('ButtonForegroundPressed'),
452
+ },
453
+ ]
454
+ : hover
455
+ ? [
456
+ textStyles,
457
+ {
458
+ color: PlatformColor('ButtonForegroundPointerOver'),
459
+ },
460
+ ]
461
+ : textStyles
462
462
  }
463
463
  disabled={disabled}>
464
464
  {formattedTitle}
@@ -7,7 +7,11 @@
7
7
 
8
8
  import type {ViewProps} from 'react-native/Libraries/Components/View/ViewPropTypes';
9
9
  import type {HostComponent} from 'react-native/Libraries/Renderer/shims/ReactNativeTypes';
10
- import type {DirectEventHandler, Double, Int32} from 'react-native/Libraries/Types/CodegenTypes';
10
+ import type {
11
+ DirectEventHandler,
12
+ Double,
13
+ Int32,
14
+ } from 'react-native/Libraries/Types/CodegenTypes';
11
15
 
12
16
  import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
13
17
 
@@ -17,7 +17,7 @@ const supportKeyboard = (WrappedComponent) => {
17
17
  class SupportKeyboard extends react_1.default.Component {
18
18
  render() {
19
19
  const { forwardedRef, ...rest } = this.props;
20
- return react_1.default.createElement(WrappedComponent, { ref: forwardedRef, ...rest });
20
+ return (react_1.default.createElement(WrappedComponent, { ref: forwardedRef, ...rest }));
21
21
  }
22
22
  }
23
23
  return react_1.default.forwardRef((props, ref) => {
@@ -1 +1 @@
1
- {"version":3,"file":"KeyboardExt.js","sourceRoot":"","sources":["../../../src-win/Libraries/Components/Keyboard/KeyboardExt.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,YAAY,CAAC;;;;;;AAEb,kDAA0B;AAG1B;;GAEG;AACI,MAAM,eAAe,GAAG,CAC7B,gBAAwC,EACxC,EAAE;IAUF,MAAM,eAAgB,SAAQ,eAAK,CAAC,SAAgC;QAC3D,MAAM;YACX,MAAM,EAAC,YAAY,EAAE,GAAG,IAAI,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;YAC3C,OAAO,8BAAC,gBAAgB,IAAC,GAAG,EAAE,YAAY,KAAO,IAAqB,GAAI,CAAC;QAC7E,CAAC;KACF;IAED,OAAO,eAAK,CAAC,UAAU,CACrB,CAAC,KAAsD,EAAE,GAAmB,EAAE,EAAE;QAC9E,OAAO,8BAAC,eAAe,OAAK,KAAK,EAAE,YAAY,EAAE,GAAG,GAAI,CAAC;IAC3D,CAAC,CACF,CAAC;AACJ,CAAC,CAAC;AAxBW,QAAA,eAAe,mBAwB1B","sourcesContent":["/**\n * Copyright (c) Microsoft Corporation.\n * Licensed under the MIT License.\n * @format\n */\n'use strict';\n\nimport React from 'react';\nimport {IKeyboardProps} from './KeyboardExtProps';\n\n/**\n * @deprecated - Exported types should already have the keyboarding properties on them\n */\nexport const supportKeyboard = <P extends Record<string, any>>(\n WrappedComponent: React.ComponentType<P>,\n) => {\n interface IForwardRefProps {\n forwardedRef: React.Ref<any>;\n }\n\n // children is used to avoid error: Property 'children' does not exist on type 'IntrinsicAttributes & ViewProps &\n // IKeyboardProps & RefAttributes<any>\n type PropsWithoutForwardedRef = P & React.PropsWithChildren<IKeyboardProps>;\n type PropsWithForwardedRef = React.PropsWithoutRef<PropsWithoutForwardedRef> & IForwardRefProps;\n\n class SupportKeyboard extends React.Component<PropsWithForwardedRef> {\n public render(): JSX.Element {\n const {forwardedRef, ...rest} = this.props;\n return <WrappedComponent ref={forwardedRef} {...(rest as unknown as P)} />;\n }\n }\n\n return React.forwardRef(\n (props: React.PropsWithoutRef<PropsWithoutForwardedRef>, ref: React.Ref<any>) => {\n return <SupportKeyboard {...props} forwardedRef={ref} />;\n },\n );\n};\n"]}
1
+ {"version":3,"file":"KeyboardExt.js","sourceRoot":"","sources":["../../../src-win/Libraries/Components/Keyboard/KeyboardExt.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,YAAY,CAAC;;;;;;AAEb,kDAA0B;AAG1B;;GAEG;AACI,MAAM,eAAe,GAAG,CAC7B,gBAAwC,EACxC,EAAE;IAWF,MAAM,eAAgB,SAAQ,eAAK,CAAC,SAAgC;QAC3D,MAAM;YACX,MAAM,EAAC,YAAY,EAAE,GAAG,IAAI,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;YAC3C,OAAO,CACL,8BAAC,gBAAgB,IAAC,GAAG,EAAE,YAAY,KAAO,IAAqB,GAAI,CACpE,CAAC;QACJ,CAAC;KACF;IAED,OAAO,eAAK,CAAC,UAAU,CACrB,CACE,KAAsD,EACtD,GAAmB,EACnB,EAAE;QACF,OAAO,8BAAC,eAAe,OAAK,KAAK,EAAE,YAAY,EAAE,GAAG,GAAI,CAAC;IAC3D,CAAC,CACF,CAAC;AACJ,CAAC,CAAC;AA9BW,QAAA,eAAe,mBA8B1B","sourcesContent":["/**\n * Copyright (c) Microsoft Corporation.\n * Licensed under the MIT License.\n * @format\n */\n'use strict';\n\nimport React from 'react';\nimport {IKeyboardProps} from './KeyboardExtProps';\n\n/**\n * @deprecated - Exported types should already have the keyboarding properties on them\n */\nexport const supportKeyboard = <P extends Record<string, any>>(\n WrappedComponent: React.ComponentType<P>,\n) => {\n interface IForwardRefProps {\n forwardedRef: React.Ref<any>;\n }\n\n // children is used to avoid error: Property 'children' does not exist on type 'IntrinsicAttributes & ViewProps &\n // IKeyboardProps & RefAttributes<any>\n type PropsWithoutForwardedRef = P & React.PropsWithChildren<IKeyboardProps>;\n type PropsWithForwardedRef = React.PropsWithoutRef<PropsWithoutForwardedRef> &\n IForwardRefProps;\n\n class SupportKeyboard extends React.Component<PropsWithForwardedRef> {\n public render(): JSX.Element {\n const {forwardedRef, ...rest} = this.props;\n return (\n <WrappedComponent ref={forwardedRef} {...(rest as unknown as P)} />\n );\n }\n }\n\n return React.forwardRef(\n (\n props: React.PropsWithoutRef<PropsWithoutForwardedRef>,\n ref: React.Ref<any>,\n ) => {\n return <SupportKeyboard {...props} forwardedRef={ref} />;\n },\n );\n};\n"]}
@@ -1360,11 +1360,12 @@ function InternalTextInput(props: Props): React.Node {
1360
1360
  typeof props.value === 'string'
1361
1361
  ? props.value
1362
1362
  : typeof props.defaultValue === 'string'
1363
- ? props.defaultValue
1364
- : '';
1363
+ ? props.defaultValue
1364
+ : '';
1365
1365
 
1366
1366
  const viewCommands =
1367
- WindowsTextInputCommands || AndroidTextInputCommands || // [Windows]
1367
+ WindowsTextInputCommands ||
1368
+ AndroidTextInputCommands || // [Windows]
1368
1369
  (props.multiline === true
1369
1370
  ? RCTMultilineTextInputNativeCommands
1370
1371
  : RCTSinglelineTextInputNativeCommands);
@@ -1442,8 +1443,12 @@ function InternalTextInput(props: Props): React.Node {
1442
1443
  }
1443
1444
  },
1444
1445
  isFocused(): boolean {
1445
- const currentlyFocusedInput = TextInputState.currentlyFocusedInput();
1446
- return currentlyFocusedInput !== null && currentlyFocusedInput === inputRef.current;
1446
+ const currentlyFocusedInput =
1447
+ TextInputState.currentlyFocusedInput();
1448
+ return (
1449
+ currentlyFocusedInput !== null &&
1450
+ currentlyFocusedInput === inputRef.current
1451
+ );
1447
1452
  },
1448
1453
  getNativeRef(): ?React.ElementRef<HostComponent<mixed>> {
1449
1454
  return inputRef.current;
@@ -1998,12 +2003,12 @@ const ExportedForwardRef: React.AbstractComponent<
1998
2003
  textContentType != null
1999
2004
  ? textContentType
2000
2005
  : Platform.OS === 'ios' &&
2001
- autoComplete &&
2002
- autoComplete in autoCompleteWebToTextContentTypeMap
2003
- ? // $FlowFixMe[invalid-computed-prop]
2004
- // $FlowFixMe[prop-missing]
2005
- autoCompleteWebToTextContentTypeMap[autoComplete]
2006
- : textContentType
2006
+ autoComplete &&
2007
+ autoComplete in autoCompleteWebToTextContentTypeMap
2008
+ ? // $FlowFixMe[invalid-computed-prop]
2009
+ // $FlowFixMe[prop-missing]
2010
+ autoCompleteWebToTextContentTypeMap[autoComplete]
2011
+ : textContentType
2007
2012
  }
2008
2013
  {...restProps}
2009
2014
  forwardedRef={forwardedRef}
@@ -45,8 +45,8 @@ const extractSingleTouch = (nativeEvent: {
45
45
  return !hasTouches && hasChangedTouches
46
46
  ? changedTouches[0]
47
47
  : hasTouches
48
- ? touches[0]
49
- : nativeEvent;
48
+ ? touches[0]
49
+ : nativeEvent;
50
50
  };
51
51
 
52
52
  /**
@@ -131,7 +131,10 @@ const PASSTHROUGH_PROPS = [
131
131
  const TouchableWithoutFeedback: React.AbstractComponent<
132
132
  Props,
133
133
  React.ElementRef<typeof Animated.View>,
134
- > = React.forwardRef(function TouchableWithoutFeedback(props: Props, ref): React.Node {
134
+ > = React.forwardRef(function TouchableWithoutFeedback(
135
+ props: Props,
136
+ ref,
137
+ ): React.Node {
135
138
  const {
136
139
  disabled,
137
140
  rejectResponderTermination,
@@ -153,7 +156,6 @@ const TouchableWithoutFeedback: React.AbstractComponent<
153
156
  onMouseLeave, // [Windows]
154
157
  } = props;
155
158
 
156
-
157
159
  const pressabilityConfig = useMemo(
158
160
  () => ({
159
161
  cancelable: !rejectResponderTermination,
@@ -262,4 +264,4 @@ const TouchableWithoutFeedback: React.AbstractComponent<
262
264
  return React.cloneElement(element, {...elementProps, ref}, ...children);
263
265
  });
264
266
 
265
- module.exports = TouchableWithoutFeedback;
267
+ module.exports = TouchableWithoutFeedback;
@@ -33,9 +33,7 @@ const childrenWithImportantForAccessibility = children => {
33
33
  // $FlowFixMe[incompatible-call]
34
34
  return React.cloneElement(child, {
35
35
  accessible: false,
36
- children: childrenWithImportantForAccessibility(
37
- child.props.children,
38
- ),
36
+ children: childrenWithImportantForAccessibility(child.props.children),
39
37
  });
40
38
  } else {
41
39
  // $FlowFixMe[incompatible-call]
@@ -329,9 +329,9 @@ const Text: React.AbstractComponent<TextProps, TextForwardRef> =
329
329
  styleProps.borderTopWidth != null)
330
330
  ) {
331
331
  let textStyleProps = Array.isArray(styleProps)
332
- ? // $FlowFixMe[underconstrained-implicit-instantiation]
333
- flattenStyle(styleProps)
334
- : styleProps;
332
+ ? // $FlowFixMe[underconstrained-implicit-instantiation]
333
+ flattenStyle(styleProps)
334
+ : styleProps;
335
335
  let {
336
336
  // $FlowFixMe[prop-missing]
337
337
  margin,
@@ -371,11 +371,15 @@ const Text: React.AbstractComponent<TextProps, TextForwardRef> =
371
371
  paddingVertical,
372
372
  // $FlowFixMe[not-an-object]
373
373
  ...rest
374
- } = textStyleProps != null ? textStyleProps : {}
375
- return (
376
- <View style={styleProps}><TextAncestor.Provider value={true}>{nativeText}</TextAncestor.Provider></View>
377
- );
378
- };
374
+ } = textStyleProps != null ? textStyleProps : {};
375
+ return (
376
+ <View style={styleProps}>
377
+ <TextAncestor.Provider value={true}>
378
+ {nativeText}
379
+ </TextAncestor.Provider>
380
+ </View>
381
+ );
382
+ }
379
383
  // Windows]
380
384
 
381
385
  if (children == null) {
@@ -617,4 +621,4 @@ const verticalAlignToTextAlignVerticalMap = {
617
621
  middle: 'center',
618
622
  };
619
623
 
620
- module.exports = Text;
624
+ module.exports = Text;
@@ -70,10 +70,10 @@ const Platform: PlatformType = {
70
70
  ? // $FlowFixMe[incompatible-return]
71
71
  spec.windows
72
72
  : 'native' in spec
73
- ? // $FlowFixMe[incompatible-return]
74
- spec.native
75
- : // $FlowFixMe[incompatible-return]
76
- spec.default,
73
+ ? // $FlowFixMe[incompatible-return]
74
+ spec.native
75
+ : // $FlowFixMe[incompatible-return]
76
+ spec.default,
77
77
  };
78
78
 
79
79
  module.exports = Platform;
@@ -1,43 +1,17 @@
1
+ // Copyright (c) Microsoft Corporation.
2
+ // Licensed under the MIT License.
3
+
1
4
  #include "pch.h"
2
5
  #include "ReactNativeAppBuilder.h"
3
6
  #include "ReactNativeAppBuilder.g.cpp"
4
- #include "IReactDispatcher.h"
5
- #include "ReactNativeHost.h"
7
+
6
8
  #include "ReactNativeWin32App.h"
9
+
10
+ #include "winrt/Microsoft.ReactNative.h"
7
11
  #include "winrt/Microsoft.UI.Composition.h"
8
12
  #include "winrt/Microsoft.UI.Dispatching.h"
13
+ #include "winrt/Microsoft.UI.Interop.h"
9
14
  #include "winrt/Microsoft.UI.Windowing.h"
10
- #include "winrt/microsoft.UI.Interop.h"
11
-
12
- // Scaling factor for the window's content based on the DPI of the display where the window is located.
13
- float ScaleFactor(HWND hwnd) noexcept {
14
- return GetDpiForWindow(hwnd) / static_cast<float>(USER_DEFAULT_SCREEN_DPI);
15
- }
16
-
17
- void UpdateRootViewSizeToAppWindow(
18
- winrt::Microsoft::ReactNative::ReactNativeIsland const &rootView,
19
- winrt::Microsoft::UI::Windowing::AppWindow const &window) {
20
- auto hwnd = winrt::Microsoft::UI::GetWindowFromWindowId(window.Id());
21
- auto scaleFactor = ScaleFactor(hwnd);
22
- winrt::Windows::Foundation::Size size{
23
- window.ClientSize().Width / scaleFactor, window.ClientSize().Height / scaleFactor};
24
- // Do not relayout when minimized
25
- if (window.Presenter().as<winrt::Microsoft::UI::Windowing::OverlappedPresenter>().State() !=
26
- winrt::Microsoft::UI::Windowing::OverlappedPresenterState::Minimized) {
27
- winrt::Microsoft::ReactNative::LayoutConstraints constraints;
28
- constraints.LayoutDirection = winrt::Microsoft::ReactNative::LayoutDirection::Undefined;
29
- constraints.MaximumSize = constraints.MinimumSize = size;
30
- rootView.Arrange(constraints, {0, 0});
31
- }
32
- }
33
-
34
- namespace winrt::ReactNative {
35
- using namespace winrt::Microsoft::ReactNative;
36
- }
37
-
38
- namespace winrt::UI {
39
- using namespace winrt::Microsoft::UI;
40
- }
41
15
 
42
16
  namespace winrt::Microsoft::ReactNative::implementation {
43
17
  ReactNativeAppBuilder::ReactNativeAppBuilder() {
@@ -46,133 +20,55 @@ ReactNativeAppBuilder::ReactNativeAppBuilder() {
46
20
 
47
21
  ReactNativeAppBuilder::~ReactNativeAppBuilder() {}
48
22
 
49
- winrt::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::AddPackageProviders(
50
- winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const
51
- &packageProviders) {
52
- for (auto const &provider : packageProviders) {
53
- m_reactNativeWin32App.ReactNativeHost().PackageProviders().Append(provider);
54
- }
55
-
56
- return *this;
57
- }
58
-
59
- winrt::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetReactInstanceSettings(
60
- winrt::Microsoft::ReactNative::ReactInstanceSettings const &settings) {
61
- m_reactNativeWin32App.ReactNativeHost().InstanceSettings(settings);
62
-
23
+ winrt::Microsoft::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetDispatcherQueueController(
24
+ winrt::Microsoft::UI::Dispatching::DispatcherQueueController const &dispatcherQueueController) {
25
+ m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->DispatcherQueueController(
26
+ dispatcherQueueController);
63
27
  return *this;
64
28
  }
65
29
 
66
- winrt::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetCompositor(
30
+ winrt::Microsoft::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetCompositor(
67
31
  winrt::Microsoft::UI::Composition::Compositor const &compositor) {
68
32
  m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->Compositor(compositor);
69
33
  return *this;
70
34
  }
71
35
 
72
- winrt::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetAppWindow(
36
+ winrt::Microsoft::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetAppWindow(
73
37
  winrt::Microsoft::UI::Windowing::AppWindow const &appWindow) {
74
38
  m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->AppWindow(appWindow);
75
39
 
76
40
  return *this;
77
41
  }
78
42
 
79
- winrt::Microsoft::ReactNative::ReactNativeAppBuilder ReactNativeAppBuilder::SetReactViewOptions(
80
- winrt::Microsoft::ReactNative::ReactViewOptions const &reactViewOptions) {
81
- m_reactViewOptions = reactViewOptions;
43
+ winrt::Microsoft::ReactNative::ReactNativeWin32App ReactNativeAppBuilder::Build() {
44
+ // Create the DispatcherQueueController if the app developer doesn't provide one
45
+ if (m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->DispatcherQueueController() == nullptr) {
46
+ assert(m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->Compositor() == nullptr);
82
47
 
83
- return *this;
84
- }
85
-
86
- winrt::ReactNative::ReactNativeWin32App ReactNativeAppBuilder::Build() {
87
- if (m_reactNativeWin32App.Compositor() == nullptr) {
88
- // Create a DispatcherQueue for this thread. This is needed for Composition, Content, and
89
- // Input APIs.
48
+ // Create a DispatcherQueue for this thread. This is needed for Composition, Content, and Input APIs.
90
49
  auto dispatcherQueueController =
91
50
  winrt::Microsoft::UI::Dispatching::DispatcherQueueController::CreateOnCurrentThread();
92
51
 
93
- m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->DispatchQueueController(
52
+ m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->DispatcherQueueController(
94
53
  dispatcherQueueController);
54
+ }
95
55
 
96
- // Create the compositor on behalf of the App Developer
56
+ // Create the Compositor if the app developer doesn't provide one
57
+ if (m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->Compositor() == nullptr) {
58
+ // Create the compositor on behalf of the App Developer.
97
59
  auto compositor = winrt::Microsoft::UI::Composition::Compositor();
98
60
  m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->Compositor(compositor);
99
61
  }
100
62
 
101
- // Create the AppWindow if the developer doesn't provide one
63
+ // Create the AppWindow if the app developer doesn't provide one
102
64
  if (m_reactNativeWin32App.AppWindow() == nullptr) {
103
65
  auto appWindow = winrt::Microsoft::UI::Windowing::AppWindow::Create();
104
- appWindow.Title(L"SampleApplication");
66
+ appWindow.Title(L"ReactNativeWin32App");
105
67
  appWindow.Resize({1000, 1000});
106
- appWindow.Show();
107
68
 
108
69
  m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->AppWindow(appWindow);
109
70
  }
110
71
 
111
- // Currently set the property to use current thread dispatcher as a default UI dispatcher.
112
- // TODO: Provision for setting dispatcher based on the thread dispatcherQueueController is created.
113
- m_reactNativeWin32App.ReactNativeHost().InstanceSettings().Properties().Set(
114
- ReactDispatcherHelper::UIDispatcherProperty(), ReactDispatcherHelper::UIThreadDispatcher());
115
-
116
- auto hwnd{winrt::UI::GetWindowFromWindowId(m_reactNativeWin32App.AppWindow().Id())};
117
-
118
- winrt::ReactNative::ReactCoreInjection::SetTopLevelWindowId(
119
- m_reactNativeWin32App.ReactNativeHost().InstanceSettings().Properties(), reinterpret_cast<uint64_t>(hwnd));
120
-
121
- winrt::ReactNative::Composition::CompositionUIService::SetCompositor(
122
- m_reactNativeWin32App.ReactNativeHost().InstanceSettings(), m_reactNativeWin32App.Compositor());
123
-
124
- // Start the react-native instance, which will create a JavaScript runtime and load the applications bundle.
125
- m_reactNativeWin32App.ReactNativeHost().ReloadInstance();
126
-
127
- // Create a RootView which will present a react-native component
128
- auto reactNativeIsland = winrt::Microsoft::ReactNative::ReactNativeIsland(m_reactNativeWin32App.Compositor());
129
- reactNativeIsland.ReactViewHost(winrt::Microsoft::ReactNative::ReactCoreInjection::MakeViewHost(
130
- m_reactNativeWin32App.ReactNativeHost(), m_reactViewOptions));
131
-
132
- m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->ReactNativeIsland(
133
- std::move(reactNativeIsland));
134
-
135
- // Update the size of the RootView when the AppWindow changes size
136
- m_reactNativeWin32App.AppWindow().Changed(
137
- [wkRootView = winrt::make_weak(m_reactNativeWin32App.ReactNativeIsland())](
138
- winrt::Microsoft::UI::Windowing::AppWindow const &window,
139
- winrt::Microsoft::UI::Windowing::AppWindowChangedEventArgs const &args) {
140
- if (args.DidSizeChange() || args.DidVisibilityChange()) {
141
- if (auto rootView = wkRootView.get()) {
142
- UpdateRootViewSizeToAppWindow(rootView, window);
143
- }
144
- }
145
- });
146
-
147
- // Quit application when main window is closed
148
- m_reactNativeWin32App.AppWindow().Destroying([this](
149
- winrt::Microsoft::UI::Windowing::AppWindow const &window,
150
- winrt::Windows::Foundation::IInspectable const & /*args*/) {
151
- // Before we shutdown the application - unload the ReactNativeHost to give the javascript a chance to save any
152
- // state
153
- auto async = m_reactNativeWin32App.ReactNativeHost().UnloadInstance();
154
- async.Completed([this](auto asyncInfo, winrt::Windows::Foundation::AsyncStatus asyncStatus) {
155
- assert(asyncStatus == winrt::Windows::Foundation::AsyncStatus::Completed);
156
- m_reactNativeWin32App.ReactNativeHost().InstanceSettings().UIDispatcher().Post([]() { PostQuitMessage(0); });
157
- });
158
- });
159
-
160
- // DesktopChildSiteBridge create a ContentSite that can host the RootView ContentIsland
161
- auto desktopChildSiteBridge = winrt::Microsoft::UI::Content::DesktopChildSiteBridge::Create(
162
- m_reactNativeWin32App.Compositor(), m_reactNativeWin32App.AppWindow().Id());
163
-
164
- desktopChildSiteBridge.Connect(m_reactNativeWin32App.ReactNativeIsland().Island());
165
-
166
- desktopChildSiteBridge.ResizePolicy(winrt::Microsoft::UI::Content::ContentSizePolicy::ResizeContentToParentWindow);
167
-
168
- auto scaleFactor = ScaleFactor(hwnd);
169
- m_reactNativeWin32App.ReactNativeIsland().ScaleFactor(scaleFactor);
170
-
171
- UpdateRootViewSizeToAppWindow(reactNativeIsland, m_reactNativeWin32App.AppWindow());
172
-
173
- m_reactNativeWin32App.as<implementation::ReactNativeWin32App>().get()->DesktopChildSiteBridge(
174
- std::move(desktopChildSiteBridge));
175
-
176
72
  return m_reactNativeWin32App;
177
73
  }
178
74
 
@@ -1,6 +1,8 @@
1
+ // Copyright (c) Microsoft Corporation.
2
+ // Licensed under the MIT License.
1
3
  #pragma once
4
+
2
5
  #include "ReactNativeAppBuilder.g.h"
3
- #include <winrt/Microsoft.UI.Content.h>
4
6
 
5
7
  namespace winrt::Microsoft::ReactNative::implementation {
6
8
  struct ReactNativeAppBuilder : ReactNativeAppBuilderT<ReactNativeAppBuilder> {
@@ -8,25 +10,15 @@ struct ReactNativeAppBuilder : ReactNativeAppBuilderT<ReactNativeAppBuilder> {
8
10
 
9
11
  ~ReactNativeAppBuilder();
10
12
 
11
- winrt::Microsoft::ReactNative::ReactNativeAppBuilder AddPackageProviders(
12
- winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const
13
- &packageProviders);
14
- winrt::Microsoft::ReactNative::ReactNativeAppBuilder SetReactInstanceSettings(
15
- winrt::Microsoft::ReactNative::ReactInstanceSettings const &settings);
16
-
17
- // TODO: Currently, SetCompositor API is not exposed to the developer.
18
- // Compositor depends on the DispatcherQueue created by DispatcherQueueController on a current thread
19
- // or dedicated thread. So we also have to make a provision for setting DispatcherQueueController.
13
+ winrt::Microsoft::ReactNative::ReactNativeAppBuilder SetDispatcherQueueController(
14
+ winrt::Microsoft::UI::Dispatching::DispatcherQueueController const &dispatcherQueueController);
20
15
  winrt::Microsoft::ReactNative::ReactNativeAppBuilder SetCompositor(
21
16
  winrt::Microsoft::UI::Composition::Compositor const &compositor);
22
17
  winrt::Microsoft::ReactNative::ReactNativeAppBuilder SetAppWindow(
23
18
  winrt::Microsoft::UI::Windowing::AppWindow const &appWindow);
24
- winrt::Microsoft::ReactNative::ReactNativeAppBuilder SetReactViewOptions(
25
- winrt::Microsoft::ReactNative::ReactViewOptions const &reactViewOptions);
26
19
  winrt::Microsoft::ReactNative::ReactNativeWin32App Build();
27
20
 
28
21
  private:
29
- winrt::Microsoft::ReactNative::ReactViewOptions m_reactViewOptions{};
30
22
  winrt::Microsoft::ReactNative::ReactNativeWin32App m_reactNativeWin32App{nullptr};
31
23
  };
32
24
  } // namespace winrt::Microsoft::ReactNative::implementation
@@ -9,60 +9,39 @@ import "IReactPackageProvider.idl";
9
9
  namespace Microsoft.ReactNative {
10
10
 
11
11
  [experimental]
12
- DOC_STRING("ReactNativeWin32App is used to manage resources appropriately to be able to host ReactNative component in a contentIsland.")
12
+ DOC_STRING("ReactNativeWin32App sets up the infrastructure for the default experience of a ReactNative application filling a WinAppSDK window.")
13
13
  runtimeclass ReactNativeWin32App {
14
14
  // Properties
15
15
  Microsoft.UI.Windowing.AppWindow AppWindow {get;};
16
16
 
17
- Microsoft.UI.Composition.Compositor Compositor {get;};
18
-
19
- Microsoft.UI.Content.DesktopChildSiteBridge DesktopChildSiteBridge {get;};
20
-
21
17
  ReactNativeHost ReactNativeHost {get;};
22
18
 
23
- ReactNativeIsland ReactNativeIsland {get;};
19
+ ReactViewOptions ReactViewOptions {get;};
20
+
21
+ // TODO: Hide these APIs for now until we're sure we need to expose them and can do so safely
22
+ // Microsoft.UI.Composition.Compositor Compositor {get;};
23
+ // Microsoft.UI.Content.DesktopChildSiteBridge DesktopChildSiteBridge {get;};
24
+ // Microsoft.UI.Dispatching DispatcherQueueController {get;};
25
+ // ReactNativeIsland ReactNativeIsland {get;};
24
26
 
25
27
  // Methods
26
28
  void Start();
27
29
  }
28
30
 
29
31
  [experimental]
30
- DOC_STRING("This is the builder for creating ReactInstanceSettings.")
31
- runtimeclass ReactInstanceSettingsBuilder
32
- {
33
- ReactInstanceSettingsBuilder();
34
-
35
- // Properties
36
- ReactInstanceSettings ReactInstanceSettings {get;};
37
-
38
- // Methods
39
- ReactInstanceSettingsBuilder UseDirectDebugger(Boolean state);
40
-
41
- ReactInstanceSettingsBuilder UseDeveloperSupport(Boolean state);
42
-
43
- ReactInstanceSettingsBuilder BundleRootPath(String path);
44
-
45
- ReactInstanceSettingsBuilder DebugBundlePath(String path);
46
-
47
- ReactInstanceSettingsBuilder JavaScriptBundleFile(String file);
48
-
49
- ReactInstanceSettingsBuilder UseFastRefresh(Boolean state);
50
- }
51
-
52
- [experimental]
53
- DOC_STRING("ReactNativeAppBuilder initializes all the required infrastructure for a Win32 Fabric Application.")
32
+ DOC_STRING("ReactNativeAppBuilder builds a ReactNativeWin32App with the base WinAppSDK infrastructure.")
54
33
  runtimeclass ReactNativeAppBuilder
55
34
  {
56
35
  ReactNativeAppBuilder();
57
36
 
58
37
  // Methods
59
- ReactNativeAppBuilder AddPackageProviders(Windows.Foundation.Collections.IVector<Microsoft.ReactNative.IReactPackageProvider> packageProviders);
60
-
61
- ReactNativeAppBuilder SetReactInstanceSettings(ReactInstanceSettings settings);
62
38
 
63
39
  ReactNativeAppBuilder SetAppWindow(Microsoft.UI.Windowing.AppWindow appWindow);
64
40
 
65
- ReactNativeAppBuilder SetReactViewOptions(Microsoft.ReactNative.ReactViewOptions reactViewOptions);
41
+ // TODO: Hide these APIs for now until we're sure we need to expose them and can do so safely
42
+ // Compositor depends on the DispatcherQueue created by DispatcherQueueController
43
+ // ReactNativeAppBuilder SetCompositor(Microsoft.UI.Composition.Compositor compositor);
44
+ // ReactNativeAppBuilder SetDispatcherQueueController(Microsoft.UI.Dispatching DispatcherQueueController);
66
45
 
67
46
  ReactNativeWin32App Build();
68
47
  }