Skip to content

Commit 6451e9e

Browse files
jonthyselljonthysell
authored
Fix missing docs from version 0.80 snap (#1101)
## Description Re-ran the native API docs script and re-ran the docusaurus version snap to get all of the new pages. ### Why It looks like some docs weren't updated when the 0.80 version was snapped. Resolves issue #1100 ## Screenshots N/A
1 parent 99f0f5d commit 6451e9e

19 files changed

+1095
-410
lines changed

‎.github/scripts/UpdateNativeApiDocs.ps1‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -198,7 +198,7 @@ Function Merge-WinRtApiDocs([string]$OldArchDocsPath, [string]$NewArchDocsPath,
198198
$NativeApiEntries += $KindObject
199199
}
200200

201-
$SidebarsJson.apis."Native API (Windows)" = $NativeApiEntries
201+
$SidebarsJson.apis."Native API" = $NativeApiEntries
202202

203203
Write-Host "Updating `"$SidebarsFile`""
204204
$SidebarsJson | ConvertTo-Json -Depth 4 | Set-Content -Path $SidebarsFile

‎docs/migration-guide.md‎

Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
---
2+
id: migration-guide
3+
title: Migration Guide
4+
---
5+
6+
![Architecture](https://img.shields.io/badge/architecture-new_&_old-green)
7+
8+
### React Native Windows — Migration from Paper (Old Architecture) to Fabric (New Architecture) - Sample Calculator App
9+
10+
11+
### Introduction
12+
13+
React Native 0.80 introduces Fabric as the default renderer and completes the transition to the New Architecture (Fabric + TurboModules). For React Native Windows (RNW), this migration replaces the legacy Paper architecture with a modern rendering pipeline that improves performance and memory usage.
14+
15+
> **Note:** This documentation references RNW v0.80, since Fabric becomes the default renderer starting with this version. However, the migration guide can be generally referred to for migrating from Paper to Fabric beginning with RNW versions supporting Fabric (starting RNW v0.74).
16+
17+
### Key Concepts
18+
19+
20+
- Paper (Old Architecture): Legacy renderer that uses UIManager and bridge-based communication between JS and native.
21+
22+
- Fabric (New Architecture): Modern concurrent renderer built on React Fiber and JSI.
23+
24+
- TurboModules: New native module system that replaces the old bridge-based modules with JSI bindings.
25+
26+
- RNW cpp-app Template: Default Windows template for new-architecture (Fabric) apps using C++/WinAppSDK.
27+
28+
- RNW old-uwp/cpp-app Template: Legacy UWP template used for Paper-based (old architecture) apps.
29+
30+
31+
### Prerequisites
32+
33+
- Node.js ≥ 18.x
34+
- React Native CLI ≥ 13.x
35+
- Visual Studio 2022 (v17.10 or later)
36+
- Windows SDK ≥ 10.0.22621.0
37+
- Existing RNW app running on RN < 0.80 (Paper architecture)
38+
39+
Run yarn install after every update of package.json file
40+
41+
### RNW App Migration
42+
43+
About the App:
44+
45+
For the purposes of this migration guide, we will use the sample Calculator app from the [React-native-windows-samples repository](https://github.com/microsoft/react-native-windows-samples). This Calculator app demonstrates a straightforward React Native for Windows project implemented in C++/WinRT, making it well-suited for illustrating the steps required to move from the legacy Paper architecture to the modern Fabric architecture. The app covers basic UI, native modules, and integration patterns typical in RNW projects, providing a practical reference as you follow each migration step.
46+
47+
You can view the Calculator app's source code at [react-native-windows-samples/samples/Calculator/cppwinrt](https://github.com/microsoft/react-native-windows-samples/tree/9e5d850e843acc2ff060fbd64673511cc67265f9/samples/Calculator/cppwinrt) and examine the full migration changes in the pull request diff [migrate calculator by anupriya13 · PR #1092](https://github.com/microsoft/react-native-windows-samples/pull/1092/files#diff-12ccc26d0186ecea507053fb04c1d4eac13aea210e5e1e95332e9add88940971). This real-world example enables you to compare the project structure and dependencies before and after the migration, making it easier to understand and replicate the process in your own RNW apps.
48+
49+
50+
51+
Repo: [react-native-windows-samples/samples/Calculator/cppwinrt at main · microsoft/react-native-windows-samples](https://github.com/microsoft/react-native-windows-samples/tree/main/samples/Calculator/cppwinrt)
52+
53+
Sample Diff: [migrate calculator by anupriya13 · Pull Request #1092 · microsoft/react-native-windows-samples](https://github.com/microsoft/react-native-windows-samples/pull/1092/files#diff-12ccc26d0186ecea507053fb04c1d4eac13aea210e5e1e95332e9add88940971)
54+
55+
Before you migrate confirm few things on your Paper project re-confirm that your project is using Paper architecture by checking the package.json init-window section
56+
57+
58+
### Steps Followed to Migrate to New Architecture (Fabric)
59+
- Upgrade Dependencies: Update package.json to use React Native 0.80 and run:
60+
```bash
61+
npm install
62+
```
63+
or
64+
```bash
65+
yarn install
66+
```
67+
(Reference - [react-native-windows-samples/samples/Calculator/cppwinrt/package.json at 9e5d850e843acc2ff060fbd64673511cc67265f9 · microsoft/react-native-windows-samples](https://github.com/microsoft/react-native-windows-samples/blob/9e5d850e843acc2ff060fbd64673511cc67265f9/samples/Calculator/cppwinrt/package.json))
68+
69+
- Delete the Existing Windows Directory:
70+
```bash
71+
rm -rf windows
72+
```
73+
74+
- Update Template in package.json: Set `"template": "cpp-app"` to use the new architecture template.
75+
76+
- Run:
77+
```bash
78+
yarn install
79+
```
80+
81+
- Reinitialize the Windows Project:
82+
```bash
83+
npx react-native init-windows --template cpp-app
84+
```
85+
86+
- Run the Application:
87+
```bash
88+
npx @react-native-community/cli run-windows
89+
```
90+
91+
92+
You will see new files created / updated inside windows directory
93+
94+
No JS/TSX changes needed in src as Calculator uses basic components.
95+
96+
97+
Commit Paper to Fabric: [migrate calculator by anupriya13 · Pull Request #1092 · microsoft/react-native-windows-samples](https://github.com/microsoft/react-native-windows-samples/pull/1092/commits/773c0ddec708083ab3fbd93dca08acfe0aa408aa)
98+
99+
### Reverting to Old Architecture (Paper)
100+
101+
In case you encounter issues migrating to Fabric or due to unsupported controls or properties in Fabric please refer to below steps to revert back to Paper architecture. If you encounter missing properties, please open an issue: https://github.com/microsoft/react-native-windows/issues
102+
103+
- Delete the Windows Directory:
104+
```bash
105+
rm -rf windows
106+
```
107+
108+
- Update Template in package.json: Set `"template": "old/uwp-cpp-app"`. (Reference -[react-native-windows-samples/samples/Calculator/fabric/package.json at 9e5d850e843acc2ff060fbd64673511cc67265f9 · microsoft/react-native-windows-samples](https://github.com/microsoft/react-native-windows-samples/blob/9e5d850e843acc2ff060fbd64673511cc67265f9/samples/Calculator/fabric/package.json))
109+
110+
- Run:
111+
```bash
112+
yarn
113+
```
114+
115+
- Reinitialize the Old Architecture Project:
116+
```bash
117+
npx react-native init-windows --template old/uwp-cpp-app
118+
```
119+
120+
- Run the App:
121+
```bash
122+
npx @react-native-community/cli run-windows
123+
```
124+
125+
126+
127+
Commit Fabric to Paper for reference: [migrate calculator by anupriya13 · Pull Request #1092 · microsoft/react-native-windows-samples](https://github.com/microsoft/react-native-windows-samples/pull/1092/commits/450baba033b9c1f0e9b9e882bee91954f03767a1)
128+
129+
### Third-Party Modules and Community Libraries [Out of Scope for Calculator]
130+
131+
When migrating to the New Architecture (Fabric), it's important to verify that all third-party or community modules used in your project are compatible with the new architecture. Modules developed for the old Paper bridge may not function correctly without Fabric support.
132+
133+
Before using any external module:
134+
135+
Check the module's documentation or GitHub repository for Fabric or TurboModule support.
136+
137+
Prefer modules that explicitly state compatibility with React Native 0.80 or higher.
138+
139+
If the module is not updated, consider alternative libraries or maintain your own fork until Fabric support is added.
140+
141+
### Flyout / Popup Behavior Update [Out of Scope for Calculator]
142+
143+
In the New Architecture RNW, the Flyout and Popup components have been updated to align with the Modal API for better cross-platform consistency. Any previous usage of Flyout or Popup should be reviewed and replaced with the new Modal-based implementation, ensuring proper layering, dismissal, and accessibility behavior.
144+
145+
### Conclusion
146+
147+
Migrating from Paper to Fabric in React Native Windows modernizes your project, improves performance, and prepares your app for future React Native releases. Reverting to the old architecture is simple if required.

‎docs/native-api/IScrollVisual-api-windows.md‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ void **`SetMaximumZoomScale`**(float maximumZoomScale)
4444
void **`SetMinimumZoomScale`**(float minimumZoomScale)
4545

4646
### SetSnapPoints
47-
void **`SetSnapPoints`**(bool snapToStart, bool snapToEnd, [`IVectorView`](https://docs.microsoft.com/uwp/api/Windows.Foundation.Collections.IVectorView-1)<float> offsets, [`SnapAlignment`](SnapAlignment) snapToAlignment)
47+
void **`SetSnapPoints`**(bool snapToStart, bool snapToEnd, [`IVectorView`](https://docs.microsoft.com/uwp/api/Windows.Foundation.Collections.IVectorView-1)<float> offsets)
4848

4949
### TryUpdatePosition
5050
void **`TryUpdatePosition`**([`Vector3`](https://docs.microsoft.com/uwp/api/Windows.Foundation.Numerics.Vector3) position, bool animate)
@@ -54,6 +54,10 @@ void **`TryUpdatePosition`**([`Vector3`](https://docs.microsoft.com/uwp/api/Wind
5454
Type: [`EventHandler`](https://docs.microsoft.com/uwp/api/Windows.Foundation.EventHandler-1)<[`IScrollPositionChangedArgs`](IScrollPositionChangedArgs)>
5555
### `ScrollEndDrag`
5656
Type: [`EventHandler`](https://docs.microsoft.com/uwp/api/Windows.Foundation.EventHandler-1)<[`IScrollPositionChangedArgs`](IScrollPositionChangedArgs)>
57+
### `ScrollMomentumBegin`
58+
Type: [`EventHandler`](https://docs.microsoft.com/uwp/api/Windows.Foundation.EventHandler-1)<[`IScrollPositionChangedArgs`](IScrollPositionChangedArgs)>
59+
### `ScrollMomentumEnd`
60+
Type: [`EventHandler`](https://docs.microsoft.com/uwp/api/Windows.Foundation.EventHandler-1)<[`IScrollPositionChangedArgs`](IScrollPositionChangedArgs)>
5761
### `ScrollPositionChanged`
5862
Type: [`EventHandler`](https://docs.microsoft.com/uwp/api/Windows.Foundation.EventHandler-1)<[`IScrollPositionChangedArgs`](IScrollPositionChangedArgs)>
5963

‎docs/native-api/SnapAlignment-api-windows.md‎

Lines changed: 0 additions & 18 deletions
This file was deleted.

‎docs/native-api/index-api-windows.md‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -172,7 +172,6 @@ title: Microsoft.ReactNative APIs
172172
- [PointerUpdateKind](PointerUpdateKind)
173173
- [RedBoxErrorType](RedBoxErrorType)
174174
- [ResourceType](ResourceType)
175-
- [SnapAlignment](SnapAlignment)
176175
- [ViewManagerPropertyType](ViewManagerPropertyType)
177176

178177
## Interfaces

‎docs/new-arch-missingProps.md‎

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
---
2+
id: new-arch-missingProps
3+
title: Missing Properties
4+
---
5+
6+
![Architecture](https://img.shields.io/badge/architecture-new_only-green)
7+
8+
> **New Architecture Only:** This page lists properties that are not yet implemented in the New Architecture. If you depend on one of these properties and would like to prioritize its implementation, please open an issue here: [RNW GitHub link](https://github.com/microsoft/react-native-windows/issues).
9+
10+
## Missing Props List
11+
12+
### `overflow`
13+
14+
| type | default |
15+
|:--|:--|
16+
| enum('visible', 'hidden') | 'visible' |
17+
18+
### `opacity`
19+
20+
Sets the transparency of the view.
21+
22+
| type | required |
23+
|:--|:--|
24+
| number | No |
25+
26+
### `snapToInterval`
27+
28+
When set, causes the scroll view to stop at multiples of the value of snapToInterval. This can be used for paginating through children that have lengths smaller than the scroll view. Typically used in combination with snapToAlignment and decelerationRate="fast". Overrides less configurable pagingEnabled prop.
29+
30+
| type | required |
31+
|:--|:--|
32+
| number | No |
33+
34+
### `snapToAlignment`
35+
36+
When snapToInterval is set, snapToAlignment will define the relationship of the snapping to the scroll view.
37+
38+
| type | required |
39+
|:--|:--|
40+
| enum('start', 'center', 'end') | No |
41+
42+
### `pagingEnabled`
43+
44+
When true, the scroll view stops on multiples of the scroll view's size when scrolling. This can be used for horizontal pagination.
45+
46+
| type | default |
47+
|:--|:--|
48+
| bool | false |
49+
50+
### `selectable`
51+
52+
Lets the user select text, to use the native copy and paste functionality.
53+
54+
| type | default |
55+
|:--|:--|
56+
| bool | false |
57+
58+
### `selectionColor`
59+
60+
The highlight color of the text.
61+
62+
| type | required |
63+
|:--|:--|
64+
| color | No |
65+
66+
### `textAlign`
67+
68+
Align the input text to the left, center, or right sides of the input field.
69+
70+
Possible values for textAlign are:
71+
72+
- left
73+
- center
74+
- right
75+
76+
| type | required |
77+
|:--|:--|
78+
| enum('left', 'center', 'right') | No |
79+
80+
### `contextMenuHidden`
81+
82+
If true, context menu is hidden. The default value is false.
83+
84+
| type | required |
85+
|:--|:--|
86+
| bool | No |
87+
88+
### `writingDirection`
89+
90+
The writing direction of the text.
91+
92+
| type | required |
93+
|:--|:--|
94+
| enum('auto', 'ltr', 'rtl') | No |
95+
96+
### `keyboardType`
97+
98+
Determines which keyboard to open, e.g.numeric
99+
100+
| type | required |
101+
|:--|:--|
102+
| enum('default', 'email-address', 'numeric', 'phone-pad', 'ascii-capable', 'numbers-and-punctuation', 'url', 'number-pad', 'name-phone-pad', 'decimal-pad', 'twitter', 'web-search', 'visible-password') | No |

‎docs/new-architecture.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ React Native's [New Architecture](https://reactnative.dev/architecture/landing-p
99

1010
React Native for Windows also supports the New Architecture for the *Windows* platform. It was first available as an opt-in preview in [[email protected]](https://devblogs.microsoft.com/react-native/2025-01-29-new-architecture-on-0-76-0-77/) and became the default for *new* app projects in `[email protected]`. For more information on the differences between the architectures on Windows, see [New vs. Old Architecture Differences](#new-vs-old-architecture-differences).
1111

12-
> **Important:** Nearly all future investments to React Native (and React Native for Windows) will be toward the New Architecture, and we highly recommend that all projects migrate as soon as possible. React Native (and therefore React Native for Windows) will eventually deprecate, then delete, support for the Old Architecture.
12+
> **Important:** Nearly all future investments to React Native (and React Native for Windows) will be toward the New Architecture, and we highly recommend that all projects migrate as soon as possible. React Native (and therefore React Native for Windows) deprecated the Old Architecture as of [[email protected]](https://reactnative.dev/blog/2025/10/08/react-native-0.82#new-architecture-only).
1313
1414
Unfortunately, React Native for Windows does not support simply "enabling" the New Architecture for existing projects, nor easily switching between the two architectures with a simple setting. Developers must choose their target architecture by selecting the appropriate template (New or Old) when initializing their native Windows app project. For more details, see [Choosing the React Native Architecture on Windows](#choosing-the-react-native-architecture-on-windows) below.
1515

‎website/.unbroken_exclusions‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ URL not found https://www.npmjs.com/package/rnpm-plugin-windows while parsing ve
3838
URL not found https://www.npmjs.com/package/react-native-macos while parsing versioned_docs/version-0.78/rnm-getting-started.md (HTTP 403)
3939

4040
#fix-unbroken.js auto-generated do not edit this line or below
41+
File not found new-architecture.md while parsing versioned_docs/version-0.80/flyout-component-windows.md
4142
File not found autolink-windows-cli.md while parsing versioned_docs/version-0.80/getting-started.md
4243
File not found getting-started.md while parsing versioned_docs/version-0.80/getting-started.md
4344
File not found init-windows-cli.md while parsing versioned_docs/version-0.80/getting-started.md
@@ -47,6 +48,7 @@ File not found platform.md while parsing versioned_docs/version-0.80/getting-sta
4748
File not found rnw-dependencies.md while parsing versioned_docs/version-0.80/getting-started.md
4849
File not found run-windows-cli.md while parsing versioned_docs/version-0.80/getting-started.md
4950
File not found run-windows-cli.md while parsing versioned_docs/version-0.80/hermes.md
51+
File not found new-architecture.md while parsing versioned_docs/version-0.80/init-windows-cli.md
5052
File not found native-code-language-choice.md while parsing versioned_docs/version-0.80/native-modules.md
5153
File not found native-modules-advanced.md while parsing versioned_docs/version-0.80/native-modules.md
5254
File not found native-modules-async.md while parsing versioned_docs/version-0.80/native-modules.md
@@ -63,8 +65,15 @@ File not found native-platform-components.md while parsing versioned_docs/versio
6365
File not found native-platform-modules.md while parsing versioned_docs/version-0.80/native-platform-getting-started.md
6466
File not found rnw-dependencies.md while parsing versioned_docs/version-0.80/native-platform-getting-started.md
6567
File not found run-windows-cli.md while parsing versioned_docs/version-0.80/native-platform-getting-started.md
66-
File not found autolink-windows-cli.md while parsing versioned_docs/version-0.80/upgrade-app.md
67-
File not found init-windows-cli.md while parsing versioned_docs/version-0.80/upgrade-app.md
68+
File not found flyout-component-windows.md while parsing versioned_docs/version-0.80/new-architecture.md
69+
File not found getting-started.md while parsing versioned_docs/version-0.80/new-architecture.md
70+
File not found glyph-component-windows.md while parsing versioned_docs/version-0.80/new-architecture.md
71+
File not found init-windows-cli.md while parsing versioned_docs/version-0.80/new-architecture.md
72+
File not found native-platform-getting-started.md while parsing versioned_docs/version-0.80/new-architecture.md
73+
File not found popup-component-windows.md while parsing versioned_docs/version-0.80/new-architecture.md
74+
File not found flyout-component-windows.md while parsing versioned_docs/version-0.80/popup-component-windows.md
75+
File not found new-architecture.md while parsing versioned_docs/version-0.80/popup-component-windows.md
76+
File not found new-architecture.md while parsing versioned_docs/version-0.80/textinput-component-windows.md
6877
File not found new-architecture.md while parsing versioned_docs/version-0.79/app-publishing.md
6978
File not found run-windows-cli.md while parsing versioned_docs/version-0.79/autolink-windows-cli.md
7079
File not found new-architecture.md while parsing versioned_docs/version-0.79/config.md

0 commit comments

Comments
 (0)