From d429f4f99690602159a221634cffc2b1936f74da Mon Sep 17 00:00:00 2001 From: Chiara Mooney <34109996+chiaramooney@users.noreply.github.com> Date: Tue, 17 Dec 2024 10:07:42 -0800 Subject: [PATCH 1/6] Implement ISelectionProvider and ISelectionItemProvider (#14019) Adds support for ISelectionProvider interface Adds support for ISelectionItemProvider interface Adds support for accessibilityState:selected Adjusts AccessibilityState native type on Windows to be std::optional instead of bool Adjusts AccessibilityState native type on Windows to include multiselectable and required fields of type std::optional Adds multiselectable and required fields to AccessibilityState type in JS with type boolean | undefined Adds support for aria-multiselectable and aria-required. Adds support for the following accessibilityActions: addToSelection, removeFromSelection, select Fixes crash in AccessibilityInsights. --- ...-a7e4e9a7-38af-4609-a0a4-152046e6e53b.json | 7 + .../AccessibilityExampleWindows.tsx | 61 +- .../test/AccessibilityTest.test.ts | 62 + .../AccessibilityTest.test.ts.snap | 449 + .../__snapshots__/snapshotPages.test.js.snap | 79884 +++++++++------- .../RNTesterApp-Fabric/RNTesterApp-Fabric.cpp | 35 +- .../CompositionDynamicAutomationProvider.cpp | 194 +- .../CompositionDynamicAutomationProvider.h | 20 +- .../CompositionViewComponentView.cpp | 13 + .../Fabric/Composition/UiaHelpers.cpp | 24 + .../Fabric/Composition/UiaHelpers.h | 5 + .../components/view/AccessibilityPrimitives.h | 252 + .../view/accessibilityPropsConversions.h | 795 + vnext/overrides.json | 37 + .../Libraries/Components/Button.windows.js | 6 + .../Components/Pressable/Pressable.windows.js | 6 + .../Components/TextInput/TextInput.windows.js | 9 +- .../Touchable/TouchableBounce.windows.js | 227 + .../TouchableNativeFeedback.windows.js | 371 + .../Touchable/TouchableOpacity.windows.js | 5 + .../TouchableWithoutFeedback.windows.js | 6 + .../Libraries/Components/View/View.windows.js | 9 +- .../Components/View/ViewAccessibility.d.ts | 10 + .../View/ViewAccessibility.windows.js | 6 +- .../Components/View/ViewPropTypes.windows.js | 2 + .../src-win/Libraries/Image/Image.windows.js | 5 + vnext/src-win/Libraries/Text/Text.windows.js | 9 +- .../Libraries/Text/TextProps.windows.js | 2 + 28 files changed, 49658 insertions(+), 32853 deletions(-) create mode 100644 change/react-native-windows-a7e4e9a7-38af-4609-a0a4-152046e6e53b.json create mode 100644 packages/e2e-test-app-fabric/test/AccessibilityTest.test.ts create mode 100644 packages/e2e-test-app-fabric/test/__snapshots__/AccessibilityTest.test.ts.snap create mode 100644 vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h create mode 100644 vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h create mode 100644 vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js create mode 100644 vnext/src-win/Libraries/Components/Touchable/TouchableNativeFeedback.windows.js diff --git a/change/react-native-windows-a7e4e9a7-38af-4609-a0a4-152046e6e53b.json b/change/react-native-windows-a7e4e9a7-38af-4609-a0a4-152046e6e53b.json new file mode 100644 index 00000000000..c0f555b2bba --- /dev/null +++ b/change/react-native-windows-a7e4e9a7-38af-4609-a0a4-152046e6e53b.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "Implement ISelectionProvider and ISelectionItemProvider", + "packageName": "react-native-windows", + "email": "34109996+chiaramooney@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/@react-native-windows/tester/src/js/examples-win/Accessibility/AccessibilityExampleWindows.tsx b/packages/@react-native-windows/tester/src/js/examples-win/Accessibility/AccessibilityExampleWindows.tsx index a9924e7cfeb..b148c49a33e 100644 --- a/packages/@react-native-windows/tester/src/js/examples-win/Accessibility/AccessibilityExampleWindows.tsx +++ b/packages/@react-native-windows/tester/src/js/examples-win/Accessibility/AccessibilityExampleWindows.tsx @@ -312,33 +312,40 @@ class AccessibilityStateExamples extends React.Component { The following list of TouchableHighlights toggles accessibilityState.selected when touched: - ( - this.selectPress(item.index)}> - - {this.state.itemsSelected[item.index] - ? 'Selected' - : 'Unselected'} - - - )} - keyExtractor={(item, index) => index.toString()} - /> + + ( + this.selectPress(item.index)}> + + {this.state.itemsSelected[item.index] + ? 'Selected' + : 'Unselected'} + + + )} + keyExtractor={(item, index) => index.toString()} + /> + The following TouchableHighlight cycles accessibilityState.checked through unchecked/checked/mixed for the View under it: diff --git a/packages/e2e-test-app-fabric/test/AccessibilityTest.test.ts b/packages/e2e-test-app-fabric/test/AccessibilityTest.test.ts new file mode 100644 index 00000000000..62be53287d6 --- /dev/null +++ b/packages/e2e-test-app-fabric/test/AccessibilityTest.test.ts @@ -0,0 +1,62 @@ +/** + * Copyright (c) Microsoft Corporation. + * Licensed under the MIT License. + * + * @format + */ + +import {dumpVisualTree} from '@react-native-windows/automation-commands'; +import {goToApiExample} from './RNTesterNavigation'; +import {app} from '@react-native-windows/automation'; +import {verifyNoErrorLogs} from './Helpers'; + +beforeAll(async () => { + // If window is partially offscreen, tests will fail to click on certain elements + await app.setWindowPosition(0, 0); + await app.setWindowSize(1000, 1250); + await goToApiExample('Accessibility Windows'); +}); + +afterEach(async () => { + await verifyNoErrorLogs(); +}); + +const searchBox = async (input: string) => { + const searchBox = await app.findElementByTestID('example_search'); + await app.waitUntil( + async () => { + await searchBox.setValue(input); + return (await searchBox.getText()) === input; + }, + { + interval: 1500, + timeout: 5000, + timeoutMsg: `Unable to enter correct search text into test searchbox.`, + }, + ); +}; + +describe('Accessibility Tests', () => { + test('Elements can set accessibilityState:selected to false', async () => { + await searchBox('Sta'); + const component = await app.findElementByTestID('Selectable item 1'); + await component.waitForDisplayed({timeout: 5000}); + const dump = await dumpVisualTree('Selectable item 1'); + expect(dump).toMatchSnapshot(); + }); + test('Elements can set accessibilityState:selected to true', async () => { + await searchBox('Sta'); + const component = await app.findElementByTestID('Selectable item 1'); + await component.waitForDisplayed({timeout: 5000}); + await component.click(); + const dump = await dumpVisualTree('Selectable item 1'); + expect(dump).toMatchSnapshot(); + }); + test('Selectable items must have a Selection Container. Elements can set accessibilityState:multiselectable and accessibilityState:required to true', async () => { + await searchBox('Sta'); + const componentsTab = await app.findElementByTestID('selection-container'); + await componentsTab.waitForDisplayed({timeout: 5000}); + const dump = await dumpVisualTree('selection-container'); + expect(dump).toMatchSnapshot(); + }); +}); diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/AccessibilityTest.test.ts.snap b/packages/e2e-test-app-fabric/test/__snapshots__/AccessibilityTest.test.ts.snap new file mode 100644 index 00000000000..2b60c38d4e8 --- /dev/null +++ b/packages/e2e-test-app-fabric/test/__snapshots__/AccessibilityTest.test.ts.snap @@ -0,0 +1,449 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Accessibility Tests Elements can set accessibilityState:selected to false 1`] = ` +{ + "Automation Tree": { + "AutomationId": "Selectable item 1", + "ControlType": 50000, + "IsKeyboardFocusable": true, + "LocalizedControlType": "button", + "Name": "Selectable item 1", + "__Children": [ + { + "AutomationId": "", + "ControlType": 50020, + "LocalizedControlType": "text", + "Name": "Unselected", + }, + ], + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "AccessibilityLabel": "Selectable item 1", + "TestId": "Selectable item 1", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ParagraphComponentView", + "_Props": {}, + }, + ], + }, + "Visual Tree": { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(135, 206, 250, 255)", + }, + "Comment": "Selectable item 1", + "Offset": "0, 0, 0", + "Size": "100, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, +} +`; + +exports[`Accessibility Tests Elements can set accessibilityState:selected to true 1`] = ` +{ + "Automation Tree": { + "AutomationId": "Selectable item 1", + "ControlType": 50026, + "IsKeyboardFocusable": true, + "LocalizedControlType": "group", + "Name": "Selectable item 1", + "SelectionItemPattern.IsSelected": true, + "__Children": [ + { + "AutomationId": "", + "ControlType": 50020, + "LocalizedControlType": "text", + "Name": "Selected", + }, + ], + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "AccessibilityLabel": "Selectable item 1", + "TestId": "Selectable item 1", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ParagraphComponentView", + "_Props": {}, + }, + ], + }, + "Visual Tree": { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(128, 128, 128, 255)", + }, + "Comment": "Selectable item 1", + "Offset": "0, 0, 0", + "Size": "100, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, +} +`; + +exports[`Accessibility Tests Selectable items must have a Selection Container. Elements can set accessibilityState:multiselectable and accessibilityState:required to true 1`] = ` +{ + "Automation Tree": { + "AutomationId": "selection-container", + "ControlType": 50026, + "LocalizedControlType": "group", + "Name": "Selection Container", + "SelectionPattern.CanSelectMultiple": true, + "SelectionPattern.IsSelectionRequired": true, + "__Children": [ + { + "AutomationId": "Selectable item 1", + "ControlType": 50000, + "IsKeyboardFocusable": true, + "LocalizedControlType": "button", + "Name": "Selectable item 1", + "__Children": [ + { + "AutomationId": "", + "ControlType": 50020, + "LocalizedControlType": "text", + "Name": "Unselected", + }, + ], + }, + { + "AutomationId": "Selectable item 2", + "ControlType": 50000, + "IsKeyboardFocusable": true, + "LocalizedControlType": "button", + "Name": "Selectable item 2", + "__Children": [ + { + "AutomationId": "", + "ControlType": 50020, + "LocalizedControlType": "text", + "Name": "Unselected", + }, + ], + }, + { + "AutomationId": "Selectable item 3", + "ControlType": 50000, + "IsKeyboardFocusable": true, + "LocalizedControlType": "button", + "Name": "Selectable item 3", + "__Children": [ + { + "AutomationId": "", + "ControlType": 50020, + "LocalizedControlType": "text", + "Name": "Unselected", + }, + ], + }, + ], + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "AccessibilityLabel": "Selection Container", + "TestId": "selection-container", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ScrollViewComponentView", + "_Props": { + "AccessibilityLabel": "List of selectable items", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": {}, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "AccessibilityLabel": "Selectable item 1", + "TestId": "Selectable item 1", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ParagraphComponentView", + "_Props": {}, + }, + ], + }, + { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "AccessibilityLabel": "Selectable item 2", + "TestId": "Selectable item 2", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ParagraphComponentView", + "_Props": {}, + }, + ], + }, + { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "AccessibilityLabel": "Selectable item 3", + "TestId": "Selectable item 3", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ParagraphComponentView", + "_Props": {}, + }, + ], + }, + ], + }, + ], + }, + ], + }, + "Visual Tree": { + "Comment": "selection-container", + "Offset": "0, 0, 0", + "Size": "916, 150", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 150", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 150", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(0, 0, 0, 0)", + }, + "Offset": "0, 0, 0", + "Size": "916, 150", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(0, 0, 0, 0)", + }, + "Offset": "0, 0, 0", + "Size": "916, 150", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 150", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 150", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(135, 206, 250, 255)", + }, + "Comment": "Selectable item 1", + "Offset": "0, 0, 0", + "Size": "100, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, + ], + }, + { + "Offset": "0, 50, 0", + "Size": "100, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(135, 206, 250, 255)", + }, + "Comment": "Selectable item 2", + "Offset": "0, 0, 0", + "Size": "100, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, + ], + }, + { + "Offset": "0, 100, 0", + "Size": "100, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(135, 206, 250, 255)", + }, + "Comment": "Selectable item 3", + "Offset": "0, 0, 0", + "Size": "100, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "100, 20", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, + ], + }, + ], + }, + ], + }, + ], + }, + ], + }, + { + "Offset": "-13, 0, 0", + "Size": "12, 0", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "-12, 3, 0", + "Opacity": 0, + "Size": "12, 144", + "Visual Type": "Visual", + }, + { + "Offset": "0, 4, 0", + "Opacity": 0, + "Size": "12, 12", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, -16, 0", + "Opacity": 0, + "Size": "12, 12", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-5, 16, 0", + "Size": "6, 118", + "Visual Type": "Visual", + }, + ], + }, + { + "Offset": "0, -13, 0", + "Size": "0, 12", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "3, -12, 0", + "Opacity": 0, + "Size": "910, 12", + "Visual Type": "Visual", + }, + { + "Offset": "4, 0, 0", + "Opacity": 0, + "Size": "12, 12", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-16, 0, 0", + "Opacity": 0, + "Size": "12, 12", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "16, -5, 0", + "Size": "884, 6", + "Visual Type": "Visual", + }, + ], + }, + ], + }, + ], + }, + ], + }, +} +`; diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap b/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap index 36429eab3de..cb35c326aed 100644 --- a/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap +++ b/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap @@ -301,181 +301,196 @@ exports[`snapshotAllPages Accessibility Windows 4`] = ` The following list of TouchableHighlights toggles accessibilityState.selected when touched: - - - + + + - - Unselected - + testID="Selectable item 1" + > + + Unselected + + - - + - - Unselected - + testID="Selectable item 2" + > + + Unselected + + - - + - - Unselected - + testID="Selectable item 3" + > + + Unselected + + - - + + The following TouchableHighlight cycles accessibilityState.checked through unchecked/checked/mixed for the View under it: @@ -1216,6 +1231,8 @@ exports[`snapshotAllPages Alerts 1`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1276,6 +1293,8 @@ exports[`snapshotAllPages Alerts 2`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1335,6 +1354,8 @@ exports[`snapshotAllPages Alerts 3`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1395,6 +1416,8 @@ exports[`snapshotAllPages Alerts 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1454,6 +1477,8 @@ exports[`snapshotAllPages Alerts 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1513,6 +1538,8 @@ exports[`snapshotAllPages Alerts 6`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1572,6 +1599,8 @@ exports[`snapshotAllPages Alerts 7`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1649,6 +1678,8 @@ exports[`snapshotAllPages Alerts 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1703,6 +1734,8 @@ exports[`snapshotAllPages Alerts 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1757,6 +1790,8 @@ exports[`snapshotAllPages Alerts 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1811,6 +1846,8 @@ exports[`snapshotAllPages Alerts 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1865,6 +1902,8 @@ exports[`snapshotAllPages Alerts 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1924,6 +1963,8 @@ exports[`snapshotAllPages Alerts 9`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -1978,6 +2019,8 @@ exports[`snapshotAllPages Alerts 9`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -2032,6 +2075,8 @@ exports[`snapshotAllPages Alerts 9`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -2163,6 +2208,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2230,6 +2277,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2297,6 +2346,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2364,6 +2415,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2431,6 +2484,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2498,6 +2553,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2565,6 +2622,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2632,6 +2691,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2699,6 +2760,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2766,6 +2829,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2833,6 +2898,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2900,6 +2967,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": false, } } @@ -2969,6 +3038,8 @@ exports[`snapshotAllPages Animated 1`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -3104,6 +3175,8 @@ exports[`snapshotAllPages Animated 2`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -3293,6 +3366,8 @@ exports[`snapshotAllPages Animated 3`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -3595,6 +3670,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -3649,6 +3726,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -3703,6 +3782,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -3889,6 +3970,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -3943,6 +4026,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -3997,6 +4082,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -4183,6 +4270,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -4237,6 +4326,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -4291,6 +4382,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -4477,6 +4570,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -4531,6 +4626,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -4585,6 +4682,8 @@ exports[`snapshotAllPages Animated 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -4835,6 +4934,8 @@ exports[`snapshotAllPages Animated 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -4952,6 +5053,8 @@ exports[`snapshotAllPages Animated 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -5069,6 +5172,8 @@ exports[`snapshotAllPages Animated 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -5210,6 +5315,8 @@ exports[`snapshotAllPages Animated 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -5327,6 +5434,8 @@ exports[`snapshotAllPages Animated 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -5444,6 +5553,8 @@ exports[`snapshotAllPages Animated 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -5566,6 +5677,8 @@ exports[`snapshotAllPages Animated 6`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -5725,6 +5838,8 @@ exports[`snapshotAllPages Animated 7`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -5907,6 +6022,8 @@ exports[`snapshotAllPages Animated 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -5962,6 +6079,8 @@ exports[`snapshotAllPages Animated 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -6016,6 +6135,8 @@ exports[`snapshotAllPages Animated 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -6070,6 +6191,8 @@ exports[`snapshotAllPages Animated 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -6175,6 +6298,8 @@ exports[`snapshotAllPages Animated 9`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -6306,6 +6431,8 @@ exports[`snapshotAllPages Animated 10`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -6387,337 +6514,816 @@ exports[`snapshotAllPages Animated 11`] = ` `; -exports[`snapshotAllPages AppState 1`] = ``; - -exports[`snapshotAllPages AppState 2`] = ` - - - -`; - -exports[`snapshotAllPages AppState 3`] = ` - - - [] - - -`; - -exports[`snapshotAllPages AppState 4`] = ` +exports[`snapshotAllPages Animated 12`] = ` - - 0 - - -`; - -exports[`snapshotAllPages AppState 5`] = ` - - - [] - - -`; - -exports[`snapshotAllPages Border 1`] = ` - -`; - -exports[`snapshotAllPages Border 2`] = ` - + + -`; - -exports[`snapshotAllPages Border 3`] = ` - -`; - -exports[`snapshotAllPages Border 4`] = ` - -`; - -exports[`snapshotAllPages Border 5`] = ` - -`; - -exports[`snapshotAllPages Border 6`] = ` - -`; - -exports[`snapshotAllPages Border 7`] = ` - -`; - -exports[`snapshotAllPages Border 8`] = ` - + "borderWidth": 1, + "margin": 20, + "opacity": 0.9, + "padding": 20, + } + } + > + + Change Opacity + + - -`; - -exports[`snapshotAllPages Border 9`] = ` - - + > + + Add + + + > + + Subtract + + + > + + Multiply + + - -`; - -exports[`snapshotAllPages Border 10`] = ` - + + Divide + + + + + Modulo + + + +`; + +exports[`snapshotAllPages Animated 13`] = ` + + + + + + + Press count : 0 + + + + + + + + + + 0 + + + + + 1 + + + + + 2 + + + + + 3 + + + + + 4 + + + + + 5 + + + + + 6 + + + + + 7 + + + + + 8 + + + + + 9 + + + + + + +`; + +exports[`snapshotAllPages AppState 1`] = ` + +`; + +exports[`snapshotAllPages AppState 2`] = ` + + + +`; + +exports[`snapshotAllPages AppState 3`] = ` + + + [] + + +`; + +exports[`snapshotAllPages AppState 4`] = ` + + + 0 + + +`; + +exports[`snapshotAllPages AppState 5`] = ` + + + [] + + +`; + +exports[`snapshotAllPages Border 1`] = ` + `; -exports[`snapshotAllPages Border 11`] = ` +exports[`snapshotAllPages Border 2`] = ` `; -exports[`snapshotAllPages Border 12`] = ` +exports[`snapshotAllPages Border 3`] = ` `; -exports[`snapshotAllPages Border 13`] = ` +exports[`snapshotAllPages Border 4`] = ` `; -exports[`snapshotAllPages Border 14`] = ` +exports[`snapshotAllPages Border 5`] = ` `; -exports[`snapshotAllPages Border 15`] = ` +exports[`snapshotAllPages Border 6`] = ` `; -exports[`snapshotAllPages Border 16`] = ` +exports[`snapshotAllPages Border 7`] = ` `; -exports[`snapshotAllPages Border 17`] = ` +exports[`snapshotAllPages Border 8`] = ` + testID="border-test-custom-borders-ios-clipping" +> + + `; -exports[`snapshotAllPages Button 1`] = ` +exports[`snapshotAllPages Border 9`] = ` + + + + + +`; + +exports[`snapshotAllPages Border 10`] = ` + +`; + +exports[`snapshotAllPages Border 11`] = ` + +`; + +exports[`snapshotAllPages Border 12`] = ` + +`; + +exports[`snapshotAllPages Border 13`] = ` + +`; + +exports[`snapshotAllPages Border 14`] = ` + +`; + +exports[`snapshotAllPages Border 15`] = ` + +`; + +exports[`snapshotAllPages Border 16`] = ` + +`; + +exports[`snapshotAllPages Border 17`] = ` + +`; + +exports[`snapshotAllPages Button 1`] = ` + - + + + + + + + Change height + + + + + `; -exports[`snapshotAllPages Flyout 1`] = ` +exports[`snapshotAllPages FlatList 10`] = ` - Placement Options: - - - - + }, + ] + } + > + - Open Flyout + Pizza - - - - - Open Flyout without Target + Burger - - - - - Open Flyout with Offset + Risotto - - - - - Text Input to Anchor flyout to: - - - - - -`; - -exports[`snapshotAllPages Glyph UWP 1`] = ` - - - Glyph: default Accent color - - - - Glyph: red - - - - Multiple glyphs: red - - - - Multiple glyphs - - - -`; - -exports[`snapshotAllPages Keyboard 1`] = ` - - - - Keyboard is - - - closed - - - - - No events observed - - - -`; - -exports[`snapshotAllPages Keyboard 2`] = ` - - - - Keyboard is - - - closed - - - - - No events observed - - - -`; - -exports[`snapshotAllPages Keyboard 3`] = ` - - - No tab index, this item will be tabbed to last - - - - tabIndex default - - - - These 3 items should tab in the order of first, last, middle: - - - - - tabIndex 1 - - - - - tabIndex 3 - - - - - tabIndex 2 - - - - - Controls like Picker should also do the same tab in the order of first, last, middle: - - - - - - - -`; - -exports[`snapshotAllPages Keyboard Focus Example 1`] = ` - - - - Please select a item to set focus - - - - - - View accept focus - - - - - - - - Test Purpose: focus on TextInput, then timeout and blur on TextInput2, TextInput still keep focus - - - - - - Test Purpose: focus on TextInput2, then timeout and blur on TextInput2, TextInput2 lose focus - - - - Key - unknown - - - - + - - - Last focus event for TouchableHighlight: - - - + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + disabled={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + [ + { + "backgroundColor": "pink", + "height": 70, + "justifyContent": "center", + "marginVertical": 8, + "paddingHorizontal": 20, + }, + { + "backgroundColor": "pink", + }, + ] + } + testID="French Fries" + > + + French Fries + + + + - - - Last focus event for TouchableOpacity: - - - - - Last focus event for TouchableWithoutFeedback: - - - - -`; - -exports[`snapshotAllPages Keyboard extension Example 1`] = ` - - - - - OnKeyDown Key and Code - - - - - - - - - OnKeyDownCapture Key and Code - - - - - - - - - - - OnKeyUp Key and Code - - - - - - - - - OnKeyUpCapture Key and Code - - - - - - - - - - - - - -`; - -exports[`snapshotAllPages Layout - Flexbox 1`] = ` - - - - Layout - - - - - + + Onion Rings + + + + - Flex Direction + Fried Shrimps + + - - row - - - - - - - - - - row-reverse - - - - - - - - - - column + Water - + + + + - - - - - - - - column-reverse + Coke - + + + - - - - - - - + - - top: 15, left: 160 - - + Beer + + + + Cheesecake + + + + + + + +`; + +exports[`snapshotAllPages FlatList 11`] = ` + + + + + + + - Justify Content - Main Direction + Pizza + + - - flex-start - - - - - - - - - - center + Burger - + + + - - - - - - - - flex-end - - - - - - - - - - space-between - - + - - - - - - - - space-around - - - - - - - - + Risotto + - Align Items - Other Direction + French Fries + + - - flex-start - - - - - - - - - - - - - - - - + - + Onion Rings + + + + + + - + Fried Shrimps + + + + + + - + Water + + + + + + - - - center + } + > + Coke - + + + + - - - - - - - - - - - - - - - - - - - - flex-end + Beer - - - - - - - - - - - - - - - - - - - - Flex Wrap + Cheesecake - + - - - - - - - - - - - - - - - - - - - - + } + /> `; -exports[`snapshotAllPages Layout Events 1`] = ` - - - layout events are called on mount and whenever layout is recalculated. Note that the layout event will typically be received - - - before - - the layout has updated on screen, especially when using layout animations. - - - Press here to change layout. - - - - - - ViewLayout: - - undefined - - - - - A simple piece of text. - - - - - Text w/h: - ? - / - ? - - Image x/y: - ? - / - ? - - - -`; - -exports[`snapshotAllPages Legacy Native Module 1`] = ` +exports[`snapshotAllPages FlatList 12`] = ` -`; - -exports[`snapshotAllPages LegacyControlStyleTest 1`] = ` - +> - - - + - - + - - Show Round Border - + + Pizza + + - - - -`; - -exports[`snapshotAllPages LegacyImageTest 1`] = ` - - - - - - - - Show Border - + + Burger + + - - - - - - Set image to RTL - + + Risotto + + - - - -`; - -exports[`snapshotAllPages LegacyLoginTest 1`] = ` - - - - - - - Show Password - + + French Fries + + - - - - - LOGIN - - - - -`; - -exports[`snapshotAllPages LegacySelectableTextTest 1`] = ` - - - Pressed: - 0 - times. - - - Text before - - - click here - - - text after - - - - - Toggle Selectable - + + Onion Rings + + - - - - - - Clear State - + + Fried Shrimps + + - - - -`; - -exports[`snapshotAllPages LegacyTextHitTestTest 1`] = ` - - - Pressed: - 0 - times. - - - Nested - - - pressable - - - text: - - + - Click here - - - - - - Nested text inside pressable text: - - - - Click here - - - - - Multiline pressable test: - - - Click here -or click here. - - - - Multiline pressable RTL text: - - - أحب اللغة -العربية - - - - RTL text in LTR flow direction: - - + Water + + + + - أحب اللغة العربية - - - - RTL text in RTL flow direction: - - - أحب اللغة العربية - - - - LTR text in RTL flow direction: - - - Click here - - - - Bidirectional text in a single run: - - + + + Coke + + + + - أحب اللغة العربية hello - - - - Bidirectional text in separate runs: - - + + + Beer + + + + - أحب اللغة العربية - hello - - - - Add pressable inline text child: - - + + + Cheesecake + + + + - Click to add - - - - + + + +`; + +exports[`snapshotAllPages FlatList 13`] = ` + - Click anywhere to toggle pressability: - - - Click here - - - - Wrapped text pressability: - + } +> - - abcdef - - + testID="output" + /> - - + - - Clear State - + + Pizza + + - - - -`; - -exports[`snapshotAllPages LegacyTextInputTest 1`] = ` - - - - - - <Log Start> - - -`; - -exports[`snapshotAllPages Linking 1`] = ` - - - - - Open - https://www.facebook.com - + + Burger + + - - - - Open - http://www.facebook.com - + + Risotto + + - - - - Open - http://facebook.com - + + French Fries + + - - - - Open - fb://notifications - - - - - - - Open - geo:37.484847,-122.148386 - - - - - - - Open - tel:9876543210 - + + Onion Rings + + - - - -`; - -exports[`snapshotAllPages Linking 2`] = ` - - - - - Open Settings - - - - -`; - -exports[`snapshotAllPages Modal 1`] = ` - - - - Show Modal - - - - - Animation Type - - - - - slide + Fried Shrimps - none + Water - - fade - - - - - - - - Status Bar Translucent 🟢 - - - - - - Hardware Acceleration 🟢 - - - - - - Presentation Style ⚫️ - - - - - fullScreen + Coke - pageSheet + Beer - formSheet + Cheesecake + + + +`; + +exports[`snapshotAllPages FlatList 14`] = ` + + + - - - overFullScreen - - - - + } + testID="output" + /> - - - Transparent - - - - - + - - Supported Orientation ⚫️ - - + "onViewableItemsChanged": [Function], + "viewabilityConfig": { + "minimumViewTime": 1000, + "viewAreaCoveragePercentThreshold": 100, + "waitForInteraction": true, + }, + }, + ] + } + > + - portrait + Pizza - portrait-upside-down + Burger - landscape + Risotto - landscape-left + French Fries - landscape-right + Onion Rings - - - - - Actions - - + + + Fried Shrimps + + + + - onShow + Water + + + Coke + + + + - onDismiss ⚫️ + Beer - - - -`; - -exports[`snapshotAllPages Modal 2`] = ` - - - onShow is called - 0 - times - - - onDismiss is called - 0 - times - - - + + + Cheesecake + + + + - Show Modal - - + /> + + `; -exports[`snapshotAllPages Mouse Click Events 1`] = ` +exports[`snapshotAllPages FlatList 15`] = ` - Primary Pressed x - 0 - - - Auxiliary Pressed x - 0 - - - Secondary Pressed x - 0 - - - + + - - - - Clear state - - - - - - - I'm a view! - - - - - - - I'm a button! - - - - - -`; - -exports[`snapshotAllPages Mouse Events 1`] = ` - - - + - - Hoverable - - text - - - - This is a TouchableHighlight + + Pizza - - This is an overlay view + + Burger - - - - - - -`; - -exports[`snapshotAllPages Native Animated Example 1`] = ` - - - - Native: - - - - - - - - JavaScript - : - - - - + + + Risotto + + + + - - -`; - -exports[`snapshotAllPages Native Animated Example 2`] = ` - - - - Native: - - - - + + + French Fries + + + + - - - - JavaScript - : - - - - + + + Onion Rings + + + + - - -`; - -exports[`snapshotAllPages Native Animated Example 3`] = ` - - - - Native: - - - - + + + Fried Shrimps + + + + - - - - JavaScript - : - - - - + + + Water + + + + - - -`; - -exports[`snapshotAllPages Native Animated Example 4`] = ` - - - - Native: - - - - + + + Coke + + + + - - - - JavaScript - : - - - - + + + Beer + + + + - + > + + + Cheesecake + + + + + + `; -exports[`snapshotAllPages Native Animated Example 5`] = ` +exports[`snapshotAllPages Flyout 1`] = ` - - - Native: - - - - - - - JavaScript - : - + > + Placement Options: + + - - -`; - -exports[`snapshotAllPages Native Animated Example 6`] = ` - - - - Native: - + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + [ + { + "backgroundColor": { + "windowsbrush": [ + "ButtonBackground", + ], + }, + "borderBottomWidth": 1.5, + "borderColor": { + "windowsbrush": [ + "ButtonBorderBrush", + ], + }, + "borderRadius": 3, + "borderWidth": 1, + }, + ] + } + > + + + + Open Flyout + + + + - - - - JavaScript - : - + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + [ + { + "backgroundColor": { + "windowsbrush": [ + "ButtonBackground", + ], + }, + "borderBottomWidth": 1.5, + "borderColor": { + "windowsbrush": [ + "ButtonBorderBrush", + ], + }, + "borderRadius": 3, + "borderWidth": 1, + }, + ] + } + > + + + + Open Flyout without Target + + + + - - -`; - -exports[`snapshotAllPages Native Animated Example 7`] = ` - - - - Native: - + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + [ + { + "backgroundColor": { + "windowsbrush": [ + "ButtonBackground", + ], + }, + "borderBottomWidth": 1.5, + "borderColor": { + "windowsbrush": [ + "ButtonBorderBrush", + ], + }, + "borderRadius": 3, + "borderWidth": 1, + }, + ] + } + > + + + + Open Flyout with Offset + + + + - - - - - JavaScript - : + > + Text Input to Anchor flyout to: + - - - @@ -32700,753 +32049,822 @@ exports[`snapshotAllPages Native Animated Example 7`] = ` `; -exports[`snapshotAllPages Native Animated Example 8`] = ` - + + Glyph: default Accent color + + - - - Native: - - - + + Glyph: red + + - - - - - JavaScript - : - - - + + Multiple glyphs: red + + - + + Multiple glyphs + + - + } + /> `; -exports[`snapshotAllPages Native Animated Example 9`] = ` - - +exports[`snapshotAllPages Keyboard 1`] = ` + + - Native: + Keyboard is - - - - - - - JavaScript - : + > + closed - + - + + No events observed + `; -exports[`snapshotAllPages Native Animated Example 10`] = ` - - - + + + Keyboard is + + - - - Value: - 0 + > + closed + - -`; - -exports[`snapshotAllPages Native Animated Example 11`] = ` - + > + + No events observed + + `; -exports[`snapshotAllPages Native Animated Example 12`] = ` +exports[`snapshotAllPages Keyboard 3`] = ` + + No tab index, this item will be tabbed to last + - - - - - Scroll me sideways! - - - - - -`; - -exports[`snapshotAllPages Native Animated Example 13`] = ` - - - Native: + tabIndex default + + These 3 items should tab in the order of first, last, middle: + - - - - - JavaScript - : - - - - + tabIndex={1} + > + + tabIndex 1 + + - - -`; - -exports[`snapshotAllPages Native Animated Example 14`] = ` - - - - Force JS Stalls - - + tabIndex={3} + > + + tabIndex 3 + + + + + tabIndex 2 + + + + Controls like Picker should also do the same tab in the order of first, last, middle: + - - Track JS Stalls - - - - -`; - -exports[`snapshotAllPages PanResponder Sample 1`] = ` - - - - Basic gesture handling - - - + - - - + /> `; -exports[`snapshotAllPages Performance API Examples 1`] = ` +exports[`snapshotAllPages Keyboard Focus Example 1`] = ` - + + Please select a item to set focus + + + + - + View accept focus + + + + - performance.memory + /> + + + + Test Purpose: focus on TextInput, then timeout and blur on TextInput2, TextInput still keep focus + - + + Test Purpose: focus on TextInput2, then timeout and blur on TextInput2, TextInput2 lose focus + + + /> + + Key + unknown + + + + + + Last focus event for TouchableHighlight: + + + + - - - - Click to update memory info - - - - - - - jsHeapSizeLimit: undefined bytes - - - totalJSHeapSize: undefined bytes - - - usedJSHeapSize: undefined bytes - - + /> + + Last focus event for TouchableOpacity: + + + + + Last focus event for TouchableWithoutFeedback: + + `; -exports[`snapshotAllPages Performance API Examples 2`] = ` +exports[`snapshotAllPages Keyboard extension Example 1`] = ` + + + + + OnKeyDown Key and Code + + + + + + + + + OnKeyDownCapture Key and Code + + + + + + + + + + + OnKeyUp Key and Code + + + + + + + + + OnKeyUpCapture Key and Code + + + + + + + + + + + + + +`; + +exports[`snapshotAllPages Layout - Flexbox 1`] = ` - performance.reactNativeStartupTiming + Layout - - - - - - - Click to update React startup timing - - - - - - - startTime: undefined ms - - - initializeRuntimeStart: undefined ms - - - executeJavaScriptBundleEntryPointStart: undefined ms - - - executeJavaScriptBundleEntryPointEnd: undefined ms - - - initializeRuntimeEnd: undefined ms - - - endTime: undefined ms - - - - - -`; - -exports[`snapshotAllPages Performance Comparison Examples 1`] = ` - - - + - - Show Bad + + Flex Direction - Show Good + row - - - - - - -`; - -exports[`snapshotAllPages Performance Comparison Examples 2`] = ` - - - + + + + + + + + + row-reverse + + + + + + + + + + column + + + + + + + + + + column-reverse + + + + + + + + + + + top: 15, left: 160 + + + + - - Show Bad + + Justify Content - Main Direction - Show Good + flex-start - - - - - - -`; - -exports[`snapshotAllPages Performance Comparison Examples 3`] = ` - - - + + + + + + + + + center + + + + + + + + + + flex-end + + + + + + + + + + space-between + + + + + + + + + + space-around + + + + + + + + + + - - Show Bad + + Align Items - Other Direction - Show Good + flex-start - - - - - - -`; - -exports[`snapshotAllPages Performance Comparison Examples 4`] = ` - - - - - - - Show Bad - - - - - Show Good - - - - - - - -`; - -exports[`snapshotAllPages Performance Comparison Examples 5`] = ` - - - - - + > + + + + + + + + + + + + + + + + + + - Show Bad + center - - + + + + + + + + + + + + + + + + + + + + flex-end + + + + + + + + + + + + + + + + + + + + + + + + - - Show Good + + Flex Wrap - - - - - -`; - -exports[`snapshotAllPages Performance Comparison Examples 6`] = ` - - - - - - Show Bad - - - - - Show Good - + > + + + + + + + + + + + + + + + + + - - + `; -exports[`snapshotAllPages PlatformColor 1`] = ` - -`; - -exports[`snapshotAllPages PlatformColor 2`] = ` - - +exports[`snapshotAllPages Layout Events 1`] = ` + + + layout events are called on mount and whenever layout is recalculated. Note that the layout event will typically be received + - Unexpected Platform.OS: windows + before - - - -`; - -exports[`snapshotAllPages PlatformColor 3`] = ` - - Not applicable on this platform - -`; - -exports[`snapshotAllPages PlatformColor 4`] = ` - + > + Press here to change layout. + + - - Unexpected Platform.OS: windows + /> + + ViewLayout: + + undefined + + - + > + A simple piece of text. + + + + + Text w/h: + ? + / + ? + + Image x/y: + ? + / + ? + `; -exports[`snapshotAllPages Pointer Events 1`] = ` +exports[`snapshotAllPages Legacy Native Module 1`] = ` + +`; + +exports[`snapshotAllPages LegacyControlStyleTest 1`] = ` - + - - - A: unspecified - - - + + + + + - - - B: none - - - - - - C: unspecified - - - + Show Round Border + + +`; + +exports[`snapshotAllPages LegacyImageTest 1`] = ` + - - - - - -`; - -exports[`snapshotAllPages Pointer Events 2`] = ` - - - + + + - A: unspecified - - - - - - B: none - - - - - - C: unspecified - - - + Show Border + - + + > + Set image to RTL + + `; -exports[`snapshotAllPages Pointer Events 3`] = ` +exports[`snapshotAllPages LegacyLoginTest 1`] = ` + + - - - - A: unspecified - - + } + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + [ + { + "backgroundColor": { + "windowsbrush": [ + "ButtonBackground", + ], + }, + "borderBottomWidth": 1.5, + "borderColor": { + "windowsbrush": [ + "ButtonBorderBrush", + ], + }, + "borderRadius": 3, + "borderWidth": 1, + }, + ] + } + testID="show-password-toggle" + > + - - - B: box-none - - - - - - C: unspecified - - - - - - - C: explicitly unspecified - - - + Show Password + - - - + } + > + LOGIN + + `; -exports[`snapshotAllPages Pointer Events 4`] = ` - - + - + + Text before + + + click here + + + text after + + + - A: unspecified - - - - - - B: box-none - - - - - - C: unspecified - - - - - - - C: explicitly unspecified - - - + Toggle Selectable + - - - - -`; - -exports[`snapshotAllPages Pointer Events 5`] = ` - - - - A: unspecified - - - - - - B: box-only - - - - - - C: unspecified - - - - - - - C: explicitly unspecified - - - + Clear State + + +`; + +exports[`snapshotAllPages LegacyTextHitTestTest 1`] = ` + + + Pressed: + 0 + times. + + + Nested + + + pressable + + + text: + + + Click here + + + + + + Nested text inside pressable text: + + + + Click here + + + + + Multiline pressable test: + + + Click here +or click here. + + + + Multiline pressable RTL text: + + + أحب اللغة +العربية + + + + RTL text in LTR flow direction: + + + أحب اللغة العربية + + + + RTL text in RTL flow direction: + + + أحب اللغة العربية + + + + LTR text in RTL flow direction: + + + Click here + + + + Bidirectional text in a single run: + + + أحب اللغة العربية hello + + + + Bidirectional text in separate runs: + + + أحب اللغة العربية + hello + + + + Add pressable inline text child: + + + Click to add + + + + + Click anywhere to toggle pressability: + + + Click here + + + + Wrapped text pressability: + - - + > + abcdef + + - -`; - -exports[`snapshotAllPages Pointer Events 6`] = ` - - + - A: unspecified + Clear State - - - - B: box-only - - - - - - C: unspecified - - - - - - - C: explicitly unspecified - - - - - +`; + +exports[`snapshotAllPages LegacyTextInputTest 1`] = ` + + + + + - - - - + <Log Start> + `; -exports[`snapshotAllPages Pointer Events 7`] = ` +exports[`snapshotAllPages Linking 1`] = ` - + - A: overflow: - visible + Open + https://www.facebook.com - + - - - B: overflowing - - - + } + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + collapsable={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "opacity": 1, + } + } + > - - - C: fully outside - - - - - - D: child of fully outside - - - + Open + http://www.facebook.com + - - - + > + + Open + http://facebook.com + + - - -`; - -exports[`snapshotAllPages Pointer Events 8`] = ` - - - A: overflow: - hidden - - - - - - B: overflowing - - - - - - - C: fully outside - - - - - - D: child of fully outside - - - + Open + fb://notifications + - - - - - - -`; - -exports[`snapshotAllPages Popup 1`] = ` - - - The following tests popup Anchor - - - - Text Input to Anchor popup to: - - - - - + > + + + Open + geo:37.484847,-122.148386 + + + - - - Open Popup - - + } + > + Open + tel:9876543210 + `; -exports[`snapshotAllPages Popup 2`] = ` +exports[`snapshotAllPages Linking 2`] = ` - + - - - Toggle popup - - + "fontSize": 14, + "fontWeight": "400", + "margin": 8, + "textAlign": "center", + }, + ] + } + > + Open Settings + `; -exports[`snapshotAllPages Popup 3`] = ` - +exports[`snapshotAllPages Modal 1`] = ` + - - - - Toggle popup - - - + + Show Modal + - -`; - -exports[`snapshotAllPages Pressable 1`] = ` -[ - + Animation Type + + - - Press Me - + + + slide + + + + + + + none + + + + + + + fade + + + - , + - - , -] -`; - -exports[`snapshotAllPages Pressable 2`] = ` - - - Press Me + Status Bar Translucent 🟢 + - -`; - -exports[`snapshotAllPages Pressable 3`] = ` - - + Hardware Acceleration 🟢 + + - - Press Me - - + value={false} + /> - -`; - -exports[`snapshotAllPages Pressable 4`] = ` - - - - - -`; - -exports[`snapshotAllPages Pressable 5`] = ` - - + Presentation Style ⚫️ + + - - - + - radius 30 - + + fullScreen + + - - - - + - radius 150 - + + pageSheet + + - - + accessible={true} + disabled={false} + focusable={true} + hitSlop={4} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + > + + + formSheet + + + - - radius 70, with border - + + overFullScreen + + - with border, default color and radius + Transparent + - + Supported Orientation ⚫️ + + - - - - use foreground - - - -`; - -exports[`snapshotAllPages Pressable 6`] = ` -[ - - Text has built-in onPress handling - , - - - , -] -`; - -exports[`snapshotAllPages Pressable 7`] = ` - - - + + + portrait + + + + + + + portrait-upside-down + + + + - + + + landscape + + + + - Press Me - + + + landscape-left + + + + + + + landscape-right + + + - - -`; - -exports[`snapshotAllPages Pressable 8`] = ` - - - 3D Touch is not available on this device - - - + "fontWeight": "bold", + "margin": 3, + } + } + > + Actions + - - Press Me - + + + onShow + + + + + + + onDismiss ⚫️ + + + - -`; - -exports[`snapshotAllPages Pressable 9`] = ` - + + Backdrop Color ⚫️ + + + + + red + + + + - - Press Outside This View - + + + blue + + + + + + + default + + + - - - `; -exports[`snapshotAllPages Pressable 10`] = ` +exports[`snapshotAllPages Modal 2`] = ` + + onShow is called + 0 + times + + + onDismiss is called + 0 + times + - + + Show Modal + - - Native Methods Exist - `; -exports[`snapshotAllPages Pressable 11`] = ` -[ +exports[`snapshotAllPages Mouse Click Events 1`] = ` + + + Primary Pressed x + 0 + + + Auxiliary Pressed x + 0 + + + Secondary Pressed x + 0 + + + - + + + Clear state + + + + + + - Disabled Pressable + I'm a view! - , + + + + + I'm a button! + + + + + +`; + +exports[`snapshotAllPages Mouse Events 1`] = ` + + - - Enabled Pressable - - , -] + + + Hoverable + + text + + + + + This is a TouchableHighlight + + + + + + + This is an overlay view + + + + + + + + + `; -exports[`snapshotAllPages Pressable 12`] = ` - +exports[`snapshotAllPages Moving Light Example 1`] = ` + + + Size: 25 + + + Color: white + - - Press Me - + + + Toggle Light + + + + + Last Event Value: No Event yet + + `; -exports[`snapshotAllPages Pressable 13`] = ` -[ +exports[`snapshotAllPages Native Animated Example 1`] = ` + + + + Native: + + - - Press Me - - - , + /> + + + + JavaScript + : + + - - , - - - - Click to focus textbox - - - , -] + /> + + `; -exports[`snapshotAllPages Pressable 14`] = ` -[ +exports[`snapshotAllPages Native Animated Example 2`] = ` + + + + Native: + + - - Press Me - - - - , + + + + JavaScript + : + + - - - defaultText - - , -] + + `; -exports[`snapshotAllPages Pressable 15`] = ` -[ +exports[`snapshotAllPages Native Animated Example 3`] = ` + + + + Native: + + - - Press Me - - - , + /> + + + + JavaScript + : + + , -] + > + + + `; -exports[`snapshotAllPages Pressable 16`] = ` - +exports[`snapshotAllPages Native Animated Example 4`] = ` + + + + Native: + + + + + + + JavaScript + : + + + + > + + `; -exports[`snapshotAllPages Pressable 17`] = ` +exports[`snapshotAllPages Native Animated Example 5`] = ` + + + Native: + + + + /> + + + + JavaScript + : + + + + + +`; + +exports[`snapshotAllPages Native Animated Example 6`] = ` + + + + Native: + + + + > + + + + + JavaScript + : + + + + + +`; + +exports[`snapshotAllPages Native Animated Example 7`] = ` + + + + Native: + + + + > + + + + + JavaScript + : + + + + + +`; + +exports[`snapshotAllPages Native Animated Example 8`] = ` + + + + Native: + + + + > + + + + + JavaScript + : + + + + + +`; + +exports[`snapshotAllPages Native Animated Example 9`] = ` + + + + Native: + + + + > + + + + + JavaScript + : + + + + + +`; + +exports[`snapshotAllPages Native Animated Example 10`] = ` + + - + + + + Value: + 0 + + +`; + +exports[`snapshotAllPages Native Animated Example 11`] = ` + + + +`; + +exports[`snapshotAllPages Native Animated Example 12`] = ` + + - + + + + Scroll me sideways! + + + + + +`; + +exports[`snapshotAllPages Native Animated Example 13`] = ` + + + + Native: + + + + + + + + + JavaScript + : + + + + > + + + + +`; + +exports[`snapshotAllPages Native Animated Example 14`] = ` + + + Force JS Stalls + + + + + + Track JS Stalls + + + + +`; + +exports[`snapshotAllPages PanResponder Sample 1`] = ` + + + + Basic gesture handling + + + + > + + + + + +`; + +exports[`snapshotAllPages Performance API Examples 1`] = ` + - + + performance.memory + + + + > + + + + + + Click to update memory info + + + + + + + jsHeapSizeLimit: undefined bytes + + + totalJSHeapSize: undefined bytes + + + usedJSHeapSize: undefined bytes + + + + `; -exports[`snapshotAllPages Pressable 18`] = ` +exports[`snapshotAllPages Performance API Examples 2`] = ` - - Pressable with accessible=true and focusable=true - - - - - Pressable with accessible=false + > + performance.reactNativeStartupTiming - - Pressable with focusable=false - - - - - Pressable with accessible=false and focusable=false - + + + + Click to log some marks and measures + + + + `; -exports[`snapshotAllPages Pressable 19`] = ` - +exports[`snapshotAllPages Performance API Examples 4`] = ` + - - Pressable with ToolTip "Pressable" - + > + + + + + Click to update React startup timing + + + + + + + startTime: undefined ms + + + initializeRuntimeStart: undefined ms + + + executeJavaScriptBundleEntryPointStart: undefined ms + + + executeJavaScriptBundleEntryPointEnd: undefined ms + + + initializeRuntimeEnd: undefined ms + + + endTime: undefined ms + + + `; -exports[`snapshotAllPages Pressable 20`] = ` - +exports[`snapshotAllPages Performance Comparison Examples 1`] = ` + + - - Parent Pressable - - + + + + Show Bad + + + + + Show Good + + + + - - Child Pressable - + /> `; -exports[`snapshotAllPages Pressable 21`] = ` +exports[`snapshotAllPages Performance Comparison Examples 2`] = ` - - View #1, front is visible, back is hidden. - + "flex": 1, + }, + { + "backgroundColor": "#f2f2f7ff", + }, + ] + } +> - - Front - - - + + + Show Bad + + + + + Show Good + + + + - - Back (You should not see this) - + /> - +`; + +exports[`snapshotAllPages Performance Comparison Examples 3`] = ` + - View #2, front is hidden, back is visible. - + "flex": 1, + }, + { + "backgroundColor": "#f2f2f7ff", + }, + ] + } +> - - Front (You should not see this) - - - + + + Show Bad + + + + + Show Good + + + + - - Back - + /> `; -exports[`snapshotAllPages RTLExample 1`] = ` - - - - Left-to-Right - - + }, + { + "backgroundColor": "#f2f2f7ff", + }, + ] + } +> - - forceRTL - - - - - -`; - -exports[`snapshotAllPages RTLExample 2`] = ` - - - - - - LTR - + + Show Bad + + + + + Show Good + + + + +`; + +exports[`snapshotAllPages Performance Comparison Examples 5`] = ` + - - - + > + + Show Bad + + - Text Text Text + Show Good - - - Button - - - + /> + + +`; + +exports[`snapshotAllPages Performance Comparison Examples 6`] = ` + + - - - + > + + Show Bad + + - Text Text Text + Show Good - - - Button - - - + /> `; -exports[`snapshotAllPages RTLExample 3`] = ` - - + - - LTR - + + Get Pixel Density + + + +`; + +exports[`snapshotAllPages PixelRatio 2`] = ` + - - Left-to-Right language without text alignment. - - - من اليمين إلى اليسار اللغة دون محاذاة النص - - - מימין לשמאל השפה בלי יישור טקסט - - - -`; - -exports[`snapshotAllPages RTLExample 4`] = ` - - - - - LTR - + + Get Font Scale + + + +`; + +exports[`snapshotAllPages PixelRatio 3`] = ` + - - Left-to-Right language without text alignment. - - - من اليمين إلى اليسار اللغة دون محاذاة النص - - + Layout Size(dp): + + + + + - מימין לשמאל השפה בלי יישור טקסט - + + Pixel Size: + + + 0 + px + + `; -exports[`snapshotAllPages RTLExample 5`] = ` - - + + + Layout Size(dp): + + + + + - - - LTR - - + Nearest Layout Size: + + + + 0 + dp + + +`; + +exports[`snapshotAllPages PlatformColor 1`] = ` + +`; + +exports[`snapshotAllPages PlatformColor 2`] = ` + - Left-to-Right language without text alignment. - - - من اليمين إلى اليسار اللغة دون محاذاة النص + Unexpected Platform.OS: windows - - מימין לשמאל השפה בלי יישור טקסט - + /> `; -exports[`snapshotAllPages RTLExample 6`] = ` - - + Not applicable on this platform + +`; + +exports[`snapshotAllPages PlatformColor 4`] = ` + + + + Unexpected Platform.OS: windows + + + +`; + +exports[`snapshotAllPages Pointer Events 1`] = ` + + + + A: unspecified + + + + + + B: none + + + - LTR - + + + C: unspecified + + + - - LRT or RTL TextInput. - - + "fontSize": 9, + } + } + /> + `; -exports[`snapshotAllPages RTLExample 7`] = ` +exports[`snapshotAllPages Pointer Events 2`] = ` + A: unspecified + + + + + + B: none + + + - LTR - + + + C: unspecified + + + - - - - Without directional meaning - - - - With directional meaning - + /> `; -exports[`snapshotAllPages RTLExample 8`] = ` +exports[`snapshotAllPages Pointer Events 3`] = ` - LTR + A: unspecified - - - - - + + + B: box-none + + + + + + C: unspecified + + + + + + + C: explicitly unspecified + + + + + + + + + @@ -40040,1007 +42286,975 @@ exports[`snapshotAllPages RTLExample 8`] = ` `; -exports[`snapshotAllPages RTLExample 9`] = ` +exports[`snapshotAllPages Pointer Events 4`] = ` - - Styles - - - paddingStart: 50, - - - paddingEnd: 10 - - - - Demo: - - - The - teal - is padding. - + + A: unspecified + + + + + B: box-none + + + + + + C: unspecified + + + + - LTR + C: explicitly unspecified - -`; - -exports[`snapshotAllPages RTLExample 10`] = ` - - - Styles - - - marginStart: 50, - - - marginEnd: 10 - - - - Demo: - - - The green is margin. - + + + + + +`; + +exports[`snapshotAllPages Pointer Events 5`] = ` + + + A: unspecified + + + + + B: box-only + + + - LTR + C: unspecified - - - - -`; - -exports[`snapshotAllPages RTLExample 11`] = ` - - - Styles - - - start: 50 - - - - Demo: - - - The orange is position. - - - - - LTR + C: explicitly unspecified - - - Styles - - - end: 50 - - - - Demo: - - - The orange is position. - + + + + + +`; + +exports[`snapshotAllPages Pointer Events 6`] = ` + + + A: unspecified + + + + + B: box-only + + + - LTR + C: unspecified + + + + + + + C: explicitly unspecified - -`; - -exports[`snapshotAllPages RTLExample 12`] = ` - - - Styles - - - borderStartWidth: 10, - - - borderEndWidth: 50 - - - - Demo: - + + + + + +`; + +exports[`snapshotAllPages Pointer Events 7`] = ` + - - + + A: overflow: + visible + + + + - - - + + + + + + C: fully outside + + + + + - LTR - - + } + > + D: child of fully outside + - -`; - -exports[`snapshotAllPages RTLExample 13`] = ` - - - Styles - - - borderStartColor: 'red', - - - borderEndColor: 'green', - - - - Demo: - + + + + + +`; + +exports[`snapshotAllPages Pointer Events 8`] = ` + - - + + A: overflow: + hidden + + + + + + B: overflowing + + + + + + + C: fully outside + + + - - - LTR - - + } + > + D: child of fully outside + + + + + + `; -exports[`snapshotAllPages RTLExample 14`] = ` - +exports[`snapshotAllPages Popup 1`] = ` + - Styles - - - borderTopStartRadius: 10, - - - borderTopEndRadius: 20, - - - borderBottomStartRadius: 30, - - - borderBottomEndRadius: 40 + The following tests popup Anchor - - - Demo: - + + Text Input to Anchor popup to: + + + + - + - - - - LTR - - - + Open Popup + @@ -41048,555 +43262,286 @@ exports[`snapshotAllPages RTLExample 14`] = ` `; -exports[`snapshotAllPages RTLExample 15`] = ` - - + - Styles - - - borderStartStartRadius: 10, - - - borderStartEndRadius: 20, - - - borderEndStartRadius: 30, - - - borderEndEndRadius: 40 - - - - Demo: - - - - + - - - - LTR - - - - + Toggle popup + `; -exports[`snapshotAllPages RTLExample 16`] = ` - - + - Styles - - - borderStartColor: 'red', - - - borderEndColor: 'green', - - - borderStartWidth: 10, - - - borderEndWidth: 50, - - - borderTopStartRadius: 10, - - - borderTopEndRadius: 20, - - - borderBottomStartRadius: 30, - - - borderBottomEndRadius: 40 - - - - Demo: - - - - + - - - - LTR - - - - + Toggle popup + `; -exports[`snapshotAllPages ScrollView 1`] = ` - - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - + - - Item 11 - - + Press Me + - + , + + + , +] +`; + +exports[`snapshotAllPages Pressable 2`] = ` + - - Scroll to top + + Press Me + +`; + +exports[`snapshotAllPages Pressable 3`] = ` + - - Scroll to bottom + + Press me and move your finger + +`; + +exports[`snapshotAllPages Pressable 4`] = ` + + + + + Press Me + + + + + +`; + +exports[`snapshotAllPages Pressable 4`] = ` + - - Flash scroll indicators - + `; -exports[`snapshotAllPages ScrollView 2`] = ` +exports[`snapshotAllPages Pressable 5`] = ` - - LTR Layout - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - + + + + + - - Item 10 - - - - - Item 11 - - + radius 150 + - + + + + radius 70, with border + + + + + + - - Scroll to start + + with border, default color and radius + + - - Scroll to end - + + + use foreground + `; -exports[`snapshotAllPages ScrollView 3`] = ` - +exports[`snapshotAllPages Pressable 6`] = ` +[ + + Text has built-in onPress handling + , + , +] +`; + +exports[`snapshotAllPages Pressable 7`] = ` + + + - RTL Layout - - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - - - Scroll to start + + Press Me + + + + + +`; + +exports[`snapshotAllPages Pressable 8`] = ` + + + + 3D Touch is not available on this device + + + + + + Press Me + + +`; + +exports[`snapshotAllPages Pressable 9`] = ` + + - - Scroll to end + + Press Outside This View + + + `; -exports[`snapshotAllPages ScrollView 4`] = ` - - + - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - + + - Scrolling enabled = true + Native Methods Exist + +`; + +exports[`snapshotAllPages Pressable 11`] = ` +[ + + Disabled Pressable + + , + - - Disable Scrolling + + Enabled Pressable - + , +] +`; + +exports[`snapshotAllPages Pressable 12`] = ` + - - Enable Scrolling + + Press Me `; -exports[`snapshotAllPages ScrollView 5`] = ` - - + + + Press Me + + + , + + + , + - + Click to focus textbox + + + , +] +`; + +exports[`snapshotAllPages Pressable 14`] = ` +[ + + - - Item 0 - - - - - Item 1 - - - + - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - + Press Me + - - - - - setContentContainerStyle - - + value={false} + /> + , + + + + defaultText + + , +] +`; + +exports[`snapshotAllPages Pressable 15`] = ` +[ + - - setContentInset + + Press Me - - + , + , +] `; -exports[`snapshotAllPages ScrollView 6`] = ` +exports[`snapshotAllPages Pressable 16`] = ` - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - - - - Deceleration Rate: normal - - - + testID="advanced_borders_pressable" + /> `; -exports[`snapshotAllPages ScrollView 7`] = ` - - + - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - - + - - setDisableIntervalMomentum: false - - - + - - setDisableScrollViewPanResponder: false - - - - -`; - -exports[`snapshotAllPages ScrollView 8`] = ` - - - - - STICKY HEADER - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - - + - - invertStickyHeaders: false - - - + - - Scroll to top - - - + - - Scroll to bottom - - - + } + accessible={true} + disabled={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "backgroundColor": "black", + "height": 50, + "opacity": 0.5, + "width": 50, + } + } + /> + + + + + `; -exports[`snapshotAllPages ScrollView 9`] = ` - - + - - - - Sticky Header 1 - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - + Pressable with accessible=true and focusable=true + + + + + Pressable with accessible=false + + + + + Pressable with focusable=false + + + + + Pressable with accessible=false and focusable=false + + + +`; + +exports[`snapshotAllPages Pressable 19`] = ` + + + + Pressable with ToolTip "Pressable" + + + +`; + +exports[`snapshotAllPages Pressable 20`] = ` + + + + Parent Pressable + + - - Item 8 - - - - - Item 9 - - - + + Child Pressable + + + + +`; + +exports[`snapshotAllPages Pressable 21`] = ` + + + View #1, front is visible, back is hidden. + + + - - Item 10 - - - - - Item 11 - - - - - Sticky Header 2 - - - + + Front + + + - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - Sticky Header 3 - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - + } + > + + Back (You should not see this) + - - + + + View #2, front is hidden, back is visible. + + - Scroll to top + Front (You should not see this) - Scroll to bottom + Back `; -exports[`snapshotAllPages ScrollView 10`] = ` +exports[`snapshotAllPages Pressable 23`] = ` - - - - - - Press to change color - - - - + + Pressable 1 of 3 + + + + + Pressable 2 of 3 + + + + + Pressable 3 of 3 + + + +`; + +exports[`snapshotAllPages RTLExample 1`] = ` + + + + Left-to-Right + + + + + forceRTL + + + - + + + +`; + +exports[`snapshotAllPages RTLExample 2`] = ` + + + + + + LTR + + + + + + + + - + + + > + + Text Text Text + + + + - + + Button + + + + + + - + - + + + > + + Text Text Text + + - - - - - scroll to top - - - - - - - - - scroll to bottom - - + } + > + Button + @@ -45384,838 +46631,746 @@ exports[`snapshotAllPages ScrollView 10`] = ` `; -exports[`snapshotAllPages ScrollView 11`] = ` +exports[`snapshotAllPages RTLExample 3`] = ` - - - - - - Button - - + "borderWidth": 1, + }, + { + "backgroundColor": "gray", + }, + ] + } + > - - Item 0 + + LTR - + + + - - Item 1 - - - + Left-to-Right language without text alignment. + + - - Item 2 - - - + من اليمين إلى اليسار اللغة دون محاذاة النص + + - - Item 3 - - - + מימין לשמאל השפה בלי יישור טקסט + + + +`; + +exports[`snapshotAllPages RTLExample 4`] = ` + + + + - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 + + LTR - - - Keyboard Dismiss Mode - + - - - none - - - + + من اليمين إلى اليسار اللغة دون محاذاة النص + + - - on-drag - - + מימין לשמאל השפה בלי יישור טקסט + - +`; + +exports[`snapshotAllPages RTLExample 5`] = ` + + - Keyboard Should Persist taps - - - - never - + + + LTR + + - + + - - always - - - + - - handled - - + من اليمين إلى اليسار اللغة دون محاذاة النص + + + מימין לשמאל השפה בלי יישור טקסט + `; -exports[`snapshotAllPages ScrollView 12`] = ` +exports[`snapshotAllPages RTLExample 6`] = ` - - Content Size Changed: - original - - - - - - Item 0 - - - - - Item 1 - - + "borderRadius": 3, + "borderWidth": 1, + }, + { + "backgroundColor": "gray", + }, + ] + } + > - - Item 2 + + LTR - + + + + LRT or RTL TextInput. + + + + +`; + +exports[`snapshotAllPages RTLExample 7`] = ` + + + - - Item 3 - - - - - Item 4 - - + "borderRadius": 3, + "borderWidth": 1, + }, + { + "backgroundColor": "gray", + }, + ] + } + > - - Item 5 + + LTR - + + + + - - Item 6 - - - - - Item 7 - - - + - - Item 8 - - - + + + - - Item 9 - - - - - Item 10 - - - + - - Item 11 - - + With directional meaning + - + + +`; + +exports[`snapshotAllPages RTLExample 8`] = ` + - - Change Content Size - - - -`; - -exports[`snapshotAllPages ScrollView 13`] = ` - - - Scroll State: - none - - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - + "borderRadius": 3, + "borderWidth": 1, + }, + { + "backgroundColor": "gray", + }, + ] + } + > - - Item 3 + + LTR - + + + - - Item 4 - - - + - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - + + + +`; + +exports[`snapshotAllPages RTLExample 9`] = ` + + + Styles + + + paddingStart: 50, + + + paddingEnd: 10 + + + + Demo: + + + The + teal + is padding. + + + - - Item 8 - - + } + > - - Item 9 - - - - - Item 10 - - - - - Item 11 - + + + + LTR + + + - + `; -exports[`snapshotAllPages ScrollView 14`] = ` +exports[`snapshotAllPages RTLExample 10`] = ` + + Styles + - onScroll: - none + marginStart: 50, - + marginEnd: 10 + + + - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - + + The green is margin. + + + - - Item 8 - - + } + > - - Item 9 - - - - - Item 10 - - - - - Item 11 - + + + + LTR + + + - + `; -exports[`snapshotAllPages ScrollView 15`] = ` +exports[`snapshotAllPages RTLExample 11`] = ` - + + Styles + + + start: 50 + + + + Demo: + + + The orange is position. + + - - - - - Item 0 - - + } + > - - Item 1 - - - - - Item 2 - - - - - Item 3 - + + + + LTR + + + - + + + + Styles + + + end: 50 + + + + Demo: + + + The orange is position. + + + - - Item 4 - - + } + > - - Item 5 - - - - - Item 6 - - - - - Item 7 - + + + + LTR + + + - + + +`; + +exports[`snapshotAllPages RTLExample 12`] = ` + + + Styles + + + borderStartWidth: 10, + + + borderEndWidth: 50 + + + + Demo: + + + - - Item 8 - - - + + - - Item 9 - - - - - Item 10 - - - - - Item 11 - + } + } + > + + + + LTR + + + + - + `; -exports[`snapshotAllPages ScrollView 16`] = ` +exports[`snapshotAllPages RTLExample 13`] = ` - - - + + borderStartColor: 'red', + + + borderEndColor: 'green', + + + + Demo: + + + - - Item 0 - - - + + - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - + } + } + > + + + + LTR + + + + - - + +`; + +exports[`snapshotAllPages RTLExample 14`] = ` + + + Styles + + + borderTopStartRadius: 10, + + + borderTopEndRadius: 20, + + + borderBottomStartRadius: 30, + + + borderBottomEndRadius: 40 + + + + Demo: + + - - removeClippedSubviews: false - + + + + + + + LTR + + + + + + `; -exports[`snapshotAllPages ScrollView 17`] = ` +exports[`snapshotAllPages RTLExample 15`] = ` - + Styles + + + borderStartStartRadius: 10, + + + borderStartEndRadius: 20, + + + borderEndStartRadius: 30, + + + borderEndEndRadius: 40 + + + - - + + - - Item 0 - - - + + - - Item 1 - - - + + + + LTR + + + + + + + + +`; + +exports[`snapshotAllPages RTLExample 16`] = ` + + + Styles + + + borderStartColor: 'red', + + + borderEndColor: 'green', + + + borderStartWidth: 10, + + + borderEndWidth: 50, + + + borderTopStartRadius: 10, + + + borderTopEndRadius: 20, + + + borderBottomStartRadius: 30, + + + borderBottomEndRadius: 40 + + + + Demo: + + + + + + + + + LTR + + + + + + + + +`; + +exports[`snapshotAllPages ScrollView 1`] = ` + + + + + + Item 0 + + + + + Item 1 + + + - setScrollIndicatorInsets + Scroll to top - showsHorizontalScrollIndicator: true + Scroll to bottom - showsVerticalScrollIndicator: true + Flash scroll indicators `; -exports[`snapshotAllPages ScrollView 18`] = ` +exports[`snapshotAllPages ScrollView 2`] = ` - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - + } + > + LTR Layout + + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + - + - - Item 10 - - - - - Item 11 - - + } + accessible={true} + collapsable={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "alignItems": "center", + "backgroundColor": "#cccccc", + "borderRadius": 3, + "margin": 5, + "opacity": 1, + "padding": 5, + } + } + testID="scroll_to_start_button" + > + + Scroll to start + - - - - snapToEnd: true - + testID="scroll_to_end_button" + > + + Scroll to end + + + +`; + +exports[`snapshotAllPages ScrollView 3`] = ` + - - snapToStart: true + + RTL Layout - - - - setSnapToInterval - - - + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + - - reset snapToOffsets - - - -`; - -exports[`snapshotAllPages ScrollView 19`] = ` - - - - Item 0 + Scroll to start - Item 1 + Scroll to end - + +`; + +exports[`snapshotAllPages ScrollView 4`] = ` + + + - - Item 2 - - - - - Item 3 - - - + - - Item 4 - - - - - Item 5 - - + + + + Item 0 + + + + - - Item 6 - - - - - Item 7 - - - - Item 8 + Scroll to start - - Item 9 - - - - - Item 10 - - - - Item 11 + Scroll to end - + `; -exports[`snapshotAllPages ScrollView 20`] = ` +exports[`snapshotAllPages ScrollView 5`] = ` + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + Scrolling enabled = true + + + + Disable Scrolling + + + + + Enable Scrolling + + + +`; + +exports[`snapshotAllPages ScrollView 5`] = ` + @@ -48540,7 +50546,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "minWidth": 96, "padding": 5, }, - null, + undefined, ] } > @@ -48558,7 +50564,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "minWidth": 96, "padding": 5, }, - null, + undefined, ] } > @@ -48576,7 +50582,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "minWidth": 96, "padding": 5, }, - null, + undefined, ] } > @@ -48594,7 +50600,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "minWidth": 96, "padding": 5, }, - null, + undefined, ] } > @@ -48612,7 +50618,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "minWidth": 96, "padding": 5, }, - null, + undefined, ] } > @@ -48620,65 +50626,117 @@ exports[`snapshotAllPages ScrollView 20`] = ` Item 5 - - - - + + Item 6 + + + + + Item 7 + + + - - Add to top - + > + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + - Remove top + setContentContainerStyle - Change height top + setContentInset - +`; + +exports[`snapshotAllPages ScrollView 6`] = ` + + - + + + Item 0 + + + + + Item 1 + + + - - Add to end - - - + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + - - Remove end - + > + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + - Change height end + Deceleration Rate: normal `; -exports[`snapshotAllPages ScrollViewAnimated 1`] = ` - - + - + + Item 0 + + + + + Item 1 + + + - + Item 2 + + + - - Scroll me horizontally - - + "backgroundColor": "#cccccc", + "borderRadius": 3, + "margin": 5, + "minWidth": 96, + "padding": 5, + }, + undefined, + ] + } + > + + Item 3 + - - - -`; - -exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` - - - + + Item 4 + + + + + Item 5 + + + - - Item 0 - - - + Item 6 + + + + + Item 7 + + + + + Item 8 + + + - - Item 1 - + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + - - Item 2 + + setDisableIntervalMomentum: false - - Item 3 + + setDisableScrollViewPanResponder: false - - - + +`; + +exports[`snapshotAllPages ScrollView 8`] = ` + + + + + STICKY HEADER + + + + Item 0 + + + + + Item 1 + + + - - Item 0 - - - + + Item 2 + + + - - Item 1 - - - + + Item 3 + + + - - Item 2 - - - + + Item 4 + + + - - Item 3 - - - + + Item 5 + + + - - Item 4 - - - + + Item 6 + + + - - Item 5 - - - + + Item 7 + + + - - Item 6 - - - + + Item 8 + + + - - Item 7 - - - + + Item 9 + + + - - Item 8 - - - + + Item 10 + + + - - Item 9 - - - + + Item 11 + + + + + + + + invertStickyHeaders: false + + + + + Scroll to top + + + + + Scroll to bottom + + + + +`; + +exports[`snapshotAllPages ScrollView 9`] = ` + + + + + + Sticky Header 1 + + + - - Item 10 - - - + + Item 0 + + + + + Item 1 + + + - - Item 11 - - - + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + - - Item 12 - - - + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + - - Item 13 - - - + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + - - Item 14 - - - + + Item 11 + + + + + Sticky Header 2 + + + - - Item 15 - - - + + Item 0 + + + + + Item 1 + + + - - Item 16 - - - + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + - - Item 17 - - - + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + - - Item 18 - - - + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + - - Item 19 - - + "minWidth": 96, + "padding": 5, + }, + undefined, + ] + } + > + + Item 11 + - + + + Sticky Header 3 + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + - - Item 5 + + Scroll to top - - Item 6 + + Scroll to bottom - + +`; + +exports[`snapshotAllPages ScrollView 10`] = ` + + + - - Item 7 - - - - - Item 8 - - - + + + + Press to change color + + + + + + + + + + + + + + + + - - Item 9 - - - + + + scroll to top + + + + + - - Item 10 - + + + + scroll to bottom + + + + - - - Item 11 - - + + + + + Press to change color + + + + + + + + + + + + + + + + +`; + +exports[`snapshotAllPages ScrollView 11`] = ` + + + + + + + Button + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + + Keyboard Dismiss Mode + + - - Item 12 + + none - - Item 13 + + on-drag - + + Keyboard Should Persist taps + + - - Item 14 - - + } + > - - Item 15 + + never - - Item 16 + + always - - Item 17 + + handled - + +`; + +exports[`snapshotAllPages ScrollView 12`] = ` + + + Content Size Changed: + original + + + + - - Item 18 - - - + Item 0 + + + + + Item 1 + + + + + Item 2 + + + - - Item 19 - - - - - + Item 3 + + + + + Item 4 + + + + + Item 5 + + + - - Item 0 - - - + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + - - Item 1 - - - + + Item 9 + + + - - Item 2 - - - + + Item 10 + + + + + Item 11 + + + + + + + Change Content Size + + + +`; + +exports[`snapshotAllPages ScrollView 13`] = ` + + + Scroll State: + none + + + + + + Item 0 + + + - - Item 3 - - - + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + - - Item 4 - - - + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + - - Item 5 - - - + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + - - Item 6 - - - + + Item 10 + + + - - Item 7 - - - + + Item 11 + + + + + +`; + +exports[`snapshotAllPages ScrollView 14`] = ` + + + onScroll: + none + + + + + + Item 0 + + + - - Item 8 - - - + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + - - Item 9 - - - + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + - - Item 10 - - - + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + - - Item 11 - - - + + Item 10 + + + + + Item 11 + + + + + +`; + +exports[`snapshotAllPages ScrollView 15`] = ` + + + } + style={ + [ + { + "backgroundColor": "#eeeeee", + "height": 300, + }, + { + "height": 200, + }, + ] + } + > + + + - - Item 12 - - - + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + - - Item 13 - - - + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + - - Item 14 - - - + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + - - Item 15 - - - + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + +`; + +exports[`snapshotAllPages ScrollView 16`] = ` + + + + - - Item 16 - - - + + Item 0 + + + - - Item 17 - - - + + Item 1 + + + - - Item 18 - - - + + Item 2 + + + - - Item 19 - - + "minWidth": 96, + "padding": 5, + }, + undefined, + ] + } + > + + Item 3 + - - - - - - Item 0 - - - + + Item 4 + + + + + Item 5 + + + - - Item 1 - - - + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + - - Item 2 - - - + + Item 9 + + + + + Item 10 + + + - - Item 3 - - - + + Item 11 + + + + + + + removeClippedSubviews: false + + + +`; + +exports[`snapshotAllPages ScrollView 17`] = ` + + + + + + Item 0 + + + + + Item 1 + + + - - Item 4 - - - + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + - - Item 5 - - - + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + - - Item 6 - - - + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + - - Item 7 - - - + + Item 11 + + + + + + + setScrollIndicatorInsets + + + + + showsHorizontalScrollIndicator: true + + + + + showsVerticalScrollIndicator: true + + + +`; + +exports[`snapshotAllPages ScrollView 18`] = ` + + + + + + Item 0 + + + - - Item 8 - - - + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + - - Item 9 - - - + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + - - Item 10 - - - + + Item 7 + + + + + Item 8 + + + - - Item 11 - - - - - Item 12 - - - - - Item 13 - - - - - Item 14 - - - - - Item 15 - - - - - Item 16 - - - - - Item 17 - - - + + Item 9 + + + - - Item 18 - - - + + Item 10 + + + - - Item 19 - - + "minWidth": 96, + "padding": 5, + }, + undefined, + ] + } + > + + Item 11 + - - + + + + snapToEnd: true + + + + + snapToStart: true + + + + + setSnapToInterval + + + + + reset snapToOffsets + + + +`; + +exports[`snapshotAllPages ScrollView 19`] = ` + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + +`; + +exports[`snapshotAllPages ScrollView 20`] = ` + + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + + + + Add to top + + + + + Remove top + + + + + Change height top + + + + + + + Add to end + + + + + Remove end + + + + + Change height end + + + + +`; + +exports[`snapshotAllPages ScrollViewAnimated 1`] = ` + + + + + + + + Scroll me horizontally + + + + + + +`; + +exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + Item 12 + + + + + Item 13 + + + + + Item 14 + + + + + Item 15 + + + + + Item 16 + + + + + Item 17 + + + + + Item 18 + + + + + Item 19 + + + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + Item 12 + + + + + Item 13 + + + + + Item 14 + + + + + Item 15 + + + + + Item 16 + + + + + Item 17 + + + + + Item 18 + + + + + Item 19 + + + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + Item 12 + + + + + Item 13 + + + + + Item 14 + + + + + Item 15 + + + + + Item 16 + + + + + Item 17 + + + + + Item 18 + + + + + Item 19 + + + + + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + Item 12 + + + + + Item 13 + + + + + Item 14 + + + + + Item 15 + + + + + Item 16 + + + + + Item 17 + + + + + Item 18 + + + + + Item 19 + + + + + - + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + Item 12 + + + + + Item 13 + + + + + Item 14 + + + + + Item 15 + + + + + Item 16 + + + + + Item 17 + + + + + Item 18 + + + + + Item 19 + + + + + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + Item 12 + + + + + Item 13 + + + + + Item 14 + + + + + Item 15 + + + + + Item 16 + + + + + Item 17 + + + + + Item 18 + + + + + Item 19 + + + + + + +`; + +exports[`snapshotAllPages SectionList 1`] = ` +[ + + + Menu + + , + + + + contentInset top: 44 + + + + + + Toggle header size + + + + + + + + + + Main dishes + + + + + + Pizza + + + + + + + Burger + + + + + + + Risotto + + + + + + + Sides + + + + + + French Fries + + + + + + + Onion Rings + + + + + + + Fried Shrimps + + + + + + + + , +] +`; + +exports[`snapshotAllPages SectionList 2`] = ` + + + + + + + + Test + + + + + + + + + + Main dishes + + + + + Pizza + + + + + - Item 0 + Burger + + - Item 1 + Risotto + + + + + Sides + + + - Item 2 + French Fries + + - Item 3 + Onion Rings + + - Item 4 + Fried Shrimps + + + + + + +`; + +exports[`snapshotAllPages SectionList 3`] = ` + + + + + + + + + Main dishes + + + - Item 5 + Pizza + + - Item 6 + Burger + + - Item 7 + Risotto + + + + + Sides + + + - Item 8 + French Fries + + - Item 9 + Onion Rings + + + + Fried Shrimps + + + + + + + + +`; + +exports[`snapshotAllPages SectionList 4`] = ` + + + + + - + + + + - Item 10 + Section separator for leading undefined and trailing Pizza has not been pressed - - Item 11 - + + Pizza + + + + + separator for leading Pizza and trailing Burger has not been pressed + + + + - - Item 12 - + + Burger + + + + + separator for leading Burger and trailing Risotto has not been pressed + + + + + + Risotto + + + + + Section separator for leading Risotto and trailing undefined has not been pressed + + + + + + + - + + + + - Item 13 + Section separator for leading undefined and trailing French Fries has not been pressed - - Item 14 - + + French Fries + + + + + separator for leading French Fries and trailing Onion Rings has not been pressed + + + + - - Item 15 - + + Onion Rings + + + + + separator for leading Onion Rings and trailing Fried Shrimps has not been pressed + + + + + + Fried Shrimps + + + + + Section separator for leading Fried Shrimps and trailing undefined has not been pressed + + + + + + + + + +`; + +exports[`snapshotAllPages SectionList 5`] = ` + + + + stickySectionHeadersEnabled false + + + + + + Sticky On + + + + + + + + + - - Item 16 - - + Main dishes + + + - Item 17 + Pizza + + - Item 18 + Burger + + - Item 19 + Risotto - - - + + + + Sides + + + - Item 0 + French Fries + + - Item 1 + Onion Rings + + - Item 2 + Fried Shrimps - + + + + + +`; + +exports[`snapshotAllPages SectionList 6`] = ` + + + + inverted false + + + + + + Toggle true + + + + + + + + + - - Item 3 - - + Main dishes + + + - Item 4 + Pizza + + - Item 5 + Burger + + - Item 6 + Risotto - + + + - - Item 7 - - + Sides + + + - Item 8 + French Fries + + - Item 9 + Onion Rings + + - Item 10 + Fried Shrimps - + + + + + +`; + +exports[`snapshotAllPages SectionList 7`] = ` + + + + - - Item 11 - - + Main dishes + + + - Item 12 + Pizza + + - Item 13 + Burger + + - Item 14 + Risotto + + + + + Sides + + + - Item 15 + French Fries + + - Item 16 + Onion Rings + + - Item 17 + Fried Shrimps + + + - - Item 18 + + Virtualized + : + - - Item 19 - - - - - - -`; - -exports[`snapshotAllPages SectionList 1`] = ` -[ - - - Menu - - , - - - - contentInset top: 44 - - - - - - Toggle header size - - - - - - - - - + Log Viewable + : + + - Main dishes - + value={false} + /> - + + Debug + : + + - - Pizza - - + } + value={false} + /> - + + Inverted + : + + - - Burger - - + } + value={false} + /> + + + + scroll to: + + - - Risotto - + + + Top + + + - - - Sides - - - - - French Fries - + + + 3rd Section + + + - - Onion Rings - + + + 6th Section + + + - - Fried Shrimps - + + + Out of Viewable Area (See warning) + + + - - - - , -] -`; - -exports[`snapshotAllPages SectionList 2`] = ` - - - + - - - - - Test - - - - - - - Onion Rings - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 3`] = ` - - - - - - - - - Main dishes - + + Onion Rings + + + + Fried Shrimps + + + + + - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 4`] = ` - - - - - - Main dishes - - - - - - - Section separator for leading undefined and trailing Pizza has not been pressed - - - - - Pizza - - - - - separator for leading Pizza and trailing Burger has not been pressed - - - - - - - - - Burger - - - - - separator for leading Burger and trailing Risotto has not been pressed - - - - - - - - - Risotto - - - - - Section separator for leading Risotto and trailing undefined has not been pressed - - - - - - - - Sides - - - - - - - Section separator for leading undefined and trailing French Fries has not been pressed - - - - - French Fries - - - - - separator for leading French Fries and trailing Onion Rings has not been pressed - - - - - - - - - Onion Rings - - - - - separator for leading Onion Rings and trailing Fried Shrimps has not been pressed - - - - - - - - - Fried Shrimps - - - - - Section separator for leading Fried Shrimps and trailing undefined has not been pressed - - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 5`] = ` - - - - stickySectionHeadersEnabled false - - - - - - Sticky On - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 6`] = ` - - - - inverted false - - - - - - Toggle true - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 7`] = ` - - - - - - - - Virtualized - : - - - - - - Log Viewable - : - - - - - - Debug - : - - - - - - Inverted - : - - - - - - - - scroll to: - - - - - - - Top - - - - - - - - - - - 3rd Section - - - - - - - - - - - 6th Section - - - - - - - - - - - Out of Viewable Area (See warning) - - - - - - - - - + } + refreshing={false} + renderItem={[Function]} + scrollEventThrottle={0.0001} + stickyHeaderIndices={ + [ + 1, + 3, + 6, + 10, + ] + } + style={ + { + "backgroundColor": "white", + } + } + viewabilityConfig={ + { + "minimumViewTime": 3000, + "viewAreaCoveragePercentThreshold": 100, + "waitForInteraction": true, + } + } + > + + + + + + + LIST HEADER + + + + + + + + + SECTION HEADER: + empty section + + + + + + + + SECTION FOOTER: + empty section + + + + + + + + SECTION HEADER: + s1 + + + + + + + + + SECTION SEPARATOR + + + + + Item In Header Section + - + Section s1 + + + + + + SECTION SEPARATOR + + + + + + + + SECTION FOOTER: + s1 + + + + + + + + SECTION HEADER: + s2 + + + + + + + + + SECTION SEPARATOR + + + + + ITEM SEPARATOR + + + + + + + + + SECTION SEPARATOR + + + + + + + + SECTION FOOTER: + s2 + + + + + + + + SECTION HEADER: + 0 - 9 + + + + + + + + + + + LIST FOOTER + + + + + + + + + + + + Main dishes + + + + + + Pizza + + + + + + + Burger + + + + + + + Risotto + + + + + + + Sides + + + + + + French Fries + + + + + + + Onion Rings + + + + + + + Fried Shrimps + + + + + + + + +`; + +exports[`snapshotAllPages SectionList 11`] = ` + + + + + + + + + + Main dishes + + + + + + Pizza + + + + + + + Burger + + + + + + + Risotto + + + + + + + Sides + + + + + + French Fries + + + + + + + Onion Rings + + + + + + + Fried Shrimps + + + + + + + + +`; + +exports[`snapshotAllPages SectionList 12`] = ` + + + + + + + + + + Main dishes + + + + + + Pizza + + + + + + + Burger + + + + + + + Risotto + + + + + + + Sides + + + + + + French Fries + + + + + + + Onion Rings + + + + + + + Fried Shrimps + + + + + + + + +`; + +exports[`snapshotAllPages Share 1`] = ` + + + Native Experience + + + Our top priority for React Native is to match the expectations people have for each platform. This is why React Native renders to platform primitives. We value native look-and-feel over cross-platform consistency. For example, the TextInput in React Native renders to a UITextField on iOS. This ensures that integration with password managers and keyboard controls work out of the box. By using platform primitives, React Native apps are also able to stay up-to-date with design and behavior changes from new releases of Android and iOS. + + + + + + SHARE + + + + + +`; + +exports[`snapshotAllPages Share 2`] = ` + + + Massive Scale + + + Hundreds of screens in the Facebook app are implemented with React Native. The Facebook app is used by billions of people on a huge range of devices. This is why we invest in the most challenging problems at scale. Deploying React Native in our apps lets us identify problems that we wouldn’t see at a smaller scale. For example, Facebook focuses on improving performance across a broad spectrum of devices from the newest iPhone to many older generations of Android devices. This focus informs our architecture projects such as Hermes, Fabric, and TurboModules. + + + + + + SHARE + + + + + +`; + +exports[`snapshotAllPages Share 3`] = ` + + + action: + null + + + Create native apps + + + React Native combines the best parts of native development with React, a best-in-class JavaScript library for building user interfaces. + + + + + + SHARE + + + + + +`; + +exports[`snapshotAllPages SwipeableCard 1`] = ` +[ + + + + + + + + + Section # + 0 + + + + + + + + Section # + 1 + + + + + + + + Section # + 2 + + + + + + + + Section # + 3 + + + + + + + + Section # + 4 + + + + + + + + , + + + + + + + + + Section # + 0 + + + + + + + + Section # + 1 + + + + + + + + Section # + 2 + + + + + + + + Section # + 3 + + + + + + + + Section # + 4 + + + + + + + + , +] +`; + +exports[`snapshotAllPages Switch 1`] = ` + + + + + Off + + + + + + On + + + +`; + +exports[`snapshotAllPages Switch 2`] = ` + + + + + Off + + + + + + On + + + +`; + +exports[`snapshotAllPages Switch 3`] = ` + + + + + + Off + + + + + + + On + + + +`; + +exports[`snapshotAllPages Switch 4`] = ` + +`; + +exports[`snapshotAllPages Switch 5`] = ` + + + + +`; + +exports[`snapshotAllPages Switch 6`] = ` + + + +`; + +exports[`snapshotAllPages Switch 7`] = ` + + + +`; + +exports[`snapshotAllPages Switch 8`] = ` + + + + + + + + + + +`; + +exports[`snapshotAllPages Text 1`] = ` + + + Text with background color only + + + Text with background color and uniform borderRadii + + + Text with background color and non-uniform borders + + + Text with borderWidth + + + Text with background AND borderWidth + + +`; + +exports[`snapshotAllPages Text 2`] = ` + + + Truncated text is baaaaad. + + + Shrinking to fit available space is much better! + + + Add text to me to watch me shrink! + + + Multiline text component shrinking is supported, watch as this reeeeaaaally loooooong teeeeeeext grooooows and then shriiiinks as you add text to me! ioahsdia soady auydoa aoisyd aosdy + + + Text limited by height, watch as this reeeeaaaally loooooong teeeeeeext grooooows and then shriiiinks as you add text to me! ioahsdia soady auydoa aoisyd aosdy + + + + Differently sized nested elements will shrink together. + + + LARGE TEXT! + + + + + Reset + + + Remove Text + + + Add Text + + + +`; + +exports[`snapshotAllPages Text 3`] = ` +[ + + + + This is adjusting text. + + + , + + + + + + Set Height to 20 + + + + + , + + + + + + Set Height to 40 + + + + + , + + + + + + Set Height to 60 + + + + + , +] +`; + +exports[`snapshotAllPages Text 4`] = ` + + + None: + + WillNotHaveAHyphenWhenBreakingForNewLine + , + + + Full: + + WillHaveAHyphenWhenBreakingForNewLine + , +] +`; + +exports[`snapshotAllPages Text 6`] = ` + + This text is indented by 10px padding on all sides. + +`; + +exports[`snapshotAllPages Text 7`] = ` + + + Increase size + + + Decrease size + + + + Language + + + + + + Arabic + + + + + + + Chinese + + + + + - } - refreshing={false} - renderItem={[Function]} - scrollEventThrottle={0.0001} - stickyHeaderIndices={ - [ - 1, - 3, - 6, - 10, - ] - } - style={ - { - "backgroundColor": "white", - } - } - viewabilityConfig={ - { - "minimumViewTime": 3000, - "viewAreaCoveragePercentThreshold": 100, - "waitForInteraction": true, - } - } - > - - - - - - - LIST HEADER - - - - + English + + + - - - SECTION HEADER: - empty section - - - - - - - - SECTION FOOTER: - empty section - - - + Emoji + + + - - - SECTION HEADER: - s1 - - - + German + + + - - - - SECTION SEPARATOR - - - - - Item In Header Section - - - Section s1 - - - - - - SECTION SEPARATOR - - - + } + > + Greek + + + - - - SECTION FOOTER: - s1 - - - + Hebrew + + + - - - SECTION HEADER: - s2 - - - + Hindi + + + - - - - SECTION SEPARATOR - - - - - ITEM SEPARATOR - - - + } + > + Igbo + + + - - - - SECTION SEPARATOR - - - + } + > + Irish + + + - - - SECTION FOOTER: - s2 - - - + Japanese + + + - - - SECTION HEADER: - 0 - 9 - - - + Korean + + + - - - - - - LIST FOOTER - - - + Norwegian + - - - -`; - -exports[`snapshotAllPages Share 1`] = ` - - - Native Experience - - - Our top priority for React Native is to match the expectations people have for each platform. This is why React Native renders to platform primitives. We value native look-and-feel over cross-platform consistency. For example, the TextInput in React Native renders to a UITextField on iOS. This ensures that integration with password managers and keyboard controls work out of the box. By using platform primitives, React Native apps are also able to stay up-to-date with design and behavior changes from new releases of Android and iOS. - - - - - SHARE - + + Polish + + - - - -`; - -exports[`snapshotAllPages Share 2`] = ` - - - Massive Scale - - - Hundreds of screens in the Facebook app are implemented with React Native. The Facebook app is used by billions of people on a huge range of devices. This is why we invest in the most challenging problems at scale. Deploying React Native in our apps lets us identify problems that we wouldn’t see at a smaller scale. For example, Facebook focuses on improving performance across a broad spectrum of devices from the newest iPhone to many older generations of Android devices. This focus informs our architecture projects such as Hermes, Fabric, and TurboModules. - - - - - SHARE - - - - - -`; - -exports[`snapshotAllPages Share 3`] = ` - - - action: - null - - - Create native apps - - - React Native combines the best parts of native development with React, a best-in-class JavaScript library for building user interfaces. - - - + + Romanian + + + - - SHARE - + + Russian + + - - - -`; - -exports[`snapshotAllPages SwipeableCard 1`] = ` -[ - - - - - - - - Section # - 0 - - - - - - - - Section # - 1 - - - - - - - - Section # - 2 - - - - - - - - Section # - 3 - - - - - - - - Section # - 4 - - - - - + + Swedish + + - - , - - - + - - - - - Section # - 0 - - - - - - - - Section # - 1 - - - - - - - - Section # - 2 - - - - - - - - Section # - 3 - - - - - - - - Section # - 4 - - - - - + + Thai + + - , -] -`; - -exports[`snapshotAllPages Switch 1`] = ` - - - + + - - Off + The quick brown fox jumps over the lazy dog. - + Alignment: + + - - On - - - -`; - -exports[`snapshotAllPages Switch 2`] = ` - - - - - Off - - - - + + + Left Align + + + + - - On - - - -`; - -exports[`snapshotAllPages Switch 3`] = ` - - - - - - Off - - - - + + Center Align + + + + - - - On - + + + Right Align + + + `; -exports[`snapshotAllPages Switch 4`] = ` - -`; - -exports[`snapshotAllPages Switch 5`] = ` - - - + Sans-Serif + , + - -`; - -exports[`snapshotAllPages Switch 6`] = ` - - + Sans-Serif Bold + , + - -`; - -exports[`snapshotAllPages Switch 7`] = ` - - + Serif + , + - -`; - -exports[`snapshotAllPages Switch 8`] = ` - - + Serif Bold + , + - - - - , + - - , + - - + } + > + Unknown Font Family + , +] `; -exports[`snapshotAllPages Text 1`] = ` +exports[`snapshotAllPages Text 9`] = ` + + + showSoftInputOnFocus: false + + + + + + +`; + +exports[`snapshotAllPages TextInput 20`] = ` + + + Uncontrolled: + + + + Controlled: + + + + + + + Update controlled Input + + + + + +`; + +exports[`snapshotAllPages TextInput 21`] = ` + + + Do not clear text on focus: + + + + Clear text on focus: + + + +`; + +exports[`snapshotAllPages TextInput 22`] = ` + + + Measure: + setTimeout + ( + fn, 200 + ) - + 0 + + + + + Measure: + setTimeout + ( + fn, 500 + ) - + 0 + + `; @@ -81221,6 +95153,8 @@ exports[`snapshotAllPages Timers 2`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81286,6 +95220,8 @@ exports[`snapshotAllPages Timers 3`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81340,6 +95276,8 @@ exports[`snapshotAllPages Timers 3`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81394,6 +95332,8 @@ exports[`snapshotAllPages Timers 3`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81448,6 +95388,8 @@ exports[`snapshotAllPages Timers 3`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81502,6 +95444,8 @@ exports[`snapshotAllPages Timers 3`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81565,6 +95509,8 @@ exports[`snapshotAllPages Timers 4`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81630,6 +95576,8 @@ exports[`snapshotAllPages Timers 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81689,6 +95637,8 @@ exports[`snapshotAllPages Timers 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81744,6 +95694,8 @@ exports[`snapshotAllPages Timers 5`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81927,6 +95879,8 @@ exports[`snapshotAllPages Touchable* and onPress 2`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -81996,6 +95950,8 @@ exports[`snapshotAllPages Touchable* and onPress 3`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -82181,6 +96137,8 @@ exports[`snapshotAllPages Touchable* and onPress 8`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -82267,6 +96225,8 @@ exports[`snapshotAllPages Touchable* and onPress 9`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -82412,6 +96372,8 @@ exports[`snapshotAllPages Touchable* and onPress 11`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -82550,6 +96512,8 @@ exports[`snapshotAllPages Touchable* and onPress 12`] = ` "checked": undefined, "disabled": undefined, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -82604,6 +96568,8 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` "checked": undefined, "disabled": true, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -82659,6 +96625,8 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -82812,6 +96780,8 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` "checked": undefined, "disabled": true, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -82862,6 +96832,8 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` "checked": undefined, "disabled": false, "expanded": undefined, + "multiselectable": undefined, + "required": undefined, "selected": undefined, } } @@ -82904,6 +96876,152 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` `; +exports[`snapshotAllPages Touchable* and onPress 15`] = ` + + + + Touchable Highlight (Control 1 in Set of 3) + + + + + Touchable Opacity (Control 2 in Set of 3) + + + + TouchableWithoutFeedback (Control 3 in Set of 3) + + +`; + exports[`snapshotAllPages TransferProperties 1`] = ` + + + + + RepeatedlyFetch + + + + GetCurrentPattern(UIA_ValuePatternId, reinterpret_cast(&valuePattern)); if (SUCCEEDED(hr) && valuePattern) { hr = valuePattern->get_Value(&value); @@ -389,6 +392,34 @@ void DumpUIAPatternInfo(IUIAutomationElement *pTarget, const winrt::Windows::Dat } expandCollapsePattern->Release(); } + + // Dump ISelectionItemProvider Information + ISelectionItemProvider *selectionItemPattern; + hr = pTarget->GetCurrentPattern(UIA_SelectionItemPatternId, reinterpret_cast(&selectionItemPattern)); + if (SUCCEEDED(hr) && selectionItemPattern) { + hr = selectionItemPattern->get_IsSelected(&isSelected); + if (SUCCEEDED(hr)) { + InsertBooleanValueIfNotDefault(result, L"SelectionItemPattern.IsSelected", isSelected); + } + selectionItemPattern->Release(); + } + + // Dump ISelectionProvider Information + ISelectionProvider *selectionPattern; + hr = pTarget->GetCurrentPattern(UIA_SelectionPatternId, reinterpret_cast(&selectionPattern)); + if (SUCCEEDED(hr) && selectionPattern) { + hr = selectionPattern->get_CanSelectMultiple(&multipleSelection); + if (SUCCEEDED(hr)) { + InsertBooleanValueIfNotDefault(result, L"SelectionPattern.CanSelectMultiple", multipleSelection, false); + } + hr = selectionPattern->get_IsSelectionRequired(&selectionRequired); + if (SUCCEEDED(hr)) { + InsertBooleanValueIfNotDefault(result, L"SelectionPattern.IsSelectionRequired", selectionRequired, false); + } + selectionPattern->Release(); + } + + ::SysFreeString(value); } winrt::Windows::Data::Json::JsonObject DumpUIATreeRecurse( diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp index e5160eee6a6..a06a7a675cc 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp @@ -11,7 +11,21 @@ namespace winrt::Microsoft::ReactNative::implementation { CompositionDynamicAutomationProvider::CompositionDynamicAutomationProvider( const winrt::Microsoft::ReactNative::Composition::ComponentView &componentView) noexcept - : m_view{componentView} {} + : m_view{componentView} { + auto strongView = m_view.view(); + + if (!strongView) + return; + + auto props = std::static_pointer_cast( + winrt::get_self(strongView)->props()); + if (!props) + return; + + if (props->accessibilityState.has_value() && props->accessibilityState->selected.has_value()) { + AddSelectionItemsToContainer(this); + } +} HRESULT __stdcall CompositionDynamicAutomationProvider::Navigate( NavigateDirection direction, @@ -203,6 +217,18 @@ HRESULT __stdcall CompositionDynamicAutomationProvider::GetPatternProvider(PATTE AddRef(); } + if (patternId == UIA_SelectionPatternId && props->accessibilityState.has_value() && + props->accessibilityState->multiselectable.has_value() && props->accessibilityState->required.has_value()) { + *pRetVal = static_cast(this); + AddRef(); + } + + if (patternId == UIA_SelectionItemPatternId && props->accessibilityState.has_value() && + props->accessibilityState->selected.has_value()) { + *pRetVal = static_cast(this); + AddRef(); + } + return S_OK; } @@ -346,6 +372,7 @@ HRESULT __stdcall CompositionDynamicAutomationProvider::GetPropertyValue(PROPERT case UIA_IsOffscreenPropertyId: { pRetVal->vt = VT_BOOL; pRetVal->boolVal = (compositionView->getClipState() == ClipState::FullyClipped) ? VARIANT_TRUE : VARIANT_FALSE; + break; } case UIA_HelpTextPropertyId: { pRetVal->vt = VT_BSTR; @@ -552,4 +579,169 @@ HRESULT __stdcall CompositionDynamicAutomationProvider::Collapse() { return S_OK; } +HRESULT __stdcall CompositionDynamicAutomationProvider::get_CanSelectMultiple(BOOL *pRetVal) { + if (pRetVal == nullptr) + return E_POINTER; + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + auto props = + std::static_pointer_cast(winrt::get_self(strongView)->props()); + + if (props == nullptr) + return UIA_E_ELEMENTNOTAVAILABLE; + + *pRetVal = (props->accessibilityState.has_value() && props->accessibilityState->multiselectable.has_value()) + ? props->accessibilityState->multiselectable.value() + : false; + + return S_OK; +} + +HRESULT __stdcall CompositionDynamicAutomationProvider::get_IsSelectionRequired(BOOL *pRetVal) { + if (pRetVal == nullptr) + return E_POINTER; + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + auto props = std::static_pointer_cast( + winrt::get_self(strongView)->props()); + + if (props == nullptr) + return UIA_E_ELEMENTNOTAVAILABLE; + + *pRetVal = (props->accessibilityState.has_value() && props->accessibilityState->required.has_value()) + ? props->accessibilityState->required.value() + : false; + + return S_OK; +} + +HRESULT __stdcall CompositionDynamicAutomationProvider::GetSelection(SAFEARRAY **pRetVal) { + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + std::vector selectedItems; + for (size_t i = 0; i < m_selectionItems.size(); i++) { + auto selectionItem = m_selectionItems.at(i); + auto provider = selectionItem.as(); + BOOL selected; + auto hr = provider->get_IsSelected(&selected); + if (hr == S_OK && selected) { + selectedItems.push_back(int(i)); + } + } + + *pRetVal = SafeArrayCreateVector(VT_UNKNOWN, 0, ULONG(selectedItems.size())); + if (*pRetVal == nullptr) + return E_OUTOFMEMORY; + + for (size_t i = 0; i < selectedItems.size(); i++) { + auto pos = static_cast(i); + SafeArrayPutElement(*pRetVal, &pos, m_selectionItems.at(selectedItems.at(i)).get()); + } + return S_OK; +} + +void CompositionDynamicAutomationProvider::AddToSelectionItems(winrt::com_ptr &item) { + if (std::find(m_selectionItems.begin(), m_selectionItems.end(), item) != m_selectionItems.end()) { + return; + } + m_selectionItems.push_back(item); +} + +void CompositionDynamicAutomationProvider::RemoveFromSelectionItems(winrt::com_ptr &item) { + std::erase(m_selectionItems, item); +} + +HRESULT __stdcall CompositionDynamicAutomationProvider::AddToSelection() { + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + DispatchAccessibilityAction(m_view, "addToSelection"); + return S_OK; +} + +HRESULT __stdcall CompositionDynamicAutomationProvider::get_IsSelected(BOOL *pRetVal) { + if (pRetVal == nullptr) + return E_POINTER; + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + auto props = std::static_pointer_cast( + winrt::get_self(strongView)->props()); + + if (props == nullptr) + return UIA_E_ELEMENTNOTAVAILABLE; + + *pRetVal = (props->accessibilityState.has_value() && props->accessibilityState->selected.has_value()) + ? props->accessibilityState->selected.value() + : false; + + return S_OK; +} + +IRawElementProviderSimple *findSelectionContainer(winrt::Microsoft::ReactNative::ComponentView current) { + if (!current) + return nullptr; + + auto props = std::static_pointer_cast( + winrt::get_self(current)->props()); + if (props->accessibilityState.has_value() && props->accessibilityState->multiselectable.has_value() && + props->accessibilityState->required.has_value()) { + auto uiaProvider = + current.as()->EnsureUiaProvider(); + if (uiaProvider != nullptr) { + auto spProviderSimple = uiaProvider.try_as(); + if (spProviderSimple != nullptr) { + spProviderSimple->AddRef(); + return spProviderSimple.get(); + } + } + } else { + return findSelectionContainer(current.Parent()); + } + return nullptr; +} + +HRESULT __stdcall CompositionDynamicAutomationProvider::get_SelectionContainer(IRawElementProviderSimple **pRetVal) { + if (pRetVal == nullptr) + return E_POINTER; + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + *pRetVal = findSelectionContainer(strongView.Parent()); + return S_OK; +} + +HRESULT __stdcall CompositionDynamicAutomationProvider::RemoveFromSelection() { + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + DispatchAccessibilityAction(m_view, "removeFromSelection"); + return S_OK; +} + +HRESULT __stdcall CompositionDynamicAutomationProvider::Select() { + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + DispatchAccessibilityAction(m_view, "select"); + return S_OK; +} + } // namespace winrt::Microsoft::ReactNative::implementation diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.h b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.h index fd37624b580..bf403a9dad3 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.h @@ -17,7 +17,9 @@ class CompositionDynamicAutomationProvider : public winrt::implements< IScrollItemProvider, IValueProvider, IToggleProvider, - IExpandCollapseProvider> { + IExpandCollapseProvider, + ISelectionProvider, + ISelectionItemProvider> { public: CompositionDynamicAutomationProvider( const winrt::Microsoft::ReactNative::Composition::ComponentView &componentView) noexcept; @@ -57,8 +59,24 @@ class CompositionDynamicAutomationProvider : public winrt::implements< virtual HRESULT __stdcall Expand() override; virtual HRESULT __stdcall Collapse() override; + // inherited via ISelectionProvider + virtual HRESULT __stdcall get_CanSelectMultiple(BOOL *pRetVal) override; + virtual HRESULT __stdcall get_IsSelectionRequired(BOOL *pRetVal) override; + virtual HRESULT __stdcall GetSelection(SAFEARRAY **pRetVal) override; + + // inherited via ISelectionItemProvider + virtual HRESULT __stdcall AddToSelection() override; + virtual HRESULT __stdcall get_IsSelected(BOOL *pRetVal) override; + virtual HRESULT __stdcall get_SelectionContainer(IRawElementProviderSimple **pRetVal) override; + virtual HRESULT __stdcall RemoveFromSelection() override; + virtual HRESULT __stdcall Select() override; + + void AddToSelectionItems(winrt::com_ptr &item); + void RemoveFromSelectionItems(winrt::com_ptr &item); + private: ::Microsoft::ReactNative::ReactTaggedView m_view; + std::vector> m_selectionItems; }; } // namespace winrt::Microsoft::ReactNative::implementation diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp index 9f7578a0451..7969adbbbc0 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp @@ -747,6 +747,19 @@ void ComponentView::updateAccessibilityProps( UIA_LiveSettingPropertyId, oldViewProps.accessibilityLiveRegion, newViewProps.accessibilityLiveRegion); + + if ((oldViewProps.accessibilityState.has_value() && oldViewProps.accessibilityState->selected.has_value()) != + ((newViewProps.accessibilityState.has_value() && newViewProps.accessibilityState->selected.has_value()))) { + auto compProvider = + m_uiaProvider.try_as(); + if (compProvider) { + if ((newViewProps.accessibilityState.has_value() && newViewProps.accessibilityState->selected.has_value())) { + winrt::Microsoft::ReactNative::implementation::AddSelectionItemsToContainer(compProvider.get()); + } else { + winrt::Microsoft::ReactNative::implementation::RemoveSelectionItemsFromContainer(compProvider.get()); + } + } + } } std::optional ComponentView::getAcccessiblityValue() noexcept { diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp index db919ea10bf..11e1f4881d4 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp @@ -214,6 +214,30 @@ ExpandCollapseState GetExpandCollapseState(const bool &expanded) noexcept { } } +void AddSelectionItemsToContainer(CompositionDynamicAutomationProvider *provider) noexcept { + winrt::com_ptr selectionContainer; + provider->get_SelectionContainer(selectionContainer.put()); + if (!selectionContainer) + return; + auto selectionContainerProvider = selectionContainer.as(); + auto simpleProvider = static_cast(provider); + winrt::com_ptr simpleProviderPtr; + simpleProviderPtr.copy_from(simpleProvider); + selectionContainerProvider->AddToSelectionItems(simpleProviderPtr); +} + +void RemoveSelectionItemsFromContainer(CompositionDynamicAutomationProvider *provider) noexcept { + winrt::com_ptr selectionContainer; + provider->get_SelectionContainer(selectionContainer.put()); + if (!selectionContainer) + return; + auto selectionContainerProvider = selectionContainer.as(); + auto simpleProvider = static_cast(provider); + winrt::com_ptr simpleProviderPtr; + simpleProviderPtr.copy_from(simpleProvider); + selectionContainerProvider->RemoveFromSelectionItems(simpleProviderPtr); +} + ToggleState GetToggleState(const std::optional &state) noexcept { if (state.has_value()) { if (state->checked == facebook::react::AccessibilityState::Checked) { diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.h b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.h index 20b03314aac..0104c5853e7 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.h @@ -1,6 +1,7 @@ #pragma once #include +#include #include #include @@ -37,5 +38,9 @@ void DispatchAccessibilityAction(::Microsoft::ReactNative::ReactTaggedView &view ExpandCollapseState GetExpandCollapseState(const bool &expanded) noexcept; +void AddSelectionItemsToContainer(CompositionDynamicAutomationProvider *provider) noexcept; + +void RemoveSelectionItemsFromContainer(CompositionDynamicAutomationProvider *provider) noexcept; + ToggleState GetToggleState(const std::optional &state) noexcept; } // namespace winrt::Microsoft::ReactNative::implementation diff --git a/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h new file mode 100644 index 00000000000..e1ba1e6a3fd --- /dev/null +++ b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h @@ -0,0 +1,252 @@ +/* + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +#pragma once + +#include +#include +#include +#include + +namespace facebook::react { + +enum class AccessibilityTraits : uint32_t { + None = 0, + Button = (1 << 0), + Link = (1 << 1), + Image = (1 << 2), + Selected = (1 << 3), + PlaysSound = (1 << 4), + KeyboardKey = (1 << 5), + StaticText = (1 << 6), + SummaryElement = (1 << 7), + NotEnabled = (1 << 8), + UpdatesFrequently = (1 << 9), + SearchField = (1 << 10), + StartsMediaSession = (1 << 11), + Adjustable = (1 << 12), + AllowsDirectInteraction = (1 << 13), + CausesPageTurn = (1 << 14), + Header = (1 << 15), + Switch = (1 << 16), + TabBar = (1 << 17), +}; + +constexpr enum AccessibilityTraits operator|( + const enum AccessibilityTraits lhs, + const enum AccessibilityTraits rhs) { + return (enum AccessibilityTraits)((uint32_t)lhs | (uint32_t)rhs); +} + +constexpr enum AccessibilityTraits operator&( + const enum AccessibilityTraits lhs, + const enum AccessibilityTraits rhs) { + return (enum AccessibilityTraits)((uint32_t)lhs & (uint32_t)rhs); +} + +struct AccessibilityAction { + std::string name{""}; + std::optional label{}; +}; + +inline static bool operator==( + const AccessibilityAction& lhs, + const AccessibilityAction& rhs) { + return lhs.name == rhs.name && lhs.label == rhs.label; +} + +inline static bool operator!=( + const AccessibilityAction& lhs, + const AccessibilityAction& rhs) { + return !(rhs == lhs); +} + +struct AccessibilityState { + bool disabled{false}; + std::optional selected{std::nullopt}; // [Windows] - Do not remove; required for Windows ISelectionItemProvider Implementation + bool busy{false}; + std::optional expanded{std::nullopt}; + std::optional multiselectable{std::nullopt}; // [Windows] - Do not remove; required for Windows ISelectionProvider Implementation + std::optional required{std::nullopt}; // [Windows] - Do not remove; required for Windows ISelectionProvider Implementation + enum { Unchecked, Checked, Mixed, None } checked{None}; +}; + +constexpr bool operator==( + const AccessibilityState& lhs, + const AccessibilityState& rhs) { + return lhs.disabled == rhs.disabled && lhs.selected == rhs.selected && + lhs.checked == rhs.checked && lhs.busy == rhs.busy && + lhs.expanded == rhs.expanded; +} + +constexpr bool operator!=( + const AccessibilityState& lhs, + const AccessibilityState& rhs) { + return !(rhs == lhs); +} + +struct AccessibilityLabelledBy { + std::vector value{}; +}; + +inline static bool operator==( + const AccessibilityLabelledBy& lhs, + const AccessibilityLabelledBy& rhs) { + return lhs.value == rhs.value; +} + +inline static bool operator!=( + const AccessibilityLabelledBy& lhs, + const AccessibilityLabelledBy& rhs) { + return !(lhs == rhs); +} + +struct AccessibilityValue { + std::optional min; + std::optional max; + std::optional now; + std::optional text{}; +}; + +constexpr bool operator==( + const AccessibilityValue& lhs, + const AccessibilityValue& rhs) { + return lhs.min == rhs.min && lhs.max == rhs.max && lhs.now == rhs.now && + lhs.text == rhs.text; +} + +constexpr bool operator!=( + const AccessibilityValue& lhs, + const AccessibilityValue& rhs) { + return !(rhs == lhs); +} + +enum class ImportantForAccessibility : uint8_t { + Auto, + Yes, + No, + NoHideDescendants, +}; + +enum class AccessibilityLiveRegion : uint8_t { + None, + Polite, + Assertive, +}; + +enum class AccessibilityRole { + None, + Button, + Dropdownlist, + Togglebutton, + Link, + Search, + Image, + Keyboardkey, + Text, + Adjustable, + Imagebutton, + Header, + Summary, + Alert, + Checkbox, + Combobox, + Menu, + Menubar, + Menuitem, + Progressbar, + Radio, + Radiogroup, + Scrollbar, + Spinbutton, + Switch, + Tab, + Tabbar, + Tablist, + Timer, + List, + Toolbar, + Grid, + Pager, + Scrollview, + Horizontalscrollview, + Viewgroup, + Webview, + Drawerlayout, + Slidingdrawer, + Iconmenu, +}; + +enum class Role { + Alert, + Alertdialog, + Application, + Article, + Banner, + Button, + Cell, + Checkbox, + Columnheader, + Combobox, + Complementary, + Contentinfo, + Definition, + Dialog, + Directory, + Document, + Feed, + Figure, + Form, + Grid, + Group, + Heading, + Img, + Link, + List, + Listitem, + Log, + Main, + Marquee, + Math, + Menu, + Menubar, + Menuitem, + Meter, + Navigation, + None, + Note, + Option, + Presentation, + Progressbar, + Radio, + Radiogroup, + Region, + Row, + Rowgroup, + Rowheader, + Scrollbar, + Searchbox, + Separator, + Slider, + Spinbutton, + Status, + Summary, + Switch, + Tab, + Table, + Tablist, + Tabpanel, + Term, + Timer, + Toolbar, + Tooltip, + Tree, + Treegrid, + Treeitem, +}; + +} // namespace facebook::react diff --git a/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h new file mode 100644 index 00000000000..19826f1abbe --- /dev/null +++ b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h @@ -0,0 +1,795 @@ +/* + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +#pragma once + +#include +#include +#include +#include +#include +#include +#include + +#include + +namespace facebook::react { + +inline void fromString(const std::string& string, AccessibilityTraits& result) { + if (string == "none") { + result = AccessibilityTraits::None; + return; + } + if (string == "button" || string == "togglebutton") { + result = AccessibilityTraits::Button; + return; + } + if (string == "link") { + result = AccessibilityTraits::Link; + return; + } + if (string == "image" || string == "img") { + result = AccessibilityTraits::Image; + return; + } + if (string == "selected") { + result = AccessibilityTraits::Selected; + return; + } + if (string == "plays") { + result = AccessibilityTraits::PlaysSound; + return; + } + if (string == "keyboardkey" || string == "key") { + result = AccessibilityTraits::KeyboardKey; + return; + } + if (string == "text") { + result = AccessibilityTraits::StaticText; + return; + } + if (string == "disabled") { + result = AccessibilityTraits::NotEnabled; + return; + } + if (string == "frequentUpdates") { + result = AccessibilityTraits::UpdatesFrequently; + return; + } + if (string == "search") { + result = AccessibilityTraits::SearchField; + return; + } + if (string == "startsMedia") { + result = AccessibilityTraits::StartsMediaSession; + return; + } + if (string == "adjustable") { + result = AccessibilityTraits::Adjustable; + return; + } + if (string == "allowsDirectInteraction") { + result = AccessibilityTraits::AllowsDirectInteraction; + return; + } + if (string == "pageTurn") { + result = AccessibilityTraits::CausesPageTurn; + return; + } + if (string == "header" || string == "heading") { + result = AccessibilityTraits::Header; + return; + } + if (string == "imagebutton") { + result = AccessibilityTraits::Image | AccessibilityTraits::Button; + return; + } + if (string == "summary") { + result = AccessibilityTraits::SummaryElement; + return; + } + if (string == "switch") { + result = AccessibilityTraits::Switch; + return; + } + if (string == "tabbar") { + result = AccessibilityTraits::TabBar; + return; + } + if (string == "progressbar") { + result = AccessibilityTraits::UpdatesFrequently; + return; + } + result = AccessibilityTraits::None; +} + +inline void fromRawValue( + const PropsParserContext& context, + const RawValue& value, + AccessibilityTraits& result) { + if (value.hasType()) { + fromString((std::string)value, result); + return; + } + + result = {}; + + react_native_expect(value.hasType>()); + if (value.hasType>()) { + auto items = (std::vector)value; + for (auto& item : items) { + AccessibilityTraits itemAccessibilityTraits; + fromString(item, itemAccessibilityTraits); + result = result | itemAccessibilityTraits; + } + } else { + LOG(ERROR) << "AccessibilityTraits parsing: unsupported type"; + } +} + +inline void fromRawValue( + const PropsParserContext& context, + const RawValue& value, + AccessibilityState& result) { + auto map = (std::unordered_map)value; + auto selected = map.find("selected"); + if (selected != map.end()) { + fromRawValue(context, selected->second, result.selected); + } + auto disabled = map.find("disabled"); + if (disabled != map.end()) { + fromRawValue(context, disabled->second, result.disabled); + } + auto checked = map.find("checked"); + if (checked != map.end()) { + if (checked->second.hasType()) { + if ((std::string)checked->second == "mixed") { + result.checked = AccessibilityState::Mixed; + } else { + result.checked = AccessibilityState::None; + } + } else if (checked->second.hasType()) { + if ((bool)checked->second == true) { + result.checked = AccessibilityState::Checked; + } else { + result.checked = AccessibilityState::Unchecked; + } + } else { + result.checked = AccessibilityState::None; + } + } + auto busy = map.find("busy"); + if (busy != map.end()) { + fromRawValue(context, busy->second, result.busy); + } + auto expanded = map.find("expanded"); + if (expanded != map.end()) { + fromRawValue(context, expanded->second, result.expanded); + } + // [Windows] - DO NOT REMOVE - required for Windows ISelectionProvider Implementation + auto multiselectable = map.find("multiselectable"); + if (multiselectable != map.end()) { + fromRawValue(context, multiselectable->second, result.multiselectable); + } + auto required = map.find("required"); + if (required != map.end()) { + fromRawValue(context, required->second, result.required); + } + // [Windows] - DO NOT REMOVE +} + +inline std::string toString( + const ImportantForAccessibility& importantForAccessibility) { + switch (importantForAccessibility) { + case ImportantForAccessibility::Auto: + return "auto"; + case ImportantForAccessibility::Yes: + return "yes"; + case ImportantForAccessibility::No: + return "no"; + case ImportantForAccessibility::NoHideDescendants: + return "no-hide-descendants"; + } +} + +inline void fromRawValue( + const PropsParserContext& context, + const RawValue& value, + ImportantForAccessibility& result) { + result = ImportantForAccessibility::Auto; + react_native_expect(value.hasType()); + if (value.hasType()) { + auto string = (std::string)value; + if (string == "auto") { + result = ImportantForAccessibility::Auto; + } else if (string == "yes") { + result = ImportantForAccessibility::Yes; + } else if (string == "no") { + result = ImportantForAccessibility::No; + } else if (string == "no-hide-descendants") { + result = ImportantForAccessibility::NoHideDescendants; + } else { + LOG(ERROR) << "Unsupported ImportantForAccessibility value: " << string; + react_native_expect(false); + } + } else { + LOG(ERROR) << "Unsupported ImportantForAccessibility type"; + } +} + +inline void fromRawValue( + const PropsParserContext& context, + const RawValue& value, + AccessibilityAction& result) { + auto map = (std::unordered_map)value; + + auto name = map.find("name"); + react_native_assert(name != map.end() && name->second.hasType()); + if (name != map.end()) { + fromRawValue(context, name->second, result.name); + } + + auto label = map.find("label"); + if (label != map.end()) { + if (label->second.hasType()) { + result.label = (std::string)label->second; + } + } +} + +inline void fromRawValue( + const PropsParserContext&, + const RawValue& value, + AccessibilityValue& result) { + auto map = (std::unordered_map)value; + + auto min = map.find("min"); + if (min != map.end()) { + if (min->second.hasType()) { + result.min = (int)min->second; + } + } + + auto max = map.find("max"); + if (max != map.end()) { + if (max->second.hasType()) { + result.max = (int)max->second; + } + } + + auto now = map.find("now"); + if (now != map.end()) { + if (now->second.hasType()) { + result.now = (int)now->second; + } + } + + auto text = map.find("text"); + if (text != map.end()) { + if (text->second.hasType()) { + result.text = (std::string)text->second; + } + } +} + +inline void fromRawValue( + const PropsParserContext& context, + const RawValue& value, + AccessibilityLabelledBy& result) { + if (value.hasType()) { + result.value.push_back((std::string)value); + } else if (value.hasType>()) { + result.value = (std::vector)value; + } +} + +inline void fromRawValue( + const PropsParserContext& context, + const RawValue& value, + AccessibilityLiveRegion& result) { + result = AccessibilityLiveRegion::None; + react_native_expect(value.hasType()); + if (value.hasType()) { + auto string = (std::string)value; + if (string == "none") { + result = AccessibilityLiveRegion::None; + } else if (string == "polite") { + result = AccessibilityLiveRegion::Polite; + } else if (string == "assertive") { + result = AccessibilityLiveRegion::Assertive; + } else { + LOG(ERROR) << "Unsupported AccessibilityLiveRegion value: " << string; + react_native_expect(false); + } + } else { + LOG(ERROR) << "Unsupported AccessibilityLiveRegion type"; + } +} + +inline std::string toString(const AccessibilityRole& accessibilityRole) { + switch (accessibilityRole) { + case AccessibilityRole::None: + return "none"; + case AccessibilityRole::Button: + return "button"; + case AccessibilityRole::Dropdownlist: + return "dropdownlist"; + case AccessibilityRole::Togglebutton: + return "togglebutton"; + case AccessibilityRole::Link: + return "link"; + case AccessibilityRole::Search: + return "search"; + case AccessibilityRole::Image: + return "image"; + case AccessibilityRole::Keyboardkey: + return "keyboardkey"; + case AccessibilityRole::Text: + return "text"; + case AccessibilityRole::Adjustable: + return "adjustable"; + case AccessibilityRole::Imagebutton: + return "imagebutton"; + case AccessibilityRole::Header: + return "header"; + case AccessibilityRole::Summary: + return "summary"; + case AccessibilityRole::Alert: + return "alert"; + case AccessibilityRole::Checkbox: + return "checkbox"; + case AccessibilityRole::Combobox: + return "combobox"; + case AccessibilityRole::Menu: + return "menu"; + case AccessibilityRole::Menubar: + return "menubar"; + case AccessibilityRole::Menuitem: + return "menuitem"; + case AccessibilityRole::Progressbar: + return "progressbar"; + case AccessibilityRole::Radio: + return "radio"; + case AccessibilityRole::Radiogroup: + return "radiogroup"; + case AccessibilityRole::Scrollbar: + return "scrollbar"; + case AccessibilityRole::Spinbutton: + return "spinbutton"; + case AccessibilityRole::Switch: + return "switch"; + case AccessibilityRole::Tab: + return "tab"; + case AccessibilityRole::Tabbar: + return "tabbar"; + case AccessibilityRole::Tablist: + return "tablist"; + case AccessibilityRole::Timer: + return "timer"; + case AccessibilityRole::List: + return "timer"; + case AccessibilityRole::Toolbar: + return "toolbar"; + case AccessibilityRole::Grid: + return "grid"; + case AccessibilityRole::Pager: + return "pager"; + case AccessibilityRole::Scrollview: + return "scrollview"; + case AccessibilityRole::Horizontalscrollview: + return "horizontalscrollview"; + case AccessibilityRole::Viewgroup: + return "viewgroup"; + case AccessibilityRole::Webview: + return "webview"; + case AccessibilityRole::Drawerlayout: + return "drawerlayout"; + case AccessibilityRole::Slidingdrawer: + return "slidingdrawer"; + case AccessibilityRole::Iconmenu: + return "iconmenu"; + } + + LOG(ERROR) << "Unsupported AccessibilityRole value"; + react_native_expect(false); + // sane default for prod + return "none"; +} + +inline void fromRawValue( + const PropsParserContext& context, + const RawValue& value, + AccessibilityRole& result) { + react_native_expect(value.hasType()); + if (value.hasType()) { + auto string = (std::string)value; + if (string == "none") { + result = AccessibilityRole::None; + } else if (string == "button") { + result = AccessibilityRole::Button; + } else if (string == "dropdownlist") { + result = AccessibilityRole::Dropdownlist; + } else if (string == "togglebutton") { + result = AccessibilityRole::Togglebutton; + } else if (string == "link") { + result = AccessibilityRole::Link; + } else if (string == "search") { + result = AccessibilityRole::Search; + } else if (string == "image") { + result = AccessibilityRole::Image; + } else if (string == "keyboardkey") { + result = AccessibilityRole::Keyboardkey; + } else if (string == "text") { + result = AccessibilityRole::Text; + } else if (string == "adjustable") { + result = AccessibilityRole::Adjustable; + } else if (string == "imagebutton") { + result = AccessibilityRole::Imagebutton; + } else if (string == "header") { + result = AccessibilityRole::Header; + } else if (string == "summary") { + result = AccessibilityRole::Summary; + } else if (string == "alert") { + result = AccessibilityRole::Alert; + } else if (string == "checkbox") { + result = AccessibilityRole::Checkbox; + } else if (string == "combobox") { + result = AccessibilityRole::Combobox; + } else if (string == "menu") { + result = AccessibilityRole::Menu; + } else if (string == "menubar") { + result = AccessibilityRole::Menubar; + } else if (string == "menuitem") { + result = AccessibilityRole::Menuitem; + } else if (string == "progressbar") { + result = AccessibilityRole::Progressbar; + } else if (string == "radio") { + result = AccessibilityRole::Radio; + } else if (string == "radiogroup") { + result = AccessibilityRole::Radiogroup; + } else if (string == "scrollbar") { + result = AccessibilityRole::Scrollbar; + } else if (string == "spinbutton") { + result = AccessibilityRole::Spinbutton; + } else if (string == "switch") { + result = AccessibilityRole::Switch; + } else if (string == "tab") { + result = AccessibilityRole::Tab; + } else if (string == "tabbar") { + result = AccessibilityRole::Tabbar; + } else if (string == "tablist") { + result = AccessibilityRole::Tablist; + } else if (string == "timer") { + result = AccessibilityRole::Timer; + } else if (string == "toolbar") { + result = AccessibilityRole::Toolbar; + } else if (string == "grid") { + result = AccessibilityRole::Grid; + } else if (string == "pager") { + result = AccessibilityRole::Pager; + } else if (string == "scrollview") { + result = AccessibilityRole::Scrollview; + } else if (string == "horizontalscrollview") { + result = AccessibilityRole::Horizontalscrollview; + } else if (string == "viewgroup") { + result = AccessibilityRole::Viewgroup; + } else if (string == "webview") { + result = AccessibilityRole::Webview; + } else if (string == "drawerlayout") { + result = AccessibilityRole::Drawerlayout; + } else if (string == "slidingdrawer") { + result = AccessibilityRole::Slidingdrawer; + } else if (string == "iconmenu") { + result = AccessibilityRole::Iconmenu; + } else { + LOG(ERROR) << "Unsupported AccessibilityRole value: " << string; + react_native_expect(false); + // sane default for prod + result = AccessibilityRole::None; + } + return; + } + + LOG(ERROR) << "Unsupported AccessibilityRole type"; + react_native_expect(false); + // sane default for prod + result = AccessibilityRole::None; +} + +inline std::string toString(const Role& role) { + switch (role) { + case Role::Alert: + return "alert"; + case Role::Alertdialog: + return "alertdialog"; + case Role::Application: + return "application"; + case Role::Article: + return "article"; + case Role::Banner: + return "banner"; + case Role::Button: + return "button"; + case Role::Cell: + return "cell"; + case Role::Checkbox: + return "checkbox"; + case Role::Columnheader: + return "columnheader"; + case Role::Combobox: + return "combobox"; + case Role::Complementary: + return "complementary"; + case Role::Contentinfo: + return "contentinfo"; + case Role::Definition: + return "definition"; + case Role::Dialog: + return "dialog"; + case Role::Directory: + return "directory"; + case Role::Document: + return "document"; + case Role::Feed: + return "feed"; + case Role::Figure: + return "figure"; + case Role::Form: + return "form"; + case Role::Grid: + return "grid"; + case Role::Group: + return "group"; + case Role::Heading: + return "heading"; + case Role::Img: + return "img"; + case Role::Link: + return "link"; + case Role::List: + return "list"; + case Role::Listitem: + return "listitem"; + case Role::Log: + return "log"; + case Role::Main: + return "main"; + case Role::Marquee: + return "marquee"; + case Role::Math: + return "math"; + case Role::Menu: + return "menu"; + case Role::Menubar: + return "menubar"; + case Role::Menuitem: + return "menuitem"; + case Role::Meter: + return "meter"; + case Role::Navigation: + return "navigation"; + case Role::None: + return "none"; + case Role::Note: + return "note"; + case Role::Option: + return "option"; + case Role::Presentation: + return "presentation"; + case Role::Progressbar: + return "progressbar"; + case Role::Radio: + return "radio"; + case Role::Radiogroup: + return "radiogroup"; + case Role::Region: + return "region"; + case Role::Row: + return "row"; + case Role::Rowgroup: + return "rowgroup"; + case Role::Rowheader: + return "rowheader"; + case Role::Scrollbar: + return "scrollbar"; + case Role::Searchbox: + return "searchbox"; + case Role::Separator: + return "separator"; + case Role::Slider: + return "slider"; + case Role::Spinbutton: + return "spinbutton"; + case Role::Status: + return "status"; + case Role::Summary: + return "summary"; + case Role::Switch: + return "switch"; + case Role::Tab: + return "tab"; + case Role::Table: + return "table"; + case Role::Tablist: + return "tablist"; + case Role::Tabpanel: + return "tabpanel"; + case Role::Term: + return "term"; + case Role::Timer: + return "timer"; + case Role::Toolbar: + return "toolbar"; + case Role::Tooltip: + return "tooltip"; + case Role::Tree: + return "tree"; + case Role::Treegrid: + return "treegrid"; + case Role::Treeitem: + return "treeitem"; + } + + LOG(ERROR) << "Unsupported Role value"; + react_native_expect(false); + // sane default for prod + return "none"; +} + +inline void fromRawValue( + const PropsParserContext& context, + const RawValue& value, + Role& result) { + react_native_expect(value.hasType()); + if (value.hasType()) { + auto string = (std::string)value; + if (string == "alert") { + result = Role::Alert; + } else if (string == "alertdialog") { + result = Role::Alertdialog; + } else if (string == "application") { + result = Role::Application; + } else if (string == "article") { + result = Role::Article; + } else if (string == "banner") { + result = Role::Banner; + } else if (string == "button") { + result = Role::Button; + } else if (string == "cell") { + result = Role::Cell; + } else if (string == "checkbox") { + result = Role::Checkbox; + } else if (string == "columnheader") { + result = Role::Columnheader; + } else if (string == "combobox") { + result = Role::Combobox; + } else if (string == "complementary") { + result = Role::Complementary; + } else if (string == "contentinfo") { + result = Role::Contentinfo; + } else if (string == "definition") { + result = Role::Definition; + } else if (string == "dialog") { + result = Role::Dialog; + } else if (string == "directory") { + result = Role::Directory; + } else if (string == "document") { + result = Role::Document; + } else if (string == "feed") { + result = Role::Feed; + } else if (string == "figure") { + result = Role::Figure; + } else if (string == "form") { + result = Role::Form; + } else if (string == "grid") { + result = Role::Grid; + } else if (string == "group") { + result = Role::Group; + } else if (string == "heading") { + result = Role::Heading; + } else if (string == "img") { + result = Role::Img; + } else if (string == "link") { + result = Role::Link; + } else if (string == "list") { + result = Role::List; + } else if (string == "listitem") { + result = Role::Listitem; + } else if (string == "log") { + result = Role::Log; + } else if (string == "main") { + result = Role::Main; + } else if (string == "marquee") { + result = Role::Marquee; + } else if (string == "math") { + result = Role::Math; + } else if (string == "menu") { + result = Role::Menu; + } else if (string == "menubar") { + result = Role::Menubar; + } else if (string == "menuitem") { + result = Role::Menuitem; + } else if (string == "meter") { + result = Role::Meter; + } else if (string == "navigation") { + result = Role::Navigation; + } else if (string == "none") { + result = Role::None; + } else if (string == "note") { + result = Role::Note; + } else if (string == "option") { + result = Role::Option; + } else if (string == "presentation") { + result = Role::Presentation; + } else if (string == "progressbar") { + result = Role::Progressbar; + } else if (string == "radio") { + result = Role::Radio; + } else if (string == "radiogroup") { + result = Role::Radiogroup; + } else if (string == "region") { + result = Role::Region; + } else if (string == "row") { + result = Role::Row; + } else if (string == "rowgroup") { + result = Role::Rowgroup; + } else if (string == "rowheader") { + result = Role::Rowheader; + } else if (string == "scrollbar") { + result = Role::Scrollbar; + } else if (string == "searchbox") { + result = Role::Searchbox; + } else if (string == "separator") { + result = Role::Separator; + } else if (string == "slider") { + result = Role::Slider; + } else if (string == "spinbutton") { + result = Role::Spinbutton; + } else if (string == "status") { + result = Role::Status; + } else if (string == "summary") { + result = Role::Summary; + } else if (string == "switch") { + result = Role::Switch; + } else if (string == "tab") { + result = Role::Tab; + } else if (string == "table") { + result = Role::Table; + } else if (string == "tablist") { + result = Role::Tablist; + } else if (string == "tabpanel") { + result = Role::Tabpanel; + } else if (string == "term") { + result = Role::Term; + } else if (string == "timer") { + result = Role::Timer; + } else if (string == "toolbar") { + result = Role::Toolbar; + } else if (string == "tooltip") { + result = Role::Tooltip; + } else if (string == "tree") { + result = Role::Tree; + } else if (string == "treegrid") { + result = Role::Treegrid; + } else if (string == "treeitem") { + result = Role::Treeitem; + } else { + LOG(ERROR) << "Unsupported Role value: " << string; + react_native_expect(false); + // sane default for prod + result = Role::None; + } + return; + } + + LOG(ERROR) << "Unsupported Role type"; + react_native_expect(false); + // sane default for prod + result = Role::None; +} + +} // namespace facebook::react diff --git a/vnext/overrides.json b/vnext/overrides.json index 28607151782..50ae24c46bb 100644 --- a/vnext/overrides.json +++ b/vnext/overrides.json @@ -97,6 +97,31 @@ "baseFile": "packages/react-native/ReactCommon/react/bridging/CallbackWrapper.h", "baseHash": "fe1adea3ede6ed141bc6db212be72091722ffa02", "issue": 12195 + }. + { + "type": "patch", + "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/nativemodule/core/ReactCommon/TurboModule.h", + "baseFile": "packages/react-native/ReactCommon/react/nativemodule/core/ReactCommon/TurboModule.h", + "baseHash": "e82eb139eab8a6e122421416fb724811bfadd6fb", + "issue": 14128 + }, + { + "type": "derived", + "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h", + "baseFile": "packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityPrimitives.h", + "baseHash": "6db5b174fe1dc7d108ae7f9e730decfe5f633bd8" + }, + { + "type": "derived", + "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h", + "baseFile": "packages/react-native/ReactCommon/react/renderer/components/view/accessibilityPropsConversions.h", + "baseHash": "4b2822199233e660f36c01df18fbbff7799968cc" + }, + { + "type": "derived", + "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/componentregistry/ComponentDescriptorRegistry.cpp", + "baseFile": "packages/react-native/ReactCommon/react/renderer/componentregistry/ComponentDescriptorRegistry.cpp", + "baseHash": "b15afcf4971fd2c9c9a9859ffcb2113bec28fc35" }, { "type": "patch", @@ -383,12 +408,24 @@ "baseHash": "965bd1e103f7bd92340917acf231516659aba36c", "issue": 0 }, + { + "type": "derived", + "file": "src-win/Libraries/Components/Touchable/TouchableBounce.windows.js", + "baseFile": "packages/react-native/Libraries/Components/Touchable/TouchableBounce.js", + "baseHash": "39541effd705b515e24600d5bc984542a5cd668b" + }, { "type": "patch", "file": "src-win/Libraries/Components/Touchable/TouchableHighlight.windows.js", "baseFile": "packages/react-native/Libraries/Components/Touchable/TouchableHighlight.js", "baseHash": "9d57e5e91830560775ab1b1cc0836bd35de10281" }, + { + "type": "derived", + "file": "src-win/Libraries/Components/Touchable/TouchableNativeFeedback.windows.js", + "baseFile": "packages/react-native/Libraries/Components/Touchable/TouchableNativeFeedback.js", + "baseHash": "8a1cc3c55ca3af68c5627479b3614fa44a1ffbea" + }, { "type": "patch", "file": "src-win/Libraries/Components/Touchable/TouchableOpacity.windows.js", diff --git a/vnext/src-win/Libraries/Components/Button.windows.js b/vnext/src-win/Libraries/Components/Button.windows.js index d9c8b643ca3..2f61329e692 100644 --- a/vnext/src-win/Libraries/Components/Button.windows.js +++ b/vnext/src-win/Libraries/Components/Button.windows.js @@ -164,6 +164,8 @@ type ButtonProps = $ReadOnly<{| 'aria-disabled'?: ?boolean, 'aria-expanded'?: ?boolean, 'aria-selected'?: ?boolean, + 'aria-multiselectable'?: ?boolean, // Windows + 'aria-required'?: ?boolean, // Windows /** * [Android] Controlling if a view fires accessibility events and if it is reported to accessibility services. @@ -308,6 +310,8 @@ const Button: React.AbstractComponent< 'aria-expanded': ariaExpanded, 'aria-label': ariaLabel, 'aria-selected': ariaSelected, + 'aria-multiselectable': ariaMultiselectable, // Windows + 'aria-required': ariaRequired, // Windows importantForAccessibility, color, onPress, @@ -343,6 +347,8 @@ const Button: React.AbstractComponent< disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + multiselectable: ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows + required: ariaRequired ?? accessibilityState?.required, // Windows }; const disabled = diff --git a/vnext/src-win/Libraries/Components/Pressable/Pressable.windows.js b/vnext/src-win/Libraries/Components/Pressable/Pressable.windows.js index c8cb9f48329..87db12e06bb 100644 --- a/vnext/src-win/Libraries/Components/Pressable/Pressable.windows.js +++ b/vnext/src-win/Libraries/Components/Pressable/Pressable.windows.js @@ -75,6 +75,8 @@ type Props = $ReadOnly<{| 'aria-disabled'?: ?boolean, 'aria-expanded'?: ?boolean, 'aria-selected'?: ?boolean, + 'aria-multiselectable'?: ?boolean, // Windows + 'aria-required'?: ?boolean, // Windows /** * A value indicating whether the accessibility elements contained within * this accessibility element are hidden. @@ -259,6 +261,8 @@ function Pressable(props: Props, forwardedRef): React.Node { 'aria-expanded': ariaExpanded, 'aria-label': ariaLabel, 'aria-selected': ariaSelected, + 'aria-multiselectable': ariaMultiselectable, // Windows + 'aria-required': ariaRequired, // Windows cancelable, children, delayHoverIn, @@ -299,6 +303,8 @@ function Pressable(props: Props, forwardedRef): React.Node { disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + multiselectable: ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows + required: ariaRequired ?? accessibilityState?.required, // Windows }; _accessibilityState = diff --git a/vnext/src-win/Libraries/Components/TextInput/TextInput.windows.js b/vnext/src-win/Libraries/Components/TextInput/TextInput.windows.js index 646ffd610b0..a90a1e9f2e8 100644 --- a/vnext/src-win/Libraries/Components/TextInput/TextInput.windows.js +++ b/vnext/src-win/Libraries/Components/TextInput/TextInput.windows.js @@ -1190,6 +1190,8 @@ function InternalTextInput(props: Props): React.Node { 'aria-disabled': ariaDisabled, 'aria-expanded': ariaExpanded, 'aria-selected': ariaSelected, + 'aria-multiselectable': ariaMultiselectable, // Windows + 'aria-required': ariaRequired, // Windows accessibilityState, id, tabIndex, @@ -1590,7 +1592,9 @@ function InternalTextInput(props: Props): React.Node { ariaChecked != null || ariaDisabled != null || ariaExpanded != null || - ariaSelected != null + ariaSelected != null || + ariaMultiselectable != null || // Windows + ariaRequired != null // Windows ) { _accessibilityState = { busy: ariaBusy ?? accessibilityState?.busy, @@ -1598,6 +1602,9 @@ function InternalTextInput(props: Props): React.Node { disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + multiselectable: + ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows + required: ariaRequired ?? accessibilityState?.required, // Windows }; } diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js new file mode 100644 index 00000000000..c36f12d6455 --- /dev/null +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js @@ -0,0 +1,227 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow strict-local + * @format + */ + +import type {ViewStyleProp} from '../../StyleSheet/StyleSheet'; +import typeof TouchableWithoutFeedback from './TouchableWithoutFeedback'; + +import Animated from '../../Animated/Animated'; +import Pressability, { + type PressabilityConfig, +} from '../../Pressability/Pressability'; +import {PressabilityDebugView} from '../../Pressability/PressabilityDebug'; +import Platform from '../../Utilities/Platform'; +import * as React from 'react'; + +type Props = $ReadOnly<{| + ...React.ElementConfig, + + onPressAnimationComplete?: ?() => void, + onPressWithCompletion?: ?(callback: () => void) => void, + releaseBounciness?: ?number, + releaseVelocity?: ?number, + style?: ?ViewStyleProp, + + hostRef: React.RefSetter>, +|}>; + +type State = $ReadOnly<{| + pressability: Pressability, + scale: Animated.Value, +|}>; + +class TouchableBounce extends React.Component { + state: State = { + pressability: new Pressability(this._createPressabilityConfig()), + scale: new Animated.Value(1), + }; + + _createPressabilityConfig(): PressabilityConfig { + return { + cancelable: !this.props.rejectResponderTermination, + disabled: this.props.disabled, + hitSlop: this.props.hitSlop, + delayLongPress: this.props.delayLongPress, + delayPressIn: this.props.delayPressIn, + delayPressOut: this.props.delayPressOut, + minPressDuration: 0, + pressRectOffset: this.props.pressRetentionOffset, + android_disableSound: this.props.touchSoundDisabled, + onBlur: event => { + if (Platform.isTV) { + this._bounceTo(1, 0.4, 0); + } + if (this.props.onBlur != null) { + this.props.onBlur(event); + } + }, + onFocus: event => { + if (Platform.isTV) { + this._bounceTo(0.93, 0.1, 0); + } + if (this.props.onFocus != null) { + this.props.onFocus(event); + } + }, + onLongPress: this.props.onLongPress, + onPress: event => { + const {onPressAnimationComplete, onPressWithCompletion} = this.props; + const releaseBounciness = this.props.releaseBounciness ?? 10; + const releaseVelocity = this.props.releaseVelocity ?? 10; + + if (onPressWithCompletion != null) { + onPressWithCompletion(() => { + this.state.scale.setValue(0.93); + this._bounceTo( + 1, + releaseVelocity, + releaseBounciness, + onPressAnimationComplete, + ); + }); + return; + } + + this._bounceTo( + 1, + releaseVelocity, + releaseBounciness, + onPressAnimationComplete, + ); + if (this.props.onPress != null) { + this.props.onPress(event); + } + }, + onPressIn: event => { + this._bounceTo(0.93, 0.1, 0); + if (this.props.onPressIn != null) { + this.props.onPressIn(event); + } + }, + onPressOut: event => { + this._bounceTo(1, 0.4, 0); + if (this.props.onPressOut != null) { + this.props.onPressOut(event); + } + }, + }; + } + + _bounceTo( + toValue: number, + velocity: number, + bounciness: number, + callback?: ?() => void, + ) { + Animated.spring(this.state.scale, { + toValue, + velocity, + bounciness, + useNativeDriver: true, + }).start(callback); + } + + render(): React.Node { + // BACKWARD-COMPATIBILITY: Focus and blur events were never supported before + // adopting `Pressability`, so preserve that behavior. + const {onBlur, onFocus, ...eventHandlersWithoutBlurAndFocus} = + this.state.pressability.getEventHandlers(); + const accessibilityLiveRegion = + this.props['aria-live'] === 'off' + ? 'none' + : this.props['aria-live'] ?? this.props.accessibilityLiveRegion; + const _accessibilityState = { + busy: this.props['aria-busy'] ?? this.props.accessibilityState?.busy, + checked: + this.props['aria-checked'] ?? this.props.accessibilityState?.checked, + disabled: + this.props['aria-disabled'] ?? this.props.accessibilityState?.disabled, + expanded: + this.props['aria-expanded'] ?? this.props.accessibilityState?.expanded, + selected: + this.props['aria-selected'] ?? this.props.accessibilityState?.selected, + multiselectable: + this.props['aria-multiselectable'] ?? + this.props.accessibilityState?.multiselectable, // Windows + required: + this.props['aria-required'] ?? this.props.accessibilityState?.required, // Windows + }; + + const accessibilityValue = { + max: this.props['aria-valuemax'] ?? this.props.accessibilityValue?.max, + min: this.props['aria-valuemin'] ?? this.props.accessibilityValue?.min, + now: this.props['aria-valuenow'] ?? this.props.accessibilityValue?.now, + text: this.props['aria-valuetext'] ?? this.props.accessibilityValue?.text, + }; + + const accessibilityLabel = + this.props['aria-label'] ?? this.props.accessibilityLabel; + return ( + + {this.props.children} + {__DEV__ ? ( + + ) : null} + + ); + } + + componentDidUpdate(prevProps: Props, prevState: State) { + this.state.pressability.configure(this._createPressabilityConfig()); + } + + componentDidMount(): mixed { + this.state.pressability.configure(this._createPressabilityConfig()); + } + + componentWillUnmount(): void { + this.state.pressability.reset(); + this.state.scale.resetAnimation(); + } +} + +module.exports = (React.forwardRef((props, hostRef) => ( + +)): component( + ref: React.RefSetter, + ...props: $ReadOnly<$Diff> +)); diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableNativeFeedback.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableNativeFeedback.windows.js new file mode 100644 index 00000000000..b2c34d09d6d --- /dev/null +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableNativeFeedback.windows.js @@ -0,0 +1,371 @@ +/** + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @flow strict-local + * @format + */ + +import type {PressEvent} from '../../Types/CoreEventTypes'; +import typeof TouchableWithoutFeedback from './TouchableWithoutFeedback'; + +import View from '../../Components/View/View'; +import Pressability, { + type PressabilityConfig, +} from '../../Pressability/Pressability'; +import {PressabilityDebugView} from '../../Pressability/PressabilityDebug'; +import {findHostInstance_DEPRECATED} from '../../ReactNative/RendererProxy'; +import processColor from '../../StyleSheet/processColor'; +import Platform from '../../Utilities/Platform'; +import {Commands} from '../View/ViewNativeComponent'; +import invariant from 'invariant'; +import * as React from 'react'; + +type Props = $ReadOnly<{| + ...React.ElementConfig, + + /** + * Determines the type of background drawable that's going to be used to + * display feedback. It takes an object with `type` property and extra data + * depending on the `type`. It's recommended to use one of the static + * methods to generate that dictionary. + */ + background?: ?( + | $ReadOnly<{| + type: 'ThemeAttrAndroid', + attribute: + | 'selectableItemBackground' + | 'selectableItemBackgroundBorderless', + rippleRadius: ?number, + |}> + | $ReadOnly<{| + type: 'RippleAndroid', + color: ?number, + borderless: boolean, + rippleRadius: ?number, + |}> + ), + + /** + * TV preferred focus (see documentation for the View component). + */ + hasTVPreferredFocus?: ?boolean, + + /** + * TV next focus down (see documentation for the View component). + */ + nextFocusDown?: ?number, + + /** + * TV next focus forward (see documentation for the View component). + */ + nextFocusForward?: ?number, + + /** + * TV next focus left (see documentation for the View component). + */ + nextFocusLeft?: ?number, + + /** + * TV next focus right (see documentation for the View component). + */ + nextFocusRight?: ?number, + + /** + * TV next focus up (see documentation for the View component). + */ + nextFocusUp?: ?number, + + /** + * Set to true to add the ripple effect to the foreground of the view, instead + * of the background. This is useful if one of your child views has a + * background of its own, or you're e.g. displaying images, and you don't want + * the ripple to be covered by them. + * + * Check TouchableNativeFeedback.canUseNativeForeground() first, as this is + * only available on Android 6.0 and above. If you try to use this on older + * versions, this will fallback to background. + */ + useForeground?: ?boolean, +|}>; + +type State = $ReadOnly<{| + pressability: Pressability, +|}>; + +class TouchableNativeFeedback extends React.Component { + /** + * Creates a value for the `background` prop that uses the Android theme's + * default background for selectable elements. + */ + static SelectableBackground: (rippleRadius: ?number) => $ReadOnly<{| + attribute: 'selectableItemBackground', + type: 'ThemeAttrAndroid', + rippleRadius: ?number, + |}> = (rippleRadius: ?number) => ({ + type: 'ThemeAttrAndroid', + attribute: 'selectableItemBackground', + rippleRadius, + }); + + /** + * Creates a value for the `background` prop that uses the Android theme's + * default background for borderless selectable elements. Requires API 21+. + */ + static SelectableBackgroundBorderless: (rippleRadius: ?number) => $ReadOnly<{| + attribute: 'selectableItemBackgroundBorderless', + type: 'ThemeAttrAndroid', + rippleRadius: ?number, + |}> = (rippleRadius: ?number) => ({ + type: 'ThemeAttrAndroid', + attribute: 'selectableItemBackgroundBorderless', + rippleRadius, + }); + + /** + * Creates a value for the `background` prop that uses the Android ripple with + * the supplied color. If `borderless` is true, the ripple will render outside + * of the view bounds. Requires API 21+. + */ + static Ripple: ( + color: string, + borderless: boolean, + rippleRadius: ?number, + ) => $ReadOnly<{| + borderless: boolean, + color: ?number, + rippleRadius: ?number, + type: 'RippleAndroid', + |}> = (color: string, borderless: boolean, rippleRadius: ?number) => { + const processedColor = processColor(color); + invariant( + processedColor == null || typeof processedColor === 'number', + 'Unexpected color given for Ripple color', + ); + return { + type: 'RippleAndroid', + // $FlowFixMe[incompatible-type] + color: processedColor, + borderless, + rippleRadius, + }; + }; + + /** + * Whether `useForeground` is supported. + */ + static canUseNativeForeground: () => boolean = () => + Platform.OS === 'android'; + + state: State = { + pressability: new Pressability(this._createPressabilityConfig()), + }; + + _createPressabilityConfig(): PressabilityConfig { + const accessibilityStateDisabled = + this.props['aria-disabled'] ?? this.props.accessibilityState?.disabled; + return { + cancelable: !this.props.rejectResponderTermination, + disabled: + this.props.disabled != null + ? this.props.disabled + : accessibilityStateDisabled, + hitSlop: this.props.hitSlop, + delayLongPress: this.props.delayLongPress, + delayPressIn: this.props.delayPressIn, + delayPressOut: this.props.delayPressOut, + minPressDuration: 0, + pressRectOffset: this.props.pressRetentionOffset, + android_disableSound: this.props.touchSoundDisabled, + onLongPress: this.props.onLongPress, + onPress: this.props.onPress, + onPressIn: event => { + if (Platform.OS === 'android') { + this._dispatchHotspotUpdate(event); + this._dispatchPressedStateChange(true); + } + if (this.props.onPressIn != null) { + this.props.onPressIn(event); + } + }, + onPressMove: event => { + if (Platform.OS === 'android') { + this._dispatchHotspotUpdate(event); + } + }, + onPressOut: event => { + if (Platform.OS === 'android') { + this._dispatchPressedStateChange(false); + } + if (this.props.onPressOut != null) { + this.props.onPressOut(event); + } + }, + }; + } + + _dispatchPressedStateChange(pressed: boolean): void { + if (Platform.OS === 'android') { + const hostComponentRef = findHostInstance_DEPRECATED(this); + if (hostComponentRef == null) { + console.warn( + 'Touchable: Unable to find HostComponent instance. ' + + 'Has your Touchable component been unmounted?', + ); + } else { + Commands.setPressed(hostComponentRef, pressed); + } + } + } + + _dispatchHotspotUpdate(event: PressEvent): void { + if (Platform.OS === 'android') { + const {locationX, locationY} = event.nativeEvent; + const hostComponentRef = findHostInstance_DEPRECATED(this); + if (hostComponentRef == null) { + console.warn( + 'Touchable: Unable to find HostComponent instance. ' + + 'Has your Touchable component been unmounted?', + ); + } else { + Commands.hotspotUpdate( + hostComponentRef, + locationX ?? 0, + locationY ?? 0, + ); + } + } + } + + render(): React.Node { + const element = React.Children.only<$FlowFixMe>(this.props.children); + const children: Array = [element.props.children]; + if (__DEV__) { + if (element.type === View) { + children.push( + , + ); + } + } + + // BACKWARD-COMPATIBILITY: Focus and blur events were never supported before + // adopting `Pressability`, so preserve that behavior. + const {onBlur, onFocus, ...eventHandlersWithoutBlurAndFocus} = + this.state.pressability.getEventHandlers(); + + let _accessibilityState = { + busy: this.props['aria-busy'] ?? this.props.accessibilityState?.busy, + checked: + this.props['aria-checked'] ?? this.props.accessibilityState?.checked, + disabled: + this.props['aria-disabled'] ?? this.props.accessibilityState?.disabled, + expanded: + this.props['aria-expanded'] ?? this.props.accessibilityState?.expanded, + selected: + this.props['aria-selected'] ?? this.props.accessibilityState?.selected, + multiselectable: + this.props['aria-multiselectable'] ?? + this.props.accessibilityState?.multiselectable, // Windows + required: + this.props['aria-required'] ?? this.props.accessibilityState?.required, // Windows + }; + + _accessibilityState = + this.props.disabled != null + ? { + ..._accessibilityState, + disabled: this.props.disabled, + } + : _accessibilityState; + + const accessibilityValue = { + max: this.props['aria-valuemax'] ?? this.props.accessibilityValue?.max, + min: this.props['aria-valuemin'] ?? this.props.accessibilityValue?.min, + now: this.props['aria-valuenow'] ?? this.props.accessibilityValue?.now, + text: this.props['aria-valuetext'] ?? this.props.accessibilityValue?.text, + }; + + const accessibilityLiveRegion = + this.props['aria-live'] === 'off' + ? 'none' + : this.props['aria-live'] ?? this.props.accessibilityLiveRegion; + + const accessibilityLabel = + this.props['aria-label'] ?? this.props.accessibilityLabel; + return React.cloneElement( + element, + { + ...eventHandlersWithoutBlurAndFocus, + ...getBackgroundProp( + this.props.background === undefined + ? TouchableNativeFeedback.SelectableBackground() + : this.props.background, + this.props.useForeground === true, + ), + accessible: this.props.accessible !== false, + accessibilityHint: this.props.accessibilityHint, + accessibilityLanguage: this.props.accessibilityLanguage, + accessibilityLabel: accessibilityLabel, + accessibilityRole: this.props.accessibilityRole, + accessibilityState: _accessibilityState, + accessibilityActions: this.props.accessibilityActions, + onAccessibilityAction: this.props.onAccessibilityAction, + accessibilityValue: accessibilityValue, + importantForAccessibility: + this.props['aria-hidden'] === true + ? 'no-hide-descendants' + : this.props.importantForAccessibility, + accessibilityViewIsModal: + this.props['aria-modal'] ?? this.props.accessibilityViewIsModal, + accessibilityLiveRegion: accessibilityLiveRegion, + accessibilityElementsHidden: + this.props['aria-hidden'] ?? this.props.accessibilityElementsHidden, + hasTVPreferredFocus: this.props.hasTVPreferredFocus, + hitSlop: this.props.hitSlop, + focusable: + this.props.focusable !== false && + this.props.onPress !== undefined && + !this.props.disabled, + nativeID: this.props.id ?? this.props.nativeID, + nextFocusDown: this.props.nextFocusDown, + nextFocusForward: this.props.nextFocusForward, + nextFocusLeft: this.props.nextFocusLeft, + nextFocusRight: this.props.nextFocusRight, + nextFocusUp: this.props.nextFocusUp, + onLayout: this.props.onLayout, + testID: this.props.testID, + }, + ...children, + ); + } + + componentDidUpdate(prevProps: Props, prevState: State) { + this.state.pressability.configure(this._createPressabilityConfig()); + } + + componentDidMount(): mixed { + this.state.pressability.configure(this._createPressabilityConfig()); + } + + componentWillUnmount(): void { + this.state.pressability.reset(); + } +} + +const getBackgroundProp = + Platform.OS === 'android' + ? /* $FlowFixMe[missing-local-annot] The type annotation(s) required by + * Flow's LTI update could not be added via codemod */ + (background, useForeground: boolean) => + useForeground && TouchableNativeFeedback.canUseNativeForeground() + ? {nativeForegroundAndroid: background} + : {nativeBackgroundAndroid: background} + : /* $FlowFixMe[missing-local-annot] The type annotation(s) required by + * Flow's LTI update could not be added via codemod */ + (background, useForeground: boolean) => null; + +TouchableNativeFeedback.displayName = 'TouchableNativeFeedback'; + +module.exports = TouchableNativeFeedback; diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableOpacity.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableOpacity.windows.js index 663829617ae..989283c8dd6 100644 --- a/vnext/src-win/Libraries/Components/Touchable/TouchableOpacity.windows.js +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableOpacity.windows.js @@ -235,6 +235,11 @@ class TouchableOpacity extends React.Component { this.props['aria-expanded'] ?? this.props.accessibilityState?.expanded, selected: this.props['aria-selected'] ?? this.props.accessibilityState?.selected, + multiselectable: + this.props['aria-multiselectable'] ?? + this.props.accessibilityState?.multiselectable, // Windows + required: + this.props['aria-required'] ?? this.props.accessibilityState?.required, // Windows }; _accessibilityState = diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js index b9a2351f936..ee4875b260a 100644 --- a/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js @@ -59,6 +59,8 @@ type Props = $ReadOnly<{| 'aria-disabled'?: ?boolean, 'aria-expanded'?: ?boolean, 'aria-selected'?: ?boolean, + 'aria-multiselectable'?: ?boolean, // Windows + 'aria-required'?: ?boolean, // Windows 'aria-hidden'?: ?boolean, 'aria-live'?: ?('polite' | 'assertive' | 'off'), 'aria-label'?: ?Stringish, @@ -158,6 +160,10 @@ class TouchableWithoutFeedback extends React.Component { this.props['aria-expanded'] ?? this.props.accessibilityState?.expanded, selected: this.props['aria-selected'] ?? this.props.accessibilityState?.selected, + multiselectable: + this.props['aria-multiselectable'] ?? + this.props.accessibilityState?.multiselectable, // Windows + required: this.props['aria-required'] ?? this.props.accessibilityState?.required, // Windows }; // BACKWARD-COMPATIBILITY: Focus and blur events were never supported before diff --git a/vnext/src-win/Libraries/Components/View/View.windows.js b/vnext/src-win/Libraries/Components/View/View.windows.js index 51c4df0329a..c33e961dc4e 100644 --- a/vnext/src-win/Libraries/Components/View/View.windows.js +++ b/vnext/src-win/Libraries/Components/View/View.windows.js @@ -47,6 +47,8 @@ const View: React.AbstractComponent< 'aria-checked': ariaChecked, 'aria-disabled': ariaDisabled, 'aria-expanded': ariaExpanded, + 'aria-multiselectable': ariaMultiselectable, // Windows + 'aria-required': ariaRequired, // Windows 'aria-hidden': ariaHidden, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, @@ -80,7 +82,9 @@ const View: React.AbstractComponent< ariaChecked != null || ariaDisabled != null || ariaExpanded != null || - ariaSelected != null + ariaSelected != null || + ariaMultiselectable != null || // Windows + ariaRequired != null // Windows ) { _accessibilityState = { busy: ariaBusy ?? accessibilityState?.busy, @@ -88,6 +92,9 @@ const View: React.AbstractComponent< disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + multiselectable: + ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows + required: ariaRequired ?? accessibilityState?.required, // Windows }; } let _accessibilityValue; diff --git a/vnext/src-win/Libraries/Components/View/ViewAccessibility.d.ts b/vnext/src-win/Libraries/Components/View/ViewAccessibility.d.ts index 9ac8d1722e5..dcd37958523 100644 --- a/vnext/src-win/Libraries/Components/View/ViewAccessibility.d.ts +++ b/vnext/src-win/Libraries/Components/View/ViewAccessibility.d.ts @@ -183,6 +183,16 @@ export interface AccessibilityState { * When present, informs accessible tools the element is expanded or collapsed */ expanded?: boolean | undefined; + /** + * When present, informs accessible tools the element can have multiple items selected + * @platform windows + */ + multiselectable?: boolean | undefined; + /** + * When present, informs accessible tools the element requires selection + * @platform windows + */ + required?: boolean | undefined; } export interface AccessibilityValue { diff --git a/vnext/src-win/Libraries/Components/View/ViewAccessibility.windows.js b/vnext/src-win/Libraries/Components/View/ViewAccessibility.windows.js index dee11efda99..b970d698137 100644 --- a/vnext/src-win/Libraries/Components/View/ViewAccessibility.windows.js +++ b/vnext/src-win/Libraries/Components/View/ViewAccessibility.windows.js @@ -179,8 +179,10 @@ export type AccessibilityState = { disabled?: boolean, selected?: boolean, checked?: ?boolean | 'mixed', - busy?: boolean, - expanded?: boolean, + busy?: ?boolean, + expanded?: ?boolean, + multiselectable?: ?boolean, // Windows + required?: ?boolean, // Windows ... }; diff --git a/vnext/src-win/Libraries/Components/View/ViewPropTypes.windows.js b/vnext/src-win/Libraries/Components/View/ViewPropTypes.windows.js index 8c21541f919..f485c8b5ec9 100644 --- a/vnext/src-win/Libraries/Components/View/ViewPropTypes.windows.js +++ b/vnext/src-win/Libraries/Components/View/ViewPropTypes.windows.js @@ -612,6 +612,8 @@ export type ViewProps = $ReadOnly<{| * See https://reactnative.dev/docs/view#aria-hidden */ 'aria-hidden'?: ?boolean, + 'aria-multiselectable'?: ?boolean, // Windows + 'aria-required'?: ?boolean, // Windows /** * Views that are only used to layout their children or otherwise don't draw diff --git a/vnext/src-win/Libraries/Image/Image.windows.js b/vnext/src-win/Libraries/Image/Image.windows.js index 99d778ad54b..ec4f5ba6695 100644 --- a/vnext/src-win/Libraries/Image/Image.windows.js +++ b/vnext/src-win/Libraries/Image/Image.windows.js @@ -148,6 +148,8 @@ let BaseImage: AbstractImageIOS = React.forwardRef((props, forwardedRef) => { 'aria-disabled': ariaDisabled, 'aria-expanded': ariaExpanded, 'aria-selected': ariaSelected, + 'aria-multiselectable': ariaMultiselectable, // Windows + 'aria-required': ariaRequired, // Windows height, src, width, @@ -160,6 +162,9 @@ let BaseImage: AbstractImageIOS = React.forwardRef((props, forwardedRef) => { disabled: ariaDisabled ?? props.accessibilityState?.disabled, expanded: ariaExpanded ?? props.accessibilityState?.expanded, selected: ariaSelected ?? props.accessibilityState?.selected, + multiselectable: + ariaMultiselectable ?? props.accessibilityState?.multiselectable, // Windows + required: ariaRequired ?? props.accessibilityState?.required, // Windows }; const accessibilityLabel = props['aria-label'] ?? props.accessibilityLabel; diff --git a/vnext/src-win/Libraries/Text/Text.windows.js b/vnext/src-win/Libraries/Text/Text.windows.js index 6c439cbfd4e..e4ff93bd81e 100644 --- a/vnext/src-win/Libraries/Text/Text.windows.js +++ b/vnext/src-win/Libraries/Text/Text.windows.js @@ -46,6 +46,8 @@ const Text: React.AbstractComponent< 'aria-checked': ariaChecked, 'aria-disabled': ariaDisabled, 'aria-expanded': ariaExpanded, + 'aria-multiselectable': ariaMultiselectable, // Windows + 'aria-required': ariaRequired, // Windows 'aria-label': ariaLabel, 'aria-level': ariaLevel, // Windows 'aria-posinset': ariaPosinset, // Windows @@ -78,7 +80,9 @@ const Text: React.AbstractComponent< ariaChecked != null || ariaDisabled != null || ariaExpanded != null || - ariaSelected != null + ariaSelected != null || + ariaMultiselectable != null || // Windows + ariaRequired != null // Windows ) { _accessibilityState = { busy: ariaBusy ?? accessibilityState?.busy, @@ -86,6 +90,9 @@ const Text: React.AbstractComponent< disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + multiselectable: + ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows + required: ariaRequired ?? accessibilityState?.required, // Windows }; } diff --git a/vnext/src-win/Libraries/Text/TextProps.windows.js b/vnext/src-win/Libraries/Text/TextProps.windows.js index 561859c4b72..7d9833b4d2e 100644 --- a/vnext/src-win/Libraries/Text/TextProps.windows.js +++ b/vnext/src-win/Libraries/Text/TextProps.windows.js @@ -97,6 +97,8 @@ export type TextProps = $ReadOnly<{| 'aria-posinset'?: ?number, // Windows 'aria-setsize'?: ?number, // Windows 'aria-level'?: ?number, // Windows + 'aria-multiselectable'?: ?boolean, // Windows + 'aria-required'?: ?boolean, // Windows /** * Represents the nativeID of the associated label text. When the assistive technology focuses on the component with this props, the text is read aloud. From 13450a4fa0809340ac1155cc93f1a4fefe508ba1 Mon Sep 17 00:00:00 2001 From: Chiara Mooney <34109996+chiaramooney@users.noreply.github.com> Date: Thu, 19 Dec 2024 15:42:51 -0800 Subject: [PATCH 2/6] [Fabric] Implement IRangeValueProvider and Adjust IValueProvider Implementation (#14212) * IRangeValue Provider * Adjust ReadOnly to Use Prop Value * Complete IRangeValueProvider Implementation * Change files * Update Snapshots --- ...-b6be67a1-15ea-4cca-9226-b7c33cd7f710.json | 7 + .../AccessibilityExampleWindows.tsx | 12 +- .../test/AccessibilityTest.test.ts | 18 + .../AccessibilityTest.test.ts.snap | 115 +++ .../__snapshots__/HomeUIADump.test.ts.snap | 1 - .../TextInputComponentTest.test.ts.snap | 669 +++++++++++++++-- .../ViewComponentTest.test.ts.snap | 13 + .../__snapshots__/snapshotPages.test.js.snap | 681 ++++++++++++++++++ .../RNTesterApp-Fabric/RNTesterApp-Fabric.cpp | 28 +- packages/playground/Samples/simple.tsx | 1 + .../CompositionDynamicAutomationProvider.cpp | 105 ++- .../CompositionDynamicAutomationProvider.h | 9 + .../CompositionViewComponentView.cpp | 4 +- .../Fabric/Composition/UiaHelpers.cpp | 10 - .../Fabric/Composition/UiaHelpers.h | 2 - .../components/view/AccessibilityPrimitives.h | 1 + .../view/accessibilityPropsConversions.h | 4 + .../Libraries/Components/Button.windows.js | 3 + .../Components/Pressable/Pressable.windows.js | 3 + .../Components/TextInput/TextInput.windows.js | 3 + .../Touchable/TouchableBounce.windows.js | 2 + .../TouchableNativeFeedback.windows.js | 2 + .../Touchable/TouchableOpacity.windows.js | 2 + .../TouchableWithoutFeedback.windows.js | 4 +- .../Libraries/Components/View/View.windows.js | 3 + .../Components/View/ViewAccessibility.d.ts | 9 +- .../View/ViewAccessibility.windows.js | 1 + .../Components/View/ViewPropTypes.windows.js | 1 + .../src-win/Libraries/Image/Image.windows.js | 2 + vnext/src-win/Libraries/Text/Text.windows.js | 4 + .../Libraries/Text/TextProps.windows.js | 1 + 31 files changed, 1623 insertions(+), 97 deletions(-) create mode 100644 change/react-native-windows-b6be67a1-15ea-4cca-9226-b7c33cd7f710.json diff --git a/change/react-native-windows-b6be67a1-15ea-4cca-9226-b7c33cd7f710.json b/change/react-native-windows-b6be67a1-15ea-4cca-9226-b7c33cd7f710.json new file mode 100644 index 00000000000..b3e436f468d --- /dev/null +++ b/change/react-native-windows-b6be67a1-15ea-4cca-9226-b7c33cd7f710.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "IRangeValue Provider", + "packageName": "react-native-windows", + "email": "34109996+chiaramooney@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/@react-native-windows/tester/src/js/examples-win/Accessibility/AccessibilityExampleWindows.tsx b/packages/@react-native-windows/tester/src/js/examples-win/Accessibility/AccessibilityExampleWindows.tsx index b148c49a33e..91edb0fcf2e 100644 --- a/packages/@react-native-windows/tester/src/js/examples-win/Accessibility/AccessibilityExampleWindows.tsx +++ b/packages/@react-native-windows/tester/src/js/examples-win/Accessibility/AccessibilityExampleWindows.tsx @@ -436,7 +436,8 @@ class AccessibilityStateExamples extends React.Component { + onPress={this.rangePress} + testID="accessibilityValue-increment"> Range value increment + }} + testID="accessibilityValue-number" + accessibilityState={{readOnly: true}}> The View's (accessibilityRole == adjustable, ie. Slider) properties should be the following according to UIA: Min-{' '} @@ -472,7 +475,10 @@ class AccessibilityStateExamples extends React.Component { accessibilityValue={{ text: this.state.viewValueText, }} - accessibilityRole="combobox"> + accessibilityRole="combobox" + testID="accessibilityValue-text" + accessible + aria-readonly> The View's properties should be the following according to UIA: Text- {this.state.viewValueText} diff --git a/packages/e2e-test-app-fabric/test/AccessibilityTest.test.ts b/packages/e2e-test-app-fabric/test/AccessibilityTest.test.ts index 62be53287d6..68e4df380c1 100644 --- a/packages/e2e-test-app-fabric/test/AccessibilityTest.test.ts +++ b/packages/e2e-test-app-fabric/test/AccessibilityTest.test.ts @@ -59,4 +59,22 @@ describe('Accessibility Tests', () => { const dump = await dumpVisualTree('selection-container'); expect(dump).toMatchSnapshot(); }); + test('Components can store range data by setting the min, max, and now of accessibilityValue', async () => { + await searchBox('Sta'); + const componentsTab = await app.findElementByTestID( + 'accessibilityValue-number', + ); + await componentsTab.waitForDisplayed({timeout: 5000}); + const dump = await dumpVisualTree('accessibilityValue-number'); + expect(dump).toMatchSnapshot(); + }); + test('Components can store value data by setting the text of accessibilityValue', async () => { + await searchBox('Sta'); + const componentsTab = await app.findElementByTestID( + 'accessibilityValue-text', + ); + await componentsTab.waitForDisplayed({timeout: 5000}); + const dump = await dumpVisualTree('accessibilityValue-text'); + expect(dump).toMatchSnapshot(); + }); }); diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/AccessibilityTest.test.ts.snap b/packages/e2e-test-app-fabric/test/__snapshots__/AccessibilityTest.test.ts.snap index 2b60c38d4e8..b70e1b1ac77 100644 --- a/packages/e2e-test-app-fabric/test/__snapshots__/AccessibilityTest.test.ts.snap +++ b/packages/e2e-test-app-fabric/test/__snapshots__/AccessibilityTest.test.ts.snap @@ -1,5 +1,120 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`Accessibility Tests Components can store range data by setting the min, max, and now of accessibilityValue 1`] = ` +{ + "Automation Tree": { + "AutomationId": "accessibilityValue-number", + "ControlType": 50015, + "IsKeyboardFocusable": true, + "LocalizedControlType": "slider", + "RangeValuePattern.IsReadOnly": true, + "RangeValuePattern.Maximum": 125, + "RangeValuePattern.Minimum": 5, + "RangeValuePattern.Value": 10, + "__Children": [ + { + "AutomationId": "", + "ControlType": 50020, + "LocalizedControlType": "text", + "Name": "The View's (accessibilityRole == adjustable, ie. Slider) properties should be the following according to UIA: Min- 5Max- 125Now- 10", + }, + ], + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "TestId": "accessibilityValue-number", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ParagraphComponentView", + "_Props": {}, + }, + ], + }, + "Visual Tree": { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(128, 128, 128, 255)", + }, + "Comment": "accessibilityValue-number", + "Offset": "0, 0, 0", + "Size": "916, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 19", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 19", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, +} +`; + +exports[`Accessibility Tests Components can store value data by setting the text of accessibilityValue 1`] = ` +{ + "Automation Tree": { + "AutomationId": "accessibilityValue-text", + "ControlType": 50003, + "LocalizedControlType": "combo box", + "ValuePattern.IsReadOnly": true, + "ValuePattern.Value": "testText", + "__Children": [ + { + "AutomationId": "", + "ControlType": 50020, + "LocalizedControlType": "text", + "Name": "The View's properties should be the following according to UIA: Text- testText", + }, + ], + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "TestId": "accessibilityValue-text", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.ParagraphComponentView", + "_Props": {}, + }, + ], + }, + "Visual Tree": { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(128, 128, 128, 255)", + }, + "Comment": "accessibilityValue-text", + "Offset": "0, 0, 0", + "Size": "916, 50", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 20", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 20", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, +} +`; + exports[`Accessibility Tests Elements can set accessibilityState:selected to false 1`] = ` { "Automation Tree": { diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/HomeUIADump.test.ts.snap b/packages/e2e-test-app-fabric/test/__snapshots__/HomeUIADump.test.ts.snap index 9a71c1e54f7..da3f507c5fe 100644 --- a/packages/e2e-test-app-fabric/test/__snapshots__/HomeUIADump.test.ts.snap +++ b/packages/e2e-test-app-fabric/test/__snapshots__/HomeUIADump.test.ts.snap @@ -8077,7 +8077,6 @@ exports[`Home UIA Tree Dump Search Bar 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "Search...", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/TextInputComponentTest.test.ts.snap b/packages/e2e-test-app-fabric/test/__snapshots__/TextInputComponentTest.test.ts.snap index 063014b9942..21f75a83ebe 100644 --- a/packages/e2e-test-app-fabric/test/__snapshots__/TextInputComponentTest.test.ts.snap +++ b/packages/e2e-test-app-fabric/test/__snapshots__/TextInputComponentTest.test.ts.snap @@ -7,7 +7,6 @@ exports[`TextInput Tests Multi-line TextInputs can enable text selection (Impera "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "multiline text selection can also be changed imperatively", }, @@ -85,7 +84,6 @@ exports[`TextInput Tests Multi-line TextInputs can enable text selection 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "multiline text selection can also be changed", }, @@ -163,7 +161,6 @@ exports[`TextInput Tests Single-line TextInputs can enable text selection (Imper "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "text selection can be changed imperatively", }, "Component Tree": { @@ -240,7 +237,6 @@ exports[`TextInput Tests Single-line TextInputs can enable text selection 1`] = "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "text selection can be changed", }, "Component Tree": { @@ -319,7 +315,6 @@ exports[`TextInput Tests Text have cursorColor 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "cursorColor={"green"}", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "Hello World", }, "Component Tree": { @@ -356,7 +351,6 @@ exports[`TextInput Tests TextInputs can autocapitalize: Autocapitalize Character "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -432,7 +426,6 @@ exports[`TextInput Tests TextInputs can autocapitalize: Autocapitalize Turned Of "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -510,7 +503,6 @@ exports[`TextInput Tests TextInputs can autocomplete, address country 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "postal-address-country", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -588,7 +580,6 @@ exports[`TextInput Tests TextInputs can autocomplete, country 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "country", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -666,7 +657,6 @@ exports[`TextInput Tests TextInputs can autocomplete, one-time-code 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "one-time-code", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -744,7 +734,6 @@ exports[`TextInput Tests TextInputs can autocomplete, sms-otp 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "sms-otp", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -755,6 +744,423 @@ exports[`TextInput Tests TextInputs can autocomplete, sms-otp 1`] = ` "Visual Tree": { "Comment": "textinput-autocomplete-sms-otp", "Offset": "0, 0, 0", + "Size": "916, 29", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, 0, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, -1, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(0, 0, 0, 255)", + }, + "Offset": "0, 0, 0", + "Opacity": 0, + "Size": "0, 0", + "Visual Type": "SpriteVisual", + }, + ], + }, +} +`; + +exports[`TextInput Tests TextInputs can autogrow 1`] = ` +{ + "Automation Tree": { + "AutomationId": "textinput-autogrow", + "ControlType": 50004, + "IsKeyboardFocusable": true, + "LocalizedControlType": "edit", + "ValuePattern.Value": "small small small small small small", + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", + "_Props": { + "TestId": "textinput-autogrow", + }, + }, + "Visual Tree": { + "Comment": "textinput-autogrow", + "Offset": "0, 0, 0", + "Size": "300, 131", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, 0, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, -1, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(0, 0, 0, 255)", + }, + "Offset": "0, 0, 0", + "Opacity": 0, + "Size": "0, 0", + "Visual Type": "SpriteVisual", + }, + ], + }, +} +`; + +exports[`TextInput Tests TextInputs can be defined as a set using accessibilityPosInSet and accessibilitySetSize 1`] = ` +{ + "Automation Tree": { + "AutomationId": "textinput-set", + "ControlType": 50026, + "LocalizedControlType": "group", + "__Children": [ + { + "AutomationId": "", + "ControlType": 50004, + "HelpText": "TextInput 1 in Set of 3", + "IsKeyboardFocusable": true, + "LocalizedControlType": "edit", + "Name": "TextInput 1 in Set of 3", + "PositionInSet": 1, + "SizeofSet": 3, + }, + { + "AutomationId": "", + "ControlType": 50004, + "HelpText": "TextInput 2 in Set of 3", + "IsKeyboardFocusable": true, + "LiveSetting": "Polite", + "LocalizedControlType": "edit", + "Name": "TextInput 2 in Set of 3", + "PositionInSet": 2, + "SizeofSet": 3, + }, + { + "AutomationId": "", + "ControlType": 50004, + "HelpText": "TextInput 3 in Set of 3", + "IsKeyboardFocusable": true, + "LiveSetting": "Assertive", + "LocalizedControlType": "edit", + "Name": "TextInput 3 in Set of 3", + "PositionInSet": 3, + "SizeofSet": 3, + }, + ], + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "TestId": "textinput-set", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", + "_Props": {}, + }, + { + "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", + "_Props": {}, + }, + { + "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", + "_Props": {}, + }, + ], + }, + "Visual Tree": { + "Comment": "textinput-set", + "Offset": "0, 0, 0", + "Size": "916, 94", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 33", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 33", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, 0, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, -1, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(0, 0, 0, 255)", + }, + "Offset": "0, 0, 0", + "Opacity": 0, + "Size": "0, 0", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, + { + "Offset": "0, 31, 0", + "Size": "916, 32", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 32", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, 0, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, -1, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(0, 0, 0, 255)", + }, + "Offset": "0, 0, 0", + "Opacity": 0, + "Size": "0, 0", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, + { + "Offset": "0, 62, 0", + "Size": "916, 32", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 32", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, 0, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, -1, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(0, 0, 0, 255)", + }, + "Offset": "0, 0, 0", + "Opacity": 0, + "Size": "0, 0", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, + ], + }, +} +`; + +exports[`TextInput Tests TextInputs can be editable 1`] = ` +{ + "Automation Tree": { + "AutomationId": "textinput-editable", + "ControlType": 50004, + "HelpText": "editable text input using editable prop", + "IsKeyboardFocusable": true, + "LocalizedControlType": "edit", + "Name": "editable text input using editable prop", + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", + "_Props": { + "TestId": "textinput-editable", + }, + }, + "Visual Tree": { + "Comment": "textinput-editable", + "Offset": "0, 0, 0", "Size": "916, 28", "Visual Type": "SpriteVisual", "__Children": [ @@ -820,8 +1226,7 @@ exports[`TextInput Tests TextInputs can autogrow 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, - "ValuePattern.Value": "small small small small small small", + "ValuePattern.Value": "multiline with children, aligned bottom-right", }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -974,7 +1379,6 @@ exports[`TextInput Tests TextInputs can be multiline, center alignment 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "multiline, aligned center", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1012,7 +1416,6 @@ exports[`TextInput Tests TextInputs can be multiline, topleft alignment 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "multiline, aligned top-left", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1161,7 +1564,6 @@ exports[`TextInput Tests TextInputs can clear on submit 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1197,7 +1599,6 @@ exports[`TextInput Tests TextInputs can clear on submit with custom submit key e "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1233,7 +1634,6 @@ exports[`TextInput Tests TextInputs can clear on submit with custom submit key e "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1269,7 +1669,6 @@ exports[`TextInput Tests TextInputs can customize its padding 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1307,7 +1706,6 @@ exports[`TextInput Tests TextInputs can enable spellcheck 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "Type text to test spell check functionality.", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1343,7 +1741,6 @@ exports[`TextInput Tests TextInputs can have a background color 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "He", }, "Component Tree": { @@ -1420,7 +1817,6 @@ exports[`TextInput Tests TextInputs can have a color 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "He", }, "Component Tree": { @@ -1497,7 +1893,6 @@ exports[`TextInput Tests TextInputs can have a font family 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "He", }, "Component Tree": { @@ -1574,7 +1969,6 @@ exports[`TextInput Tests TextInputs can have a font size 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "He", }, "Component Tree": { @@ -1651,7 +2045,6 @@ exports[`TextInput Tests TextInputs can have a font style 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "He", }, "Component Tree": { @@ -1728,7 +2121,6 @@ exports[`TextInput Tests TextInputs can have a font weight 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "He", }, "Component Tree": { @@ -1805,8 +2197,7 @@ exports[`TextInput Tests TextInputs can have attributed text 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, - "ValuePattern.Value": "Hello", + "ValuePattern.Value": "Hello ", }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1884,7 +2275,6 @@ exports[`TextInput Tests TextInputs can have caretHidden 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "caretHidden={true}", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "Hello World", }, "Component Tree": { @@ -1923,7 +2313,6 @@ exports[`TextInput Tests TextInputs can have custom return key label, Compile 1` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "returnKeyLabel: Compile", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1961,7 +2350,6 @@ exports[`TextInput Tests TextInputs can have custom return key label, React Nati "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "returnKeyLabel: React Native", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1999,7 +2387,6 @@ exports[`TextInput Tests TextInputs can have custom return key type, done 1`] = "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "returnKeyType: done", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2037,7 +2424,6 @@ exports[`TextInput Tests TextInputs can have custom return key type, go 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "returnKeyType: go", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2075,7 +2461,6 @@ exports[`TextInput Tests TextInputs can have custom return key type, next 1`] = "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "returnKeyType: next", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2113,7 +2498,6 @@ exports[`TextInput Tests TextInputs can have custom return key type, none 1`] = "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "returnKeyType: none", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2151,7 +2535,6 @@ exports[`TextInput Tests TextInputs can have custom return key type, previous 1` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "returnKeyType: previous", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2189,7 +2572,6 @@ exports[`TextInput Tests TextInputs can have custom return key type, search 1`] "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "returnKeyType: search", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2227,7 +2609,6 @@ exports[`TextInput Tests TextInputs can have custom return key type, send 1`] = "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "returnKeyType: send", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2265,7 +2646,6 @@ exports[`TextInput Tests TextInputs can have customer letter spacing, spacing=-1 "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "letterSpacing = -1", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2303,7 +2683,6 @@ exports[`TextInput Tests TextInputs can have customer letter spacing, spacing=0 "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "letterSpacing = 0", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2341,7 +2720,6 @@ exports[`TextInput Tests TextInputs can have customer letter spacing, spacing=2 "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "letterSpacing = 2", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2379,7 +2757,6 @@ exports[`TextInput Tests TextInputs can have customer letter spacing, spacing=9 "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "letterSpacing = 9", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2511,7 +2888,6 @@ exports[`TextInput Tests TextInputs can have customized letter spacing 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "He", }, "Component Tree": { @@ -2588,8 +2964,8 @@ exports[`TextInput Tests TextInputs can have customized line height 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, - "ValuePattern.Value": "Hel", + "ValuePattern.Value": "Hel +", }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2667,7 +3043,6 @@ exports[`TextInput Tests TextInputs can have inline images 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "This has drawableLeft set", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2705,7 +3080,6 @@ exports[`TextInput Tests TextInputs can have inline images, drawable props not s "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "This does not have drawable props set", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2743,7 +3117,6 @@ exports[`TextInput Tests TextInputs can have inline images, drawableLeft and dra "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "This has drawableLeft and drawablePadding set", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2781,7 +3154,6 @@ exports[`TextInput Tests TextInputs can have shadows 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "shadowColor: purple", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2817,7 +3189,6 @@ exports[`TextInput Tests TextInputs can have text decoration lines 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "He", }, "Component Tree": { @@ -2829,6 +3200,82 @@ exports[`TextInput Tests TextInputs can have text decoration lines 1`] = ` "Visual Tree": { "Comment": "style-textDecorationLine", "Offset": "0, 0, 0", + "Size": "791, 28", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, 0, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, -1, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(0, 0, 0, 255)", + }, + "Offset": "0, 0, 0", + "Opacity": 0, + "Size": "0, 0", + "Visual Type": "SpriteVisual", + }, + ], + }, +} +`; + +exports[`TextInput Tests TextInputs can have text shadows 1`] = ` +{ + "Automation Tree": { + "AutomationId": "style-textShadow", + "ControlType": 50004, + "IsKeyboardFocusable": true, + "LocalizedControlType": "edit", + "ValuePattern.Value": "He", + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", + "_Props": { + "TestId": "style-textShadow", + }, + }, + "Visual Tree": { + "Comment": "style-textShadow", + "Offset": "0, 0, 0", "Size": "791, 29", "Visual Type": "SpriteVisual", "__Children": [ @@ -2973,7 +3420,6 @@ exports[`TextInput Tests TextInputs can propagate events 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "Click inside the box to observe events being fired.", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3011,7 +3457,6 @@ exports[`TextInput Tests TextInputs can register press events 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "Click inside the box to observe events being fired.", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3047,7 +3492,6 @@ exports[`TextInput Tests TextInputs can rewrite characters: Replace Space with C "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3123,7 +3567,6 @@ exports[`TextInput Tests TextInputs can rewrite characters: Replace Space with N "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3199,7 +3642,6 @@ exports[`TextInput Tests TextInputs can rewrite characters: Replace Space with U "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3277,7 +3719,6 @@ exports[`TextInput Tests TextInputs can set their readOnly prop to false 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "editable text input using readOnly prop", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3430,7 +3871,6 @@ exports[`TextInput Tests TextInputs can submit with custom key, multilined and s "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3466,7 +3906,6 @@ exports[`TextInput Tests TextInputs have a custom background color 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "Same BackgroundColor as View ", }, "Component Tree": { @@ -3503,7 +3942,6 @@ exports[`TextInput Tests TextInputs have a custom highlight color 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "Selection Color is red", }, "Component Tree": { @@ -3542,7 +3980,6 @@ exports[`TextInput Tests TextInputs have a custom placeholder text color 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "Red placeholder text color", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3578,7 +4015,6 @@ exports[`TextInput Tests TextInputs have a custom text color 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "Green Text", }, "Component Tree": { @@ -3617,7 +4053,6 @@ exports[`TextInput Tests TextInputs have a custom underline color 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "Blue underline color", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3655,7 +4090,6 @@ exports[`TextInput Tests TextInputs have a default placeholder text color 1`] = "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "Default placeholder text color", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3691,7 +4125,6 @@ exports[`TextInput Tests TextInputs have a default text color 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "Default color text", }, "Component Tree": { @@ -3730,7 +4163,6 @@ exports[`TextInput Tests TextInputs have a default underline color 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "Default underline color", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3766,7 +4198,6 @@ exports[`TextInput Tests TextInputs support secure entry 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "iloveturtles", }, "Component Tree": { @@ -3805,7 +4236,6 @@ exports[`TextInput Tests TextInputs support secure entry, with placeholder text "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "color is supported too", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3834,6 +4264,109 @@ exports[`TextInput Tests TextInputs support secure entry, with placeholder text } `; +exports[`TextInput Tests TextInputs which have a searchbox role should also support the value pattern. 1`] = ` +{ + "Automation Tree": { + "AutomationId": "textinput-searchbox", + "ControlType": 50026, + "LocalizedControlType": "group", + "__Children": [ + { + "AutomationId": "", + "ControlType": 50004, + "IsKeyboardFocusable": true, + "LocalizedControlType": "edit", + "ValuePattern.Value": "Search", + }, + ], + }, + "Component Tree": { + "Type": "Microsoft.ReactNative.Composition.ViewComponentView", + "_Props": { + "TestId": "textinput-searchbox", + }, + "__Children": [ + { + "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", + "_Props": {}, + }, + ], + }, + "Visual Tree": { + "Comment": "textinput-searchbox", + "Offset": "0, 0, 0", + "Size": "916, 31", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 32", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "916, 32", + "Visual Type": "SpriteVisual", + "__Children": [ + { + "Offset": "0, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, 0, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 0, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "-1, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "1, -1, 0", + "Size": "-2, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, -1, 0", + "Size": "1, 1", + "Visual Type": "SpriteVisual", + }, + { + "Offset": "0, 1, 0", + "Size": "1, -2", + "Visual Type": "SpriteVisual", + }, + { + "Brush": { + "Brush Type": "ColorBrush", + "Color": "rgba(0, 0, 0, 255)", + }, + "Offset": "0, 0, 0", + "Opacity": 0, + "Size": "0, 0", + "Visual Type": "SpriteVisual", + }, + ], + }, + ], + }, + ], + }, +} +`; + exports[`TextInput Tests TextInputs with set height and padding from theme 1`] = ` { "Automation Tree": { @@ -3843,7 +4376,6 @@ exports[`TextInput Tests TextInputs with set height and padding from theme 1`] = "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "If you set height, beware of padding set from themes", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3879,7 +4411,6 @@ exports[`TextInput Tests Uncontrolled TextInput 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "Hello World!", }, "Component Tree": { diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/ViewComponentTest.test.ts.snap b/packages/e2e-test-app-fabric/test/__snapshots__/ViewComponentTest.test.ts.snap index 6e7c1fec89f..96751a8dabb 100644 --- a/packages/e2e-test-app-fabric/test/__snapshots__/ViewComponentTest.test.ts.snap +++ b/packages/e2e-test-app-fabric/test/__snapshots__/ViewComponentTest.test.ts.snap @@ -982,6 +982,19 @@ exports[`View Tests Views can have customized accessibility 1`] = ` "LocalizedControlType": "text", "Name": "Current Number of Accessibility Taps: 0", }, + { + "AutomationId": "", + "ControlType": 50026, + "LocalizedControlType": "group", + "__Children": [ + { + "AutomationId": "", + "ControlType": 50020, + "LocalizedControlType": "text", + "Name": "This sub-view should not have an accessibility value. It's control type does not support the value pattern.", + }, + ], + }, ], }, "Component Tree": { diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap b/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap index cb35c326aed..99f10e3b1ca 100644 --- a/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap +++ b/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap @@ -707,6 +707,7 @@ exports[`snapshotAllPages Accessibility Windows 4`] = ` "width": 100, } } + testID="accessibilityValue-increment" > Range value increment @@ -714,6 +715,11 @@ exports[`snapshotAllPages Accessibility Windows 4`] = ` The View's (accessibilityRole == adjustable, ie. Slider) properties should be the following according to UIA: Min- @@ -750,12 +757,15 @@ exports[`snapshotAllPages Accessibility Windows 4`] = ` "text": "testText", } } + accessible={true} + aria-readonly={true} style={ { "backgroundColor": "gray", "height": 50, } } + testID="accessibilityValue-text" > The View's properties should be the following according to UIA: Text- @@ -1232,6 +1242,7 @@ exports[`snapshotAllPages Alerts 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1294,6 +1305,7 @@ exports[`snapshotAllPages Alerts 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1355,6 +1367,7 @@ exports[`snapshotAllPages Alerts 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1417,6 +1430,7 @@ exports[`snapshotAllPages Alerts 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1478,6 +1492,7 @@ exports[`snapshotAllPages Alerts 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1539,6 +1554,7 @@ exports[`snapshotAllPages Alerts 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1600,6 +1616,7 @@ exports[`snapshotAllPages Alerts 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1679,6 +1696,7 @@ exports[`snapshotAllPages Alerts 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1735,6 +1753,7 @@ exports[`snapshotAllPages Alerts 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1791,6 +1810,7 @@ exports[`snapshotAllPages Alerts 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1847,6 +1867,7 @@ exports[`snapshotAllPages Alerts 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1903,6 +1924,7 @@ exports[`snapshotAllPages Alerts 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -1964,6 +1986,7 @@ exports[`snapshotAllPages Alerts 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -2020,6 +2043,7 @@ exports[`snapshotAllPages Alerts 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -2076,6 +2100,7 @@ exports[`snapshotAllPages Alerts 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -2209,6 +2234,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2278,6 +2304,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2347,6 +2374,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2416,6 +2444,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2485,6 +2514,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2554,6 +2584,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2623,6 +2654,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2692,6 +2724,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2761,6 +2794,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2830,6 +2864,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2899,6 +2934,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -2968,6 +3004,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -3039,6 +3076,7 @@ exports[`snapshotAllPages Animated 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -3176,6 +3214,7 @@ exports[`snapshotAllPages Animated 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -3367,6 +3406,7 @@ exports[`snapshotAllPages Animated 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -3671,6 +3711,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -3727,6 +3768,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -3783,6 +3825,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -3971,6 +4014,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -4027,6 +4071,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -4083,6 +4128,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -4271,6 +4317,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -4327,6 +4374,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -4383,6 +4431,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -4571,6 +4620,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -4627,6 +4677,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -4683,6 +4734,7 @@ exports[`snapshotAllPages Animated 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -4935,6 +4987,7 @@ exports[`snapshotAllPages Animated 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -5054,6 +5107,7 @@ exports[`snapshotAllPages Animated 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -5173,6 +5227,7 @@ exports[`snapshotAllPages Animated 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -5316,6 +5371,7 @@ exports[`snapshotAllPages Animated 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -5435,6 +5491,7 @@ exports[`snapshotAllPages Animated 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -5554,6 +5611,7 @@ exports[`snapshotAllPages Animated 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -5678,6 +5736,7 @@ exports[`snapshotAllPages Animated 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -5839,6 +5898,7 @@ exports[`snapshotAllPages Animated 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6023,6 +6083,7 @@ exports[`snapshotAllPages Animated 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6080,6 +6141,7 @@ exports[`snapshotAllPages Animated 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6136,6 +6198,7 @@ exports[`snapshotAllPages Animated 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6192,6 +6255,7 @@ exports[`snapshotAllPages Animated 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6299,6 +6363,7 @@ exports[`snapshotAllPages Animated 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6432,6 +6497,7 @@ exports[`snapshotAllPages Animated 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6575,6 +6641,7 @@ exports[`snapshotAllPages Animated 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6631,6 +6698,7 @@ exports[`snapshotAllPages Animated 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6687,6 +6755,7 @@ exports[`snapshotAllPages Animated 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6743,6 +6812,7 @@ exports[`snapshotAllPages Animated 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6799,6 +6869,7 @@ exports[`snapshotAllPages Animated 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -6882,6 +6953,7 @@ exports[`snapshotAllPages Animated 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -7779,6 +7851,7 @@ exports[`snapshotAllPages Button 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -7868,6 +7941,7 @@ exports[`snapshotAllPages Button 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -7974,6 +8048,7 @@ exports[`snapshotAllPages Button 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8067,6 +8142,7 @@ exports[`snapshotAllPages Button 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8174,6 +8250,7 @@ exports[`snapshotAllPages Button 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8267,6 +8344,7 @@ exports[`snapshotAllPages Button 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8360,6 +8438,7 @@ exports[`snapshotAllPages Button 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8457,6 +8536,7 @@ exports[`snapshotAllPages Button 5`] = ` "disabled": true, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8574,6 +8654,7 @@ exports[`snapshotAllPages Button 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8670,6 +8751,7 @@ exports[`snapshotAllPages Button 7`] = ` "disabled": true, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8788,6 +8870,7 @@ exports[`snapshotAllPages Button 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8880,6 +8963,7 @@ exports[`snapshotAllPages Button 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -8966,6 +9050,7 @@ exports[`snapshotAllPages Button 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -9052,6 +9137,7 @@ exports[`snapshotAllPages Button 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -9138,6 +9224,7 @@ exports[`snapshotAllPages Button 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -9226,6 +9313,7 @@ exports[`snapshotAllPages Composition Bugs Example 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -9351,6 +9439,7 @@ exports[`snapshotAllPages Composition Bugs Example 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -9458,6 +9547,7 @@ exports[`snapshotAllPages Composition Bugs Example 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -9565,6 +9655,7 @@ exports[`snapshotAllPages Composition Bugs Example 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -9672,6 +9763,7 @@ exports[`snapshotAllPages Composition Bugs Example 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -9794,6 +9886,7 @@ exports[`snapshotAllPages Composition Bugs Example 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -9914,6 +10007,7 @@ exports[`snapshotAllPages Crash 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -10001,6 +10095,7 @@ exports[`snapshotAllPages DevSettings 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -10088,6 +10183,7 @@ exports[`snapshotAllPages DevSettings 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -10610,6 +10706,7 @@ exports[`snapshotAllPages Fast Path Texts 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -10702,6 +10799,7 @@ exports[`snapshotAllPages Fast Path Texts 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -10813,6 +10911,7 @@ exports[`snapshotAllPages Fast Path Texts 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -11407,6 +11506,7 @@ exports[`snapshotAllPages FlatList 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -11491,6 +11591,7 @@ exports[`snapshotAllPages FlatList 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13173,6 +13274,7 @@ exports[`snapshotAllPages FlatList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13312,6 +13414,7 @@ exports[`snapshotAllPages FlatList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13379,6 +13482,7 @@ exports[`snapshotAllPages FlatList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13446,6 +13550,7 @@ exports[`snapshotAllPages FlatList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13513,6 +13618,7 @@ exports[`snapshotAllPages FlatList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13580,6 +13686,7 @@ exports[`snapshotAllPages FlatList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13647,6 +13754,7 @@ exports[`snapshotAllPages FlatList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13745,6 +13853,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13876,6 +13985,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -13944,6 +14054,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14012,6 +14123,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14080,6 +14192,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14148,6 +14261,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14216,6 +14330,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14284,6 +14399,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14352,6 +14468,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14420,6 +14537,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14488,6 +14606,7 @@ exports[`snapshotAllPages FlatList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14627,6 +14746,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14768,6 +14888,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14836,6 +14957,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14904,6 +15026,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -14972,6 +15095,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15040,6 +15164,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15108,6 +15233,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15176,6 +15302,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15244,6 +15371,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15312,6 +15440,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15380,6 +15509,7 @@ exports[`snapshotAllPages FlatList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15488,6 +15618,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15620,6 +15751,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15688,6 +15820,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15756,6 +15889,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15824,6 +15958,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15892,6 +16027,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -15960,6 +16096,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16028,6 +16165,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16096,6 +16234,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16164,6 +16303,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16232,6 +16372,7 @@ exports[`snapshotAllPages FlatList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16400,6 +16541,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16468,6 +16610,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16536,6 +16679,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16604,6 +16748,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16672,6 +16817,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16740,6 +16886,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16808,6 +16955,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16876,6 +17024,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -16944,6 +17093,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17012,6 +17162,7 @@ exports[`snapshotAllPages FlatList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17140,6 +17291,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17231,6 +17383,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17322,6 +17475,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17413,6 +17567,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17504,6 +17659,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17595,6 +17751,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17686,6 +17843,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17777,6 +17935,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17868,6 +18027,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -17959,6 +18119,7 @@ exports[`snapshotAllPages FlatList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -26827,6 +26988,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -26895,6 +27057,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -26963,6 +27126,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27031,6 +27195,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27099,6 +27264,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27167,6 +27333,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27235,6 +27402,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27303,6 +27471,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27371,6 +27540,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27439,6 +27609,7 @@ exports[`snapshotAllPages FlatList 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27607,6 +27778,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27675,6 +27847,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27743,6 +27916,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27811,6 +27985,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27879,6 +28054,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -27947,6 +28123,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28015,6 +28192,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28083,6 +28261,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28151,6 +28330,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28219,6 +28399,7 @@ exports[`snapshotAllPages FlatList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28395,6 +28576,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28470,6 +28652,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28545,6 +28728,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28620,6 +28804,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28695,6 +28880,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28770,6 +28956,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28845,6 +29032,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28920,6 +29108,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -28995,6 +29184,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29070,6 +29260,7 @@ exports[`snapshotAllPages FlatList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29246,6 +29437,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29321,6 +29513,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29396,6 +29589,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29471,6 +29665,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29546,6 +29741,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29621,6 +29817,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29696,6 +29893,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29771,6 +29969,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29846,6 +30045,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -29921,6 +30121,7 @@ exports[`snapshotAllPages FlatList 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30096,6 +30297,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30164,6 +30366,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30232,6 +30435,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30300,6 +30504,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30368,6 +30573,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30436,6 +30642,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30504,6 +30711,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30572,6 +30780,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30640,6 +30849,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30708,6 +30918,7 @@ exports[`snapshotAllPages FlatList 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30884,6 +31095,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -30959,6 +31171,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31034,6 +31247,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31109,6 +31323,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31184,6 +31399,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31259,6 +31475,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31334,6 +31551,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31409,6 +31627,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31484,6 +31703,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31559,6 +31779,7 @@ exports[`snapshotAllPages FlatList 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31753,6 +31974,7 @@ exports[`snapshotAllPages Flyout 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31847,6 +32069,7 @@ exports[`snapshotAllPages Flyout 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -31941,6 +32164,7 @@ exports[`snapshotAllPages Flyout 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -32636,6 +32860,7 @@ exports[`snapshotAllPages Keyboard Focus Example 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -32692,6 +32917,7 @@ exports[`snapshotAllPages Keyboard Focus Example 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -34838,6 +35064,7 @@ exports[`snapshotAllPages LegacyControlStyleTest 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -34955,6 +35182,7 @@ exports[`snapshotAllPages LegacyImageTest 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -35040,6 +35268,7 @@ exports[`snapshotAllPages LegacyImageTest 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -35161,6 +35390,7 @@ exports[`snapshotAllPages LegacyLoginTest 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -35245,6 +35475,7 @@ exports[`snapshotAllPages LegacyLoginTest 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -35344,6 +35575,7 @@ exports[`snapshotAllPages LegacySelectableTextTest 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -35429,6 +35661,7 @@ exports[`snapshotAllPages LegacySelectableTextTest 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -35715,6 +35948,7 @@ or click here. "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -35787,6 +36021,7 @@ or click here. "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -35924,6 +36159,7 @@ exports[`snapshotAllPages Linking 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -35987,6 +36223,7 @@ exports[`snapshotAllPages Linking 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -36050,6 +36287,7 @@ exports[`snapshotAllPages Linking 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -36113,6 +36351,7 @@ exports[`snapshotAllPages Linking 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -36176,6 +36415,7 @@ exports[`snapshotAllPages Linking 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -36239,6 +36479,7 @@ exports[`snapshotAllPages Linking 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -36308,6 +36549,7 @@ exports[`snapshotAllPages Linking 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -36395,6 +36637,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -36478,6 +36721,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -36548,6 +36792,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": true, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": true, } @@ -36621,6 +36866,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -36794,6 +37040,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -36871,6 +37118,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -36948,6 +37196,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37025,6 +37274,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37174,6 +37424,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37251,6 +37502,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37328,6 +37580,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37405,6 +37658,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37482,6 +37736,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37588,6 +37843,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37658,6 +37914,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37762,6 +38019,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37834,6 +38092,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -37906,6 +38165,7 @@ exports[`snapshotAllPages Modal 1`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": true, } @@ -38010,6 +38270,7 @@ exports[`snapshotAllPages Modal 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -38117,6 +38378,7 @@ exports[`snapshotAllPages Mouse Click Events 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -38222,6 +38484,7 @@ exports[`snapshotAllPages Mouse Click Events 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -38469,6 +38732,7 @@ exports[`snapshotAllPages Moving Light Example 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -38572,6 +38836,7 @@ exports[`snapshotAllPages Native Animated Example 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -38675,6 +38940,7 @@ exports[`snapshotAllPages Native Animated Example 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -38772,6 +39038,7 @@ exports[`snapshotAllPages Native Animated Example 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -38869,6 +39136,7 @@ exports[`snapshotAllPages Native Animated Example 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -38958,6 +39226,7 @@ exports[`snapshotAllPages Native Animated Example 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -39039,6 +39308,7 @@ exports[`snapshotAllPages Native Animated Example 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -39128,6 +39398,7 @@ exports[`snapshotAllPages Native Animated Example 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -39217,6 +39488,7 @@ exports[`snapshotAllPages Native Animated Example 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -39306,6 +39578,7 @@ exports[`snapshotAllPages Native Animated Example 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -39395,6 +39668,7 @@ exports[`snapshotAllPages Native Animated Example 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -39521,6 +39795,7 @@ exports[`snapshotAllPages Native Animated Example 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -39824,6 +40099,7 @@ exports[`snapshotAllPages Performance API Examples 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40019,6 +40295,7 @@ exports[`snapshotAllPages Performance API Examples 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40088,6 +40365,7 @@ exports[`snapshotAllPages Performance API Examples 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40171,6 +40449,7 @@ exports[`snapshotAllPages Performance API Examples 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40360,6 +40639,7 @@ exports[`snapshotAllPages Performance Comparison Examples 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40416,6 +40696,7 @@ exports[`snapshotAllPages Performance Comparison Examples 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40526,6 +40807,7 @@ exports[`snapshotAllPages Performance Comparison Examples 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40582,6 +40864,7 @@ exports[`snapshotAllPages Performance Comparison Examples 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40692,6 +40975,7 @@ exports[`snapshotAllPages Performance Comparison Examples 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40748,6 +41032,7 @@ exports[`snapshotAllPages Performance Comparison Examples 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40858,6 +41143,7 @@ exports[`snapshotAllPages Performance Comparison Examples 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -40914,6 +41200,7 @@ exports[`snapshotAllPages Performance Comparison Examples 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -41024,6 +41311,7 @@ exports[`snapshotAllPages Performance Comparison Examples 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -41080,6 +41368,7 @@ exports[`snapshotAllPages Performance Comparison Examples 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -41190,6 +41479,7 @@ exports[`snapshotAllPages Performance Comparison Examples 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -41246,6 +41536,7 @@ exports[`snapshotAllPages Performance Comparison Examples 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -41337,6 +41628,7 @@ exports[`snapshotAllPages PixelRatio 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -41445,6 +41737,7 @@ exports[`snapshotAllPages PixelRatio 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43183,6 +43476,7 @@ exports[`snapshotAllPages Popup 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43281,6 +43575,7 @@ exports[`snapshotAllPages Popup 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43378,6 +43673,7 @@ exports[`snapshotAllPages Popup 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43474,6 +43770,7 @@ exports[`snapshotAllPages Pressable 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43550,6 +43847,7 @@ exports[`snapshotAllPages Pressable 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43621,6 +43919,7 @@ exports[`snapshotAllPages Pressable 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43704,6 +44003,7 @@ exports[`snapshotAllPages Pressable 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43784,6 +44084,7 @@ exports[`snapshotAllPages Pressable 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43856,6 +44157,7 @@ exports[`snapshotAllPages Pressable 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43911,6 +44213,7 @@ exports[`snapshotAllPages Pressable 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -43966,6 +44269,7 @@ exports[`snapshotAllPages Pressable 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44028,6 +44332,7 @@ exports[`snapshotAllPages Pressable 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44096,6 +44401,7 @@ exports[`snapshotAllPages Pressable 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44203,6 +44509,7 @@ exports[`snapshotAllPages Pressable 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44350,6 +44657,7 @@ exports[`snapshotAllPages Pressable 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44443,6 +44751,7 @@ exports[`snapshotAllPages Pressable 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44490,6 +44799,7 @@ exports[`snapshotAllPages Pressable 11`] = ` "disabled": true, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44550,6 +44860,7 @@ exports[`snapshotAllPages Pressable 11`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44631,6 +44942,7 @@ exports[`snapshotAllPages Pressable 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44697,6 +45009,7 @@ exports[`snapshotAllPages Pressable 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44809,6 +45122,7 @@ exports[`snapshotAllPages Pressable 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44904,6 +45218,7 @@ exports[`snapshotAllPages Pressable 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -44982,6 +45297,7 @@ exports[`snapshotAllPages Pressable 16`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45044,6 +45360,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45089,6 +45406,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45134,6 +45452,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45179,6 +45498,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45224,6 +45544,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45269,6 +45590,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45314,6 +45636,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45359,6 +45682,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45404,6 +45728,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45449,6 +45774,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45494,6 +45820,7 @@ exports[`snapshotAllPages Pressable 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45547,6 +45874,7 @@ exports[`snapshotAllPages Pressable 18`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45593,6 +45921,7 @@ exports[`snapshotAllPages Pressable 18`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45639,6 +45968,7 @@ exports[`snapshotAllPages Pressable 18`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45685,6 +46015,7 @@ exports[`snapshotAllPages Pressable 18`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45736,6 +46067,7 @@ exports[`snapshotAllPages Pressable 19`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45791,6 +46123,7 @@ exports[`snapshotAllPages Pressable 20`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45833,6 +46166,7 @@ exports[`snapshotAllPages Pressable 20`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45900,6 +46234,7 @@ exports[`snapshotAllPages Pressable 21`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -45951,6 +46286,7 @@ exports[`snapshotAllPages Pressable 21`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -46027,6 +46363,7 @@ exports[`snapshotAllPages Pressable 21`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -46078,6 +46415,7 @@ exports[`snapshotAllPages Pressable 21`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -46143,6 +46481,7 @@ exports[`snapshotAllPages Pressable 23`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -46187,6 +46526,7 @@ exports[`snapshotAllPages Pressable 23`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -46231,6 +46571,7 @@ exports[`snapshotAllPages Pressable 23`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -46356,6 +46697,7 @@ exports[`snapshotAllPages RTLExample 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -46643,6 +46985,7 @@ exports[`snapshotAllPages RTLExample 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -46775,6 +47118,7 @@ exports[`snapshotAllPages RTLExample 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -46922,6 +47266,7 @@ exports[`snapshotAllPages RTLExample 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -47069,6 +47414,7 @@ exports[`snapshotAllPages RTLExample 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -47194,6 +47540,7 @@ exports[`snapshotAllPages RTLExample 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -47370,6 +47717,7 @@ exports[`snapshotAllPages RTLExample 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -47476,6 +47824,7 @@ exports[`snapshotAllPages RTLExample 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -47585,6 +47934,7 @@ exports[`snapshotAllPages RTLExample 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -47736,6 +48086,7 @@ exports[`snapshotAllPages RTLExample 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -47879,6 +48230,7 @@ exports[`snapshotAllPages RTLExample 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -48018,6 +48370,7 @@ exports[`snapshotAllPages RTLExample 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -48158,6 +48511,7 @@ exports[`snapshotAllPages RTLExample 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -48302,6 +48656,7 @@ exports[`snapshotAllPages RTLExample 13`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -48453,6 +48808,7 @@ exports[`snapshotAllPages RTLExample 14`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -48604,6 +48960,7 @@ exports[`snapshotAllPages RTLExample 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -48770,6 +49127,7 @@ exports[`snapshotAllPages RTLExample 16`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -49102,6 +49460,7 @@ exports[`snapshotAllPages ScrollView 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -49154,6 +49513,7 @@ exports[`snapshotAllPages ScrollView 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -49206,6 +49566,7 @@ exports[`snapshotAllPages ScrollView 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -49516,6 +49877,7 @@ exports[`snapshotAllPages ScrollView 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -49568,6 +49930,7 @@ exports[`snapshotAllPages ScrollView 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -49879,6 +50242,7 @@ exports[`snapshotAllPages ScrollView 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -49931,6 +50295,7 @@ exports[`snapshotAllPages ScrollView 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -50051,6 +50416,7 @@ exports[`snapshotAllPages ScrollView 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -50103,6 +50469,7 @@ exports[`snapshotAllPages ScrollView 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -50394,6 +50761,7 @@ exports[`snapshotAllPages ScrollView 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -50445,6 +50813,7 @@ exports[`snapshotAllPages ScrollView 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -50745,6 +51114,7 @@ exports[`snapshotAllPages ScrollView 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -50796,6 +51166,7 @@ exports[`snapshotAllPages ScrollView 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -51088,6 +51459,7 @@ exports[`snapshotAllPages ScrollView 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -51391,6 +51763,7 @@ exports[`snapshotAllPages ScrollView 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -51442,6 +51815,7 @@ exports[`snapshotAllPages ScrollView 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -51743,6 +52117,7 @@ exports[`snapshotAllPages ScrollView 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -51794,6 +52169,7 @@ exports[`snapshotAllPages ScrollView 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -51846,6 +52222,7 @@ exports[`snapshotAllPages ScrollView 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -52638,6 +53015,7 @@ exports[`snapshotAllPages ScrollView 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -52690,6 +53068,7 @@ exports[`snapshotAllPages ScrollView 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -52929,6 +53308,7 @@ exports[`snapshotAllPages ScrollView 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -53014,6 +53394,7 @@ exports[`snapshotAllPages ScrollView 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -53125,6 +53506,7 @@ exports[`snapshotAllPages ScrollView 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -53299,6 +53681,7 @@ exports[`snapshotAllPages ScrollView 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -53587,6 +53970,7 @@ exports[`snapshotAllPages ScrollView 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -53638,6 +54022,7 @@ exports[`snapshotAllPages ScrollView 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -53709,6 +54094,7 @@ exports[`snapshotAllPages ScrollView 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -53760,6 +54146,7 @@ exports[`snapshotAllPages ScrollView 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -53811,6 +54198,7 @@ exports[`snapshotAllPages ScrollView 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -54106,6 +54494,7 @@ exports[`snapshotAllPages ScrollView 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -55131,6 +55520,7 @@ exports[`snapshotAllPages ScrollView 16`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -55431,6 +55821,7 @@ exports[`snapshotAllPages ScrollView 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -55482,6 +55873,7 @@ exports[`snapshotAllPages ScrollView 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -55533,6 +55925,7 @@ exports[`snapshotAllPages ScrollView 17`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -55827,6 +56220,7 @@ exports[`snapshotAllPages ScrollView 18`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -55878,6 +56272,7 @@ exports[`snapshotAllPages ScrollView 18`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -55929,6 +56324,7 @@ exports[`snapshotAllPages ScrollView 18`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -55980,6 +56376,7 @@ exports[`snapshotAllPages ScrollView 18`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -56545,6 +56942,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -56596,6 +56994,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -56647,6 +57046,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -56707,6 +57107,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -56758,6 +57159,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -56809,6 +57211,7 @@ exports[`snapshotAllPages ScrollView 20`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -56901,6 +57304,7 @@ exports[`snapshotAllPages ScrollViewAnimated 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -56972,6 +57376,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57027,6 +57432,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57082,6 +57488,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57137,6 +57544,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57196,6 +57604,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57251,6 +57660,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57306,6 +57716,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57361,6 +57772,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57416,6 +57828,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57471,6 +57884,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57526,6 +57940,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57581,6 +57996,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57636,6 +58052,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57691,6 +58108,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57746,6 +58164,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57801,6 +58220,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57856,6 +58276,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57911,6 +58332,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -57966,6 +58388,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58021,6 +58444,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58076,6 +58500,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58131,6 +58556,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58186,6 +58612,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58241,6 +58668,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58298,6 +58726,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58353,6 +58782,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58408,6 +58838,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58463,6 +58894,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58518,6 +58950,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58573,6 +59006,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58628,6 +59062,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58683,6 +59118,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58738,6 +59174,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58793,6 +59230,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58848,6 +59286,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58903,6 +59342,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -58958,6 +59398,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59013,6 +59454,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59068,6 +59510,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59129,6 +59572,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59185,6 +59629,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59241,6 +59686,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59297,6 +59743,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59353,6 +59800,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59409,6 +59857,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59465,6 +59914,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59521,6 +59971,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59577,6 +60028,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59633,6 +60085,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59689,6 +60142,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59745,6 +60199,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59801,6 +60256,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59857,6 +60313,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59913,6 +60370,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -59969,6 +60427,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60025,6 +60484,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60081,6 +60541,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60137,6 +60598,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60193,6 +60655,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60257,6 +60720,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60313,6 +60777,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60369,6 +60834,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60425,6 +60891,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60481,6 +60948,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60537,6 +61005,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60593,6 +61062,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60649,6 +61119,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60705,6 +61176,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60761,6 +61233,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60817,6 +61290,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60873,6 +61347,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60929,6 +61404,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -60985,6 +61461,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61041,6 +61518,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61097,6 +61575,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61153,6 +61632,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61209,6 +61689,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61265,6 +61746,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61321,6 +61803,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61385,6 +61868,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61441,6 +61925,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61497,6 +61982,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61553,6 +62039,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61609,6 +62096,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61665,6 +62153,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61721,6 +62210,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61777,6 +62267,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61833,6 +62324,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61889,6 +62381,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -61945,6 +62438,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62001,6 +62495,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62057,6 +62552,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62113,6 +62609,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62169,6 +62666,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62225,6 +62723,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62281,6 +62780,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62337,6 +62837,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62393,6 +62894,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62449,6 +62951,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62513,6 +63016,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62569,6 +63073,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62625,6 +63130,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62681,6 +63187,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62737,6 +63244,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62793,6 +63301,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62849,6 +63358,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62905,6 +63415,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -62961,6 +63472,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63017,6 +63529,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63073,6 +63586,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63129,6 +63643,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63185,6 +63700,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63241,6 +63757,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63297,6 +63814,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63353,6 +63871,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63409,6 +63928,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63465,6 +63985,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63521,6 +64042,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63577,6 +64099,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63704,6 +64227,7 @@ exports[`snapshotAllPages SectionList 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63880,6 +64404,7 @@ exports[`snapshotAllPages SectionList 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -63946,6 +64471,7 @@ exports[`snapshotAllPages SectionList 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64012,6 +64538,7 @@ exports[`snapshotAllPages SectionList 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64099,6 +64626,7 @@ exports[`snapshotAllPages SectionList 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64165,6 +64693,7 @@ exports[`snapshotAllPages SectionList 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64231,6 +64760,7 @@ exports[`snapshotAllPages SectionList 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64341,6 +64871,7 @@ exports[`snapshotAllPages SectionList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64507,6 +65038,7 @@ exports[`snapshotAllPages SectionList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64573,6 +65105,7 @@ exports[`snapshotAllPages SectionList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64639,6 +65172,7 @@ exports[`snapshotAllPages SectionList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64726,6 +65260,7 @@ exports[`snapshotAllPages SectionList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64792,6 +65327,7 @@ exports[`snapshotAllPages SectionList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -64858,6 +65394,7 @@ exports[`snapshotAllPages SectionList 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65054,6 +65591,7 @@ exports[`snapshotAllPages SectionList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65120,6 +65658,7 @@ exports[`snapshotAllPages SectionList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65186,6 +65725,7 @@ exports[`snapshotAllPages SectionList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65273,6 +65813,7 @@ exports[`snapshotAllPages SectionList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65339,6 +65880,7 @@ exports[`snapshotAllPages SectionList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65405,6 +65947,7 @@ exports[`snapshotAllPages SectionList 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65586,6 +66129,7 @@ exports[`snapshotAllPages SectionList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65709,6 +66253,7 @@ exports[`snapshotAllPages SectionList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65832,6 +66377,7 @@ exports[`snapshotAllPages SectionList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -65992,6 +66538,7 @@ exports[`snapshotAllPages SectionList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -66115,6 +66662,7 @@ exports[`snapshotAllPages SectionList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -66238,6 +66786,7 @@ exports[`snapshotAllPages SectionList 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -66406,6 +66955,7 @@ exports[`snapshotAllPages SectionList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -66570,6 +67120,7 @@ exports[`snapshotAllPages SectionList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -66636,6 +67187,7 @@ exports[`snapshotAllPages SectionList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -66702,6 +67254,7 @@ exports[`snapshotAllPages SectionList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -66789,6 +67342,7 @@ exports[`snapshotAllPages SectionList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -66855,6 +67409,7 @@ exports[`snapshotAllPages SectionList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -66921,6 +67476,7 @@ exports[`snapshotAllPages SectionList 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67032,6 +67588,7 @@ exports[`snapshotAllPages SectionList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67199,6 +67756,7 @@ exports[`snapshotAllPages SectionList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67265,6 +67823,7 @@ exports[`snapshotAllPages SectionList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67331,6 +67890,7 @@ exports[`snapshotAllPages SectionList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67418,6 +67978,7 @@ exports[`snapshotAllPages SectionList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67484,6 +68045,7 @@ exports[`snapshotAllPages SectionList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67550,6 +68112,7 @@ exports[`snapshotAllPages SectionList 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67683,6 +68246,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67749,6 +68313,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67815,6 +68380,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67902,6 +68468,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -67968,6 +68535,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -68034,6 +68602,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -68109,6 +68678,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -68172,6 +68742,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -68235,6 +68806,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -68298,6 +68870,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -68361,6 +68934,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -68396,6 +68970,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -68894,6 +69469,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -68967,6 +69543,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -69040,6 +69617,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -69148,6 +69726,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -69221,6 +69800,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -69294,6 +69874,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -76540,6 +77121,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -76613,6 +77195,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -76686,6 +77269,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -76794,6 +77378,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -76867,6 +77452,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -76940,6 +77526,7 @@ exports[`snapshotAllPages SectionList 7`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77165,6 +77752,7 @@ exports[`snapshotAllPages SectionList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77238,6 +77826,7 @@ exports[`snapshotAllPages SectionList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77311,6 +77900,7 @@ exports[`snapshotAllPages SectionList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77419,6 +78009,7 @@ exports[`snapshotAllPages SectionList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77492,6 +78083,7 @@ exports[`snapshotAllPages SectionList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77565,6 +78157,7 @@ exports[`snapshotAllPages SectionList 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77775,6 +78368,7 @@ exports[`snapshotAllPages SectionList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77841,6 +78435,7 @@ exports[`snapshotAllPages SectionList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77907,6 +78502,7 @@ exports[`snapshotAllPages SectionList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -77994,6 +78590,7 @@ exports[`snapshotAllPages SectionList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -78060,6 +78657,7 @@ exports[`snapshotAllPages SectionList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -78126,6 +78724,7 @@ exports[`snapshotAllPages SectionList 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -78229,6 +78828,7 @@ exports[`snapshotAllPages Share 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -78340,6 +78940,7 @@ exports[`snapshotAllPages Share 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -78455,6 +79056,7 @@ exports[`snapshotAllPages Share 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -79819,6 +80421,7 @@ exports[`snapshotAllPages Text 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -79911,6 +80514,7 @@ exports[`snapshotAllPages Text 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -80003,6 +80607,7 @@ exports[`snapshotAllPages Text 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -80188,6 +80793,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80259,6 +80865,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80330,6 +80937,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": true, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": true, } @@ -80404,6 +81012,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80475,6 +81084,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80546,6 +81156,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80617,6 +81228,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80688,6 +81300,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80759,6 +81372,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80830,6 +81444,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80901,6 +81516,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -80972,6 +81588,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -81043,6 +81660,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -81114,6 +81732,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -81185,6 +81804,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -81256,6 +81876,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -81327,6 +81948,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -81398,6 +82020,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -81497,6 +82120,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": true, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": true, } @@ -81571,6 +82195,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -81642,6 +82267,7 @@ exports[`snapshotAllPages Text 7`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -89295,6 +89921,7 @@ exports[`snapshotAllPages TextInput 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -91439,6 +92066,7 @@ exports[`snapshotAllPages TextInput 18`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -92669,6 +93297,7 @@ exports[`snapshotAllPages TextInput 20`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -94844,6 +95473,7 @@ exports[`snapshotAllPages Timers 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -94905,6 +95535,7 @@ exports[`snapshotAllPages Timers 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -94966,6 +95597,7 @@ exports[`snapshotAllPages Timers 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95027,6 +95659,7 @@ exports[`snapshotAllPages Timers 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95088,6 +95721,7 @@ exports[`snapshotAllPages Timers 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95154,6 +95788,7 @@ exports[`snapshotAllPages Timers 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95221,6 +95856,7 @@ exports[`snapshotAllPages Timers 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95277,6 +95913,7 @@ exports[`snapshotAllPages Timers 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95333,6 +95970,7 @@ exports[`snapshotAllPages Timers 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95389,6 +96027,7 @@ exports[`snapshotAllPages Timers 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95445,6 +96084,7 @@ exports[`snapshotAllPages Timers 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95510,6 +96150,7 @@ exports[`snapshotAllPages Timers 4`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95577,6 +96218,7 @@ exports[`snapshotAllPages Timers 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95638,6 +96280,7 @@ exports[`snapshotAllPages Timers 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95695,6 +96338,7 @@ exports[`snapshotAllPages Timers 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -95880,6 +96524,7 @@ exports[`snapshotAllPages Touchable* and onPress 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -95951,6 +96596,7 @@ exports[`snapshotAllPages Touchable* and onPress 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -96138,6 +96784,7 @@ exports[`snapshotAllPages Touchable* and onPress 8`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -96226,6 +96873,7 @@ exports[`snapshotAllPages Touchable* and onPress 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -96373,6 +97021,7 @@ exports[`snapshotAllPages Touchable* and onPress 11`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -96513,6 +97162,7 @@ exports[`snapshotAllPages Touchable* and onPress 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -96569,6 +97219,7 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` "disabled": true, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -96626,6 +97277,7 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -96781,6 +97433,7 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` "disabled": true, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -96833,6 +97486,7 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -96933,6 +97587,7 @@ exports[`snapshotAllPages Touchable* and onPress 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -96991,6 +97646,7 @@ exports[`snapshotAllPages Touchable* and onPress 15`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readonly": undefined, "required": undefined, "selected": undefined, } @@ -97061,6 +97717,7 @@ exports[`snapshotAllPages TransferProperties 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -97254,6 +97911,7 @@ exports[`snapshotAllPages TransferProperties 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -97338,6 +97996,7 @@ exports[`snapshotAllPages TransferProperties 2`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -97432,6 +98091,7 @@ exports[`snapshotAllPages TransparentHitTestExample 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -97670,6 +98330,7 @@ exports[`snapshotAllPages View 5`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -98085,6 +98746,7 @@ exports[`snapshotAllPages View 9`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -98246,6 +98908,7 @@ exports[`snapshotAllPages View 10`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -98484,6 +99147,7 @@ exports[`snapshotAllPages View 12`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -99572,6 +100236,7 @@ exports[`snapshotAllPages WebSocket 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -99776,6 +100441,7 @@ exports[`snapshotAllPages WebSocket 1`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -100153,6 +100819,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100222,6 +100889,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100291,6 +100959,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100360,6 +101029,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": true, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": true, } @@ -100432,6 +101102,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100501,6 +101172,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100570,6 +101242,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100639,6 +101312,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100708,6 +101382,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100777,6 +101452,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100846,6 +101522,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -100915,6 +101592,7 @@ exports[`snapshotAllPages XMLHttpRequest 2`] = ` "disabled": false, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": false, } @@ -101049,6 +101727,7 @@ exports[`snapshotAllPages XMLHttpRequest 3`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -101265,6 +101944,7 @@ exports[`snapshotAllPages XMLHttpRequest 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } @@ -101349,6 +102029,7 @@ exports[`snapshotAllPages XMLHttpRequest 6`] = ` "disabled": undefined, "expanded": undefined, "multiselectable": undefined, + "readOnly": undefined, "required": undefined, "selected": undefined, } diff --git a/packages/e2e-test-app-fabric/windows/RNTesterApp-Fabric/RNTesterApp-Fabric.cpp b/packages/e2e-test-app-fabric/windows/RNTesterApp-Fabric/RNTesterApp-Fabric.cpp index 933cbe65364..48f0c1e1339 100644 --- a/packages/e2e-test-app-fabric/windows/RNTesterApp-Fabric/RNTesterApp-Fabric.cpp +++ b/packages/e2e-test-app-fabric/windows/RNTesterApp-Fabric/RNTesterApp-Fabric.cpp @@ -348,6 +348,9 @@ winrt::Windows::Data::Json::JsonObject ListErrors(winrt::Windows::Data::Json::Js void DumpUIAPatternInfo(IUIAutomationElement *pTarget, const winrt::Windows::Data::Json::JsonObject &result) { BSTR value = nullptr; BOOL isReadOnly; + double now; + double min; + double max; ToggleState toggleState; ExpandCollapseState expandCollapseState; HRESULT hr; @@ -365,11 +368,34 @@ void DumpUIAPatternInfo(IUIAutomationElement *pTarget, const winrt::Windows::Dat } hr = valuePattern->get_IsReadOnly(&isReadOnly); if (SUCCEEDED(hr)) { - InsertBooleanValueIfNotDefault(result, L"ValuePattern.IsReadOnly", isReadOnly, true); + InsertBooleanValueIfNotDefault(result, L"ValuePattern.IsReadOnly", isReadOnly, false); } valuePattern->Release(); } + // Dump IRangeValueProvider Information + IRangeValueProvider *rangeValuePattern; + hr = pTarget->GetCurrentPattern(UIA_RangeValuePatternId, reinterpret_cast(&rangeValuePattern)); + if (SUCCEEDED(hr) && rangeValuePattern) { + hr = rangeValuePattern->get_Value(&now); + if (SUCCEEDED(hr)) { + result.Insert(L"RangeValuePattern.Value", winrt::Windows::Data::Json::JsonValue::CreateNumberValue(now)); + } + hr = rangeValuePattern->get_Minimum(&min); + if (SUCCEEDED(hr)) { + result.Insert(L"RangeValuePattern.Minimum", winrt::Windows::Data::Json::JsonValue::CreateNumberValue(min)); + } + hr = rangeValuePattern->get_Maximum(&max); + if (SUCCEEDED(hr)) { + result.Insert(L"RangeValuePattern.Maximum", winrt::Windows::Data::Json::JsonValue::CreateNumberValue(max)); + } + hr = rangeValuePattern->get_IsReadOnly(&isReadOnly); + if (SUCCEEDED(hr)) { + InsertBooleanValueIfNotDefault(result, L"RangeValuePattern.IsReadOnly", isReadOnly, false); + } + rangeValuePattern->Release(); + } + // Dump IToggleProvider Information IToggleProvider *togglePattern; hr = pTarget->GetCurrentPattern(UIA_TogglePatternId, reinterpret_cast(&togglePattern)); diff --git a/packages/playground/Samples/simple.tsx b/packages/playground/Samples/simple.tsx index 71349398ce4..1ba97312559 100644 --- a/packages/playground/Samples/simple.tsx +++ b/packages/playground/Samples/simple.tsx @@ -11,6 +11,7 @@ export default class Bootstrap extends React.Component { return ( diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp index a06a7a675cc..dd0933ed8ed 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp @@ -141,8 +141,12 @@ HRESULT __stdcall CompositionDynamicAutomationProvider::get_ProviderOptions(Prov return S_OK; } -bool accessibilityValueHasValue(const facebook::react::AccessibilityValue &value) { - return (value.min.has_value() && value.max.has_value()) || value.now.has_value() || value.text.has_value(); +bool accessibilityValueHasTextValue(const facebook::react::AccessibilityValue &value) { + return value.text.has_value(); +} + +bool accessibilityValueHasNumericValue(const facebook::react::AccessibilityValue &value) { + return (value.min.has_value() && value.max.has_value() && value.now.has_value()); } bool expandableControl(const facebook::react::SharedViewProps props) { @@ -199,8 +203,15 @@ HRESULT __stdcall CompositionDynamicAutomationProvider::GetPatternProvider(PATTE } if (patternId == UIA_ValuePatternId && - (strongView.try_as() || - accessibilityValueHasValue(props->accessibilityValue))) { + ((strongView + .try_as() && + !accessibilityValueHasNumericValue(props->accessibilityValue)) || + accessibilityValueHasTextValue(props->accessibilityValue))) { + *pRetVal = static_cast(this); + AddRef(); + } + + if (patternId == UIA_RangeValuePatternId && accessibilityValueHasNumericValue(props->accessibilityValue)) { *pRetVal = static_cast(this); AddRef(); } @@ -481,6 +492,8 @@ HRESULT __stdcall CompositionDynamicAutomationProvider::SetValue(LPCWSTR val) { winrt::get_self(strongView) ->setAcccessiblityValue(winrt::to_string(val)); + // TODO: Edit once/if onAccessibilityAction props supports returning UIA event data. See + // https://github.com/react-native-community/discussions-and-proposals/issues/843. DispatchAccessibilityAction(m_view, "setValue"); return S_OK; } @@ -507,8 +520,88 @@ HRESULT __stdcall CompositionDynamicAutomationProvider::get_IsReadOnly(BOOL *pRe if (!strongView) return UIA_E_ELEMENTNOTAVAILABLE; - *pRetVal = winrt::get_self(strongView) - ->getAcccessiblityIsReadOnly(); + auto props = std::static_pointer_cast( + winrt::get_self(strongView)->props()); + if (props == nullptr) + return UIA_E_ELEMENTNOTAVAILABLE; + auto accessibilityRole = props->accessibilityRole; + if (props->accessibilityState.has_value() && props->accessibilityState->readOnly.has_value()) { + *pRetVal = props->accessibilityState->readOnly.value(); + } else { + // Use default IsReadOnly value. + *pRetVal = false; + } + return S_OK; +} + +HRESULT __stdcall CompositionDynamicAutomationProvider::get_LargeChange(double *pRetVal) { + // no-op + return S_OK; +} +HRESULT __stdcall CompositionDynamicAutomationProvider::get_Maximum(double *pRetVal) { + if (pRetVal == nullptr) + return E_POINTER; + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + auto props = std::static_pointer_cast( + winrt::get_self(strongView)->props()); + + if (props == nullptr) + return UIA_E_ELEMENTNOTAVAILABLE; + + *pRetVal = props->accessibilityValue.max.value(); + return S_OK; +} +HRESULT __stdcall CompositionDynamicAutomationProvider::get_Minimum(double *pRetVal) { + if (pRetVal == nullptr) + return E_POINTER; + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + auto props = std::static_pointer_cast( + winrt::get_self(strongView)->props()); + + if (props == nullptr) + return UIA_E_ELEMENTNOTAVAILABLE; + + *pRetVal = props->accessibilityValue.min.value(); + return S_OK; +} +HRESULT __stdcall CompositionDynamicAutomationProvider::get_SmallChange(double *pRetVal) { + // no-op + return S_OK; +} +HRESULT __stdcall CompositionDynamicAutomationProvider::get_Value(double *pRetVal) { + if (pRetVal == nullptr) + return E_POINTER; + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + auto props = std::static_pointer_cast( + winrt::get_self(strongView)->props()); + + if (props == nullptr) + return UIA_E_ELEMENTNOTAVAILABLE; + + *pRetVal = props->accessibilityValue.now.value(); + return S_OK; +} +HRESULT __stdcall CompositionDynamicAutomationProvider::SetValue(double val) { + auto strongView = m_view.view(); + + if (!strongView) + return UIA_E_ELEMENTNOTAVAILABLE; + + // TODO: Edit once/if onAccessibilityAction props supports returning UIA event data. See + // https://github.com/react-native-community/discussions-and-proposals/issues/843. + DispatchAccessibilityAction(m_view, "setValue"); return S_OK; } diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.h b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.h index bf403a9dad3..34a15284196 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.h @@ -16,6 +16,7 @@ class CompositionDynamicAutomationProvider : public winrt::implements< IInvokeProvider, IScrollItemProvider, IValueProvider, + IRangeValueProvider, IToggleProvider, IExpandCollapseProvider, ISelectionProvider, @@ -50,6 +51,14 @@ class CompositionDynamicAutomationProvider : public winrt::implements< virtual HRESULT __stdcall get_Value(BSTR *pRetVal) override; virtual HRESULT __stdcall get_IsReadOnly(BOOL *pRetVal) override; + // inherited via IRangeValueProvider + virtual HRESULT __stdcall get_LargeChange(double *pRetVal) override; + virtual HRESULT __stdcall get_Maximum(double *pRetVal) override; + virtual HRESULT __stdcall get_Minimum(double *pRetVal) override; + virtual HRESULT __stdcall get_SmallChange(double *pRetVal) override; + virtual HRESULT __stdcall get_Value(double *pRetVal) override; + virtual HRESULT __stdcall SetValue(double val) override; + // inherited via IToggleProvider virtual HRESULT __stdcall get_ToggleState(ToggleState *pRetVal) override; virtual HRESULT __stdcall Toggle() override; diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp index 7969adbbbc0..d5d1574e4b3 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp @@ -762,8 +762,8 @@ void ComponentView::updateAccessibilityProps( } } -std::optional ComponentView::getAcccessiblityValue() noexcept { - return std::static_pointer_cast(props())->accessibilityValue.text; +std::optional ComponentView::getAccessiblityValue() noexcept { + return std::static_pointer_cast(props())->accessibilityValue.text.value(); } void ComponentView::setAcccessiblityValue(std::string &&value) noexcept { diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp index 11e1f4881d4..3e03460ad23 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp @@ -174,16 +174,6 @@ long GetLiveSetting(const std::string &liveRegion) noexcept { return LiveSetting::Off; } -std::string extractAccessibilityValue(const facebook::react::AccessibilityValue &value) noexcept { - if (value.now.has_value()) { - return std::to_string(value.now.value()); - } else if (value.text.has_value()) { - return value.text.value(); - } else { - return ""; - } -} - void DispatchAccessibilityAction(::Microsoft::ReactNative::ReactTaggedView &view, const std::string &action) noexcept { auto strongView = view.view(); diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.h b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.h index 0104c5853e7..ce0a7f32b70 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.h @@ -32,8 +32,6 @@ void UpdateUiaProperty( long GetLiveSetting(const std::string &liveRegion) noexcept; -std::string extractAccessibilityValue(const facebook::react::AccessibilityValue &value) noexcept; - void DispatchAccessibilityAction(::Microsoft::ReactNative::ReactTaggedView &view, const std::string &action) noexcept; ExpandCollapseState GetExpandCollapseState(const bool &expanded) noexcept; diff --git a/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h index e1ba1e6a3fd..7e604290366 100644 --- a/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h +++ b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h @@ -70,6 +70,7 @@ struct AccessibilityState { std::optional selected{std::nullopt}; // [Windows] - Do not remove; required for Windows ISelectionItemProvider Implementation bool busy{false}; std::optional expanded{std::nullopt}; + std::optional readOnly{std::nullopt}; // [Windows] - Do not remove; required for Windows IRangeValueProvider and IValueProvider Implementation std::optional multiselectable{std::nullopt}; // [Windows] - Do not remove; required for Windows ISelectionProvider Implementation std::optional required{std::nullopt}; // [Windows] - Do not remove; required for Windows ISelectionProvider Implementation enum { Unchecked, Checked, Mixed, None } checked{None}; diff --git a/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h index 19826f1abbe..7a0e32cce40 100644 --- a/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h +++ b/vnext/ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h @@ -171,6 +171,10 @@ inline void fromRawValue( fromRawValue(context, expanded->second, result.expanded); } // [Windows] - DO NOT REMOVE - required for Windows ISelectionProvider Implementation + auto readOnly = map.find("readOnly"); + if (readOnly != map.end()) { + fromRawValue(context, readOnly->second, result.readOnly); + } auto multiselectable = map.find("multiselectable"); if (multiselectable != map.end()) { fromRawValue(context, multiselectable->second, result.multiselectable); diff --git a/vnext/src-win/Libraries/Components/Button.windows.js b/vnext/src-win/Libraries/Components/Button.windows.js index 2f61329e692..337375a076d 100644 --- a/vnext/src-win/Libraries/Components/Button.windows.js +++ b/vnext/src-win/Libraries/Components/Button.windows.js @@ -164,6 +164,7 @@ type ButtonProps = $ReadOnly<{| 'aria-disabled'?: ?boolean, 'aria-expanded'?: ?boolean, 'aria-selected'?: ?boolean, + 'aria-readonly'?: ?boolean, // Windows 'aria-multiselectable'?: ?boolean, // Windows 'aria-required'?: ?boolean, // Windows @@ -310,6 +311,7 @@ const Button: React.AbstractComponent< 'aria-expanded': ariaExpanded, 'aria-label': ariaLabel, 'aria-selected': ariaSelected, + 'aria-readonly': ariaReadOnly, // Windows 'aria-multiselectable': ariaMultiselectable, // Windows 'aria-required': ariaRequired, // Windows importantForAccessibility, @@ -347,6 +349,7 @@ const Button: React.AbstractComponent< disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + readOnly: ariaReadOnly ?? accessibilityState?.readOnly, // Windows multiselectable: ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows required: ariaRequired ?? accessibilityState?.required, // Windows }; diff --git a/vnext/src-win/Libraries/Components/Pressable/Pressable.windows.js b/vnext/src-win/Libraries/Components/Pressable/Pressable.windows.js index 87db12e06bb..7d2e5bdb092 100644 --- a/vnext/src-win/Libraries/Components/Pressable/Pressable.windows.js +++ b/vnext/src-win/Libraries/Components/Pressable/Pressable.windows.js @@ -75,6 +75,7 @@ type Props = $ReadOnly<{| 'aria-disabled'?: ?boolean, 'aria-expanded'?: ?boolean, 'aria-selected'?: ?boolean, + 'aria-readonly'?: ?boolean, // Windows 'aria-multiselectable'?: ?boolean, // Windows 'aria-required'?: ?boolean, // Windows /** @@ -261,6 +262,7 @@ function Pressable(props: Props, forwardedRef): React.Node { 'aria-expanded': ariaExpanded, 'aria-label': ariaLabel, 'aria-selected': ariaSelected, + 'aria-readonly': ariaReadOnly, 'aria-multiselectable': ariaMultiselectable, // Windows 'aria-required': ariaRequired, // Windows cancelable, @@ -303,6 +305,7 @@ function Pressable(props: Props, forwardedRef): React.Node { disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + readOnly: ariaReadOnly ?? accessibilityState?.readOnly, multiselectable: ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows required: ariaRequired ?? accessibilityState?.required, // Windows }; diff --git a/vnext/src-win/Libraries/Components/TextInput/TextInput.windows.js b/vnext/src-win/Libraries/Components/TextInput/TextInput.windows.js index a90a1e9f2e8..82370cff454 100644 --- a/vnext/src-win/Libraries/Components/TextInput/TextInput.windows.js +++ b/vnext/src-win/Libraries/Components/TextInput/TextInput.windows.js @@ -1190,6 +1190,7 @@ function InternalTextInput(props: Props): React.Node { 'aria-disabled': ariaDisabled, 'aria-expanded': ariaExpanded, 'aria-selected': ariaSelected, + 'aria-readonly': ariaReadOnly, // Windows 'aria-multiselectable': ariaMultiselectable, // Windows 'aria-required': ariaRequired, // Windows accessibilityState, @@ -1593,6 +1594,7 @@ function InternalTextInput(props: Props): React.Node { ariaDisabled != null || ariaExpanded != null || ariaSelected != null || + ariaReadOnly != null || // Windows ariaMultiselectable != null || // Windows ariaRequired != null // Windows ) { @@ -1602,6 +1604,7 @@ function InternalTextInput(props: Props): React.Node { disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + readOnly: ariaReadOnly ?? accessibilityState?.readOnly, // Windows multiselectable: ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows required: ariaRequired ?? accessibilityState?.required, // Windows diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js index c36f12d6455..cae348b3d00 100644 --- a/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js @@ -146,6 +146,8 @@ class TouchableBounce extends React.Component { this.props['aria-expanded'] ?? this.props.accessibilityState?.expanded, selected: this.props['aria-selected'] ?? this.props.accessibilityState?.selected, + readOnly: + this.props['aria-readonly'] ?? this.props.accessibilityState?.readOnly, // Windows multiselectable: this.props['aria-multiselectable'] ?? this.props.accessibilityState?.multiselectable, // Windows diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableNativeFeedback.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableNativeFeedback.windows.js index b2c34d09d6d..505261b2b9f 100644 --- a/vnext/src-win/Libraries/Components/Touchable/TouchableNativeFeedback.windows.js +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableNativeFeedback.windows.js @@ -265,6 +265,8 @@ class TouchableNativeFeedback extends React.Component { this.props['aria-expanded'] ?? this.props.accessibilityState?.expanded, selected: this.props['aria-selected'] ?? this.props.accessibilityState?.selected, + readOnly: + this.props['aria-readonly'] ?? this.props.accessibilityState?.readOnly, multiselectable: this.props['aria-multiselectable'] ?? this.props.accessibilityState?.multiselectable, // Windows diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableOpacity.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableOpacity.windows.js index 989283c8dd6..f56d5164de5 100644 --- a/vnext/src-win/Libraries/Components/Touchable/TouchableOpacity.windows.js +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableOpacity.windows.js @@ -235,6 +235,8 @@ class TouchableOpacity extends React.Component { this.props['aria-expanded'] ?? this.props.accessibilityState?.expanded, selected: this.props['aria-selected'] ?? this.props.accessibilityState?.selected, + readOnly: + this.props['aria-readonly'] ?? this.props.accessibilityState?.readOnly, // Windows multiselectable: this.props['aria-multiselectable'] ?? this.props.accessibilityState?.multiselectable, // Windows diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js index ee4875b260a..5f288f186ad 100644 --- a/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js @@ -59,6 +59,7 @@ type Props = $ReadOnly<{| 'aria-disabled'?: ?boolean, 'aria-expanded'?: ?boolean, 'aria-selected'?: ?boolean, + 'aria-readonly'?: ?boolean, // Windows 'aria-multiselectable'?: ?boolean, // Windows 'aria-required'?: ?boolean, // Windows 'aria-hidden'?: ?boolean, @@ -160,7 +161,8 @@ class TouchableWithoutFeedback extends React.Component { this.props['aria-expanded'] ?? this.props.accessibilityState?.expanded, selected: this.props['aria-selected'] ?? this.props.accessibilityState?.selected, - multiselectable: + readonly: this.props['aria-readonly'] ?? this.props.accessibilityState?.readOnly, // Windows + multiselectable: this.props['aria-multiselectable'] ?? this.props.accessibilityState?.multiselectable, // Windows required: this.props['aria-required'] ?? this.props.accessibilityState?.required, // Windows diff --git a/vnext/src-win/Libraries/Components/View/View.windows.js b/vnext/src-win/Libraries/Components/View/View.windows.js index c33e961dc4e..2706b4a5c90 100644 --- a/vnext/src-win/Libraries/Components/View/View.windows.js +++ b/vnext/src-win/Libraries/Components/View/View.windows.js @@ -55,6 +55,7 @@ const View: React.AbstractComponent< 'aria-level': ariaLevel, 'aria-live': ariaLive, 'aria-posinset': ariaPosinset, // Windows + 'aria-readonly': ariaReadOnly, // Windows 'aria-selected': ariaSelected, 'aria-setsize': ariaSetsize, // Windows 'aria-valuemax': ariaValueMax, @@ -83,6 +84,7 @@ const View: React.AbstractComponent< ariaDisabled != null || ariaExpanded != null || ariaSelected != null || + ariaReadOnly != null || // Windows ariaMultiselectable != null || // Windows ariaRequired != null // Windows ) { @@ -92,6 +94,7 @@ const View: React.AbstractComponent< disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + readOnly: ariaReadOnly ?? accessibilityState?.readOnly, // Windows multiselectable: ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows required: ariaRequired ?? accessibilityState?.required, // Windows diff --git a/vnext/src-win/Libraries/Components/View/ViewAccessibility.d.ts b/vnext/src-win/Libraries/Components/View/ViewAccessibility.d.ts index dcd37958523..cfc1c115184 100644 --- a/vnext/src-win/Libraries/Components/View/ViewAccessibility.d.ts +++ b/vnext/src-win/Libraries/Components/View/ViewAccessibility.d.ts @@ -183,14 +183,19 @@ export interface AccessibilityState { * When present, informs accessible tools the element is expanded or collapsed */ expanded?: boolean | undefined; + /** + * When present, informs accessible tools the element is read only + * @platform windows + */ + readOnly?: boolean | undefined; /** * When present, informs accessible tools the element can have multiple items selected - * @platform windows + * @platform windows */ multiselectable?: boolean | undefined; /** * When present, informs accessible tools the element requires selection - * @platform windows + * @platform windows */ required?: boolean | undefined; } diff --git a/vnext/src-win/Libraries/Components/View/ViewAccessibility.windows.js b/vnext/src-win/Libraries/Components/View/ViewAccessibility.windows.js index b970d698137..cb73956dd5a 100644 --- a/vnext/src-win/Libraries/Components/View/ViewAccessibility.windows.js +++ b/vnext/src-win/Libraries/Components/View/ViewAccessibility.windows.js @@ -181,6 +181,7 @@ export type AccessibilityState = { checked?: ?boolean | 'mixed', busy?: ?boolean, expanded?: ?boolean, + readOnly?: ?boolean, // Windows multiselectable?: ?boolean, // Windows required?: ?boolean, // Windows ... diff --git a/vnext/src-win/Libraries/Components/View/ViewPropTypes.windows.js b/vnext/src-win/Libraries/Components/View/ViewPropTypes.windows.js index f485c8b5ec9..95c29c44eb1 100644 --- a/vnext/src-win/Libraries/Components/View/ViewPropTypes.windows.js +++ b/vnext/src-win/Libraries/Components/View/ViewPropTypes.windows.js @@ -606,6 +606,7 @@ export type ViewProps = $ReadOnly<{| 'aria-disabled'?: ?boolean, 'aria-expanded'?: ?boolean, 'aria-selected'?: ?boolean, + 'aria-readonly'?: ?boolean, // Windows /** A value indicating whether the accessibility elements contained within * this accessibility element are hidden. * diff --git a/vnext/src-win/Libraries/Image/Image.windows.js b/vnext/src-win/Libraries/Image/Image.windows.js index ec4f5ba6695..aff1b24ca2e 100644 --- a/vnext/src-win/Libraries/Image/Image.windows.js +++ b/vnext/src-win/Libraries/Image/Image.windows.js @@ -148,6 +148,7 @@ let BaseImage: AbstractImageIOS = React.forwardRef((props, forwardedRef) => { 'aria-disabled': ariaDisabled, 'aria-expanded': ariaExpanded, 'aria-selected': ariaSelected, + 'aria-readonly': ariaReadOnly, // Windows 'aria-multiselectable': ariaMultiselectable, // Windows 'aria-required': ariaRequired, // Windows height, @@ -162,6 +163,7 @@ let BaseImage: AbstractImageIOS = React.forwardRef((props, forwardedRef) => { disabled: ariaDisabled ?? props.accessibilityState?.disabled, expanded: ariaExpanded ?? props.accessibilityState?.expanded, selected: ariaSelected ?? props.accessibilityState?.selected, + readOnly: ariaReadOnly ?? props.accessibilityState?.readOnly, // Windows multiselectable: ariaMultiselectable ?? props.accessibilityState?.multiselectable, // Windows required: ariaRequired ?? props.accessibilityState?.required, // Windows diff --git a/vnext/src-win/Libraries/Text/Text.windows.js b/vnext/src-win/Libraries/Text/Text.windows.js index e4ff93bd81e..28fc643febb 100644 --- a/vnext/src-win/Libraries/Text/Text.windows.js +++ b/vnext/src-win/Libraries/Text/Text.windows.js @@ -53,6 +53,7 @@ const Text: React.AbstractComponent< 'aria-posinset': ariaPosinset, // Windows 'aria-setsize': ariaSetsize, // Windows 'aria-selected': ariaSelected, + 'aria-readonly': ariaReadOnly, //Windows ellipsizeMode, id, nativeID, @@ -81,6 +82,7 @@ const Text: React.AbstractComponent< ariaDisabled != null || ariaExpanded != null || ariaSelected != null || + ariaReadOnly != null || // Windows ariaMultiselectable != null || // Windows ariaRequired != null // Windows ) { @@ -90,6 +92,8 @@ const Text: React.AbstractComponent< disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, + readOnly: ariaReadOnly, // Windows + readOnly: ariaReadOnly ?? accessibilityState?.readOnly, // Windows multiselectable: ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows required: ariaRequired ?? accessibilityState?.required, // Windows diff --git a/vnext/src-win/Libraries/Text/TextProps.windows.js b/vnext/src-win/Libraries/Text/TextProps.windows.js index 7d9833b4d2e..e77b1063cf9 100644 --- a/vnext/src-win/Libraries/Text/TextProps.windows.js +++ b/vnext/src-win/Libraries/Text/TextProps.windows.js @@ -97,6 +97,7 @@ export type TextProps = $ReadOnly<{| 'aria-posinset'?: ?number, // Windows 'aria-setsize'?: ?number, // Windows 'aria-level'?: ?number, // Windows + 'aria-readonly'?: ?boolean, // Windows 'aria-multiselectable'?: ?boolean, // Windows 'aria-required'?: ?boolean, // Windows From 317f7bf25e1313254501a409404026164a9f2743 Mon Sep 17 00:00:00 2001 From: Andrew Coates <30809111+acoates-ms@users.noreply.github.com> Date: Fri, 10 Jan 2025 14:14:18 -0800 Subject: [PATCH 3/6] Rework modal to be implemented entirely using public APIs (#14256) * Rework modal implementation to use public APIs * shutdown fix * Change files * format * remove dead code * format * fixes * fix * UIA tree for root component should be kept distinct from main UIA tree * input offset fix for sub rootviews * Split modal into two componentview's so that we dont have multiple roots in our componentview tree * format * Ensure rootview removes itself from the island, before a new one adds itself on instance reload * defork some modal test pages * remove override --- ...-f295c471-5165-440a-a5d5-4d9b2d9c84d9.json | 7 + .../tester/overrides.json | 6 - .../js/examples/Modal/ModalOnShow.windows.js | 149 ----- .../Modal/ModalPresentation.windows.js | 10 +- .../CompositionComponentView.idl | 14 +- .../Fabric/ComponentView.cpp | 1 - .../Composition/ComponentViewRegistry.cpp | 5 - .../CompositionDynamicAutomationProvider.cpp | 1 - .../Composition/CompositionEventHandler.cpp | 45 +- .../Composition/CompositionEventHandler.h | 4 +- .../CompositionRootAutomationProvider.cpp | 2 +- .../CompositionRootAutomationProvider.h | 3 +- .../CompositionViewComponentView.cpp | 6 +- .../WindowsModalHostViewComponentDescriptor.h | 39 -- .../WindowsModalHostViewComponentView.cpp | 520 +++++++----------- .../Modal/WindowsModalHostViewComponentView.h | 64 +-- .../Modal/WindowsModalHostViewShadowNode.cpp | 18 - .../Modal/WindowsModalHostViewShadowNode.h | 39 -- .../Composition/PortalComponentView.cpp | 66 +++ .../Fabric/Composition/PortalComponentView.h | 52 ++ .../ReactCompositionViewComponentBuilder.cpp | 21 + .../ReactCompositionViewComponentBuilder.h | 11 +- .../Fabric/Composition/ReactNativeIsland.cpp | 98 +++- .../Fabric/Composition/ReactNativeIsland.h | 18 +- .../Fabric/Composition/RootComponentView.cpp | 88 ++- .../Fabric/Composition/RootComponentView.h | 16 + .../Fabric/Composition/UiaHelpers.cpp | 61 +- .../Fabric/FabricUIManagerModule.cpp | 7 +- .../Fabric/FabricUIManagerModule.h | 3 - .../WindowsComponentDescriptorRegistry.cpp | 2 - .../IReactCompositionViewComponentBuilder.idl | 5 + .../Microsoft.ReactNative/ReactNativeHost.cpp | 5 + .../ReactNativeIsland.idl | 6 +- vnext/Shared/Shared.vcxitems | 5 +- vnext/Shared/Shared.vcxitems.filters | 5 +- .../rnwcore/ActivityIndicatorView.g.h | 212 +++++++ .../rnwcore/AndroidDrawerLayout.g.h | 295 ++++++++++ .../AndroidHorizontalScrollContentView.g.h | 200 +++++++ .../components/rnwcore/AndroidProgressBar.g.h | 224 ++++++++ .../rnwcore/AndroidSwipeRefreshLayout.g.h | 250 +++++++++ .../components/rnwcore/AndroidSwitch.g.h | 267 +++++++++ .../components/rnwcore/DebuggingOverlay.g.h | 234 ++++++++ .../components/rnwcore/InputAccessory.g.h | 200 +++++++ .../components/rnwcore/ModalHostView.g.h | 283 ++++++++++ .../components/rnwcore/PullToRefreshView.g.h | 246 +++++++++ .../react/components/rnwcore/SafeAreaView.g.h | 197 +++++++ .../react/components/rnwcore/Switch.g.h | 263 +++++++++ .../rnwcore/UnimplementedNativeView.g.h | 200 +++++++ vnext/just-task.js | 2 +- vnext/overrides.json | 18 - 50 files changed, 3692 insertions(+), 801 deletions(-) create mode 100644 change/react-native-windows-f295c471-5165-440a-a5d5-4d9b2d9c84d9.json delete mode 100644 packages/@react-native-windows/tester/src/js/examples/Modal/ModalOnShow.windows.js delete mode 100644 vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentDescriptor.h delete mode 100644 vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.cpp delete mode 100644 vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.h create mode 100644 vnext/Microsoft.ReactNative/Fabric/Composition/PortalComponentView.cpp create mode 100644 vnext/Microsoft.ReactNative/Fabric/Composition/PortalComponentView.h create mode 100644 vnext/codegen/react/components/rnwcore/ActivityIndicatorView.g.h create mode 100644 vnext/codegen/react/components/rnwcore/AndroidDrawerLayout.g.h create mode 100644 vnext/codegen/react/components/rnwcore/AndroidHorizontalScrollContentView.g.h create mode 100644 vnext/codegen/react/components/rnwcore/AndroidProgressBar.g.h create mode 100644 vnext/codegen/react/components/rnwcore/AndroidSwipeRefreshLayout.g.h create mode 100644 vnext/codegen/react/components/rnwcore/AndroidSwitch.g.h create mode 100644 vnext/codegen/react/components/rnwcore/DebuggingOverlay.g.h create mode 100644 vnext/codegen/react/components/rnwcore/InputAccessory.g.h create mode 100644 vnext/codegen/react/components/rnwcore/ModalHostView.g.h create mode 100644 vnext/codegen/react/components/rnwcore/PullToRefreshView.g.h create mode 100644 vnext/codegen/react/components/rnwcore/SafeAreaView.g.h create mode 100644 vnext/codegen/react/components/rnwcore/Switch.g.h create mode 100644 vnext/codegen/react/components/rnwcore/UnimplementedNativeView.g.h diff --git a/change/react-native-windows-f295c471-5165-440a-a5d5-4d9b2d9c84d9.json b/change/react-native-windows-f295c471-5165-440a-a5d5-4d9b2d9c84d9.json new file mode 100644 index 00000000000..724dde632cb --- /dev/null +++ b/change/react-native-windows-f295c471-5165-440a-a5d5-4d9b2d9c84d9.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "Rework modal implementation to use public APIs", + "packageName": "react-native-windows", + "email": "30809111+acoates-ms@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/@react-native-windows/tester/overrides.json b/packages/@react-native-windows/tester/overrides.json index a30b7f1e39f..18959a0179f 100644 --- a/packages/@react-native-windows/tester/overrides.json +++ b/packages/@react-native-windows/tester/overrides.json @@ -27,12 +27,6 @@ "type": "platform", "file": "src/js/examples/HTTP/HTTPExampleMultiPartFormData.js" }, - { - "type": "patch", - "file": "src/js/examples/Modal/ModalOnShow.windows.js", - "baseFile": "packages/rn-tester/js/examples/Modal/ModalOnShow.js", - "baseHash": "5098723f16d232ef3c5971a6f153522f42f87f61" - }, { "type": "patch", "file": "src/js/examples/Modal/ModalPresentation.windows.js", diff --git a/packages/@react-native-windows/tester/src/js/examples/Modal/ModalOnShow.windows.js b/packages/@react-native-windows/tester/src/js/examples/Modal/ModalOnShow.windows.js deleted file mode 100644 index e4e2468c967..00000000000 --- a/packages/@react-native-windows/tester/src/js/examples/Modal/ModalOnShow.windows.js +++ /dev/null @@ -1,149 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @flow strict-local - * @format - */ - -import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; - -import * as React from 'react'; -import {Modal, Pressable, StyleSheet, Text, View} from 'react-native'; - -function ModalOnShowOnDismiss(): React.Node { - const [modalShowComponent, setModalShowComponent] = React.useState(true); - const [modalVisible, setModalVisible] = React.useState(false); - const [onShowCount, setOnShowCount] = React.useState(0); - const [onDismissCount, setOnDismissCount] = React.useState(0); - - return ( - - {modalShowComponent && ( - { - setOnShowCount(onShowCount + 1); - }} - onDismiss={() => { - setOnDismissCount(onDismissCount + 1); - }} - onRequestClose={() => { - setModalVisible(false); - }}> - - - - onShow is called {onShowCount} times - - - onDismiss is called {onDismissCount} times - - setModalVisible(false)}> - - Hide modal by setting visible to false - - - setModalShowComponent(false)}> - - Hide modal by removing component - - - - - - )} - onShow is called {onShowCount} times - - onDismiss is called {onDismissCount} times - - { - setModalShowComponent(true); - setModalVisible(true); - }}> - - Show Modal - - - - ); -} - -const styles = StyleSheet.create({ - container: { - display: 'flex', - alignItems: 'center', - paddingVertical: 30, - }, - centeredView: { - // flex: 1, [Windows] - justifyContent: 'center', - alignItems: 'center', - }, - modalBackdrop: { - backgroundColor: 'rgba(0, 0, 0, 0.5)', - }, - modalView: { - margin: 20, - backgroundColor: 'white', - borderRadius: 20, - padding: 35, - alignItems: 'center', - shadowColor: '#000', - shadowOffset: { - width: 0, - height: 2, - }, - shadowOpacity: 0.25, - shadowRadius: 4, - elevation: 5, - }, - button: { - borderRadius: 20, - padding: 10, - marginVertical: 20, - elevation: 2, - }, - buttonOpen: { - backgroundColor: '#F194FF', - }, - buttonClose: { - backgroundColor: '#2196F3', - }, - textStyle: { - color: 'white', - fontWeight: 'bold', - textAlign: 'center', - }, - // [Windows - widthHeight: { - width: 300, - height: 400, - }, - // Windows] -}); - -export default ({ - title: "Modal's onShow/onDismiss", - name: 'onShow', - description: - 'onShow and onDismiss (iOS only) callbacks are called when a modal is shown/dismissed', - render: (): React.Node => , -}: RNTesterModuleExample); diff --git a/packages/@react-native-windows/tester/src/js/examples/Modal/ModalPresentation.windows.js b/packages/@react-native-windows/tester/src/js/examples/Modal/ModalPresentation.windows.js index fbae830d053..b851c8af979 100644 --- a/packages/@react-native-windows/tester/src/js/examples/Modal/ModalPresentation.windows.js +++ b/packages/@react-native-windows/tester/src/js/examples/Modal/ModalPresentation.windows.js @@ -293,13 +293,9 @@ const styles = StyleSheet.create({ marginTop: 6, }, modalContainer: { - // [Windows - width: 500, - height: 500, - // flex: 1, - // justifyContent: 'center', - // padding: 20, - // Windows ] + flex: 1, + justifyContent: 'center', + padding: 20, }, modalInnerContainer: { borderRadius: 10, diff --git a/vnext/Microsoft.ReactNative/CompositionComponentView.idl b/vnext/Microsoft.ReactNative/CompositionComponentView.idl index 7cfa2740d2a..5c72cbd5067 100644 --- a/vnext/Microsoft.ReactNative/CompositionComponentView.idl +++ b/vnext/Microsoft.ReactNative/CompositionComponentView.idl @@ -7,6 +7,7 @@ import "ViewProps.idl"; import "Composition.Input.idl"; import "CompositionSwitcher.idl"; import "IReactContext.idl"; +import "ReactNativeIsland.idl"; #include "DocString.h" @@ -110,8 +111,19 @@ namespace Microsoft.ReactNative.Composition [default_interface] runtimeclass RootComponentView : ViewComponentView { Microsoft.ReactNative.ComponentView GetFocusedComponent(); + Microsoft.ReactNative.ReactNativeIsland ReactNativeIsland { get; }; + DOC_STRING("Is non-null if this RootComponentView is the content of a portal") + PortalComponentView Portal { get; }; }; - + + [experimental] + [webhosthidden] + [default_interface] + DOC_STRING("Used to implement UI that is hosted outside the main UI tree, such as modal.") + runtimeclass PortalComponentView : Microsoft.ReactNative.ComponentView { + RootComponentView ContentRoot { get; }; + }; + [experimental] [webhosthidden] [default_interface] diff --git a/vnext/Microsoft.ReactNative/Fabric/ComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/ComponentView.cpp index 4895e1e2328..331edf4b0b6 100644 --- a/vnext/Microsoft.ReactNative/Fabric/ComponentView.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/ComponentView.cpp @@ -639,7 +639,6 @@ facebook::react::Tag ComponentView::hitTest( } winrt::IInspectable ComponentView::EnsureUiaProvider() noexcept { - assert(false); return nullptr; } diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/ComponentViewRegistry.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/ComponentViewRegistry.cpp index 360a3161c14..4989b3fc0e9 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/ComponentViewRegistry.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/ComponentViewRegistry.cpp @@ -15,8 +15,6 @@ #include #include #include -#include -#include #include #include #include @@ -59,9 +57,6 @@ ComponentViewDescriptor const &ComponentViewRegistry::dequeueComponentViewWithCo } else if (componentHandle == facebook::react::ImageShadowNode::Handle()) { view = winrt::Microsoft::ReactNative::Composition::implementation::ImageComponentView::Create( compContext, tag, m_context); - } else if (componentHandle == facebook::react::WindowsModalHostViewShadowNode::Handle()) { - view = winrt::Microsoft::ReactNative::Composition::implementation::WindowsModalHostComponentView::Create( - compContext, tag, m_context); } else if (componentHandle == facebook::react::WindowsTextInputShadowNode::Handle()) { view = winrt::Microsoft::ReactNative::Composition::implementation::WindowsTextInputComponentView::Create( compContext, tag, m_context); diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp index dd0933ed8ed..58fe025d9b5 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp @@ -189,7 +189,6 @@ HRESULT __stdcall CompositionDynamicAutomationProvider::GetPatternProvider(PATTE winrt::get_self(strongView)->props()); if (props == nullptr) return UIA_E_ELEMENTNOTAVAILABLE; - auto accessibilityRole = props->accessibilityRole; // Invoke control pattern is used to support controls that do not maintain state // when activated but rather initiate or perform a single, unambiguous action. if (patternId == UIA_InvokePatternId && (props->onAccessibilityTap)) { diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionEventHandler.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionEventHandler.cpp index 6ef17a06050..98f124e80c9 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionEventHandler.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionEventHandler.cpp @@ -142,9 +142,8 @@ struct CompositionInputKeyboardSource : winrt::implements< CompositionEventHandler::CompositionEventHandler( const winrt::Microsoft::ReactNative::ReactContext &context, - const winrt::Microsoft::ReactNative::ReactNativeIsland &reactNativeIsland, - const int fragmentTag) - : m_fragmentTag(fragmentTag), m_context(context), m_wkRootView(reactNativeIsland) {} + const winrt::Microsoft::ReactNative::ReactNativeIsland &reactNativeIsland) + : m_context(context), m_wkRootView(reactNativeIsland) {} void CompositionEventHandler::Initialize() noexcept { #ifdef USE_WINUI3 @@ -348,11 +347,8 @@ facebook::react::SurfaceId CompositionEventHandler::SurfaceId() const noexcept { winrt::Microsoft::ReactNative::Composition::implementation::RootComponentView & CompositionEventHandler::RootComponentView() const noexcept { - auto rootComponentViewDescriptor = (::Microsoft::ReactNative::FabricUIManager::FromProperties(m_context.Properties())) - ->GetViewRegistry() - .componentViewDescriptorWithTag(SurfaceId()); - return *rootComponentViewDescriptor.view - .as(); + auto island = m_wkRootView.get(); + return *winrt::get_self(island)->GetComponentView(); } void CompositionEventHandler::onPointerWheelChanged( @@ -365,6 +361,9 @@ void CompositionEventHandler::onPointerWheelChanged( facebook::react::Point ptLocal; facebook::react::Point ptScaled = {static_cast(position.X), static_cast(position.Y)}; + // In the case of a sub rootview, we may have a non-zero origin. hitTest takes a pt in the parent coords, so we + // need to apply the current origin + ptScaled += RootComponentView().layoutMetrics().frame.origin; auto tag = RootComponentView().hitTest(ptScaled, ptLocal); if (tag == -1) @@ -981,6 +980,11 @@ void CompositionEventHandler::getTargetPointerArgs( tag = -1; ptScaled = {position.X, position.Y}; + + // In the case of a sub rootview, we may have a non-zero origin. hitTest takes a pt in the parent coords, so we need + // to apply the current origin + ptScaled += RootComponentView().layoutMetrics().frame.origin; + if (std::find(m_capturedPointers.begin(), m_capturedPointers.end(), pointerId) != m_capturedPointers.end()) { assert(m_pointerCapturingComponentTag != -1); tag = m_pointerCapturingComponentTag; @@ -993,30 +997,7 @@ void CompositionEventHandler::getTargetPointerArgs( ptLocal.y = ptScaled.y - (clientRect.top / strongRootView.ScaleFactor()); } } else { - if (m_fragmentTag == -1) { - tag = RootComponentView().hitTest(ptScaled, ptLocal); - return; - } - - // check if the fragment tag exists - if (!fabricuiManager->GetViewRegistry().findComponentViewWithTag(m_fragmentTag)) { - return; - } - - auto fagmentView = fabricuiManager->GetViewRegistry().componentViewDescriptorWithTag(m_fragmentTag).view; - auto fagmentchildren = fagmentView.Children(); - - // call the hitTest with the fargment as the RootComponent - for (auto index = fagmentchildren.Size(); index > 0; index--) { - auto childView = fagmentchildren.GetAt(index - 1); - auto targetTag = - winrt::get_self(childView)->hitTest( - ptScaled, ptLocal); - if (targetTag != -1) { - tag = targetTag; - break; - } - } + tag = RootComponentView().hitTest(ptScaled, ptLocal); } } diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionEventHandler.h b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionEventHandler.h index f35bd44115d..1826338fadb 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionEventHandler.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionEventHandler.h @@ -31,8 +31,7 @@ class CompositionEventHandler : public std::enable_shared_from_this m_activeTouches; // iOS is map of touch event args to ActiveTouch..? PointerId m_touchId = 0; - int m_fragmentTag = -1; std::map> m_currentlyHoveredViewsPerPointer; winrt::weak_ref m_wkRootView; diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionRootAutomationProvider.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionRootAutomationProvider.cpp index 5bf4135f57c..a1ab4e62227 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionRootAutomationProvider.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionRootAutomationProvider.cpp @@ -167,7 +167,7 @@ HRESULT __stdcall CompositionRootAutomationProvider::get_ProviderOptions(Provide return S_OK; } -winrt::Microsoft::ReactNative::Composition::implementation::RootComponentView * +winrt::com_ptr CompositionRootAutomationProvider::rootComponentView() noexcept { if (auto rootView = m_wkRootView.get()) { auto innerRootView = winrt::get_self(rootView); diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionRootAutomationProvider.h b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionRootAutomationProvider.h index cdaf5eabd0e..374b4c95f43 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionRootAutomationProvider.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionRootAutomationProvider.h @@ -63,7 +63,8 @@ class CompositionRootAutomationProvider : public winrt::implements< }; private: - winrt::Microsoft::ReactNative::Composition::implementation::RootComponentView *rootComponentView() noexcept; + winrt::com_ptr + rootComponentView() noexcept; HRESULT AdvisePropertiesAdded(SAFEARRAY *psaProperties) noexcept; HRESULT AdvisePropertiesRemoved(SAFEARRAY *psaProperties) noexcept; diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp index d5d1574e4b3..a4633f174b2 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp @@ -468,7 +468,7 @@ bool ComponentView::CapturePointer(const winrt::Microsoft::ReactNative::Composit if (!root) return false; - auto rootView{uiManager->GetReactNativeIsland(root->Tag())}; + auto rootView{root->ReactNativeIsland()}; if (!rootView) { return false; } @@ -487,7 +487,7 @@ void ComponentView::ReleasePointerCapture( if (!root) return; - auto rootView{uiManager->GetReactNativeIsland(root->Tag())}; + auto rootView{root->ReactNativeIsland()}; if (!rootView) { return; } @@ -1314,7 +1314,7 @@ winrt::Microsoft::ReactNative::ComponentView lastDeepChild( } // Walks the tree calling the function fn on each node. -// If fn returns true, then walkTree stops itterating over the tree, and returns true. +// If fn returns true, then walkTree stops iterating over the tree, and returns true. // If the tree walk completes without fn returning true, then walkTree returns false. bool walkTree( const winrt::Microsoft::ReactNative::ComponentView &view, diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentDescriptor.h b/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentDescriptor.h deleted file mode 100644 index 041f578f767..00000000000 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentDescriptor.h +++ /dev/null @@ -1,39 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -#pragma once - -#include -#include -// [Windows -#include "WindowsModalHostViewShadowNode.h" -// ] - -namespace facebook::react { - -/* - * Descriptor for component. - */ - -class WindowsModalHostViewComponentDescriptor final - : public ConcreteComponentDescriptor { - public: - using ConcreteComponentDescriptor::ConcreteComponentDescriptor; - - void adopt(ShadowNode &shadowNode) const override { - auto &layoutableShadowNode = static_cast(shadowNode); - auto &stateData = - static_cast(*shadowNode.getState()).getData(); - - layoutableShadowNode.setSize(Size{stateData.screenSize.width, stateData.screenSize.height}); - layoutableShadowNode.setPositionType(YGPositionTypeAbsolute); - - ConcreteComponentDescriptor::adopt(shadowNode); - } -}; - -} // namespace facebook::react diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.cpp index 08b584f2162..6bb1de556d9 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.cpp @@ -5,379 +5,241 @@ #include "WindowsModalHostViewComponentView.h" -#include -#include -#include "../CompositionDynamicAutomationProvider.h" -#include "Unicode.h" - -#include -#include -#include -#include -#include -#include -#include +#include "../../../codegen/react/components/rnwcore/ModalHostView.g.h" +#include #include +#include +#include #include -#include -#include -#include "IReactContext.h" -#include "ReactHost/ReactInstanceWin.h" -#include "ReactNativeHost.h" -#include "WindowsModalHostViewShadowNode.h" namespace winrt::Microsoft::ReactNative::Composition::implementation { -WindowsModalHostComponentView::WindowsModalHostComponentView( - const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext, - facebook::react::Tag tag, - winrt::Microsoft::ReactNative::ReactContext const &reactContext) - : Super(compContext, tag, reactContext) {} - -WindowsModalHostComponentView::~WindowsModalHostComponentView() { - // dispatch onDismiss event - auto emitter = std::static_pointer_cast(m_eventEmitter); - facebook::react::ModalHostViewEventEmitter::OnDismiss onDismissArgs; - emitter->onDismiss(onDismissArgs); - - // reset the topWindowID - if (m_prevWindowID) { - auto host = - winrt::Microsoft::ReactNative::implementation::ReactNativeHost::GetReactNativeHost(m_reactContext.Properties()); - winrt::Microsoft::ReactNative::ReactCoreInjection::SetTopLevelWindowId( - host.InstanceSettings().Properties(), m_prevWindowID); - m_prevWindowID = 0; - } - - // enable input to parent - EnableWindow(m_parentHwnd, true); - - // Check if the window handle (m_hwnd) exists and destroy it if necessary - if (m_hwnd) { - // Close/Destroy the modal window - SendMessage(m_hwnd, WM_DESTROY, 0, 0); - m_hwnd = nullptr; - } -} - -winrt::Microsoft::ReactNative::ComponentView WindowsModalHostComponentView::Create( - const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext, - facebook::react::Tag tag, - winrt::Microsoft::ReactNative::ReactContext const &reactContext) noexcept { - return winrt::make(compContext, tag, reactContext); -} -// constants for creating a new windows -constexpr PCWSTR c_modalWindowClassName = L"MS_REACTNATIVE_MODAL"; -constexpr auto CompHostProperty = L"CompHost"; -const int MODAL_MIN_WIDTH = 50; -const int MODAL_MIN_HEIGHT = 50; +struct ModalHostView : public winrt::implements, + ::Microsoft::ReactNativeSpecs::BaseModalHostView { + ~ModalHostView() { + if (m_window && m_window.IsVisible()) { + CloseWindow(); + } -float ScaleFactor(HWND hwnd) noexcept { - return GetDpiForWindow(hwnd) / static_cast(USER_DEFAULT_SCREEN_DPI); -} + if (m_reactNativeIsland) { + m_reactNativeIsland.Island().Close(); + } -// creates a new modal window -void WindowsModalHostComponentView::EnsureModalCreated() { - auto host = - winrt::Microsoft::ReactNative::implementation::ReactNativeHost::GetReactNativeHost(m_reactContext.Properties()); + if (m_bridge) { + if (m_departFocusToken && !m_bridge.IsClosed()) { + auto navHost = winrt::Microsoft::UI::Input::InputFocusNavigationHost::GetForSiteBridge(m_bridge); + navHost.DepartFocusRequested(m_departFocusToken); + } + m_bridge.Close(); + } - // return if hwnd already exists - if (!host || m_hwnd) { - return; + if (m_window) { + m_window.Destroy(); + m_window = nullptr; + } } - RegisterWndClass(); - - HINSTANCE hInstance = GetModuleHandle(NULL); - winrt::com_ptr<::IUnknown> spunk; - - // get the root hwnd - m_prevWindowID = - winrt::Microsoft::ReactNative::ReactCoreInjection::GetTopLevelWindowId(m_reactContext.Properties().Handle()); + void InitializePortalViewComponent( + const winrt::Microsoft::ReactNative::Composition::PortalComponentView &portalComponentView) noexcept { + m_reactContext = portalComponentView.ReactContext(); - m_parentHwnd = GetHwndForParenting(); - - auto windowsStyle = m_showTitleBar ? WS_OVERLAPPEDWINDOW : WS_POPUP; - - m_hwnd = CreateWindow( - c_modalWindowClassName, - L"React-Native Modal", - windowsStyle, - CW_USEDEFAULT, - CW_USEDEFAULT, - MODAL_MIN_WIDTH, - MODAL_MIN_HEIGHT, - m_parentHwnd, // parent - nullptr, - hInstance, - spunk.get()); - - // Check if window creation succeeded - if (!m_hwnd) { - throw std::exception("Failed to create new hwnd for Modal: " + GetLastError()); + portalComponentView.Mounted( + [](const auto & /*sender*/, const auto &view) { view.UserData().as()->OnMounted(view); }); + portalComponentView.Unmounted( + [](const auto & /*sender*/, const auto &view) { view.UserData().as()->OnUnmounted(view); }); } - // Disable user sizing of the hwnd - ::SetWindowLong(m_hwnd, GWL_STYLE, GetWindowLong(m_hwnd, GWL_STYLE) & ~WS_SIZEBOX); - - // set the top-level windows as the new hwnd - winrt::Microsoft::ReactNative::ReactCoreInjection::SetTopLevelWindowId( - host.InstanceSettings().Properties(), reinterpret_cast(m_hwnd)); - - // get current compositor - handles the creation/manipulation of visual objects - auto compositionContext = CompositionContext(); - auto compositor = - winrt::Microsoft::ReactNative::Composition::Experimental::MicrosoftCompositionContextHelper::InnerCompositor( - compositionContext); - - // create a react native island - code taken from CompositionHwndHost - auto bridge = winrt::Microsoft::UI::Content::DesktopChildSiteBridge::Create( - compositor, winrt::Microsoft::UI::GetWindowIdFromWindow(m_hwnd)); - m_reactNativeIsland = winrt::Microsoft::ReactNative::ReactNativeIsland(compositor, m_reactContext.Handle(), *this); - auto contentIsland = m_reactNativeIsland.Island(); - bridge.Connect(contentIsland); - bridge.Show(); - - // set ScaleFactor - ScaleFactor(m_hwnd); - - // set layout contraints - winrt::Microsoft::ReactNative::LayoutConstraints constraints; - constraints.LayoutDirection = winrt::Microsoft::ReactNative::LayoutDirection::Undefined; - - RECT rc; - GetClientRect(m_parentHwnd, &rc); - // Maximum size is set to size of parent hwnd - constraints.MaximumSize = {(rc.right - rc.left) * ScaleFactor(m_hwnd), (rc.bottom - rc.top) / ScaleFactor(m_hwnd)}; - constraints.MinimumSize = {MODAL_MIN_WIDTH * ScaleFactor(m_hwnd), MODAL_MIN_HEIGHT * ScaleFactor(m_hwnd)}; - m_reactNativeIsland.Arrange(constraints, {0, 0}); - bridge.ResizePolicy(winrt::Microsoft::UI::Content::ContentSizePolicy::ResizeContentToParentWindow); - - spunk.detach(); -} - -void WindowsModalHostComponentView::ShowOnUIThread() { - if (m_hwnd && !IsWindowVisible(m_hwnd)) { - ShowWindow(m_hwnd, SW_NORMAL); - BringWindowToTop(m_hwnd); - SetFocus(m_hwnd); - - // disable input to parent - EnableWindow(m_parentHwnd, false); - - // dispatch onShow event - auto emitter = std::static_pointer_cast(m_eventEmitter); - facebook::react::ModalHostViewEventEmitter::OnShow onShowArgs; - emitter->onShow(onShowArgs); + void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::com_ptr<::Microsoft::ReactNativeSpecs::ModalHostViewProps> &newProps, + const winrt::com_ptr<::Microsoft::ReactNativeSpecs::ModalHostViewProps> &oldProps) noexcept override { + if (!oldProps || newProps->visible != oldProps->visible) { + if (newProps->visible.value_or(true)) { + // We do not immediately show the window, since we want to resize/position + // the window based on the layout metrics before we show it + m_showQueued = true; + } else { + CloseWindow(); + } + } + ::Microsoft::ReactNativeSpecs::BaseModalHostView::UpdateProps(view, newProps, oldProps); } -} -void WindowsModalHostComponentView::HideOnUIThread() noexcept { - if (m_hwnd) { - SendMessage(m_hwnd, WM_CLOSE, 0, 0); + void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics & /*oldLayoutMetrics*/) noexcept override { + if (m_window) { + AdjustWindowSize(newLayoutMetrics); + } } - // dispatch onDismiss event - auto emitter = std::static_pointer_cast(m_eventEmitter); - facebook::react::ModalHostViewEventEmitter::OnDismiss onDismissArgs; - emitter->onDismiss(onDismissArgs); + void FinalizeUpdate( + const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept override { + if (m_showQueued) { + ShowOnUIThread(view); + } + } - // enable input to parent - EnableWindow(m_parentHwnd, true); + private: + void OnMounted(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + m_mounted = true; - // reset the topWindowID - if (m_prevWindowID) { - auto host = - winrt::Microsoft::ReactNative::implementation::ReactNativeHost::GetReactNativeHost(m_reactContext.Properties()); - winrt::Microsoft::ReactNative::ReactCoreInjection::SetTopLevelWindowId( - host.InstanceSettings().Properties(), m_prevWindowID); - m_prevWindowID = 0; + if (m_showQueued) { + ShowOnUIThread(view); + } } -} -// Windows Procedure - callback function used for handling all messages (generated by NTUser or manual calls to -// SendMessage) -LRESULT CALLBACK ModalBoxWndProc(HWND hwnd, UINT message, WPARAM wparam, LPARAM lparam) noexcept { - auto data = reinterpret_cast<::IUnknown *>(GetProp( - hwnd, - CompHostProperty)); // gets data handle from the property list of specified window (ie the window we want to make) - winrt::Microsoft::ReactNative::CompositionHwndHost host{nullptr}; - - if (data) { - winrt::check_hresult(data->QueryInterface( - winrt::guid_of(), - winrt::put_abi(host))); // look into the data for a CompositionHwndHost and store it in host - auto result = static_cast(host.TranslateMessage(message, wparam, lparam)); - if (result) { - return result; - } + void OnUnmounted(const winrt::Microsoft::ReactNative::ComponentView & /*view*/) noexcept { + m_mounted = false; } - switch (message) { - case WM_NCCREATE: { // called before WM_CREATE, lparam should be identical to members of CreateWindowEx - auto createStruct = reinterpret_cast(lparam); // CreateStruct - data = static_cast<::IUnknown *>(createStruct->lpCreateParams); - SetProp(hwnd, CompHostProperty, data); // adds new properties to window - break; + void AdjustWindowSize(const winrt::Microsoft::ReactNative::LayoutMetrics &layoutMetrics) noexcept { + if (layoutMetrics.Frame.Width == 0 && layoutMetrics.Frame.Height == 0) { + return; } - case WM_CLOSE: { - // Just hide the window instead of destroying it - ::ShowWindow(hwnd, SW_HIDE); - return 0; - } - case WM_DESTROY: { // called when we want to destroy the window - ::ShowWindow(hwnd, SW_HIDE); - if (data) { - data->Release(); + + // get Modal's position based on parent + RECT parentRC; + GetWindowRect(m_parentHwnd, &parentRC); + int32_t xCor = static_cast( + (parentRC.left + parentRC.right - layoutMetrics.Frame.Width * layoutMetrics.PointScaleFactor) / 2); + int32_t yCor = static_cast( + (parentRC.top + parentRC.bottom - layoutMetrics.Frame.Height * layoutMetrics.PointScaleFactor) / 2); + + // Adjust window position and size + m_window.ResizeClient( + {static_cast(layoutMetrics.Frame.Width * (layoutMetrics.PointScaleFactor)), + static_cast(layoutMetrics.Frame.Height * (layoutMetrics.PointScaleFactor))}); + m_window.Move({xCor, yCor}); + }; + + void ShowOnUIThread(const winrt::Microsoft::ReactNative::ComponentView &view) { + if (!m_mounted) + return; + + m_showQueued = false; + EnsureModalCreated(view); + + if (m_window && !m_window.IsVisible()) { + m_bridge.Enable(); + m_window.Show(true); + + auto navHost = winrt::Microsoft::UI::Input::InputFocusNavigationHost::GetForSiteBridge(m_bridge); + auto result = navHost.NavigateFocus(winrt::Microsoft::UI::Input::FocusNavigationRequest::Create( + winrt::Microsoft::UI::Input::FocusNavigationReason::First)); + + // dispatch onShow event + if (auto eventEmitter = EventEmitter()) { + ::Microsoft::ReactNativeSpecs::ModalHostViewEventEmitter::OnShow eventArgs; + eventEmitter->onShow(eventArgs); } - SetProp(hwnd, CompHostProperty, nullptr); - break; } } - return DefWindowProc(hwnd, message, wparam, lparam); -} - -// Creates and Register a new window class -void WindowsModalHostComponentView::RegisterWndClass() noexcept { - static bool registered = false; - if (registered) { - return; - } - - HINSTANCE hInstance = - GetModuleHandle(NULL); // returns a handle to the file used to create the calling process (.exe file) - - WNDCLASSEX wcex = {}; // contains window class information - wcex.cbSize = sizeof(wcex); // size of windows class (bytes) - wcex.style = CS_HREDRAW | CS_VREDRAW; // class style (redraw window on size adjustment) - wcex.lpfnWndProc = &ModalBoxWndProc; // pointer to windows procedure - wcex.cbClsExtra = DLGWINDOWEXTRA; // extra bytes to allocate - wcex.cbWndExtra = - sizeof(winrt::impl::abi::type *); // extra bytes to allocate - wcex.hInstance = hInstance; - wcex.hCursor = LoadCursor(nullptr, IDC_ARROW); // handle to class cursor - wcex.hbrBackground = (HBRUSH)(COLOR_WINDOW + 1); // background color - wcex.lpszClassName = c_modalWindowClassName; // specify resource name - ATOM classId = RegisterClassEx(&wcex); // register new windows class - WINRT_VERIFY(classId); // 0 = fail - winrt::check_win32(!classId); - - registered = true; -} - -winrt::Microsoft::ReactNative::Composition::Experimental::IVisual -WindowsModalHostComponentView::VisualToMountChildrenInto() noexcept { - return m_reactNativeIsland - .as() - .InternalRootVisual(); -} + void CloseWindow() noexcept { + // enable input to parent before closing the modal window, so focus can return back to the parent window + EnableWindow(m_parentHwnd, true); -// childComponentView - reference to the child component view -// index - the position in which the childComponentView should be mounted -void WindowsModalHostComponentView::MountChildComponentView( - const winrt::Microsoft::ReactNative::ComponentView &childComponentView, - uint32_t index) noexcept { - EnsureModalCreated(); - base_type::MountChildComponentView(childComponentView, index); -} + if (m_window) { + m_window.Hide(); + } -void WindowsModalHostComponentView::UnmountChildComponentView( - const winrt::Microsoft::ReactNative::ComponentView &childComponentView, - uint32_t index) noexcept { - base_type::UnmountChildComponentView(childComponentView, index); -} + // dispatch onDismiss event + if (auto eventEmitter = EventEmitter()) { + ::Microsoft::ReactNativeSpecs::ModalHostViewEventEmitter::OnDismiss eventArgs; + eventEmitter->onDismiss(eventArgs); + } -void WindowsModalHostComponentView::updateLayoutMetrics( - facebook::react::LayoutMetrics const &layoutMetrics, - facebook::react::LayoutMetrics const &oldLayoutMetrics) noexcept { - base_type::updateLayoutMetrics(layoutMetrics, oldLayoutMetrics); - if (m_hwnd) { - EnsureModalCreated(); - AdjustWindowSize(); - ShowOnUIThread(); - } -} + // reset the topWindowID + if (m_prevWindowID) { + winrt::Microsoft::ReactNative::ReactCoreInjection::SetTopLevelWindowId( + m_reactContext.Properties().Handle(), m_prevWindowID); + m_prevWindowID = 0; + } -void WindowsModalHostComponentView::AdjustWindowSize() noexcept { - if (m_layoutMetrics.overflowInset.right == 0 && m_layoutMetrics.overflowInset.bottom == 0) { - return; + m_bridge.Disable(); } - // Modal's size is based on it's children, use the overflow to calculate the width/height - float xPos = (-m_layoutMetrics.overflowInset.right * (m_layoutMetrics.pointScaleFactor)); - float yPos = (-m_layoutMetrics.overflowInset.bottom * (m_layoutMetrics.pointScaleFactor)); - RECT rc; - GetClientRect(m_hwnd, &rc); - RECT rect = {0, 0, (int)xPos, (int)yPos}; - - if (m_showTitleBar) { - AdjustWindowRect(&rect, WS_OVERLAPPEDWINDOW, FALSE); // Adjust for title bar and borders - } + // creates a new modal window + void EnsureModalCreated(const winrt::Microsoft::ReactNative::ComponentView &view) { + if (m_window) { + return; + } - // set the layoutMetrics - m_layoutMetrics.frame.size = {(float)rect.right - rect.left, (float)rect.bottom - rect.top}; - m_layoutMetrics.overflowInset.right = 0; - m_layoutMetrics.overflowInset.bottom = 0; + // get the root hwnd + m_prevWindowID = + winrt::Microsoft::ReactNative::ReactCoreInjection::GetTopLevelWindowId(view.ReactContext().Properties()); - // get Modal's position based on parent - RECT parentRC; - GetWindowRect(m_parentHwnd, &parentRC); - float xCor = (parentRC.left + parentRC.right - m_layoutMetrics.frame.size.width) / 2; // midpointx - width / 2 - float yCor = (parentRC.top + parentRC.bottom - m_layoutMetrics.frame.size.height) / 2; // midpointy - height / 2 + m_parentHwnd = + view.as<::Microsoft::ReactNative::Composition::Experimental::IComponentViewInterop>()->GetHwndForParenting(); - // Adjust window position and size - MoveWindow(m_hwnd, (int)xCor, (int)yCor, (int)(rect.right - rect.left), (int)(rect.bottom - rect.top), true); + auto presenter = winrt::Microsoft::UI::Windowing::OverlappedPresenter::CreateForDialog(); + presenter.SetBorderAndTitleBar(true, false); + presenter.IsModal(true); - // Let RNWIsland know that Modal's size has changed - winrt::get_self(m_reactNativeIsland) - ->NotifySizeChanged(); -}; + m_window = winrt::Microsoft::UI::Windowing::AppWindow::Create( + presenter, winrt::Microsoft::UI::GetWindowIdFromWindow(m_parentHwnd)); -void WindowsModalHostComponentView::updateProps( - facebook::react::Props::Shared const &props, - facebook::react::Props::Shared const &oldProps) noexcept { - const auto &oldModalProps = - *std::static_pointer_cast(oldProps ? oldProps : viewProps()); - const auto &newModalProps = *std::static_pointer_cast(props); - newModalProps.visible ? m_isVisible = true : m_isVisible = false; - if (!m_isVisible) { - HideOnUIThread(); + // set the top-level windows as the new hwnd + winrt::Microsoft::ReactNative::ReactCoreInjection::SetTopLevelWindowId( + view.ReactContext().Properties(), + reinterpret_cast(winrt::Microsoft::UI::GetWindowFromWindowId(m_window.Id()))); + + // create a react native island - code taken from CompositionHwndHost + m_bridge = winrt::Microsoft::UI::Content::DesktopChildSiteBridge::Create( + view.Parent().as().Compositor(), m_window.Id()); + m_reactNativeIsland = winrt::Microsoft::ReactNative::ReactNativeIsland::CreatePortal( + view.as()); + auto contentIsland = m_reactNativeIsland.Island(); + + auto navHost = winrt::Microsoft::UI::Input::InputFocusNavigationHost::GetForSiteBridge(m_bridge); + m_departFocusToken = navHost.DepartFocusRequested( + [wkView = winrt::make_weak(view)]( + const auto &sender, const winrt::Microsoft::UI::Input::FocusNavigationRequestEventArgs &args) { + if (auto strongView = wkView.get()) { + TrySetFocus(strongView.Parent()); + } + }); + + m_bridge.ResizePolicy(winrt::Microsoft::UI::Content::ContentSizePolicy::ResizeContentToParentWindow); + m_bridge.Connect(contentIsland); + AdjustWindowSize(view.LayoutMetrics()); + m_bridge.Show(); } - base_type::updateProps(props, oldProps); -} -facebook::react::SharedViewProps WindowsModalHostComponentView::defaultProps() noexcept { - static auto const defaultProps = std::make_shared(); - return defaultProps; -} -const facebook::react::ModalHostViewProps &WindowsModalHostComponentView::modalHostViewProps() const noexcept { - return *std::static_pointer_cast(viewProps()); -} - -facebook::react::Tag WindowsModalHostComponentView::hitTest( - facebook::react::Point pt, - facebook::react::Point &localPt, - bool ignorePointerEvents) const noexcept { - facebook::react::Point ptLocal{pt.x - m_layoutMetrics.frame.origin.x, pt.y - m_layoutMetrics.frame.origin.y}; - - if ((ignorePointerEvents || viewProps()->pointerEvents == facebook::react::PointerEventsMode::Auto || - viewProps()->pointerEvents == facebook::react::PointerEventsMode::BoxOnly) && - ptLocal.x >= 0 && ptLocal.x <= m_layoutMetrics.frame.size.width && ptLocal.y >= 0 && - ptLocal.y <= m_layoutMetrics.frame.size.height) { - localPt = ptLocal; - return Tag(); + static void TrySetFocus(const winrt::Microsoft::ReactNative::ComponentView &view) { + auto focusController = winrt::Microsoft::UI::Input::InputFocusController::GetForIsland( + view.as().Root().ReactNativeIsland().Island()); + focusController.TrySetFocus(); } - return -1; -} - -bool WindowsModalHostComponentView::focusable() const noexcept { - return false; -} + ReactContext m_reactContext{nullptr}; + HWND m_parentHwnd{nullptr}; + winrt::Microsoft::UI::Windowing::AppWindow m_window{nullptr}; + uint64_t m_prevWindowID; + bool m_showTitleBar{false}; + bool m_showQueued{false}; + bool m_mounted{false}; + winrt::Microsoft::UI::Input::InputFocusNavigationHost::DepartFocusRequested_revoker m_departFocusRevoker; + winrt::event_token m_departFocusToken; + winrt::Microsoft::UI::Content::DesktopChildSiteBridge m_bridge{nullptr}; + winrt::Microsoft::ReactNative::ReactNativeIsland m_reactNativeIsland{nullptr}; +}; -std::string WindowsModalHostComponentView::DefaultControlType() const noexcept { - return "modal"; +void RegisterWindowsModalHostNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder) noexcept { + ::Microsoft::ReactNativeSpecs::RegisterModalHostViewNativeComponent( + packageBuilder, + [](const winrt::Microsoft::ReactNative::Composition::IReactCompositionViewComponentBuilder &builder) { + builder.SetPortalComponentViewInitializer( + [](const winrt::Microsoft::ReactNative::Composition::PortalComponentView &portalComponentView) noexcept { + auto userData = winrt::make_self(); + userData->InitializePortalViewComponent(portalComponentView); + portalComponentView.UserData(*userData); + }); + }); } } // namespace winrt::Microsoft::ReactNative::Composition::implementation diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.h b/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.h index fbb3f10ec21..0f75d74d7a0 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentView.h @@ -3,69 +3,11 @@ #pragma once -#include -#include - -#include "Composition.WindowsModalHostComponentView.g.h" -#include "../CompositionViewComponentView.h" - -#include -#include +#include namespace winrt::Microsoft::ReactNative::Composition::implementation { -struct WindowsModalHostComponentView - : WindowsModalHostComponentViewT { - using Super = WindowsModalHostComponentViewT; - - ~WindowsModalHostComponentView(); - - [[nodiscard]] static winrt::Microsoft::ReactNative::ComponentView Create( - const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext, - facebook::react::Tag tag, - winrt::Microsoft::ReactNative::ReactContext const &reactContext) noexcept; - - winrt::Microsoft::ReactNative::Composition::Experimental::IVisual VisualToMountChildrenInto() noexcept override; - void MountChildComponentView( - const winrt::Microsoft::ReactNative::ComponentView &childComponentView, - uint32_t index) noexcept override; - void UnmountChildComponentView( - const winrt::Microsoft::ReactNative::ComponentView &childComponentView, - uint32_t index) noexcept override; - - void AdjustWindowSize() noexcept; - - void updateLayoutMetrics( - facebook::react::LayoutMetrics const &layoutMetrics, - facebook::react::LayoutMetrics const &oldLayoutMetrics) noexcept override; - - void updateProps(facebook::react::Props::Shared const &props, facebook::react::Props::Shared const &oldProps) noexcept - override; - static facebook::react::SharedViewProps defaultProps() noexcept; - const facebook::react::ModalHostViewProps &modalHostViewProps() const noexcept; - bool focusable() const noexcept override; - facebook::react::Tag hitTest(facebook::react::Point pt, facebook::react::Point &localPt, bool ignorePointerEvents) - const noexcept override; - virtual std::string DefaultControlType() const noexcept; - - WindowsModalHostComponentView( - const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext, - facebook::react::Tag tag, - winrt::Microsoft::ReactNative::ReactContext const &reactContext); - - // Used for creating new window - void ShowOnUIThread(); - void HideOnUIThread() noexcept; - void EnsureModalCreated(); - static void RegisterWndClass() noexcept; - - private: - HWND m_parentHwnd{nullptr}; - HWND m_hwnd{nullptr}; - uint64_t m_prevWindowID; - bool m_isVisible{false}; - bool m_showTitleBar{false}; - winrt::Microsoft::ReactNative::ReactNativeIsland m_reactNativeIsland; -}; +void RegisterWindowsModalHostNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder) noexcept; } // namespace winrt::Microsoft::ReactNative::Composition::implementation diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.cpp deleted file mode 100644 index 35d109c5629..00000000000 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.cpp +++ /dev/null @@ -1,18 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -// [Windows -#include "WindowsModalHostViewShadowNode.h" -// ] - -#include - -namespace facebook::react { - -extern const char WindowsModalHostViewComponentName[] = "ModalHostView"; - -} // namespace facebook::react \ No newline at end of file diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.h b/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.h deleted file mode 100644 index caa591fc0d9..00000000000 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.h +++ /dev/null @@ -1,39 +0,0 @@ -/* - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -#pragma once - -#include -// [Windows -#include -#include -// ] -#include - -namespace facebook::react { - -extern const char WindowsModalHostViewComponentName[]; - -/* - * `ShadowNode` for component. - */ -class WindowsModalHostViewShadowNode final : public ConcreteViewShadowNode< - WindowsModalHostViewComponentName, - ModalHostViewProps, - ModalHostViewEventEmitter, - ModalHostViewState> { - public: - using ConcreteViewShadowNode::ConcreteViewShadowNode; - - static ShadowNodeTraits BaseTraits() { - auto traits = ConcreteViewShadowNode::BaseTraits(); - traits.set(ShadowNodeTraits::Trait::RootNodeKind); - return traits; - } -}; - -} // namespace facebook::react diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/PortalComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/PortalComponentView.cpp new file mode 100644 index 00000000000..1726973ebe8 --- /dev/null +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/PortalComponentView.cpp @@ -0,0 +1,66 @@ + +// Copyright (c) Microsoft Corporation. +// Licensed under the MIT License. + +#pragma once + +#include "PortalComponentView.h" + +#include "Composition.PortalComponentView.g.cpp" + +namespace winrt::Microsoft::ReactNative::Composition::implementation { + +PortalComponentView::PortalComponentView( + const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext, + facebook::react::Tag tag, + winrt::Microsoft::ReactNative::ReactContext const &reactContext, + winrt::Microsoft::ReactNative::Composition::ReactCompositionViewComponentBuilder *builder) + : base_type(tag, reactContext, builder) { + m_rootComponentView = winrt::make_self( + compContext, *this, reactContext); +} + +PortalComponentView::~PortalComponentView() {} + +winrt::Microsoft::ReactNative::Composition::RootComponentView PortalComponentView::ContentRoot() const noexcept { + return *m_rootComponentView; +} + +void PortalComponentView::MountChildComponentView( + const winrt::Microsoft::ReactNative::ComponentView &childComponentView, + uint32_t index) noexcept { + m_rootComponentView->MountChildComponentView(childComponentView, index); +} + +void PortalComponentView::UnmountChildComponentView( + const winrt::Microsoft::ReactNative::ComponentView &childComponentView, + uint32_t index) noexcept { + m_rootComponentView->UnmountChildComponentView(childComponentView, index); +} + +const winrt::Microsoft::ReactNative::IComponentProps PortalComponentView::userProps( + facebook::react::Props::Shared const &props) noexcept { + const auto &abiViewProps = *std::static_pointer_cast(props); + return abiViewProps.UserProps(); +} + +void PortalComponentView::updateProps( + facebook::react::Props::Shared const &props, + facebook::react::Props::Shared const &oldProps) noexcept { + m_rootComponentView->updateProps(props, oldProps); + base_type::updateProps(props, oldProps); +} + +void PortalComponentView::updateLayoutMetrics( + facebook::react::LayoutMetrics const &layoutMetrics, + facebook::react::LayoutMetrics const &oldLayoutMetrics) noexcept { + m_rootComponentView->updateLayoutMetrics(layoutMetrics, oldLayoutMetrics); + base_type::updateLayoutMetrics(layoutMetrics, oldLayoutMetrics); +} + +void PortalComponentView::FinalizeUpdates(winrt::Microsoft::ReactNative::ComponentViewUpdateMask updateMask) noexcept { + m_rootComponentView->FinalizeUpdates(updateMask); + base_type::FinalizeUpdates(updateMask); +} + +} // namespace winrt::Microsoft::ReactNative::Composition::implementation diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/PortalComponentView.h b/vnext/Microsoft.ReactNative/Fabric/Composition/PortalComponentView.h new file mode 100644 index 00000000000..29089ba6744 --- /dev/null +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/PortalComponentView.h @@ -0,0 +1,52 @@ + +// Copyright (c) Microsoft Corporation. +// Licensed under the MIT License. + +#pragma once + +#include +#include +#include "RootComponentView.h" + +#include "Composition.PortalComponentView.g.h" + +namespace Microsoft::ReactNative { +struct CompContext; +} // namespace Microsoft::ReactNative + +namespace winrt::Microsoft::ReactNative::Composition::implementation { + +struct PortalComponentView + : public PortalComponentViewT { + PortalComponentView( + const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext, + facebook::react::Tag tag, + winrt::Microsoft::ReactNative::ReactContext const &reactContext, + winrt::Microsoft::ReactNative::Composition::ReactCompositionViewComponentBuilder *builder); + virtual ~PortalComponentView(); + + winrt::Microsoft::ReactNative::Composition::RootComponentView ContentRoot() const noexcept; + + void MountChildComponentView( + const winrt::Microsoft::ReactNative::ComponentView &childComponentView, + uint32_t index) noexcept override; + void UnmountChildComponentView( + const winrt::Microsoft::ReactNative::ComponentView &childComponentView, + uint32_t index) noexcept override; + + const winrt::Microsoft::ReactNative::IComponentProps userProps( + facebook::react::Props::Shared const &props) noexcept override; + void updateProps(facebook::react::Props::Shared const &props, facebook::react::Props::Shared const &oldProps) noexcept + override; + + void updateLayoutMetrics( + facebook::react::LayoutMetrics const &layoutMetrics, + facebook::react::LayoutMetrics const &oldLayoutMetrics) noexcept override; + + void FinalizeUpdates(winrt::Microsoft::ReactNative::ComponentViewUpdateMask updateMask) noexcept override; + + private: + winrt::com_ptr m_rootComponentView; +}; + +} // namespace winrt::Microsoft::ReactNative::Composition::implementation diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/ReactCompositionViewComponentBuilder.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/ReactCompositionViewComponentBuilder.cpp index b19c3bd9b56..f7c96535343 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/ReactCompositionViewComponentBuilder.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/ReactCompositionViewComponentBuilder.cpp @@ -5,6 +5,7 @@ #include "ReactCompositionViewComponentBuilder.h" #include #include +#include #include #include "CompositionContextHelper.h" #include "DynamicWriter.h" @@ -111,6 +112,26 @@ void ReactCompositionViewComponentBuilder::SetContentIslandComponentViewInitiali }; } +void ReactCompositionViewComponentBuilder::SetPortalComponentViewInitializer( + const PortalComponentViewInitializer &initializer) noexcept { + m_fnCreateView = [initializer]( + const IReactContext &reactContext, + int32_t tag, + const Experimental::ICompositionContext &context, + ComponentViewFeatures /*features*/, + ReactCompositionViewComponentBuilder &builder) + -> winrt::Microsoft::ReactNative::Composition::PortalComponentView { + auto view = winrt::make( + context, tag, reactContext, &builder); + initializer(view); + return view; + }; + m_descriptorConstructorFactory = []() { + return &facebook::react::concreteComponentDescriptorConstructor< + ::Microsoft::ReactNative::AbiViewComponentDescriptor>; + }; +} + // (Object handle, Microsoft.ReactNative.IComponentState state) => void // void ReactCompositionViewComponentBuilder::SetStateUpdater(StateUpdater impl) noexcept { // m_stateUpdater = impl; diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/ReactCompositionViewComponentBuilder.h b/vnext/Microsoft.ReactNative/Fabric/Composition/ReactCompositionViewComponentBuilder.h index 618aae06e5d..852d08a8cd8 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/ReactCompositionViewComponentBuilder.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/ReactCompositionViewComponentBuilder.h @@ -12,10 +12,12 @@ namespace winrt::Microsoft::ReactNative::Composition { -struct ReactCompositionViewComponentBuilder : winrt::implements< - ReactCompositionViewComponentBuilder, - IReactViewComponentBuilder, - Composition::IReactCompositionViewComponentBuilder> { +struct ReactCompositionViewComponentBuilder + : winrt::implements< + ReactCompositionViewComponentBuilder, + IReactViewComponentBuilder, + Composition::IReactCompositionViewComponentBuilder, + Composition::Experimental::IReactCompositionViewComponentInternalBuilder> { ReactCompositionViewComponentBuilder() noexcept; public: // IReactViewComponentBuilder @@ -42,6 +44,7 @@ struct ReactCompositionViewComponentBuilder : winrt::implements< public: // Composition::IReactCompositionViewComponentBuilder void SetViewComponentViewInitializer(const ViewComponentViewInitializer &initializer) noexcept; void SetContentIslandComponentViewInitializer(const ComponentIslandComponentViewInitializer &initializer) noexcept; + void SetPortalComponentViewInitializer(const PortalComponentViewInitializer &initializer) noexcept; void SetCreateVisualHandler(CreateVisualDelegate impl) noexcept; void SetViewFeatures(ComponentViewFeatures viewFeatures) noexcept; void SetVisualToMountChildrenIntoHandler(VisualToMountChildrenIntoDelegate impl) noexcept; diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.cpp index 6bb4c8fe33d..594652018cb 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.cpp @@ -127,21 +127,39 @@ ReactNativeIsland::ReactNativeIsland(const winrt::Microsoft::UI::Composition::Co InitTextScaleMultiplier(); } -// Constructor to initialize ReactNativeIsland with context and componentView ReactNativeIsland::ReactNativeIsland( - const winrt::Microsoft::UI::Composition::Compositor &compositor, - winrt::Microsoft::ReactNative::IReactContext context, - winrt::Microsoft::ReactNative::ComponentView componentView) noexcept - : m_compositor(compositor), - m_context(context), + const winrt::Microsoft::ReactNative::Composition::PortalComponentView &portal) noexcept + : m_compositor(portal.ContentRoot().Compositor()), + m_context(portal.ReactContext()), m_layoutConstraints({{0, 0}, {0, 0}, winrt::Microsoft::ReactNative::LayoutDirection::Undefined}), m_isFragment(true) { - m_rootTag = componentView.Tag(); + m_portal = winrt::make_weak(portal); + + auto trueRoot = + winrt::get_self(portal) + ->rootComponentView(); + while (auto p = trueRoot->Portal()) { + trueRoot = winrt::get_self(p) + ->rootComponentView(); + }; + m_rootTag = trueRoot->Tag(); + InitTextScaleMultiplier(); - AddFragmentCompositionEventHandler(context, componentView); + AddFragmentCompositionEventHandler(m_context.Handle(), portal.ContentRoot()); + auto selfPortal = winrt::get_self( + portal.ContentRoot()); + selfPortal->ReactNativeIsland(*this); + NotifySizeChanged(); + selfPortal->start(*this); +} + +winrt::Microsoft::ReactNative::ReactNativeIsland ReactNativeIsland::CreatePortal( + const winrt::Microsoft::ReactNative::Composition::PortalComponentView &portal) noexcept { + return winrt::make(portal); } -ReactNativeIsland::ReactNativeIsland() noexcept : ReactNativeIsland(nullptr) {} +ReactNativeIsland::ReactNativeIsland() noexcept + : ReactNativeIsland(winrt::Microsoft::UI::Composition::Compositor{nullptr}) {} ReactNativeIsland::~ReactNativeIsland() noexcept { #ifdef USE_WINUI3 @@ -159,14 +177,20 @@ ReactNativeIsland::~ReactNativeIsland() noexcept { assert(m_uiDispatcher.HasThreadAccess()); UninitRootView(); } + + if (m_island) { + m_island.Close(); + } } ReactNative::IReactViewHost ReactNativeIsland::ReactViewHost() noexcept { return m_reactViewHost; } -void ReactNativeIsland::ReactViewHost(winrt::Microsoft::ReactNative::IReactViewHost const &value) noexcept { - assert(!m_isFragment); // make sure this isn't a FragmentIsalnd +void ReactNativeIsland::ReactViewHost(winrt::Microsoft::ReactNative::IReactViewHost const &value) { + if (m_isFragment) + winrt::throw_hresult(E_ACCESSDENIED); + if (m_reactViewHost == value) { return; } @@ -217,6 +241,8 @@ void ReactNativeIsland::AddRenderedVisual( void ReactNativeIsland::RemoveRenderedVisual( const winrt::Microsoft::ReactNative::Composition::Experimental::IVisual &visual) noexcept { + if (m_isFragment) + return; assert(m_hasRenderedVisual); InternalRootVisual().Remove(visual); m_hasRenderedVisual = false; @@ -442,7 +468,7 @@ void ReactNativeIsland::InitRootView( m_context = winrt::Microsoft::ReactNative::ReactContext(std::move(context)); m_reactViewOptions = std::move(viewOptions); - m_CompositionEventHandler = std::make_shared<::Microsoft::ReactNative::CompositionEventHandler>(m_context, *this, -1); + m_CompositionEventHandler = std::make_shared<::Microsoft::ReactNative::CompositionEventHandler>(m_context, *this); m_CompositionEventHandler->Initialize(); UpdateRootViewInternal(); @@ -457,15 +483,13 @@ void ReactNativeIsland::AddFragmentCompositionEventHandler( .Get(winrt::Microsoft::ReactNative::ReactDispatcherHelper::UIDispatcherProperty()) .try_as(); VerifyElseCrash(m_uiDispatcher.HasThreadAccess()); - VerifyElseCrash(m_rootTag != -1); auto uiManager = ::Microsoft::ReactNative::FabricUIManager::FromProperties( winrt::Microsoft::ReactNative::ReactPropertyBag(context.Properties())); if (!m_CompositionEventHandler) { // Create CompositionEventHandler if not already created m_context = winrt::Microsoft::ReactNative::ReactContext(context); - m_CompositionEventHandler = - std::make_shared<::Microsoft::ReactNative::CompositionEventHandler>(m_context, *this, componentView.Tag()); + m_CompositionEventHandler = std::make_shared<::Microsoft::ReactNative::CompositionEventHandler>(m_context, *this); m_CompositionEventHandler->Initialize(); m_isInitialized = true; } @@ -538,6 +562,7 @@ void ReactNativeIsland::ClearLoadingUI() noexcept { void ReactNativeIsland::EnsureLoadingUI() noexcept {} void ReactNativeIsland::ShowInstanceLoaded() noexcept { + VerifyElseCrash(!m_isFragment); if (m_rootVisual) { ClearLoadingUI(); @@ -733,6 +758,9 @@ void ReactNativeIsland::InitTextScaleMultiplier() noexcept { winrt::Windows::Foundation::Size ReactNativeIsland::Measure( const winrt::Microsoft::ReactNative::LayoutConstraints &layoutConstraints, const winrt::Windows::Foundation::Point &viewportOffset) const { + if (m_isFragment) + winrt::throw_hresult(E_ILLEGAL_METHOD_CALL); + facebook::react::Size size{0, 0}; if (layoutConstraints.LayoutDirection != winrt::Microsoft::ReactNative::LayoutDirection::LeftToRight && @@ -774,7 +802,7 @@ void ReactNativeIsland::Arrange( facebook::react::LayoutConstraints fbLayoutConstraints; ApplyConstraints(layoutConstraints, fbLayoutConstraints); - if (m_isInitialized && m_rootTag != -1) { + if (m_isInitialized && m_rootTag != -1 && !m_isFragment) { if (auto fabricuiManager = ::Microsoft::ReactNative::FabricUIManager::FromProperties( winrt::Microsoft::ReactNative::ReactPropertyBag(m_context.Properties()))) { facebook::react::LayoutContext context; @@ -813,6 +841,23 @@ winrt::Microsoft::UI::Content::ContentIsland ReactNativeIsland::Island() { rootVisual)); m_island = winrt::Microsoft::UI::Content::ContentIsland::Create(rootVisual); + auto focusController = winrt::Microsoft::UI::Input::InputFocusController::GetForIsland(m_island); + focusController.NavigateFocusRequested( + [weakThis = get_weak()]( + const auto &sender, const winrt::Microsoft::UI::Input::FocusNavigationRequestEventArgs &args) { + if (auto pThis = weakThis.get()) { + if (auto rootView = pThis->GetComponentView()) { + args.Result( + rootView->NavigateFocus(winrt::Microsoft::ReactNative::FocusNavigationRequest( + winrt::Microsoft::ReactNative::FocusNavigationReason::First)) + ? winrt::Microsoft::UI::Input::FocusNavigationResult::Moved + : winrt::Microsoft::UI::Input::FocusNavigationResult::NotMoved); + } else { + args.Result(winrt::Microsoft::UI::Input::FocusNavigationResult::NoFocusableElements); + } + } + }); + // ContentIsland does not support weak_ref, so we cannot use auto_revoke for these events m_islandAutomationProviderRequestedToken = m_island.AutomationProviderRequested( [weakThis = get_weak()]( @@ -896,13 +941,29 @@ void ReactNativeIsland::OnUnmounted() noexcept { if (!m_mounted) return; m_mounted = false; + + if (m_island && m_island.IsConnected()) { + auto focusController = winrt::Microsoft::UI::Input::InputFocusController::GetForIsland(m_island); + auto request = winrt::Microsoft::UI::Input::FocusNavigationRequest::Create( + winrt::Microsoft::UI::Input::FocusNavigationReason::Programmatic); + if (focusController.HasFocus()) { + focusController.DepartFocus(request); + } + } + if (auto componentView = GetComponentView()) { componentView->onUnmounted(); } } -winrt::Microsoft::ReactNative::Composition::implementation::RootComponentView * +winrt::com_ptr ReactNativeIsland::GetComponentView() noexcept { + if (auto portal = m_portal.get()) { + return winrt::get_self(portal) + ->ContentRoot() + .as(); + } + if (!m_context || m_context.Handle().LoadingState() != winrt::Microsoft::ReactNative::LoadingState::Loaded || m_rootTag == -1) return nullptr; @@ -912,8 +973,7 @@ ReactNativeIsland::GetComponentView() noexcept { auto rootComponentViewDescriptor = fabricuiManager->GetViewRegistry().componentViewDescriptorWithTag( static_cast(m_rootTag)); return rootComponentViewDescriptor.view - .as() - .get(); + .as(); } return nullptr; } diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.h b/vnext/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.h index c51aa7bd610..8d8ed359be8 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/ReactNativeIsland.h @@ -12,6 +12,7 @@ #include #include #include "CompositionEventHandler.h" +#include "PortalComponentView.h" #include "ReactHost/React.h" namespace winrt::Microsoft::ReactNative::implementation { @@ -48,15 +49,15 @@ struct ReactNativeIsland ~ReactNativeIsland() noexcept; ReactNativeIsland(const winrt::Microsoft::UI::Composition::Compositor &compositor) noexcept; - ReactNativeIsland( - const winrt::Microsoft::UI::Composition::Compositor &compositor, - winrt::Microsoft::ReactNative::IReactContext context, - winrt::Microsoft::ReactNative::ComponentView componentView) noexcept; + ReactNativeIsland(const winrt::Microsoft::ReactNative::Composition::PortalComponentView &portal) noexcept; + + static winrt::Microsoft::ReactNative::ReactNativeIsland CreatePortal( + const winrt::Microsoft::ReactNative::Composition::PortalComponentView &portal) noexcept; winrt::Microsoft::UI::Content::ContentIsland Island(); // property ReactViewHost ReactNative::IReactViewHost ReactViewHost() noexcept; - void ReactViewHost(ReactNative::IReactViewHost const &value) noexcept; + void ReactViewHost(ReactNative::IReactViewHost const &value); winrt::Microsoft::UI::Composition::Visual RootVisual() noexcept; @@ -104,7 +105,8 @@ struct ReactNativeIsland winrt::Microsoft::ReactNative::FocusNavigationResult NavigateFocus( const winrt::Microsoft::ReactNative::FocusNavigationRequest &request) noexcept; - winrt::Microsoft::ReactNative::Composition::implementation::RootComponentView *GetComponentView() noexcept; + winrt::com_ptr + GetComponentView() noexcept; int64_t RootTag() const noexcept; @@ -153,8 +155,12 @@ struct ReactNativeIsland bool m_hasRenderedVisual{false}; bool m_showingLoadingUI{false}; bool m_mounted{false}; + winrt::weak_ref m_portal{nullptr}; IReactDispatcher m_uiDispatcher{nullptr}; winrt::IInspectable m_uiaProvider{nullptr}; + + // This is the surfaceId that this island belongs to. + // In the case of portal content root, this will be the surfaceId that contains the portal. int64_t m_rootTag{-1}; float m_scaleFactor{1.0}; float m_textScaleMultiplier{1.0}; diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/RootComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/RootComponentView.cpp index 45d4a49dc1f..8cb42b9226e 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/RootComponentView.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/RootComponentView.cpp @@ -17,7 +17,8 @@ namespace winrt::Microsoft::ReactNative::Composition::implementation { RootComponentView::RootComponentView( const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext, facebook::react::Tag tag, - winrt::Microsoft::ReactNative::ReactContext const &reactContext) + winrt::Microsoft::ReactNative::ReactContext const &reactContext, + ReactCompositionViewComponentBuilder *builder) : base_type( {}, // default viewProps compContext, @@ -25,20 +26,34 @@ RootComponentView::RootComponentView( reactContext, ComponentViewFeatures::Default & ~(ComponentViewFeatures::Background | ComponentViewFeatures::ShadowProps | - ComponentViewFeatures::NativeBorder | ComponentViewFeatures::FocusVisual)) {} + ComponentViewFeatures::NativeBorder | ComponentViewFeatures::FocusVisual), + builder) {} + +RootComponentView::RootComponentView( + const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext, + const winrt::Microsoft::ReactNative::Composition::PortalComponentView &portal, + winrt::Microsoft::ReactNative::ReactContext const &reactContext) + : base_type( + {}, // default viewProps + compContext, + -1, + reactContext, + ComponentViewFeatures::Default & + ~(ComponentViewFeatures::Background | ComponentViewFeatures::ShadowProps | + ComponentViewFeatures::NativeBorder | ComponentViewFeatures::FocusVisual), + nullptr // builder, + ), + m_wkPortal(portal) {} RootComponentView::~RootComponentView() { - if (auto rootView = m_wkRootView.get()) { - winrt::get_self(rootView)->RemoveRenderedVisual( - OuterVisual()); - } + stop(); } winrt::Microsoft::ReactNative::ComponentView RootComponentView::Create( const winrt::Microsoft::ReactNative::Composition::Experimental::ICompositionContext &compContext, facebook::react::Tag tag, winrt::Microsoft::ReactNative::ReactContext const &reactContext) noexcept { - return winrt::make(compContext, tag, reactContext); + return winrt::make(compContext, tag, reactContext, nullptr); } RootComponentView *RootComponentView::rootComponentView() const noexcept { @@ -84,13 +99,13 @@ void RootComponentView::SetFocusedComponent(const winrt::Microsoft::ReactNative: bool RootComponentView::NavigateFocus(const winrt::Microsoft::ReactNative::FocusNavigationRequest &request) noexcept { if (request.Reason() == winrt::Microsoft::ReactNative::FocusNavigationReason::Restore) { - // No-op for now - return m_focusedComponent != nullptr; + if (m_focusedComponent) + return true; } - auto view = (request.Reason() == winrt::Microsoft::ReactNative::FocusNavigationReason::First) - ? FocusManager::FindFirstFocusableElement(*this) - : FocusManager::FindLastFocusableElement(*this); + auto view = (request.Reason() == winrt::Microsoft::ReactNative::FocusNavigationReason::Last) + ? FocusManager::FindLastFocusableElement(*this) + : FocusManager::FindFirstFocusableElement(*this); if (view) { TrySetFocusedComponent( view, @@ -116,8 +131,10 @@ bool RootComponentView::TrySetFocusedComponent( selfView = winrt::get_self(target); } - if (selfView && selfView->rootComponentView() != this) + if (selfView && selfView->rootComponentView() != this) { + assert(false); return false; + } auto losingFocusArgs = winrt::make( target, direction, m_focusedComponent, target); @@ -197,7 +214,7 @@ HRESULT RootComponentView::GetFragmentRoot(IRawElementProviderFragmentRoot **pRe if (uiManager == nullptr) return UIA_E_ELEMENTNOTAVAILABLE; - auto rootView{uiManager->GetReactNativeIsland(Tag())}; + auto rootView = m_wkRootView.get(); if (!rootView) { return UIA_E_ELEMENTNOTAVAILABLE; } @@ -214,10 +231,43 @@ uint32_t RootComponentView::overlayIndex() noexcept { return 1; } -void RootComponentView::start(const winrt::Microsoft::ReactNative::ReactNativeIsland &rootView) noexcept { - winrt::get_self(rootView)->AddRenderedVisual( +void RootComponentView::start(const winrt::Microsoft::ReactNative::ReactNativeIsland &island) noexcept { + theme(winrt::get_self(island.Theme())); + + winrt::get_self(island)->AddRenderedVisual( OuterVisual()); - m_wkRootView = rootView; + m_visualAddedToIsland = true; + ReactNativeIsland(island); +} + +void RootComponentView::stop() noexcept { + SetFocusedComponent(nullptr); + if (m_visualAddedToIsland) { + if (auto rootView = m_wkRootView.get()) { + winrt::get_self(rootView)->RemoveRenderedVisual( + OuterVisual()); + } + m_visualAddedToIsland = false; + } + // Disconnect from the Island. In case of an instance reload, the island may now + // be attached to a new RootComponentView, so we should stop interacting with it. + ReactNativeIsland(nullptr); +} + +void RootComponentView::ReactNativeIsland(const winrt::Microsoft::ReactNative::ReactNativeIsland &island) noexcept { + m_wkRootView = island; +} + +winrt::Microsoft::ReactNative::ReactNativeIsland RootComponentView::ReactNativeIsland() noexcept { + return m_wkRootView.get(); +} + +winrt::Microsoft::ReactNative::Composition::PortalComponentView RootComponentView::Portal() const noexcept { + return m_wkPortal.get(); +} + +facebook::react::Point RootComponentView::getClientOffset() const noexcept { + return {}; } winrt::IInspectable RootComponentView::UiaProviderFromPoint(const POINT &ptPixels) noexcept { @@ -226,6 +276,10 @@ winrt::IInspectable RootComponentView::UiaProviderFromPoint(const POINT &ptPixel static_cast(ptPixels.y) / m_layoutMetrics.pointScaleFactor}; facebook::react::Point localPt; + + // In the case of a sub rootview, we may have a non-zero origin. hitTest takes a pt in the parent coords, so we need + // to apply the current origin + ptDips += m_layoutMetrics.frame.origin; auto tag = hitTest(ptDips, localPt, true); auto uiManager = ::Microsoft::ReactNative::FabricUIManager::FromProperties(m_reactContext.Properties()); diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/RootComponentView.h b/vnext/Microsoft.ReactNative/Fabric/Composition/RootComponentView.h index 3043faec6ec..7790d171693 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/RootComponentView.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/RootComponentView.h @@ -46,6 +46,12 @@ struct RootComponentView : RootComponentViewT m_wkRootView{nullptr}; + winrt::weak_ref m_wkPortal{nullptr}; + bool m_visualAddedToIsland{false}; }; } // namespace winrt::Microsoft::ReactNative::Composition::implementation diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp index 3e03460ad23..4739ca7ff5a 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/UiaHelpers.cpp @@ -42,44 +42,59 @@ HRESULT UiaNavigateHelper( } } break; - case NavigateDirection_LastChild: - __fallthrough; - + case NavigateDirection_LastChild: { + auto children = view.Children(); + if (children.Size() != 0) { + uint32_t index = children.Size() - 1; + do { + auto child = children.GetAt(index).as(); + if (uiaProvider = child->EnsureUiaProvider()) { + break; + } + } while (index-- != 0); + } + } break; case NavigateDirection_FirstChild: { auto children = view.Children(); - auto index = direction == NavigateDirection_FirstChild ? 0 : children.Size() - 1; - if (!children.Size() == 0) { - uiaProvider = children.GetAt(index) - .as() - ->EnsureUiaProvider(); + if (children.Size() != 0) { + uint32_t index = 0; + do { + auto child = children.GetAt(index).as(); + if (uiaProvider = child->EnsureUiaProvider()) { + break; + } + } while (++index != children.Size()); } } break; - case NavigateDirection_NextSibling: { - auto parentCV = view.Parent().as(); + auto parentCV = view.Parent().as(); if (parentCV != nullptr) { auto children = parentCV->Children(); auto it = std::find(children.begin(), children.end(), view); - if (++it != children.end()) { - uiaProvider = (*it) - .as() - ->EnsureUiaProvider(); + + while (++it != children.end()) { + auto nextchild = (*it).as(); + if (uiaProvider = nextchild->EnsureUiaProvider()) { + break; + } } } } break; case NavigateDirection_PreviousSibling: { - auto parentCV = view.Parent().as(); + auto parentCV = view.Parent().as(); if (parentCV != nullptr) { auto children = parentCV->Children(); - for (auto i = children.Size() - 1; i > 0; i--) { - auto child = children.GetAt(i); - if (child == view) { - uiaProvider = children.GetAt(i - 1) - .as() - ->EnsureUiaProvider(); - break; - } + auto it = std::find(children.begin(), children.end(), view); + + if (it != children.begin()) { + do { + it--; + auto prevchild = (*it).as(); + if (uiaProvider = prevchild->EnsureUiaProvider()) { + break; + } + } while (it != children.begin()); } } } break; diff --git a/vnext/Microsoft.ReactNative/Fabric/FabricUIManagerModule.cpp b/vnext/Microsoft.ReactNative/Fabric/FabricUIManagerModule.cpp index a41789fda41..5f0eed847a6 100644 --- a/vnext/Microsoft.ReactNative/Fabric/FabricUIManagerModule.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/FabricUIManagerModule.cpp @@ -157,7 +157,6 @@ void FabricUIManager::startSurface( auto root = rootComponentViewDescriptor.view .as(); - root->theme(winrt::get_self(rootView.Theme())); root->start(rootView); }); @@ -177,15 +176,11 @@ void FabricUIManager::startSurface( void FabricUIManager::stopSurface(facebook::react::SurfaceId surfaceId) noexcept { m_surfaceManager->stopSurface(surfaceId); auto &rootDescriptor = m_registry.componentViewDescriptorWithTag(surfaceId); + rootDescriptor.view.as()->stop(); m_registry.enqueueComponentViewWithComponentHandle( facebook::react::RootShadowNode::Handle(), surfaceId, rootDescriptor); } -winrt::Microsoft::ReactNative::ReactNativeIsland FabricUIManager::GetReactNativeIsland( - facebook::react::SurfaceId surfaceId) const noexcept { - return m_surfaceRegistry.at(surfaceId).wkRootView.get(); -} - facebook::react::Size FabricUIManager::measureSurface( facebook::react::SurfaceId surfaceId, const facebook::react::LayoutConstraints &layoutConstraints, diff --git a/vnext/Microsoft.ReactNative/Fabric/FabricUIManagerModule.h b/vnext/Microsoft.ReactNative/Fabric/FabricUIManagerModule.h index 165eac99bd5..d89ee1b6b24 100644 --- a/vnext/Microsoft.ReactNative/Fabric/FabricUIManagerModule.h +++ b/vnext/Microsoft.ReactNative/Fabric/FabricUIManagerModule.h @@ -49,9 +49,6 @@ struct FabricUIManager final : public std::enable_shared_from_this NotifyMountedId() noexcept; private: diff --git a/vnext/Microsoft.ReactNative/Fabric/WindowsComponentDescriptorRegistry.cpp b/vnext/Microsoft.ReactNative/Fabric/WindowsComponentDescriptorRegistry.cpp index c7947ac85d6..b3c0fc9815e 100644 --- a/vnext/Microsoft.ReactNative/Fabric/WindowsComponentDescriptorRegistry.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/WindowsComponentDescriptorRegistry.cpp @@ -6,7 +6,6 @@ #include #include -#include #include #include #include @@ -37,7 +36,6 @@ WindowsComponentDescriptorRegistry::WindowsComponentDescriptorRegistry() facebook::react::ActivityIndicatorViewComponentDescriptor>()); add(facebook::react::concreteComponentDescriptorProvider()); add(facebook::react::concreteComponentDescriptorProvider()); - add(facebook::react::concreteComponentDescriptorProvider()); add(facebook::react::concreteComponentDescriptorProvider()); add(facebook::react::concreteComponentDescriptorProvider()); add(facebook::react::concreteComponentDescriptorProvider()); diff --git a/vnext/Microsoft.ReactNative/IReactCompositionViewComponentBuilder.idl b/vnext/Microsoft.ReactNative/IReactCompositionViewComponentBuilder.idl index 2edf2b822aa..788b982e463 100644 --- a/vnext/Microsoft.ReactNative/IReactCompositionViewComponentBuilder.idl +++ b/vnext/Microsoft.ReactNative/IReactCompositionViewComponentBuilder.idl @@ -21,6 +21,10 @@ namespace Microsoft.ReactNative.Composition [experimental] delegate void ComponentIslandComponentViewInitializer(ContentIslandComponentView view); + [webhosthidden] + [experimental] + delegate void PortalComponentViewInitializer(PortalComponentView view); + [experimental] [webhosthidden] delegate Microsoft.UI.Composition.Visual CreateVisualDelegate(Microsoft.ReactNative.ComponentView view); @@ -55,6 +59,7 @@ namespace Microsoft.ReactNative.Composition { void SetViewComponentViewInitializer(ViewComponentViewInitializer initializer); void SetContentIslandComponentViewInitializer(ComponentIslandComponentViewInitializer initializer); + void SetPortalComponentViewInitializer(PortalComponentViewInitializer initializer); void SetCreateVisualHandler(CreateVisualDelegate impl); void SetViewFeatures(ComponentViewFeatures viewFeatures); void SetUpdateLayoutMetricsHandler(UpdateLayoutMetricsDelegate impl); diff --git a/vnext/Microsoft.ReactNative/ReactNativeHost.cpp b/vnext/Microsoft.ReactNative/ReactNativeHost.cpp index 781bbd9d657..4b41880ffca 100644 --- a/vnext/Microsoft.ReactNative/ReactNativeHost.cpp +++ b/vnext/Microsoft.ReactNative/ReactNativeHost.cpp @@ -15,6 +15,7 @@ #include "ReactInstanceSettings.h" #ifdef USE_FABRIC +#include #include #include #include @@ -115,6 +116,10 @@ IAsyncAction ReactNativeHost::ReloadInstance() noexcept { #endif m_instanceSettings.UseWebDebugger()); +#ifdef USE_FABRIC + winrt::Microsoft::ReactNative::Composition::implementation::RegisterWindowsModalHostNativeComponent(m_packageBuilder); +#endif + if (auto packageProviders = InstanceSettings().PackageProviders()) { for (auto const &packageProvider : packageProviders) { packageProvider.CreatePackage(m_packageBuilder); diff --git a/vnext/Microsoft.ReactNative/ReactNativeIsland.idl b/vnext/Microsoft.ReactNative/ReactNativeIsland.idl index 453bbb25107..67d1937c34a 100644 --- a/vnext/Microsoft.ReactNative/ReactNativeIsland.idl +++ b/vnext/Microsoft.ReactNative/ReactNativeIsland.idl @@ -6,6 +6,8 @@ import "ReactCoreInjection.idl"; import "ReactNativeHost.idl"; import "Theme.idl"; import "IReactViewComponentBuilder.idl"; +import "CompositionComponentView.idl"; + #include "NamespaceRedirect.h" #include "DocString.h" @@ -83,7 +85,9 @@ namespace Microsoft.ReactNative #ifdef USE_WINUI3 ReactNativeIsland(Microsoft.UI.Composition.Compositor compositor); - ReactNativeIsland(Microsoft.UI.Composition.Compositor compositor, Microsoft.ReactNative.IReactContext context, Microsoft.ReactNative.ComponentView componentView); + + DOC_STRING("Used to create react portals, such as a native modal component.") + static ReactNativeIsland CreatePortal(Microsoft.ReactNative.Composition.PortalComponentView portal); #endif DOC_STRING( diff --git a/vnext/Shared/Shared.vcxitems b/vnext/Shared/Shared.vcxitems index 5e0edcf774b..aceb8f994e9 100644 --- a/vnext/Shared/Shared.vcxitems +++ b/vnext/Shared/Shared.vcxitems @@ -108,10 +108,10 @@ true - + true - + true @@ -314,6 +314,7 @@ + diff --git a/vnext/Shared/Shared.vcxitems.filters b/vnext/Shared/Shared.vcxitems.filters index 1a6676626ff..870ccbd2f87 100644 --- a/vnext/Shared/Shared.vcxitems.filters +++ b/vnext/Shared/Shared.vcxitems.filters @@ -179,9 +179,6 @@ Source Files\Fabric\Composition - - Source Files\Fabric\Composition - Source Files\Fabric\Composition @@ -239,6 +236,7 @@ Source Files\Fabric\platform\react\renderer\textlayoutmanager + @@ -776,6 +774,7 @@ Header Files\Fabric\platform\react\renderer\textlayoutmanager + diff --git a/vnext/codegen/react/components/rnwcore/ActivityIndicatorView.g.h b/vnext/codegen/react/components/rnwcore/ActivityIndicatorView.g.h new file mode 100644 index 00000000000..20bded81dc3 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/ActivityIndicatorView.g.h @@ -0,0 +1,212 @@ + +/* + * This file is auto-generated from ActivityIndicatorViewNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(ActivityIndicatorViewProps) +struct ActivityIndicatorViewProps : winrt::implements { + ActivityIndicatorViewProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + hidesWhenStopped = cloneFromProps->hidesWhenStopped; + animating = cloneFromProps->animating; + color = cloneFromProps->color; + size = cloneFromProps->size; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(hidesWhenStopped) + bool hidesWhenStopped{true}; + + REACT_FIELD(animating) + bool animating{true}; + + REACT_FIELD(color) + winrt::Microsoft::ReactNative::Color color{nullptr}; + + REACT_FIELD(size) + std::optional size; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +struct ActivityIndicatorViewEventEmitter { + ActivityIndicatorViewEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseActivityIndicatorView { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterActivityIndicatorViewNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"ActivityIndicatorView", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseActivityIndicatorView::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseActivityIndicatorView::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + if constexpr (&TUserData::MountChildComponentView != &BaseActivityIndicatorView::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseActivityIndicatorView::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseActivityIndicatorView::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseActivityIndicatorView::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidDrawerLayout.g.h b/vnext/codegen/react/components/rnwcore/AndroidDrawerLayout.g.h new file mode 100644 index 00000000000..5b57b09eb35 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/AndroidDrawerLayout.g.h @@ -0,0 +1,295 @@ + +/* + * This file is auto-generated from AndroidDrawerLayoutNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(AndroidDrawerLayoutProps) +struct AndroidDrawerLayoutProps : winrt::implements { + AndroidDrawerLayoutProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + keyboardDismissMode = cloneFromProps->keyboardDismissMode; + drawerBackgroundColor = cloneFromProps->drawerBackgroundColor; + drawerPosition = cloneFromProps->drawerPosition; + drawerWidth = cloneFromProps->drawerWidth; + drawerLockMode = cloneFromProps->drawerLockMode; + statusBarBackgroundColor = cloneFromProps->statusBarBackgroundColor; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(keyboardDismissMode) + std::optional keyboardDismissMode; + + REACT_FIELD(drawerBackgroundColor) + winrt::Microsoft::ReactNative::Color drawerBackgroundColor{nullptr}; + + REACT_FIELD(drawerPosition) + std::optional drawerPosition; + + REACT_FIELD(drawerWidth) + std::optional drawerWidth{}; + + REACT_FIELD(drawerLockMode) + std::optional drawerLockMode; + + REACT_FIELD(statusBarBackgroundColor) + winrt::Microsoft::ReactNative::Color statusBarBackgroundColor{nullptr}; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +REACT_STRUCT(AndroidDrawerLayout_OnDrawerSlide) +struct AndroidDrawerLayout_OnDrawerSlide { + REACT_FIELD(offset) + float offset{}; +}; + +REACT_STRUCT(AndroidDrawerLayout_OnDrawerStateChanged) +struct AndroidDrawerLayout_OnDrawerStateChanged { + REACT_FIELD(drawerState) + int32_t drawerState{}; +}; + +REACT_STRUCT(AndroidDrawerLayout_OnDrawerOpen) +struct AndroidDrawerLayout_OnDrawerOpen { +}; + +REACT_STRUCT(AndroidDrawerLayout_OnDrawerClose) +struct AndroidDrawerLayout_OnDrawerClose { +}; + +struct AndroidDrawerLayoutEventEmitter { + AndroidDrawerLayoutEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + using OnDrawerSlide = AndroidDrawerLayout_OnDrawerSlide; + using OnDrawerStateChanged = AndroidDrawerLayout_OnDrawerStateChanged; + using OnDrawerOpen = AndroidDrawerLayout_OnDrawerOpen; + using OnDrawerClose = AndroidDrawerLayout_OnDrawerClose; + + void onDrawerSlide(OnDrawerSlide &value) const { + m_eventEmitter.DispatchEvent(L"drawerSlide", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + void onDrawerStateChanged(OnDrawerStateChanged &value) const { + m_eventEmitter.DispatchEvent(L"drawerStateChanged", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + void onDrawerOpen(OnDrawerOpen &value) const { + m_eventEmitter.DispatchEvent(L"drawerOpen", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + void onDrawerClose(OnDrawerClose &value) const { + m_eventEmitter.DispatchEvent(L"drawerClose", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseAndroidDrawerLayout { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + // You must provide an implementation of this method to handle the "openDrawer" command + virtual void HandleOpenDrawerCommand() noexcept = 0; + + // You must provide an implementation of this method to handle the "closeDrawer" command + virtual void HandleCloseDrawerCommand() noexcept = 0; + + void HandleCommand(const winrt::Microsoft::ReactNative::ComponentView &view, const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + auto commandName = args.CommandName(); + if (commandName == L"openDrawer") { + + userData->HandleOpenDrawerCommand(); + return; + } + + if (commandName == L"closeDrawer") { + + userData->HandleCloseDrawerCommand(); + return; + } + } + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterAndroidDrawerLayoutNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"AndroidDrawerLayout", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseAndroidDrawerLayout::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseAndroidDrawerLayout::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + builder.SetCustomCommandHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + userData->HandleCommand(view, args); + }); + + if constexpr (&TUserData::MountChildComponentView != &BaseAndroidDrawerLayout::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseAndroidDrawerLayout::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseAndroidDrawerLayout::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseAndroidDrawerLayout::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidHorizontalScrollContentView.g.h b/vnext/codegen/react/components/rnwcore/AndroidHorizontalScrollContentView.g.h new file mode 100644 index 00000000000..a42ace8fd41 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/AndroidHorizontalScrollContentView.g.h @@ -0,0 +1,200 @@ + +/* + * This file is auto-generated from AndroidHorizontalScrollContentViewNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(AndroidHorizontalScrollContentViewProps) +struct AndroidHorizontalScrollContentViewProps : winrt::implements { + AndroidHorizontalScrollContentViewProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + removeClippedSubviews = cloneFromProps->removeClippedSubviews; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(removeClippedSubviews) + std::optional removeClippedSubviews{}; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +struct AndroidHorizontalScrollContentViewEventEmitter { + AndroidHorizontalScrollContentViewEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseAndroidHorizontalScrollContentView { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterAndroidHorizontalScrollContentViewNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"AndroidHorizontalScrollContentView", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseAndroidHorizontalScrollContentView::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseAndroidHorizontalScrollContentView::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + if constexpr (&TUserData::MountChildComponentView != &BaseAndroidHorizontalScrollContentView::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseAndroidHorizontalScrollContentView::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseAndroidHorizontalScrollContentView::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseAndroidHorizontalScrollContentView::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidProgressBar.g.h b/vnext/codegen/react/components/rnwcore/AndroidProgressBar.g.h new file mode 100644 index 00000000000..5f606f132f0 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/AndroidProgressBar.g.h @@ -0,0 +1,224 @@ + +/* + * This file is auto-generated from AndroidProgressBarNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(AndroidProgressBarProps) +struct AndroidProgressBarProps : winrt::implements { + AndroidProgressBarProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + styleAttr = cloneFromProps->styleAttr; + typeAttr = cloneFromProps->typeAttr; + indeterminate = cloneFromProps->indeterminate; + progress = cloneFromProps->progress; + animating = cloneFromProps->animating; + color = cloneFromProps->color; + testID = cloneFromProps->testID; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(styleAttr) + std::optional styleAttr; + + REACT_FIELD(typeAttr) + std::optional typeAttr; + + REACT_FIELD(indeterminate) + bool indeterminate{}; + + REACT_FIELD(progress) + std::optional progress{}; + + REACT_FIELD(animating) + bool animating{true}; + + REACT_FIELD(color) + winrt::Microsoft::ReactNative::Color color{nullptr}; + + REACT_FIELD(testID) + std::optional testID; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +struct AndroidProgressBarEventEmitter { + AndroidProgressBarEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseAndroidProgressBar { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterAndroidProgressBarNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"AndroidProgressBar", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseAndroidProgressBar::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseAndroidProgressBar::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + if constexpr (&TUserData::MountChildComponentView != &BaseAndroidProgressBar::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseAndroidProgressBar::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseAndroidProgressBar::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseAndroidProgressBar::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidSwipeRefreshLayout.g.h b/vnext/codegen/react/components/rnwcore/AndroidSwipeRefreshLayout.g.h new file mode 100644 index 00000000000..2254e963093 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/AndroidSwipeRefreshLayout.g.h @@ -0,0 +1,250 @@ + +/* + * This file is auto-generated from AndroidSwipeRefreshLayoutNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(AndroidSwipeRefreshLayoutProps) +struct AndroidSwipeRefreshLayoutProps : winrt::implements { + AndroidSwipeRefreshLayoutProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + enabled = cloneFromProps->enabled; + colors = cloneFromProps->colors; + progressBackgroundColor = cloneFromProps->progressBackgroundColor; + size = cloneFromProps->size; + progressViewOffset = cloneFromProps->progressViewOffset; + refreshing = cloneFromProps->refreshing; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(enabled) + bool enabled{true}; + + REACT_FIELD(colors) + std::optional> colors; + + REACT_FIELD(progressBackgroundColor) + winrt::Microsoft::ReactNative::Color progressBackgroundColor{nullptr}; + + REACT_FIELD(size) + std::optional size; + + REACT_FIELD(progressViewOffset) + std::optional progressViewOffset{}; + + REACT_FIELD(refreshing) + bool refreshing{}; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +REACT_STRUCT(AndroidSwipeRefreshLayout_OnRefresh) +struct AndroidSwipeRefreshLayout_OnRefresh { +}; + +struct AndroidSwipeRefreshLayoutEventEmitter { + AndroidSwipeRefreshLayoutEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + using OnRefresh = AndroidSwipeRefreshLayout_OnRefresh; + + void onRefresh(OnRefresh &value) const { + m_eventEmitter.DispatchEvent(L"refresh", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseAndroidSwipeRefreshLayout { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + // You must provide an implementation of this method to handle the "setNativeRefreshing" command + virtual void HandleSetNativeRefreshingCommand(bool value) noexcept = 0; + + void HandleCommand(const winrt::Microsoft::ReactNative::ComponentView &view, const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + auto commandName = args.CommandName(); + if (commandName == L"setNativeRefreshing") { + bool value; + winrt::Microsoft::ReactNative::ReadArgs(args.CommandArgs(), value); + userData->HandleSetNativeRefreshingCommand(value); + return; + } + } + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterAndroidSwipeRefreshLayoutNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"AndroidSwipeRefreshLayout", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseAndroidSwipeRefreshLayout::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseAndroidSwipeRefreshLayout::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + builder.SetCustomCommandHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + userData->HandleCommand(view, args); + }); + + if constexpr (&TUserData::MountChildComponentView != &BaseAndroidSwipeRefreshLayout::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseAndroidSwipeRefreshLayout::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseAndroidSwipeRefreshLayout::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseAndroidSwipeRefreshLayout::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidSwitch.g.h b/vnext/codegen/react/components/rnwcore/AndroidSwitch.g.h new file mode 100644 index 00000000000..5b07056e871 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/AndroidSwitch.g.h @@ -0,0 +1,267 @@ + +/* + * This file is auto-generated from AndroidSwitchNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(AndroidSwitchProps) +struct AndroidSwitchProps : winrt::implements { + AndroidSwitchProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + disabled = cloneFromProps->disabled; + enabled = cloneFromProps->enabled; + thumbColor = cloneFromProps->thumbColor; + trackColorForFalse = cloneFromProps->trackColorForFalse; + trackColorForTrue = cloneFromProps->trackColorForTrue; + value = cloneFromProps->value; + on = cloneFromProps->on; + thumbTintColor = cloneFromProps->thumbTintColor; + trackTintColor = cloneFromProps->trackTintColor; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(disabled) + std::optional disabled{}; + + REACT_FIELD(enabled) + bool enabled{true}; + + REACT_FIELD(thumbColor) + winrt::Microsoft::ReactNative::Color thumbColor{nullptr}; + + REACT_FIELD(trackColorForFalse) + winrt::Microsoft::ReactNative::Color trackColorForFalse{nullptr}; + + REACT_FIELD(trackColorForTrue) + winrt::Microsoft::ReactNative::Color trackColorForTrue{nullptr}; + + REACT_FIELD(value) + std::optional value{}; + + REACT_FIELD(on) + std::optional on{}; + + REACT_FIELD(thumbTintColor) + winrt::Microsoft::ReactNative::Color thumbTintColor{nullptr}; + + REACT_FIELD(trackTintColor) + winrt::Microsoft::ReactNative::Color trackTintColor{nullptr}; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +REACT_STRUCT(AndroidSwitch_OnChange) +struct AndroidSwitch_OnChange { + REACT_FIELD(value) + bool value{}; + + REACT_FIELD(target) + int32_t target{}; +}; + +struct AndroidSwitchEventEmitter { + AndroidSwitchEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + using OnChange = AndroidSwitch_OnChange; + + void onChange(OnChange &value) const { + m_eventEmitter.DispatchEvent(L"change", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseAndroidSwitch { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + // You must provide an implementation of this method to handle the "setNativeValue" command + virtual void HandleSetNativeValueCommand(bool value) noexcept = 0; + + void HandleCommand(const winrt::Microsoft::ReactNative::ComponentView &view, const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + auto commandName = args.CommandName(); + if (commandName == L"setNativeValue") { + bool value; + winrt::Microsoft::ReactNative::ReadArgs(args.CommandArgs(), value); + userData->HandleSetNativeValueCommand(value); + return; + } + } + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterAndroidSwitchNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"AndroidSwitch", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseAndroidSwitch::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseAndroidSwitch::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + builder.SetCustomCommandHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + userData->HandleCommand(view, args); + }); + + if constexpr (&TUserData::MountChildComponentView != &BaseAndroidSwitch::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseAndroidSwitch::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseAndroidSwitch::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseAndroidSwitch::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/DebuggingOverlay.g.h b/vnext/codegen/react/components/rnwcore/DebuggingOverlay.g.h new file mode 100644 index 00000000000..fe40aa30d7d --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/DebuggingOverlay.g.h @@ -0,0 +1,234 @@ + +/* + * This file is auto-generated from DebuggingOverlayNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(DebuggingOverlayProps) +struct DebuggingOverlayProps : winrt::implements { + DebuggingOverlayProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +struct DebuggingOverlayEventEmitter { + DebuggingOverlayEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseDebuggingOverlay { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + // You must provide an implementation of this method to handle the "highlightTraceUpdates" command + virtual void HandleHighlightTraceUpdatesCommand(std::vector updates) noexcept = 0; + + // You must provide an implementation of this method to handle the "highlightElements" command + virtual void HandleHighlightElementsCommand(std::vector elements) noexcept = 0; + + // You must provide an implementation of this method to handle the "clearElementsHighlights" command + virtual void HandleClearElementsHighlightsCommand() noexcept = 0; + + void HandleCommand(const winrt::Microsoft::ReactNative::ComponentView &view, const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + auto commandName = args.CommandName(); + if (commandName == L"highlightTraceUpdates") { + std::vector updates; + winrt::Microsoft::ReactNative::ReadArgs(args.CommandArgs(), updates); + userData->HandleHighlightTraceUpdatesCommand(updates); + return; + } + + if (commandName == L"highlightElements") { + std::vector elements; + winrt::Microsoft::ReactNative::ReadArgs(args.CommandArgs(), elements); + userData->HandleHighlightElementsCommand(elements); + return; + } + + if (commandName == L"clearElementsHighlights") { + + userData->HandleClearElementsHighlightsCommand(); + return; + } + } + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterDebuggingOverlayNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"DebuggingOverlay", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseDebuggingOverlay::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseDebuggingOverlay::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + builder.SetCustomCommandHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + userData->HandleCommand(view, args); + }); + + if constexpr (&TUserData::MountChildComponentView != &BaseDebuggingOverlay::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseDebuggingOverlay::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseDebuggingOverlay::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseDebuggingOverlay::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/InputAccessory.g.h b/vnext/codegen/react/components/rnwcore/InputAccessory.g.h new file mode 100644 index 00000000000..f9e8e469905 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/InputAccessory.g.h @@ -0,0 +1,200 @@ + +/* + * This file is auto-generated from InputAccessoryNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(InputAccessoryProps) +struct InputAccessoryProps : winrt::implements { + InputAccessoryProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + backgroundColor = cloneFromProps->backgroundColor; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(backgroundColor) + winrt::Microsoft::ReactNative::Color backgroundColor{nullptr}; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +struct InputAccessoryEventEmitter { + InputAccessoryEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseInputAccessory { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterInputAccessoryNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"InputAccessory", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseInputAccessory::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseInputAccessory::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + if constexpr (&TUserData::MountChildComponentView != &BaseInputAccessory::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseInputAccessory::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseInputAccessory::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseInputAccessory::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/ModalHostView.g.h b/vnext/codegen/react/components/rnwcore/ModalHostView.g.h new file mode 100644 index 00000000000..1529aea68ad --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/ModalHostView.g.h @@ -0,0 +1,283 @@ + +/* + * This file is auto-generated from ModalHostViewNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(ModalHostViewProps) +struct ModalHostViewProps : winrt::implements { + ModalHostViewProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + animationType = cloneFromProps->animationType; + presentationStyle = cloneFromProps->presentationStyle; + transparent = cloneFromProps->transparent; + statusBarTranslucent = cloneFromProps->statusBarTranslucent; + navigationBarTranslucent = cloneFromProps->navigationBarTranslucent; + hardwareAccelerated = cloneFromProps->hardwareAccelerated; + visible = cloneFromProps->visible; + animated = cloneFromProps->animated; + supportedOrientations = cloneFromProps->supportedOrientations; + identifier = cloneFromProps->identifier; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(animationType) + std::optional animationType; + + REACT_FIELD(presentationStyle) + std::optional presentationStyle; + + REACT_FIELD(transparent) + std::optional transparent{}; + + REACT_FIELD(statusBarTranslucent) + std::optional statusBarTranslucent{}; + + REACT_FIELD(navigationBarTranslucent) + std::optional navigationBarTranslucent{}; + + REACT_FIELD(hardwareAccelerated) + std::optional hardwareAccelerated{}; + + REACT_FIELD(visible) + std::optional visible{}; + + REACT_FIELD(animated) + std::optional animated{}; + + REACT_FIELD(supportedOrientations) + std::optional> supportedOrientations; + + REACT_FIELD(identifier) + std::optional identifier{}; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +REACT_STRUCT(ModalHostView_OnRequestClose) +struct ModalHostView_OnRequestClose { +}; + +REACT_STRUCT(ModalHostView_OnShow) +struct ModalHostView_OnShow { +}; + +REACT_STRUCT(ModalHostView_OnDismiss) +struct ModalHostView_OnDismiss { +}; + +REACT_STRUCT(ModalHostView_OnOrientationChange) +struct ModalHostView_OnOrientationChange { + REACT_FIELD(orientation) + std::string orientation; +}; + +struct ModalHostViewEventEmitter { + ModalHostViewEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + using OnRequestClose = ModalHostView_OnRequestClose; + using OnShow = ModalHostView_OnShow; + using OnDismiss = ModalHostView_OnDismiss; + using OnOrientationChange = ModalHostView_OnOrientationChange; + + void onRequestClose(OnRequestClose &value) const { + m_eventEmitter.DispatchEvent(L"requestClose", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + void onShow(OnShow &value) const { + m_eventEmitter.DispatchEvent(L"show", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + void onDismiss(OnDismiss &value) const { + m_eventEmitter.DispatchEvent(L"dismiss", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + void onOrientationChange(OnOrientationChange &value) const { + m_eventEmitter.DispatchEvent(L"orientationChange", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseModalHostView { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterModalHostViewNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"ModalHostView", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseModalHostView::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseModalHostView::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + if constexpr (&TUserData::MountChildComponentView != &BaseModalHostView::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseModalHostView::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseModalHostView::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseModalHostView::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/PullToRefreshView.g.h b/vnext/codegen/react/components/rnwcore/PullToRefreshView.g.h new file mode 100644 index 00000000000..c9aabcd6cb1 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/PullToRefreshView.g.h @@ -0,0 +1,246 @@ + +/* + * This file is auto-generated from PullToRefreshViewNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(PullToRefreshViewProps) +struct PullToRefreshViewProps : winrt::implements { + PullToRefreshViewProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + tintColor = cloneFromProps->tintColor; + titleColor = cloneFromProps->titleColor; + title = cloneFromProps->title; + progressViewOffset = cloneFromProps->progressViewOffset; + refreshing = cloneFromProps->refreshing; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(tintColor) + winrt::Microsoft::ReactNative::Color tintColor{nullptr}; + + REACT_FIELD(titleColor) + winrt::Microsoft::ReactNative::Color titleColor{nullptr}; + + REACT_FIELD(title) + std::optional title; + + REACT_FIELD(progressViewOffset) + std::optional progressViewOffset{}; + + REACT_FIELD(refreshing) + bool refreshing{}; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +REACT_STRUCT(PullToRefreshView_OnRefresh) +struct PullToRefreshView_OnRefresh { +}; + +struct PullToRefreshViewEventEmitter { + PullToRefreshViewEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + using OnRefresh = PullToRefreshView_OnRefresh; + + void onRefresh(OnRefresh &value) const { + m_eventEmitter.DispatchEvent(L"refresh", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BasePullToRefreshView { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + // You must provide an implementation of this method to handle the "setNativeRefreshing" command + virtual void HandleSetNativeRefreshingCommand(bool refreshing) noexcept = 0; + + void HandleCommand(const winrt::Microsoft::ReactNative::ComponentView &view, const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + auto commandName = args.CommandName(); + if (commandName == L"setNativeRefreshing") { + bool refreshing; + winrt::Microsoft::ReactNative::ReadArgs(args.CommandArgs(), refreshing); + userData->HandleSetNativeRefreshingCommand(refreshing); + return; + } + } + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterPullToRefreshViewNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"PullToRefreshView", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BasePullToRefreshView::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BasePullToRefreshView::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + builder.SetCustomCommandHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + userData->HandleCommand(view, args); + }); + + if constexpr (&TUserData::MountChildComponentView != &BasePullToRefreshView::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BasePullToRefreshView::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BasePullToRefreshView::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BasePullToRefreshView::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/SafeAreaView.g.h b/vnext/codegen/react/components/rnwcore/SafeAreaView.g.h new file mode 100644 index 00000000000..6e7a2f07a67 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/SafeAreaView.g.h @@ -0,0 +1,197 @@ + +/* + * This file is auto-generated from SafeAreaViewNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(SafeAreaViewProps) +struct SafeAreaViewProps : winrt::implements { + SafeAreaViewProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +struct SafeAreaViewEventEmitter { + SafeAreaViewEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseSafeAreaView { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterSafeAreaViewNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"SafeAreaView", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseSafeAreaView::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseSafeAreaView::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + if constexpr (&TUserData::MountChildComponentView != &BaseSafeAreaView::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseSafeAreaView::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseSafeAreaView::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseSafeAreaView::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/Switch.g.h b/vnext/codegen/react/components/rnwcore/Switch.g.h new file mode 100644 index 00000000000..18bf2b47fc4 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/Switch.g.h @@ -0,0 +1,263 @@ + +/* + * This file is auto-generated from SwitchNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(SwitchProps) +struct SwitchProps : winrt::implements { + SwitchProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + disabled = cloneFromProps->disabled; + value = cloneFromProps->value; + tintColor = cloneFromProps->tintColor; + onTintColor = cloneFromProps->onTintColor; + thumbTintColor = cloneFromProps->thumbTintColor; + thumbColor = cloneFromProps->thumbColor; + trackColorForFalse = cloneFromProps->trackColorForFalse; + trackColorForTrue = cloneFromProps->trackColorForTrue; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(disabled) + std::optional disabled{}; + + REACT_FIELD(value) + std::optional value{}; + + REACT_FIELD(tintColor) + winrt::Microsoft::ReactNative::Color tintColor{nullptr}; + + REACT_FIELD(onTintColor) + winrt::Microsoft::ReactNative::Color onTintColor{nullptr}; + + REACT_FIELD(thumbTintColor) + winrt::Microsoft::ReactNative::Color thumbTintColor{nullptr}; + + REACT_FIELD(thumbColor) + winrt::Microsoft::ReactNative::Color thumbColor{nullptr}; + + REACT_FIELD(trackColorForFalse) + winrt::Microsoft::ReactNative::Color trackColorForFalse{nullptr}; + + REACT_FIELD(trackColorForTrue) + winrt::Microsoft::ReactNative::Color trackColorForTrue{nullptr}; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +REACT_STRUCT(Switch_OnChange) +struct Switch_OnChange { + REACT_FIELD(value) + bool value{}; + + REACT_FIELD(target) + int32_t target{}; +}; + +struct SwitchEventEmitter { + SwitchEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + using OnChange = Switch_OnChange; + + void onChange(OnChange &value) const { + m_eventEmitter.DispatchEvent(L"change", [value](const winrt::Microsoft::ReactNative::IJSValueWriter writer) { + winrt::Microsoft::ReactNative::WriteValue(writer, value); + }); + } + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseSwitch { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + // You must provide an implementation of this method to handle the "setValue" command + virtual void HandleSetValueCommand(bool value) noexcept = 0; + + void HandleCommand(const winrt::Microsoft::ReactNative::ComponentView &view, const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + auto commandName = args.CommandName(); + if (commandName == L"setValue") { + bool value; + winrt::Microsoft::ReactNative::ReadArgs(args.CommandArgs(), value); + userData->HandleSetValueCommand(value); + return; + } + } + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterSwitchNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"Switch", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseSwitch::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseSwitch::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + builder.SetCustomCommandHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::HandleCommandArgs& args) noexcept { + auto userData = view.UserData().as(); + userData->HandleCommand(view, args); + }); + + if constexpr (&TUserData::MountChildComponentView != &BaseSwitch::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseSwitch::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseSwitch::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseSwitch::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/UnimplementedNativeView.g.h b/vnext/codegen/react/components/rnwcore/UnimplementedNativeView.g.h new file mode 100644 index 00000000000..1251cb720d2 --- /dev/null +++ b/vnext/codegen/react/components/rnwcore/UnimplementedNativeView.g.h @@ -0,0 +1,200 @@ + +/* + * This file is auto-generated from UnimplementedNativeViewNativeComponent spec file in flow / TypeScript. + */ +// clang-format off +#pragma once + +#include + +#ifdef RNW_NEW_ARCH +#include + +#include +#include +#endif // #ifdef RNW_NEW_ARCH + +#ifdef RNW_NEW_ARCH + +namespace Microsoft::ReactNativeSpecs { + +REACT_STRUCT(UnimplementedNativeViewProps) +struct UnimplementedNativeViewProps : winrt::implements { + UnimplementedNativeViewProps(winrt::Microsoft::ReactNative::ViewProps props, const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) + : ViewProps(props) + { + if (cloneFrom) { + auto cloneFromProps = cloneFrom.as(); + name = cloneFromProps->name; + } + } + + void SetProp(uint32_t hash, winrt::hstring propName, winrt::Microsoft::ReactNative::IJSValueReader value) noexcept { + winrt::Microsoft::ReactNative::ReadProp(hash, propName, value, *this); + } + + REACT_FIELD(name) + std::optional name; + + const winrt::Microsoft::ReactNative::ViewProps ViewProps; +}; + +struct UnimplementedNativeViewEventEmitter { + UnimplementedNativeViewEventEmitter(const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) + : m_eventEmitter(eventEmitter) {} + + private: + winrt::Microsoft::ReactNative::EventEmitter m_eventEmitter{nullptr}; +}; + +template +struct BaseUnimplementedNativeView { + + virtual void UpdateProps( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::com_ptr &newProps, + const winrt::com_ptr &/*oldProps*/) noexcept { + m_props = newProps; + } + + // UpdateLayoutMetrics will only be called if this method is overridden + virtual void UpdateLayoutMetrics( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*newLayoutMetrics*/, + const winrt::Microsoft::ReactNative::LayoutMetrics &/*oldLayoutMetrics*/) noexcept { + } + + // UpdateState will only be called if this method is overridden + virtual void UpdateState( + const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::IComponentState &/*newState*/) noexcept { + } + + virtual void UpdateEventEmitter(const std::shared_ptr &eventEmitter) noexcept { + m_eventEmitter = eventEmitter; + } + + // MountChildComponentView will only be called if this method is overridden + virtual void MountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &/*args*/) noexcept { + } + + // UnmountChildComponentView will only be called if this method is overridden + virtual void UnmountChildComponentView(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &/*args*/) noexcept { + } + + // Initialize will only be called if this method is overridden + virtual void Initialize(const winrt::Microsoft::ReactNative::ComponentView &/*view*/) noexcept { + } + + // CreateVisual will only be called if this method is overridden + virtual winrt::Microsoft::UI::Composition::Visual CreateVisual(const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + return view.as().Compositor().CreateSpriteVisual(); + } + + // FinalizeUpdate will only be called if this method is overridden + virtual void FinalizeUpdate(const winrt::Microsoft::ReactNative::ComponentView &/*view*/, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask /*mask*/) noexcept { + } + + + + const std::shared_ptr& EventEmitter() const { return m_eventEmitter; } + const winrt::com_ptr& Props() const { return m_props; } + +private: + winrt::com_ptr m_props; + std::shared_ptr m_eventEmitter; +}; + +template +void RegisterUnimplementedNativeViewNativeComponent( + winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder, + std::function builderCallback) noexcept { + packageBuilder.as().AddViewComponent( + L"UnimplementedNativeView", [builderCallback](winrt::Microsoft::ReactNative::IReactViewComponentBuilder const &builder) noexcept { + auto compBuilder = builder.as(); + + builder.SetCreateProps([](winrt::Microsoft::ReactNative::ViewProps props, + const winrt::Microsoft::ReactNative::IComponentProps& cloneFrom) noexcept { + return winrt::make(props, cloneFrom); + }); + + builder.SetUpdatePropsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentProps &newProps, + const winrt::Microsoft::ReactNative::IComponentProps &oldProps) noexcept { + auto userData = view.UserData().as(); + userData->UpdateProps(view, newProps ? newProps.as() : nullptr, oldProps ? oldProps.as() : nullptr); + }); + + compBuilder.SetUpdateLayoutMetricsHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::LayoutMetrics &newLayoutMetrics, + const winrt::Microsoft::ReactNative::LayoutMetrics &oldLayoutMetrics) noexcept { + auto userData = view.UserData().as(); + userData->UpdateLayoutMetrics(view, newLayoutMetrics, oldLayoutMetrics); + }); + + builder.SetUpdateEventEmitterHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::EventEmitter &eventEmitter) noexcept { + auto userData = view.UserData().as(); + userData->UpdateEventEmitter(std::make_shared(eventEmitter)); + }); + + if constexpr (&TUserData::FinalizeUpdate != &BaseUnimplementedNativeView::FinalizeUpdate) { + builder.SetFinalizeUpdateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + winrt::Microsoft::ReactNative::ComponentViewUpdateMask mask) noexcept { + auto userData = view.UserData().as(); + userData->FinalizeUpdate(view, mask); + }); + } + + if constexpr (&TUserData::UpdateState != &BaseUnimplementedNativeView::UpdateState) { + builder.SetUpdateStateHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::IComponentState &newState) noexcept { + auto userData = view.UserData().as(); + userData->member(view, newState); + }); + } + + if constexpr (&TUserData::MountChildComponentView != &BaseUnimplementedNativeView::MountChildComponentView) { + builder.SetMountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::MountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->MountChildComponentView(view, args); + }); + } + + if constexpr (&TUserData::UnmountChildComponentView != &BaseUnimplementedNativeView::UnmountChildComponentView) { + builder.SetUnmountChildComponentViewHandler([](const winrt::Microsoft::ReactNative::ComponentView &view, + const winrt::Microsoft::ReactNative::UnmountChildComponentViewArgs &args) noexcept { + auto userData = view.UserData().as(); + return userData->UnmountChildComponentView(view, args); + }); + } + + compBuilder.SetViewComponentViewInitializer([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = winrt::make_self(); + if constexpr (&TUserData::Initialize != &BaseUnimplementedNativeView::Initialize) { + userData->Initialize(view); + } + view.UserData(*userData); + }); + + if constexpr (&TUserData::CreateVisual != &BaseUnimplementedNativeView::CreateVisual) { + compBuilder.SetCreateVisualHandler([](const winrt::Microsoft::ReactNative::ComponentView &view) noexcept { + auto userData = view.UserData().as(); + return userData->CreateVisual(view); + }); + } + + // Allow app to further customize the builder + if (builderCallback) { + builderCallback(compBuilder); + } + }); +} + +} // namespace Microsoft::ReactNativeSpecs + +#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/just-task.js b/vnext/just-task.js index 3f629a09bc7..8494fb15265 100644 --- a/vnext/just-task.js +++ b/vnext/just-task.js @@ -28,7 +28,7 @@ option('clean'); function codegen(test) { execSync( - `react-native-windows-codegen --files src/**/*Native*.js --namespace Microsoft::ReactNativeSpecs --libraryName rnwcore --modulesWindows --internalComponents --modulesCxx${ + `react-native-windows-codegen --files src/**/*Native*.js --namespace Microsoft::ReactNativeSpecs --libraryName rnwcore --componentsWindows --modulesWindows --internalComponents --modulesCxx${ test ? ' --test' : '' }`, {env: process.env}, diff --git a/vnext/overrides.json b/vnext/overrides.json index 50ae24c46bb..1dc8fd6919d 100644 --- a/vnext/overrides.json +++ b/vnext/overrides.json @@ -16,24 +16,6 @@ "baseFile": ".flowconfig", "baseHash": "088893394c0e76f20bdc2f745a6dacba2285e579" }, - { - "type": "derived", - "file": "Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewComponentDescriptor.h", - "baseFile": "packages/react-native/ReactCommon/react/renderer/components/modal/ModalHostViewComponentDescriptor.h", - "baseHash": "e565039785bb3cf479021322074870c82be58b82" - }, - { - "type": "derived", - "file": "Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.cpp", - "baseFile": "packages/react-native/ReactCommon/react/renderer/components/modal/ModalHostViewShadowNode.cpp", - "baseHash": "18699cf9b127e7c09be0ae406ca57051691b52e2" - }, - { - "type": "derived", - "file": "Microsoft.ReactNative/Fabric/Composition/Modal/WindowsModalHostViewShadowNode.h", - "baseFile": "packages/react-native/ReactCommon/react/renderer/components/modal/ModalHostViewShadowNode.h", - "baseHash": "29d8881a9ebce7a85d1f6b80a6a3c6e6768a7bfc" - }, { "type": "derived", "file": "Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputComponentDescriptor.h", From 00d16984095135448cd3122a3a3ba727342a6e22 Mon Sep 17 00:00:00 2001 From: Andrew Coates <30809111+acoates-ms@users.noreply.github.com> Date: Fri, 10 Jan 2025 14:49:03 -0800 Subject: [PATCH 4/6] fix --- .../components/rnwcore/ActivityIndicatorView.g.h | 10 +--------- .../components/rnwcore/AndroidDrawerLayout.g.h | 10 +--------- .../rnwcore/AndroidHorizontalScrollContentView.g.h | 10 +--------- .../components/rnwcore/AndroidProgressBar.g.h | 10 +--------- .../rnwcore/AndroidSwipeRefreshLayout.g.h | 10 +--------- .../react/components/rnwcore/AndroidSwitch.g.h | 10 +--------- .../react/components/rnwcore/DebuggingOverlay.g.h | 10 +--------- .../react/components/rnwcore/InputAccessory.g.h | 10 +--------- .../react/components/rnwcore/ModalHostView.g.h | 14 +------------- .../react/components/rnwcore/PullToRefreshView.g.h | 10 +--------- .../react/components/rnwcore/SafeAreaView.g.h | 10 +--------- vnext/codegen/react/components/rnwcore/Switch.g.h | 10 +--------- .../components/rnwcore/UnimplementedNativeView.g.h | 10 +--------- .../Touchable/TouchableBounce.windows.js | 8 ++------ .../Touchable/TouchableWithoutFeedback.windows.js | 6 ++++-- vnext/src-win/Libraries/Text/Text.windows.js | 3 +-- 16 files changed, 20 insertions(+), 131 deletions(-) diff --git a/vnext/codegen/react/components/rnwcore/ActivityIndicatorView.g.h b/vnext/codegen/react/components/rnwcore/ActivityIndicatorView.g.h index 20bded81dc3..1a058c412ac 100644 --- a/vnext/codegen/react/components/rnwcore/ActivityIndicatorView.g.h +++ b/vnext/codegen/react/components/rnwcore/ActivityIndicatorView.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -208,5 +202,3 @@ void RegisterActivityIndicatorViewNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidDrawerLayout.g.h b/vnext/codegen/react/components/rnwcore/AndroidDrawerLayout.g.h index 5b57b09eb35..b421af61211 100644 --- a/vnext/codegen/react/components/rnwcore/AndroidDrawerLayout.g.h +++ b/vnext/codegen/react/components/rnwcore/AndroidDrawerLayout.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -291,5 +285,3 @@ void RegisterAndroidDrawerLayoutNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidHorizontalScrollContentView.g.h b/vnext/codegen/react/components/rnwcore/AndroidHorizontalScrollContentView.g.h index a42ace8fd41..4e645647d83 100644 --- a/vnext/codegen/react/components/rnwcore/AndroidHorizontalScrollContentView.g.h +++ b/vnext/codegen/react/components/rnwcore/AndroidHorizontalScrollContentView.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -196,5 +190,3 @@ void RegisterAndroidHorizontalScrollContentViewNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidProgressBar.g.h b/vnext/codegen/react/components/rnwcore/AndroidProgressBar.g.h index 5f606f132f0..0a1f55c6b60 100644 --- a/vnext/codegen/react/components/rnwcore/AndroidProgressBar.g.h +++ b/vnext/codegen/react/components/rnwcore/AndroidProgressBar.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -220,5 +214,3 @@ void RegisterAndroidProgressBarNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidSwipeRefreshLayout.g.h b/vnext/codegen/react/components/rnwcore/AndroidSwipeRefreshLayout.g.h index 2254e963093..7785a25dab8 100644 --- a/vnext/codegen/react/components/rnwcore/AndroidSwipeRefreshLayout.g.h +++ b/vnext/codegen/react/components/rnwcore/AndroidSwipeRefreshLayout.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -246,5 +240,3 @@ void RegisterAndroidSwipeRefreshLayoutNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/AndroidSwitch.g.h b/vnext/codegen/react/components/rnwcore/AndroidSwitch.g.h index 5b07056e871..8493270876c 100644 --- a/vnext/codegen/react/components/rnwcore/AndroidSwitch.g.h +++ b/vnext/codegen/react/components/rnwcore/AndroidSwitch.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -263,5 +257,3 @@ void RegisterAndroidSwitchNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/DebuggingOverlay.g.h b/vnext/codegen/react/components/rnwcore/DebuggingOverlay.g.h index fe40aa30d7d..f5590ea2446 100644 --- a/vnext/codegen/react/components/rnwcore/DebuggingOverlay.g.h +++ b/vnext/codegen/react/components/rnwcore/DebuggingOverlay.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -230,5 +224,3 @@ void RegisterDebuggingOverlayNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/InputAccessory.g.h b/vnext/codegen/react/components/rnwcore/InputAccessory.g.h index f9e8e469905..d91a3e7e0ef 100644 --- a/vnext/codegen/react/components/rnwcore/InputAccessory.g.h +++ b/vnext/codegen/react/components/rnwcore/InputAccessory.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -196,5 +190,3 @@ void RegisterInputAccessoryNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/ModalHostView.g.h b/vnext/codegen/react/components/rnwcore/ModalHostView.g.h index 1529aea68ad..7a29d82ef25 100644 --- a/vnext/codegen/react/components/rnwcore/ModalHostView.g.h +++ b/vnext/codegen/react/components/rnwcore/ModalHostView.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -29,7 +23,6 @@ struct ModalHostViewProps : winrt::implementspresentationStyle; transparent = cloneFromProps->transparent; statusBarTranslucent = cloneFromProps->statusBarTranslucent; - navigationBarTranslucent = cloneFromProps->navigationBarTranslucent; hardwareAccelerated = cloneFromProps->hardwareAccelerated; visible = cloneFromProps->visible; animated = cloneFromProps->animated; @@ -54,9 +47,6 @@ struct ModalHostViewProps : winrt::implements statusBarTranslucent{}; - REACT_FIELD(navigationBarTranslucent) - std::optional navigationBarTranslucent{}; - REACT_FIELD(hardwareAccelerated) std::optional hardwareAccelerated{}; @@ -279,5 +269,3 @@ void RegisterModalHostViewNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/PullToRefreshView.g.h b/vnext/codegen/react/components/rnwcore/PullToRefreshView.g.h index c9aabcd6cb1..52a05536f56 100644 --- a/vnext/codegen/react/components/rnwcore/PullToRefreshView.g.h +++ b/vnext/codegen/react/components/rnwcore/PullToRefreshView.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -242,5 +236,3 @@ void RegisterPullToRefreshViewNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/SafeAreaView.g.h b/vnext/codegen/react/components/rnwcore/SafeAreaView.g.h index 6e7a2f07a67..1b7877916ea 100644 --- a/vnext/codegen/react/components/rnwcore/SafeAreaView.g.h +++ b/vnext/codegen/react/components/rnwcore/SafeAreaView.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -193,5 +187,3 @@ void RegisterSafeAreaViewNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/Switch.g.h b/vnext/codegen/react/components/rnwcore/Switch.g.h index 18bf2b47fc4..194aefb0edb 100644 --- a/vnext/codegen/react/components/rnwcore/Switch.g.h +++ b/vnext/codegen/react/components/rnwcore/Switch.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -259,5 +253,3 @@ void RegisterSwitchNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/codegen/react/components/rnwcore/UnimplementedNativeView.g.h b/vnext/codegen/react/components/rnwcore/UnimplementedNativeView.g.h index 1251cb720d2..57d260ce6e7 100644 --- a/vnext/codegen/react/components/rnwcore/UnimplementedNativeView.g.h +++ b/vnext/codegen/react/components/rnwcore/UnimplementedNativeView.g.h @@ -5,16 +5,10 @@ // clang-format off #pragma once -#include - -#ifdef RNW_NEW_ARCH #include - +#include #include #include -#endif // #ifdef RNW_NEW_ARCH - -#ifdef RNW_NEW_ARCH namespace Microsoft::ReactNativeSpecs { @@ -196,5 +190,3 @@ void RegisterUnimplementedNativeViewNativeComponent( } } // namespace Microsoft::ReactNativeSpecs - -#endif // #ifdef RNW_NEW_ARCH diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js index cae348b3d00..5dc13b617b3 100644 --- a/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableBounce.windows.js @@ -28,7 +28,7 @@ type Props = $ReadOnly<{| releaseVelocity?: ?number, style?: ?ViewStyleProp, - hostRef: React.RefSetter>, + hostRef: React.Ref, |}>; type State = $ReadOnly<{| @@ -196,7 +196,6 @@ class TouchableBounce extends React.Component { this.props.onPress !== undefined && !this.props.disabled } - // $FlowFixMe[prop-missing] ref={this.props.hostRef} {...eventHandlersWithoutBlurAndFocus}> {this.props.children} @@ -223,7 +222,4 @@ class TouchableBounce extends React.Component { module.exports = (React.forwardRef((props, hostRef) => ( -)): component( - ref: React.RefSetter, - ...props: $ReadOnly<$Diff> -)); +)): React.AbstractComponent<$ReadOnly<$Diff>>); diff --git a/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js b/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js index 5f288f186ad..9bcc427cfe4 100644 --- a/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js +++ b/vnext/src-win/Libraries/Components/Touchable/TouchableWithoutFeedback.windows.js @@ -161,11 +161,13 @@ class TouchableWithoutFeedback extends React.Component { this.props['aria-expanded'] ?? this.props.accessibilityState?.expanded, selected: this.props['aria-selected'] ?? this.props.accessibilityState?.selected, - readonly: this.props['aria-readonly'] ?? this.props.accessibilityState?.readOnly, // Windows + readonly: + this.props['aria-readonly'] ?? this.props.accessibilityState?.readOnly, // Windows multiselectable: this.props['aria-multiselectable'] ?? this.props.accessibilityState?.multiselectable, // Windows - required: this.props['aria-required'] ?? this.props.accessibilityState?.required, // Windows + required: + this.props['aria-required'] ?? this.props.accessibilityState?.required, // Windows }; // BACKWARD-COMPATIBILITY: Focus and blur events were never supported before diff --git a/vnext/src-win/Libraries/Text/Text.windows.js b/vnext/src-win/Libraries/Text/Text.windows.js index 28fc643febb..ed62b371b4f 100644 --- a/vnext/src-win/Libraries/Text/Text.windows.js +++ b/vnext/src-win/Libraries/Text/Text.windows.js @@ -92,10 +92,9 @@ const Text: React.AbstractComponent< disabled: ariaDisabled ?? accessibilityState?.disabled, expanded: ariaExpanded ?? accessibilityState?.expanded, selected: ariaSelected ?? accessibilityState?.selected, - readOnly: ariaReadOnly, // Windows readOnly: ariaReadOnly ?? accessibilityState?.readOnly, // Windows multiselectable: - ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows + ariaMultiselectable ?? accessibilityState?.multiselectable, // Windows required: ariaRequired ?? accessibilityState?.required, // Windows }; } From 7ea9389e7003069c5ccd9aa23c46b965d2690bbe Mon Sep 17 00:00:00 2001 From: Andrew Coates <30809111+acoates-ms@users.noreply.github.com> Date: Fri, 10 Jan 2025 16:13:09 -0800 Subject: [PATCH 5/6] fix --- .../Fabric/ComponentView.cpp | 2 +- .../Fabric/ComponentView.h | 2 +- .../CompositionDynamicAutomationProvider.cpp | 2 +- .../CompositionViewComponentView.h | 2 +- .../WindowsTextInputComponentView.cpp | 2 +- .../TextInput/WindowsTextInputComponentView.h | 2 +- vnext/overrides.json | 39 +++++++------------ 7 files changed, 19 insertions(+), 32 deletions(-) diff --git a/vnext/Microsoft.ReactNative/Fabric/ComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/ComponentView.cpp index 331edf4b0b6..3161fa2cb7a 100644 --- a/vnext/Microsoft.ReactNative/Fabric/ComponentView.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/ComponentView.cpp @@ -642,7 +642,7 @@ winrt::IInspectable ComponentView::EnsureUiaProvider() noexcept { return nullptr; } -std::optional ComponentView::getAcccessiblityValue() noexcept { +std::optional ComponentView::getAccessiblityValue() noexcept { return std::nullopt; } diff --git a/vnext/Microsoft.ReactNative/Fabric/ComponentView.h b/vnext/Microsoft.ReactNative/Fabric/ComponentView.h index aefaff97d98..45f22c34c1d 100644 --- a/vnext/Microsoft.ReactNative/Fabric/ComponentView.h +++ b/vnext/Microsoft.ReactNative/Fabric/ComponentView.h @@ -207,7 +207,7 @@ struct ComponentView virtual facebook::react::Tag hitTest(facebook::react::Point pt, facebook::react::Point &localPt, bool ignorePointerEvents = false) const noexcept; virtual winrt::IInspectable EnsureUiaProvider() noexcept; - virtual std::optional getAcccessiblityValue() noexcept; + virtual std::optional getAccessiblityValue() noexcept; virtual void setAcccessiblityValue(std::string &&value) noexcept; virtual bool getAcccessiblityIsReadOnly() noexcept; virtual ToggleState getToggleState() noexcept; diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp index 58fe025d9b5..3fe7fcd2e57 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionDynamicAutomationProvider.cpp @@ -506,7 +506,7 @@ HRESULT __stdcall CompositionDynamicAutomationProvider::get_Value(BSTR *pRetVal) return UIA_E_ELEMENTNOTAVAILABLE; *pRetVal = StringToBSTR(winrt::get_self(strongView) - ->getAcccessiblityValue() + ->getAccessiblityValue() .value_or("")); return S_OK; } diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.h b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.h index 83a926be017..ee7c13e9a67 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.h @@ -100,7 +100,7 @@ struct ComponentView : public ComponentViewT< void EnsureTransformMatrixFacade() noexcept; winrt::IInspectable EnsureUiaProvider() noexcept override; - std::optional getAcccessiblityValue() noexcept override; + std::optional getAccessiblityValue() noexcept override; void setAcccessiblityValue(std::string &&value) noexcept override; bool getAcccessiblityIsReadOnly() noexcept override; ToggleState getToggleState() noexcept override; diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputComponentView.cpp b/vnext/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputComponentView.cpp index 4a40ea2da6c..af203ad8f78 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputComponentView.cpp +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputComponentView.cpp @@ -1221,7 +1221,7 @@ void WindowsTextInputComponentView::onMounted() noexcept { InternalFinalize(); } -std::optional WindowsTextInputComponentView::getAcccessiblityValue() noexcept { +std::optional WindowsTextInputComponentView::getAccessiblityValue() noexcept { return GetTextFromRichEdit(); } diff --git a/vnext/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputComponentView.h b/vnext/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputComponentView.h index 154b95c1ba4..155fe5e6492 100644 --- a/vnext/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputComponentView.h +++ b/vnext/Microsoft.ReactNative/Fabric/Composition/TextInput/WindowsTextInputComponentView.h @@ -67,7 +67,7 @@ struct WindowsTextInputComponentView &args) noexcept override; void onMounted() noexcept override; - std::optional getAcccessiblityValue() noexcept override; + std::optional getAccessiblityValue() noexcept override; void setAcccessiblityValue(std::string &&value) noexcept override; bool getAcccessiblityIsReadOnly() noexcept override; diff --git a/vnext/overrides.json b/vnext/overrides.json index 1dc8fd6919d..bdecc39e4e7 100644 --- a/vnext/overrides.json +++ b/vnext/overrides.json @@ -79,31 +79,6 @@ "baseFile": "packages/react-native/ReactCommon/react/bridging/CallbackWrapper.h", "baseHash": "fe1adea3ede6ed141bc6db212be72091722ffa02", "issue": 12195 - }. - { - "type": "patch", - "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/nativemodule/core/ReactCommon/TurboModule.h", - "baseFile": "packages/react-native/ReactCommon/react/nativemodule/core/ReactCommon/TurboModule.h", - "baseHash": "e82eb139eab8a6e122421416fb724811bfadd6fb", - "issue": 14128 - }, - { - "type": "derived", - "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h", - "baseFile": "packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityPrimitives.h", - "baseHash": "6db5b174fe1dc7d108ae7f9e730decfe5f633bd8" - }, - { - "type": "derived", - "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h", - "baseFile": "packages/react-native/ReactCommon/react/renderer/components/view/accessibilityPropsConversions.h", - "baseHash": "4b2822199233e660f36c01df18fbbff7799968cc" - }, - { - "type": "derived", - "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/componentregistry/ComponentDescriptorRegistry.cpp", - "baseFile": "packages/react-native/ReactCommon/react/renderer/componentregistry/ComponentDescriptorRegistry.cpp", - "baseHash": "b15afcf4971fd2c9c9a9859ffcb2113bec28fc35" }, { "type": "patch", @@ -126,6 +101,18 @@ "baseHash": "8f39e994dcc9dd871d502637f01fbcd6bfd2cccc", "issue": 12879 }, + { + "type": "derived", + "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/AccessibilityPrimitives.h", + "baseFile": "packages/react-native/ReactCommon/react/renderer/components/view/AccessibilityPrimitives.h", + "baseHash": "6db5b174fe1dc7d108ae7f9e730decfe5f633bd8" + }, + { + "type": "derived", + "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/renderer/components/view/accessibilityPropsConversions.h", + "baseFile": "packages/react-native/ReactCommon/react/renderer/components/view/accessibilityPropsConversions.h", + "baseHash": "4b2822199233e660f36c01df18fbbff7799968cc" + }, { "type": "patch", "file": "ReactCommon/TEMP_UntilReactCommonUpdate/react/runtime/ReactInstance.cpp", @@ -394,7 +381,7 @@ "type": "derived", "file": "src-win/Libraries/Components/Touchable/TouchableBounce.windows.js", "baseFile": "packages/react-native/Libraries/Components/Touchable/TouchableBounce.js", - "baseHash": "39541effd705b515e24600d5bc984542a5cd668b" + "baseHash": "fe7993d9b32d795f70aa03c11c93842395147aee" }, { "type": "patch", From afe660fe7f2936e969811f131b67983d8c162ec0 Mon Sep 17 00:00:00 2001 From: Andrew Coates <30809111+acoates-ms@users.noreply.github.com> Date: Fri, 10 Jan 2025 17:05:39 -0800 Subject: [PATCH 6/6] snapshots --- .../TextInputComponentTest.test.ts.snap | 606 +- .../ViewComponentTest.test.ts.snap | 13 - .../__snapshots__/snapshotPages.test.js.snap | 82474 +++++++--------- 3 files changed, 34615 insertions(+), 48478 deletions(-) diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/TextInputComponentTest.test.ts.snap b/packages/e2e-test-app-fabric/test/__snapshots__/TextInputComponentTest.test.ts.snap index 21f75a83ebe..72173d3a1c2 100644 --- a/packages/e2e-test-app-fabric/test/__snapshots__/TextInputComponentTest.test.ts.snap +++ b/packages/e2e-test-app-fabric/test/__snapshots__/TextInputComponentTest.test.ts.snap @@ -744,423 +744,6 @@ exports[`TextInput Tests TextInputs can autocomplete, sms-otp 1`] = ` "Visual Tree": { "Comment": "textinput-autocomplete-sms-otp", "Offset": "0, 0, 0", - "Size": "916, 29", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, 0, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, -1, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Brush": { - "Brush Type": "ColorBrush", - "Color": "rgba(0, 0, 0, 255)", - }, - "Offset": "0, 0, 0", - "Opacity": 0, - "Size": "0, 0", - "Visual Type": "SpriteVisual", - }, - ], - }, -} -`; - -exports[`TextInput Tests TextInputs can autogrow 1`] = ` -{ - "Automation Tree": { - "AutomationId": "textinput-autogrow", - "ControlType": 50004, - "IsKeyboardFocusable": true, - "LocalizedControlType": "edit", - "ValuePattern.Value": "small small small small small small", - }, - "Component Tree": { - "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", - "_Props": { - "TestId": "textinput-autogrow", - }, - }, - "Visual Tree": { - "Comment": "textinput-autogrow", - "Offset": "0, 0, 0", - "Size": "300, 131", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, 0, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, -1, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Brush": { - "Brush Type": "ColorBrush", - "Color": "rgba(0, 0, 0, 255)", - }, - "Offset": "0, 0, 0", - "Opacity": 0, - "Size": "0, 0", - "Visual Type": "SpriteVisual", - }, - ], - }, -} -`; - -exports[`TextInput Tests TextInputs can be defined as a set using accessibilityPosInSet and accessibilitySetSize 1`] = ` -{ - "Automation Tree": { - "AutomationId": "textinput-set", - "ControlType": 50026, - "LocalizedControlType": "group", - "__Children": [ - { - "AutomationId": "", - "ControlType": 50004, - "HelpText": "TextInput 1 in Set of 3", - "IsKeyboardFocusable": true, - "LocalizedControlType": "edit", - "Name": "TextInput 1 in Set of 3", - "PositionInSet": 1, - "SizeofSet": 3, - }, - { - "AutomationId": "", - "ControlType": 50004, - "HelpText": "TextInput 2 in Set of 3", - "IsKeyboardFocusable": true, - "LiveSetting": "Polite", - "LocalizedControlType": "edit", - "Name": "TextInput 2 in Set of 3", - "PositionInSet": 2, - "SizeofSet": 3, - }, - { - "AutomationId": "", - "ControlType": 50004, - "HelpText": "TextInput 3 in Set of 3", - "IsKeyboardFocusable": true, - "LiveSetting": "Assertive", - "LocalizedControlType": "edit", - "Name": "TextInput 3 in Set of 3", - "PositionInSet": 3, - "SizeofSet": 3, - }, - ], - }, - "Component Tree": { - "Type": "Microsoft.ReactNative.Composition.ViewComponentView", - "_Props": { - "TestId": "textinput-set", - }, - "__Children": [ - { - "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", - "_Props": {}, - }, - { - "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", - "_Props": {}, - }, - { - "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", - "_Props": {}, - }, - ], - }, - "Visual Tree": { - "Comment": "textinput-set", - "Offset": "0, 0, 0", - "Size": "916, 94", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "916, 33", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "916, 33", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, 0, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, -1, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Brush": { - "Brush Type": "ColorBrush", - "Color": "rgba(0, 0, 0, 255)", - }, - "Offset": "0, 0, 0", - "Opacity": 0, - "Size": "0, 0", - "Visual Type": "SpriteVisual", - }, - ], - }, - ], - }, - { - "Offset": "0, 31, 0", - "Size": "916, 32", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "916, 32", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, 0, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, -1, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Brush": { - "Brush Type": "ColorBrush", - "Color": "rgba(0, 0, 0, 255)", - }, - "Offset": "0, 0, 0", - "Opacity": 0, - "Size": "0, 0", - "Visual Type": "SpriteVisual", - }, - ], - }, - ], - }, - { - "Offset": "0, 62, 0", - "Size": "916, 32", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "916, 32", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, 0, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, -1, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Brush": { - "Brush Type": "ColorBrush", - "Color": "rgba(0, 0, 0, 255)", - }, - "Offset": "0, 0, 0", - "Opacity": 0, - "Size": "0, 0", - "Visual Type": "SpriteVisual", - }, - ], - }, - ], - }, - ], - }, -} -`; - -exports[`TextInput Tests TextInputs can be editable 1`] = ` -{ - "Automation Tree": { - "AutomationId": "textinput-editable", - "ControlType": 50004, - "HelpText": "editable text input using editable prop", - "IsKeyboardFocusable": true, - "LocalizedControlType": "edit", - "Name": "editable text input using editable prop", - }, - "Component Tree": { - "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", - "_Props": { - "TestId": "textinput-editable", - }, - }, - "Visual Tree": { - "Comment": "textinput-editable", - "Offset": "0, 0, 0", "Size": "916, 28", "Visual Type": "SpriteVisual", "__Children": [ @@ -1226,7 +809,7 @@ exports[`TextInput Tests TextInputs can autogrow 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.Value": "multiline with children, aligned bottom-right", + "ValuePattern.Value": "small small small small small small", }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1264,7 +847,6 @@ exports[`TextInput Tests TextInputs can be editable 1`] = ` "IsKeyboardFocusable": true, "LocalizedControlType": "edit", "Name": "editable text input using editable prop", - "ValuePattern.IsReadOnly": false, }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -1340,7 +922,6 @@ exports[`TextInput Tests TextInputs can be multiline, bottomright alignment 1`] "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "multiline with children, aligned bottom-right", }, "Component Tree": { @@ -2197,7 +1778,7 @@ exports[`TextInput Tests TextInputs can have attributed text 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.Value": "Hello ", + "ValuePattern.Value": "Hello", }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -2964,8 +2545,7 @@ exports[`TextInput Tests TextInputs can have customized line height 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.Value": "Hel -", + "ValuePattern.Value": "Hel", }, "Component Tree": { "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", @@ -3200,82 +2780,6 @@ exports[`TextInput Tests TextInputs can have text decoration lines 1`] = ` "Visual Tree": { "Comment": "style-textDecorationLine", "Offset": "0, 0, 0", - "Size": "791, 28", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, 0, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, -1, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Brush": { - "Brush Type": "ColorBrush", - "Color": "rgba(0, 0, 0, 255)", - }, - "Offset": "0, 0, 0", - "Opacity": 0, - "Size": "0, 0", - "Visual Type": "SpriteVisual", - }, - ], - }, -} -`; - -exports[`TextInput Tests TextInputs can have text shadows 1`] = ` -{ - "Automation Tree": { - "AutomationId": "style-textShadow", - "ControlType": 50004, - "IsKeyboardFocusable": true, - "LocalizedControlType": "edit", - "ValuePattern.Value": "He", - }, - "Component Tree": { - "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", - "_Props": { - "TestId": "style-textShadow", - }, - }, - "Visual Tree": { - "Comment": "style-textShadow", - "Offset": "0, 0, 0", "Size": "791, 29", "Visual Type": "SpriteVisual", "__Children": [ @@ -3341,7 +2845,6 @@ exports[`TextInput Tests TextInputs can have text shadows 1`] = ` "ControlType": 50004, "IsKeyboardFocusable": true, "LocalizedControlType": "edit", - "ValuePattern.IsReadOnly": false, "ValuePattern.Value": "He", }, "Component Tree": { @@ -4264,109 +3767,6 @@ exports[`TextInput Tests TextInputs support secure entry, with placeholder text } `; -exports[`TextInput Tests TextInputs which have a searchbox role should also support the value pattern. 1`] = ` -{ - "Automation Tree": { - "AutomationId": "textinput-searchbox", - "ControlType": 50026, - "LocalizedControlType": "group", - "__Children": [ - { - "AutomationId": "", - "ControlType": 50004, - "IsKeyboardFocusable": true, - "LocalizedControlType": "edit", - "ValuePattern.Value": "Search", - }, - ], - }, - "Component Tree": { - "Type": "Microsoft.ReactNative.Composition.ViewComponentView", - "_Props": { - "TestId": "textinput-searchbox", - }, - "__Children": [ - { - "Type": "Microsoft.ReactNative.Composition.WindowsTextInputComponentView", - "_Props": {}, - }, - ], - }, - "Visual Tree": { - "Comment": "textinput-searchbox", - "Offset": "0, 0, 0", - "Size": "916, 31", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "916, 32", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "916, 32", - "Visual Type": "SpriteVisual", - "__Children": [ - { - "Offset": "0, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, 0, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 0, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "-1, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "1, -1, 0", - "Size": "-2, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, -1, 0", - "Size": "1, 1", - "Visual Type": "SpriteVisual", - }, - { - "Offset": "0, 1, 0", - "Size": "1, -2", - "Visual Type": "SpriteVisual", - }, - { - "Brush": { - "Brush Type": "ColorBrush", - "Color": "rgba(0, 0, 0, 255)", - }, - "Offset": "0, 0, 0", - "Opacity": 0, - "Size": "0, 0", - "Visual Type": "SpriteVisual", - }, - ], - }, - ], - }, - ], - }, -} -`; - exports[`TextInput Tests TextInputs with set height and padding from theme 1`] = ` { "Automation Tree": { diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/ViewComponentTest.test.ts.snap b/packages/e2e-test-app-fabric/test/__snapshots__/ViewComponentTest.test.ts.snap index 96751a8dabb..6e7c1fec89f 100644 --- a/packages/e2e-test-app-fabric/test/__snapshots__/ViewComponentTest.test.ts.snap +++ b/packages/e2e-test-app-fabric/test/__snapshots__/ViewComponentTest.test.ts.snap @@ -982,19 +982,6 @@ exports[`View Tests Views can have customized accessibility 1`] = ` "LocalizedControlType": "text", "Name": "Current Number of Accessibility Taps: 0", }, - { - "AutomationId": "", - "ControlType": 50026, - "LocalizedControlType": "group", - "__Children": [ - { - "AutomationId": "", - "ControlType": 50020, - "LocalizedControlType": "text", - "Name": "This sub-view should not have an accessibility value. It's control type does not support the value pattern.", - }, - ], - }, ], }, "Component Tree": { diff --git a/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap b/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap index 99f10e3b1ca..2a2dfceba01 100644 --- a/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap +++ b/packages/e2e-test-app-fabric/test/__snapshots__/snapshotPages.test.js.snap @@ -6580,822 +6580,337 @@ exports[`snapshotAllPages Animated 11`] = ` `; -exports[`snapshotAllPages Animated 12`] = ` +exports[`snapshotAllPages AppState 1`] = ``; + +exports[`snapshotAllPages AppState 2`] = ` - + +`; + +exports[`snapshotAllPages AppState 3`] = ` + + + [] + + +`; + +exports[`snapshotAllPages AppState 4`] = ` + + + 0 + + +`; + +exports[`snapshotAllPages AppState 5`] = ` + + + [] + + +`; + +exports[`snapshotAllPages Border 1`] = ` + - - +`; + +exports[`snapshotAllPages Border 2`] = ` + - - Change Opacity - - + "borderWidth": 10, + }, + ] + } + testID="border-test-equal-width-same-color-border-radius" +/> +`; + +exports[`snapshotAllPages Border 3`] = ` + +`; + +exports[`snapshotAllPages Border 4`] = ` + +`; + +exports[`snapshotAllPages Border 5`] = ` + +`; + +exports[`snapshotAllPages Border 6`] = ` + +`; + +exports[`snapshotAllPages Border 7`] = ` + +`; + +exports[`snapshotAllPages Border 8`] = ` + + +`; + +exports[`snapshotAllPages Border 9`] = ` + + - - Add - - + /> - - Subtract - - + /> - - Multiply - - + /> - - Divide - - - - - Modulo - - - -`; - -exports[`snapshotAllPages Animated 13`] = ` - - - - - - - Press count : 0 - - - - - - - - - - 0 - - - - - 1 - - - - - 2 - - - - - 3 - - - - - 4 - - - - - 5 - - - - - 6 - - - - - 7 - - - - - 8 - - - - - 9 - - - - - - -`; - -exports[`snapshotAllPages AppState 1`] = ` - -`; - -exports[`snapshotAllPages AppState 2`] = ` - - - -`; - -exports[`snapshotAllPages AppState 3`] = ` - - - [] - - -`; - -exports[`snapshotAllPages AppState 4`] = ` - - - 0 - - -`; - -exports[`snapshotAllPages AppState 5`] = ` - - - [] - - -`; - -exports[`snapshotAllPages Border 1`] = ` - + +`; + +exports[`snapshotAllPages Border 10`] = ` + `; -exports[`snapshotAllPages Border 2`] = ` +exports[`snapshotAllPages Border 11`] = ` `; -exports[`snapshotAllPages Border 3`] = ` +exports[`snapshotAllPages Border 12`] = ` `; -exports[`snapshotAllPages Border 4`] = ` +exports[`snapshotAllPages Border 13`] = ` `; -exports[`snapshotAllPages Border 5`] = ` +exports[`snapshotAllPages Border 14`] = ` `; -exports[`snapshotAllPages Border 6`] = ` +exports[`snapshotAllPages Border 15`] = ` `; -exports[`snapshotAllPages Border 7`] = ` +exports[`snapshotAllPages Border 16`] = ` `; -exports[`snapshotAllPages Border 8`] = ` +exports[`snapshotAllPages Border 17`] = ` - - -`; - -exports[`snapshotAllPages Border 9`] = ` - - - - - - -`; - -exports[`snapshotAllPages Border 10`] = ` - -`; - -exports[`snapshotAllPages Border 11`] = ` - -`; - -exports[`snapshotAllPages Border 12`] = ` - -`; - -exports[`snapshotAllPages Border 13`] = ` - -`; - -exports[`snapshotAllPages Border 14`] = ` - -`; - -exports[`snapshotAllPages Border 15`] = ` - -`; - -exports[`snapshotAllPages Border 16`] = ` - -`; - -exports[`snapshotAllPages Border 17`] = ` - + testID="border-test-dynamic-color-ios" +/> `; exports[`snapshotAllPages Button 1`] = ` @@ -11487,113 +10723,18 @@ exports[`snapshotAllPages FlatList 1`] = ` } } /> - - - - - - - - Change height - - - - - `; -exports[`snapshotAllPages FlatList 10`] = ` +exports[`snapshotAllPages Flyout 1`] = ` + Placement Options: + + - + - + ] + } + > - Pizza + Open Flyout + + + + - - Burger - - - - - - - Risotto - - - - - - - French Fries - - - - - - - Onion Rings - - - - - - + - Fried Shrimps + Open Flyout without Target + + + + - Water + Open Flyout with Offset - - - - Coke - - - - - - - Beer - - - - - - - Cheesecake - - - - - - -`; - -exports[`snapshotAllPages FlatList 11`] = ` - + + Text Input to Anchor flyout to: + + + - +`; + +exports[`snapshotAllPages Glyph UWP 1`] = ` + + + Glyph: default Accent color + + + + Glyph: red + + + + Multiple glyphs: red + + + + Multiple glyphs + + + +`; + +exports[`snapshotAllPages Keyboard 1`] = ` + + + + Keyboard is + + + closed + + + - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - Water - - - - - - - Coke - - - - - - - Beer - - - - - - - Cheesecake - - - - - - + + No events observed + + `; -exports[`snapshotAllPages FlatList 12`] = ` - +exports[`snapshotAllPages Keyboard 2`] = ` + + + + Keyboard is + + + closed + + + + + No events observed + + + +`; + +exports[`snapshotAllPages Keyboard 3`] = ` + + + No tab index, this item will be tabbed to last + + + tabIndex default + + + + These 3 items should tab in the order of first, last, middle: + + - + tabIndex={1} + > + + tabIndex 1 + + + + + tabIndex 3 + + + + + tabIndex 2 + + - + Controls like Picker should also do the same tab in the order of first, last, middle: + + + + + + + +`; + +exports[`snapshotAllPages Keyboard Focus Example 1`] = ` + + + + Please select a item to set focus + + + + - + + View accept focus + + + + + + + + Test Purpose: focus on TextInput, then timeout and blur on TextInput2, TextInput still keep focus + + + + + + Test Purpose: focus on TextInput2, then timeout and blur on TextInput2, TextInput2 lose focus + + + + Key + unknown + + + + - + + + Last focus event for TouchableHighlight: + + + + + + + Last focus event for TouchableOpacity: + + + + + Last focus event for TouchableWithoutFeedback: + + + + +`; + +exports[`snapshotAllPages Keyboard extension Example 1`] = ` + + + + + OnKeyDown Key and Code + + + + + + + + + OnKeyDownCapture Key and Code + + + + + + + + + + + OnKeyUp Key and Code + + + + + + + + + OnKeyUpCapture Key and Code + + + + + + + + + + - - Pizza - - - + } + /> + + + +`; + +exports[`snapshotAllPages Layout - Flexbox 1`] = ` + + + + Layout + + + + - Burger + Flex Direction - - - + row + + - Risotto + + + + + + + + row-reverse - - - - + + + + + + + + column + + - + + + + + + + + column-reverse + + + + + + + + + - French Fries - + + top: 15, left: 160 + + - Onion Rings + Justify Content - Main Direction - - + + flex-start + + - + + + + + + + + center + + + + + + + + + + flex-end + + - Fried Shrimps + + + + + + + + space-between + + + + + + + + + + space-around + + + + + + + - Water + Align Items - Other Direction - - + + flex-start + + - + + + + + + + + + + + + + + + + + + + + center + + - Coke + + + + + + + + + + + + + + + + + + + + flex-end - - - - - - Beer - + + + + + + + + + + + + + + + + + + - Cheesecake + Flex Wrap - - + > + + + + + + + + + + + + + + + + + + + + `; -exports[`snapshotAllPages FlatList 13`] = ` - - + + layout events are called on mount and whenever layout is recalculated. Note that the layout event will typically be received + + + > + before + + the layout has updated on screen, especially when using layout animations. + - - + Press here to change layout. + + + + + + ViewLayout: + + undefined + + + + + A simple piece of text. + + + + + Text w/h: + ? + / + ? + + Image x/y: + ? + / + ? + + + +`; + +exports[`snapshotAllPages Legacy Native Module 1`] = ` + +`; + +exports[`snapshotAllPages LegacyControlStyleTest 1`] = ` + + + + + + + - + - - - Pizza - - + Show Round Border + - + + +`; + +exports[`snapshotAllPages LegacyImageTest 1`] = ` + + + + + + + - - - Burger - - + Show Border + - - + + + + + - - Risotto - - + Set image to RTL + + + + +`; + +exports[`snapshotAllPages LegacyLoginTest 1`] = ` + + + + + - - - French Fries - - + Show Password + - + + + + LOGIN + + + + +`; + +exports[`snapshotAllPages LegacySelectableTextTest 1`] = ` + + + Pressed: + 0 + times. + + + Text before + + + click here + + + text after + + + + - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - Water - - - - - - - Coke - - - - - - - Beer - - + Toggle Selectable + + + + + - - - Cheesecake - - + Clear State + - - + `; -exports[`snapshotAllPages FlatList 14`] = ` +exports[`snapshotAllPages LegacyTextHitTestTest 1`] = ` - - - - - + + Nested + + + pressable + + + text: + + + Click here + + + + + + Nested text inside pressable text: + + + + Click here + + + + + Multiline pressable test: + + + Click here +or click here. + + + + Multiline pressable RTL text: + + + أحب اللغة +العربية + + + + RTL text in LTR flow direction: + + + أحب اللغة العربية + + + + RTL text in RTL flow direction: + + + أحب اللغة العربية + + + + LTR text in RTL flow direction: + + + Click here + + + + Bidirectional text in a single run: + + + أحب اللغة العربية hello + + + + Bidirectional text in separate runs: + + + أحب اللغة العربية + hello + + + + Add pressable inline text child: + + + Click to add + + + + + Click anywhere to toggle pressability: + + + Click here + + + + Wrapped text pressability: + + + + + abcdef + + + + - - - - - Pizza - - - + - - - Burger - - + Clear State + - - + + +`; + +exports[`snapshotAllPages LegacyTextInputTest 1`] = ` + + + + + + <Log Start> + + +`; + +exports[`snapshotAllPages Linking 1`] = ` + + + + + - - Risotto - - + Open + https://www.facebook.com + + + - + - - French Fries - - + Open + http://www.facebook.com + + + - + - - Onion Rings - - + Open + http://facebook.com + + + - + - - Fried Shrimps - - + Open + fb://notifications + - + + - + Open + geo:37.484847,-122.148386 + + + + + + + Open + tel:9876543210 + + + + + +`; + +exports[`snapshotAllPages Linking 2`] = ` + + + + + Open Settings + + + + +`; + +exports[`snapshotAllPages Modal 1`] = ` + + + + Show Modal + + + + + Animation Type + + + + - Water + slide - + - Coke + none - - - Beer - - - - - Cheesecake + fade - - - -`; - -exports[`snapshotAllPages FlatList 15`] = ` - + + Status Bar Translucent 🟢 + + - + + Hardware Acceleration 🟢 + + + + - + + Presentation Style ⚫️ + + - Pizza + fullScreen - Burger + pageSheet - Risotto + formSheet - French Fries + overFullScreen - + + + + - + + + + + + Supported Orientation ⚫️ + + + + - Onion Rings + portrait - Fried Shrimps + portrait-upside-down - Water + landscape - Coke + landscape-left - Beer + landscape-right + + + + + Actions + + - Cheesecake + onShow - - - -`; - -exports[`snapshotAllPages Flyout 1`] = ` - - - - Placement Options: - - - - - - - Open Flyout + onDismiss ⚫️ + +`; + +exports[`snapshotAllPages Modal 2`] = ` + + + onShow is called + 0 + times + + + onDismiss is called + 0 + times + - - - - - Open Flyout without Target - - - - - - - - - - - Open Flyout with Offset - - - - - - - Text Input to Anchor flyout to: - + Show Modal - `; -exports[`snapshotAllPages Glyph UWP 1`] = ` - - - Glyph: default Accent color - - + - - Glyph: red - - - - Multiple glyphs: red - - - - Multiple glyphs - - - -`; - -exports[`snapshotAllPages Keyboard 1`] = ` - - - - Keyboard is - + > - closed - - - - - No events observed + Primary Pressed x + 0 - - -`; - -exports[`snapshotAllPages Keyboard 2`] = ` - - - - Keyboard is + + Auxiliary Pressed x + 0 - closed + Secondary Pressed x + 0 - + - - No events observed - - - -`; - -exports[`snapshotAllPages Keyboard 3`] = ` - - - No tab index, this item will be tabbed to last - - - - tabIndex default - + + + + Clear state + + + - - These 3 items should tab in the order of first, last, middle: - - - - tabIndex 1 - - - - - tabIndex 3 - - - - - tabIndex 2 - - + I'm a view! + - - Controls like Picker should also do the same tab in the order of first, last, middle: - - - - + "borderRadius": 3, + "borderWidth": 1, + }, + ] + } + testID="button_click" + > + + + + I'm a button! + + + `; -exports[`snapshotAllPages Keyboard Focus Example 1`] = ` +exports[`snapshotAllPages Mouse Events 1`] = ` - - - Please select a item to set focus - - - + + + + Hoverable + + text + + + + + This is a TouchableHighlight + + + + + + + This is an overlay view + + + + + + + + + +`; + +exports[`snapshotAllPages Native Animated Example 1`] = ` + + } + accessible={true} + focusable={true} + onClick={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} +> + + + Native: + + - - View accept focus - - - - - Test Purpose: focus on TextInput, then timeout and blur on TextInput2, TextInput still keep focus + JavaScript + : - + + + +`; + +exports[`snapshotAllPages Native Animated Example 2`] = ` + - Test Purpose: focus on TextInput2, then timeout and blur on TextInput2, TextInput2 lose focus + Native: - + + + + - Key - unknown + JavaScript + : - + - - + /> + + +`; + +exports[`snapshotAllPages Native Animated Example 3`] = ` + + - Last focus event for TouchableHighlight: - + Native: - + + - - + /> + + - Last focus event for TouchableOpacity: - + JavaScript + : - + + - - Last focus event for TouchableWithoutFeedback: - - `; -exports[`snapshotAllPages Keyboard extension Example 1`] = ` - +exports[`snapshotAllPages Native Animated Example 4`] = ` + + + + Native: + + + + + + + JavaScript + : + + + - - OnKeyDown Key and Code - - - - - - - - - OnKeyDownCapture Key and Code - - - - - - - - + /> + + +`; + +exports[`snapshotAllPages Native Animated Example 5`] = ` + + + + Native: + + + - - OnKeyUp Key and Code - - - - - - - - - OnKeyUpCapture Key and Code - - - - - - - - + /> + + + + JavaScript + : + + + - - + /> `; -exports[`snapshotAllPages Layout - Flexbox 1`] = ` +exports[`snapshotAllPages Native Animated Example 6`] = ` + + + Native: + + - - Layout + /> + + + + JavaScript + : - + + + +`; + +exports[`snapshotAllPages Native Animated Example 7`] = ` + + + + Native: + + + - - - - - Flex Direction - - - + + + + JavaScript + : + + + + - - row - - - - - - - - - - row-reverse - - - - - - - - - - column - - - - - - - - - - column-reverse - - - - - - - - - - - top: 15, left: 160 - - - - - + + +`; + +exports[`snapshotAllPages Native Animated Example 8`] = ` + + + + Native: + + + + - - - Justify Content - Main Direction - - - + + + + JavaScript + : + + + + - - flex-start - - - - - - - - - - center - - - - - - - - - - flex-end - - - - - - - - - - space-between - - - - - - - - - - space-around - - - - - - - - - - - + + +`; + +exports[`snapshotAllPages Native Animated Example 9`] = ` + + + + Native: + + + + - - - Align Items - Other Direction - - - + + + + JavaScript + : + + + + - - flex-start - - - - - - - - - - - + + +`; + +exports[`snapshotAllPages Native Animated Example 10`] = ` + + + + + + Value: + 0 + + +`; + +exports[`snapshotAllPages Native Animated Example 11`] = ` + + + +`; + +exports[`snapshotAllPages Native Animated Example 12`] = ` + + + + + + + Scroll me sideways! + + + + + +`; + +exports[`snapshotAllPages Native Animated Example 13`] = ` + + + + Native: + + + + + + + + + JavaScript + : + + + + + + + +`; + +exports[`snapshotAllPages Native Animated Example 14`] = ` + + + + Force JS Stalls + + + + + + Track JS Stalls + + + + +`; + +exports[`snapshotAllPages PanResponder Sample 1`] = ` + + + + Basic gesture handling + + + + + - - - - - - - - + + + +`; + +exports[`snapshotAllPages Performance API Examples 1`] = ` + + + + performance.memory + + + + + + + + + > + Click to update memory info + - - center - + + + + + jsHeapSizeLimit: undefined bytes + + + totalJSHeapSize: undefined bytes + + + usedJSHeapSize: undefined bytes + + + + + +`; + +exports[`snapshotAllPages Performance API Examples 2`] = ` + + + + performance.reactNativeStartupTiming + + + + + + - - - - - - - - - - - - - - - - - - - - flex-end - - - - - - - - - - - - - - - - - - - + > + Click to update React startup timing + + + + startTime: undefined ms + + + initializeRuntimeStart: undefined ms + + + executeJavaScriptBundleEntryPointStart: undefined ms + + + executeJavaScriptBundleEntryPointEnd: undefined ms + + + initializeRuntimeEnd: undefined ms + + + endTime: undefined ms + + + + + +`; + +exports[`snapshotAllPages Performance Comparison Examples 1`] = ` + + + - - Flex Wrap + + Show Bad - - - - - - - - - - - - - - - - - - + } + accessible={true} + disabled={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + [ + { + "alignItems": "center", + "backgroundColor": "#d3d3d3", + "borderColor": "#696969", + "borderRadius": 8, + "borderWidth": 1, + "justifyContent": "center", + "margin": 5, + "padding": 10, + }, + false, + ] + } + > + + Show Good + + - + `; -exports[`snapshotAllPages Layout Events 1`] = ` - - - layout events are called on mount and whenever layout is recalculated. Note that the layout event will typically be received - - - before - - the layout has updated on screen, especially when using layout animations. - - - Press here to change layout. - - +exports[`snapshotAllPages Performance Comparison Examples 2`] = ` + - - - ViewLayout: - - undefined - - - - - A simple piece of text. - - - - - Text w/h: - ? - / - ? - - Image x/y: - ? - / - ? - + + + + Show Bad + + + + + Show Good + + + + + `; -exports[`snapshotAllPages Legacy Native Module 1`] = ` +exports[`snapshotAllPages Performance Comparison Examples 3`] = ` -`; - -exports[`snapshotAllPages LegacyControlStyleTest 1`] = ` - +> - - + - + - - - - - - Show Round Border - + + Show Bad + + + + + Show Good + + + `; -exports[`snapshotAllPages LegacyImageTest 1`] = ` - +exports[`snapshotAllPages Performance Comparison Examples 4`] = ` + - - - - - - Show Border - - - - - - - - + Show Bad + + + - Set image to RTL - + + Show Good + + + `; -exports[`snapshotAllPages LegacyLoginTest 1`] = ` - - + - + - + + + + Show Bad + + + + + Show Good + + + + + + + +`; + +exports[`snapshotAllPages Performance Comparison Examples 6`] = ` + + - - Show Password - + + Show Bad + + + + + Show Good + + + - +`; + +exports[`snapshotAllPages PlatformColor 1`] = ` + +`; + +exports[`snapshotAllPages PlatformColor 2`] = ` + + - LOGIN + Unexpected Platform.OS: windows + - `; -exports[`snapshotAllPages LegacySelectableTextTest 1`] = ` +exports[`snapshotAllPages PlatformColor 3`] = ` + + Not applicable on this platform + +`; + +exports[`snapshotAllPages PlatformColor 4`] = ` - - Pressed: - 0 - times. - - - Text before - - click here + Unexpected Platform.OS: windows - - text after - - + + +`; + +exports[`snapshotAllPages Pointer Events 1`] = ` + + + A: unspecified + + + + + + B: none + + + - Toggle Selectable - + + + C: unspecified + + + - - - Clear State - - + } + /> `; -exports[`snapshotAllPages LegacyTextHitTestTest 1`] = ` - - - Pressed: - 0 - times. - - + - Nested - - - pressable - - - text: - + + - Click here + A: unspecified - - - - - Nested text inside pressable text: - - - - Click here - - - - - Multiline pressable test: - - - Click here -or click here. - - - - Multiline pressable RTL text: - - - أحب اللغة -العربية - - - - RTL text in LTR flow direction: - - + - أحب اللغة العربية - - - + + + B: none + + + + + + C: unspecified + + + + + + + - RTL text in RTL flow direction: - - + + + + +`; + +exports[`snapshotAllPages Pointer Events 3`] = ` + + + - أحب اللغة العربية - - - - LTR text in RTL flow direction: - - - Click here - - - - Bidirectional text in a single run: - - - أحب اللغة العربية hello - - - - Bidirectional text in separate runs: - - - أحب اللغة العربية - hello - - - - Add pressable inline text child: - - - Click to add - - - - - Click anywhere to toggle pressability: - - - Click here - - - - Wrapped text pressability: - - - - - abcdef - - - - - + A: unspecified + + + + + + B: box-none + + + + + + C: unspecified + + + + - Clear State - + + + C: explicitly unspecified + + + - -`; - -exports[`snapshotAllPages LegacyTextInputTest 1`] = ` - - - - - - <Log Start> - + + + + `; -exports[`snapshotAllPages Linking 1`] = ` +exports[`snapshotAllPages Pointer Events 4`] = ` - + - Open - https://www.facebook.com + A: unspecified - - - - Open - http://www.facebook.com - - - - - - + B: box-none + + + - Open - http://facebook.com - + + + C: unspecified + + + + + + + C: explicitly unspecified + + + - + + - - - Open - fb://notifications - - + /> + + +`; + +exports[`snapshotAllPages Pointer Events 5`] = ` + + - Open - geo:37.484847,-122.148386 + A: unspecified - - - + + B: box-only + + + - Open - tel:9876543210 - + + + C: unspecified + + + + + + + C: explicitly unspecified + + + - -`; - -exports[`snapshotAllPages Linking 2`] = ` - - Open Settings - + /> `; -exports[`snapshotAllPages Modal 1`] = ` +exports[`snapshotAllPages Pointer Events 6`] = ` - - Show Modal - - - - - Animation Type - + + A: unspecified + + + + + B: box-only + + + - - slide - + + C: unspecified + + - - + + + C: explicitly unspecified + + + + + + + + + + + + +`; + +exports[`snapshotAllPages Pointer Events 7`] = ` + + + + + + A: overflow: + visible + + + + - none + B: overflowing + + C: fully outside + + + - - fade - + + D: child of fully outside + + @@ -36934,414 +36413,172 @@ exports[`snapshotAllPages Modal 1`] = ` - - Status Bar Translucent 🟢 - - - - - - Hardware Acceleration 🟢 - - + /> + + +`; + +exports[`snapshotAllPages Pointer Events 8`] = ` + - - Presentation Style ⚫️ - - - - fullScreen - - + A: overflow: + hidden + - pageSheet + B: overflowing - formSheet + C: fully outside - - - - overFullScreen - + + D: child of fully outside + + @@ -37349,919 +36586,861 @@ exports[`snapshotAllPages Modal 1`] = ` - Transparent - - + +`; + +exports[`snapshotAllPages Popup 1`] = ` + + + The following tests popup Anchor + - Supported Orientation ⚫️ + Text Input to Anchor popup to: + - - + + + + - portrait + Open Popup + + + +`; + +exports[`snapshotAllPages Popup 2`] = ` + + + - - - portrait-upside-down - - + Toggle popup + + + + +`; + +exports[`snapshotAllPages Popup 3`] = ` + + + - - - landscape - - + Toggle popup + - + + +`; + +exports[`snapshotAllPages Pressable 1`] = ` +[ + + + - - - landscape-left - - - - - - - landscape-right - - - + Press Me + - + , + + , +] +`; + +exports[`snapshotAllPages Pressable 2`] = ` + + - Actions + Press Me - + +`; + +exports[`snapshotAllPages Pressable 3`] = ` + + + - - - - onShow - - - - + - - - onDismiss ⚫️ - - - + Press Me + - + +`; + +exports[`snapshotAllPages Pressable 4`] = ` + + - Backdrop Color ⚫️ - + } + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + disabled={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + > - + + +`; + +exports[`snapshotAllPages Pressable 5`] = ` + + + - + + - - red - - + radius 30 + - + - + + - - blue - - + radius 150 + - + + - - - default - - + radius 70, with border + - -`; - -exports[`snapshotAllPages Modal 2`] = ` - - - onShow is called - 0 - times - - - onDismiss is called - 0 - times - + + + with border, default color and radius + + + + - - Show Modal + + + + use foreground `; -exports[`snapshotAllPages Mouse Click Events 1`] = ` - + testID="tappable_text" + > + Text has built-in onPress handling + , - Primary Pressed x - 0 - - - Auxiliary Pressed x - 0 - - - Secondary Pressed x - 0 - - - + , +] +`; + +exports[`snapshotAllPages Pressable 7`] = ` + + - - - Clear state - - + } + > + Press Me + - - I'm a view! - - + testID="pressable_delay_events_console" + /> + +`; + +exports[`snapshotAllPages Pressable 8`] = ` + + + 3D Touch is not available on this device + + + - - - I'm a button! - - + } + > + Press Me + `; -exports[`snapshotAllPages Mouse Events 1`] = ` +exports[`snapshotAllPages Pressable 9`] = ` - - - Hoverable - - text - - - - - This is a TouchableHighlight - - - - - - - This is an overlay view - - - + Press Outside This View + - + `; -exports[`snapshotAllPages Moving Light Example 1`] = ` - - - Size: 25 - - - Color: white - +exports[`snapshotAllPages Pressable 10`] = ` + - - - - Toggle Light - - - + - Last Event Value: No Event yet + Native Methods Exist - `; -exports[`snapshotAllPages Native Animated Example 1`] = ` - - - - Native: - - +exports[`snapshotAllPages Pressable 11`] = ` +[ - - - - - JavaScript - : + > + Disabled Pressable - + , - - - + > + Enabled Pressable + + , +] `; -exports[`snapshotAllPages Native Animated Example 2`] = ` +exports[`snapshotAllPages Pressable 12`] = ` - - - Native: - - - - - - - JavaScript - : - - - - + > + Press Me + `; -exports[`snapshotAllPages Native Animated Example 3`] = ` - - - - Native: - - +exports[`snapshotAllPages Pressable 13`] = ` +[ - - - - JavaScript - : - - + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + disabled={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + > + + Press Me + + + , - - - -`; - -exports[`snapshotAllPages Native Animated Example 4`] = ` -, + - - - Native: - - + accessible={true} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "height": 30, + } + } + > + + + Click to focus textbox + + + , +] +`; + +exports[`snapshotAllPages Pressable 14`] = ` +[ + + Press Me + + + - - - - JavaScript - : - - + , - - - -`; - -exports[`snapshotAllPages Native Animated Example 5`] = ` - - - Native: + defaultText - + , +] +`; + +exports[`snapshotAllPages Pressable 15`] = ` +[ - - - - JavaScript - : - - + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + disabled={false} + focusable={true} + keyDownEvents={ + [ + { + "code": "KeyW", + "handledEventPhase": 3, + }, + { + "code": "KeyE", + "handledEventPhase": 1, + }, + ] + } + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyDownCapture={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + > + + Press Me + + + , - - - + />, +] `; -exports[`snapshotAllPages Native Animated Example 6`] = ` - - - - Native: - - +exports[`snapshotAllPages Pressable 16`] = ` + - - - - - JavaScript - : - - - - - + testID="advanced_borders_pressable" + /> `; -exports[`snapshotAllPages Native Animated Example 7`] = ` +exports[`snapshotAllPages Pressable 17`] = ` - - - Native: - - - - - - - JavaScript - : - - - - - - -`; - -exports[`snapshotAllPages Native Animated Example 8`] = ` - - - - Native: - - + /> - - - - - JavaScript - : - - - - - - -`; - -exports[`snapshotAllPages Native Animated Example 9`] = ` - - - - Native: - - + /> - - - - - JavaScript - : - - - - - - -`; - -exports[`snapshotAllPages Native Animated Example 10`] = ` - + /> - - - - Value: - 0 - - -`; - -exports[`snapshotAllPages Native Animated Example 11`] = ` - - - -`; - -exports[`snapshotAllPages Native Animated Example 12`] = ` - - - - - - Scroll me sideways! - - - - - -`; - -exports[`snapshotAllPages Native Animated Example 13`] = ` - - - - Native: - - - - - - - - - JavaScript - : - - - - - - - -`; - -exports[`snapshotAllPages Native Animated Example 14`] = ` - - - - Force JS Stalls - - - - - - Track JS Stalls - - - - -`; - -exports[`snapshotAllPages PanResponder Sample 1`] = ` - - - - Basic gesture handling - - - - - - - - -`; - -exports[`snapshotAllPages Performance API Examples 1`] = ` - + /> - - performance.memory - - - - - - - - - Click to update memory info - - - - - - - jsHeapSizeLimit: undefined bytes - - - totalJSHeapSize: undefined bytes - - - usedJSHeapSize: undefined bytes - - - - - -`; - -exports[`snapshotAllPages Performance API Examples 2`] = ` - + /> - - performance.reactNativeStartupTiming - - + } + /> - - - - Click to log some marks and measures - - - - - - -`; - -exports[`snapshotAllPages Performance API Examples 4`] = ` - + /> - - - - - Click to update React startup timing - - - - - - - startTime: undefined ms - - - initializeRuntimeStart: undefined ms - - - executeJavaScriptBundleEntryPointStart: undefined ms - - - executeJavaScriptBundleEntryPointEnd: undefined ms - - - initializeRuntimeEnd: undefined ms - - - endTime: undefined ms - - - - + { + "backgroundColor": "black", + "height": 50, + "opacity": 0.9, + "width": 50, + } + } + /> + `; -exports[`snapshotAllPages Performance Comparison Examples 1`] = ` +exports[`snapshotAllPages Pressable 18`] = ` - - - - - Show Bad - - - - - Show Good - - - - - + + Pressable with accessible=true and focusable=true + - -`; - -exports[`snapshotAllPages Performance Comparison Examples 2`] = ` - + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={false} + disabled={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "height": 50, + } + } + > + + Pressable with accessible=false + + - + Pressable with focusable=false + + + - - - - Show Bad - - - - - Show Good - - - - - + } + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={false} + disabled={false} + focusable={false} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "height": 30, + } + } + > + + Pressable with accessible=false and focusable=false + `; -exports[`snapshotAllPages Performance Comparison Examples 3`] = ` - + - + + Pressable with ToolTip "Pressable" + + + +`; + +exports[`snapshotAllPages Pressable 20`] = ` + + + + Parent Pressable + - - - - Show Bad - - - - - Show Good - - - - + } + accessible={true} + disabled={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + > + + Child Pressable + `; -exports[`snapshotAllPages Performance Comparison Examples 4`] = ` +exports[`snapshotAllPages Pressable 21`] = ` + + View #1, front is visible, back is hidden. + - + Front + + + - - - Show Bad - - - - - Show Good - - - - - - - -`; - -exports[`snapshotAllPages Performance Comparison Examples 5`] = ` - - - - - - - Show Bad - - - - - Show Good - - - - + + Back (You should not see this) + - -`; - -exports[`snapshotAllPages Performance Comparison Examples 6`] = ` - - - - - - - Show Bad - - - - - Show Good - - - - - - - -`; - -exports[`snapshotAllPages PixelRatio 1`] = ` - + View #2, front is hidden, back is visible. + - - - - Get Pixel Density - - - + + Front (You should not see this) + - - -`; - -exports[`snapshotAllPages PixelRatio 2`] = ` - - - - - - Get Font Scale - - - + + Back + `; -exports[`snapshotAllPages PixelRatio 3`] = ` - + + > + + Left-to-Right + + - - + - Layout Size(dp): - - - + + + +`; + +exports[`snapshotAllPages RTLExample 2`] = ` + + - - Pixel Size: - - - 0 - px - + + LTR + + - -`; - -exports[`snapshotAllPages PixelRatio 4`] = ` - - + + + - Layout Size(dp): - - - + + Text Text Text + + + + + > + + + Button + + + - + + + - Nearest Layout Size: - - - + + Text Text Text + + + + - 0 - dp - + + + Button + + + `; -exports[`snapshotAllPages PlatformColor 1`] = ` - + -`; - -exports[`snapshotAllPages PlatformColor 2`] = ` - - - - Unexpected Platform.OS: windows - + > + + + LTR + + + - -`; - -exports[`snapshotAllPages PlatformColor 3`] = ` - - Not applicable on this platform - -`; - -exports[`snapshotAllPages PlatformColor 4`] = ` - - Unexpected Platform.OS: windows + Left-to-Right language without text alignment. - + > + من اليمين إلى اليسار اللغة دون محاذاة النص + + + מימין לשמאל השפה בלי יישור טקסט + `; -exports[`snapshotAllPages Pointer Events 1`] = ` +exports[`snapshotAllPages RTLExample 4`] = ` - A: unspecified - - - - - - B: none - - - - - - C: unspecified - - - + LTR + - - + - + "fontSize": 10, + }, + { + "textAlign": "left", + }, + ] + } + > + من اليمين إلى اليسار اللغة دون محاذاة النص + + + מימין לשמאל השפה בלי יישור טקסט + `; -exports[`snapshotAllPages Pointer Events 2`] = ` +exports[`snapshotAllPages RTLExample 5`] = ` - A: unspecified - - - - - - B: none - - - - - - C: unspecified - - - + LTR + - - + - + "fontSize": 10, + }, + { + "textAlign": "right", + }, + ] + } + > + من اليمين إلى اليسار اللغة دون محاذاة النص + + + מימין לשמאל השפה בלי יישור טקסט + `; -exports[`snapshotAllPages Pointer Events 3`] = ` +exports[`snapshotAllPages RTLExample 6`] = ` - A: unspecified - - - - - - B: box-none - - - - - - C: unspecified - - - - - - - C: explicitly unspecified - - - + LTR + - - + - + "textAlign": "right", + }, + ] + } + /> `; -exports[`snapshotAllPages Pointer Events 4`] = ` +exports[`snapshotAllPages RTLExample 7`] = ` - A: unspecified + LTR - + + + + + + Without directional meaning + + + + - - - B: box-none - - - + - - - C: unspecified - - - - + With directional meaning + + + + +`; + +exports[`snapshotAllPages RTLExample 8`] = ` + + + + + - - - C: explicitly unspecified - - - + LTR + - @@ -42740,815 +40842,876 @@ exports[`snapshotAllPages Pointer Events 4`] = ` `; -exports[`snapshotAllPages Pointer Events 5`] = ` +exports[`snapshotAllPages RTLExample 9`] = ` + + Styles + + + paddingStart: 50, + + + paddingEnd: 10 + + + + Demo: + + + The + teal + is padding. + - - A: unspecified - - - - - B: box-only - - - - - - C: unspecified - - - - - C: explicitly unspecified + LTR - +`; + +exports[`snapshotAllPages RTLExample 10`] = ` + + - - - - - -`; - -exports[`snapshotAllPages Pointer Events 6`] = ` - + Styles + + + marginStart: 50, + + + marginEnd: 10 + + + + Demo: + + + The green is margin. + - - A: unspecified - - - - - B: box-only - - - - C: unspecified + LTR + + + + +`; + +exports[`snapshotAllPages RTLExample 11`] = ` + + + Styles + + + start: 50 + + + + Demo: + + + The orange is position. + + + + - C: explicitly unspecified + LTR - + - - - - - -`; - -exports[`snapshotAllPages Pointer Events 7`] = ` - + Styles + + + end: 50 + + + + Demo: + + + The orange is position. + - - A: overflow: - visible - - - - - - B: overflowing - - - - - - C: fully outside - - - - D: child of fully outside + LTR - +`; + +exports[`snapshotAllPages RTLExample 12`] = ` + + - - - - - -`; - -exports[`snapshotAllPages Pointer Events 8`] = ` - + Styles + + + borderStartWidth: 10, + + + borderEndWidth: 50 + + + + Demo: + - - + - A: overflow: - hidden - - - - - - B: overflowing - - - - - - - C: fully outside - - - - + - D: child of fully outside - + + LTR + + - - - - - `; -exports[`snapshotAllPages Popup 1`] = ` - +exports[`snapshotAllPages RTLExample 13`] = ` + - The following tests popup Anchor + Styles - + borderStartColor: 'red', + + + borderEndColor: 'green', + + + - - Text Input to Anchor popup to: - - - - + Demo: + - + - - Open Popup - + + + LTR + + + @@ -43556,361 +41719,713 @@ exports[`snapshotAllPages Popup 1`] = ` `; -exports[`snapshotAllPages Popup 2`] = ` - + - + Styles + + + borderTopStartRadius: 10, + + + borderTopEndRadius: 20, + + + borderBottomStartRadius: 30, + + + borderBottomEndRadius: 40 + + + + Demo: + + - - + - Toggle popup - + + + + LTR + + + + `; -exports[`snapshotAllPages Popup 3`] = ` - - + + Styles + + + borderStartStartRadius: 10, + + + borderStartEndRadius: 20, + + + borderEndStartRadius: 30, + + + borderEndEndRadius: 40 + + + + Demo: + + - - + - Toggle popup - + + + + LTR + + + + `; -exports[`snapshotAllPages Pressable 1`] = ` -[ - + - - - Press Me - - - , - + + borderStartColor: 'red', + + + borderEndColor: 'green', + + + borderStartWidth: 10, + + + borderEndWidth: 50, + + + borderTopStartRadius: 10, + + + borderTopEndRadius: 20, + + + borderBottomStartRadius: 30, + + + borderBottomEndRadius: 40 + + + - - , -] -`; - -exports[`snapshotAllPages Pressable 2`] = ` - + Demo: + - + - Press Me - + + + + + + LTR + + + + + + `; -exports[`snapshotAllPages Pressable 3`] = ` - + + testID="scroll_vertical" + > + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + - - Press me and move your finger - - - -`; - -exports[`snapshotAllPages Pressable 4`] = ` - - - - - Press Me - - + + Scroll to top + - - -`; - -exports[`snapshotAllPages Pressable 4`] = ` - - + } + testID="scroll_to_bottom_button" + > + + Scroll to bottom + + + + + Flash scroll indicators + `; -exports[`snapshotAllPages Pressable 5`] = ` +exports[`snapshotAllPages ScrollView 2`] = ` - + LTR Layout + + - + + Item 0 + + + - radius 30 - + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + - + - - - radius 150 - - + + Scroll to start + - - - radius 70, with border - - - - - - - - with border, default color and radius + + Scroll to end + +`; + +exports[`snapshotAllPages ScrollView 3`] = ` + - - + - - - use foreground - - - -`; - -exports[`snapshotAllPages Pressable 6`] = ` -[ - - Text has built-in onPress handling - , - - - , -] -`; - -exports[`snapshotAllPages Pressable 7`] = ` - - + testID="scroll_horizontal" + > + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + - - Press Me - - - - - -`; - -exports[`snapshotAllPages Pressable 8`] = ` - - - - 3D Touch is not available on this device - - - - - - Press Me + + Scroll to start - - -`; - -exports[`snapshotAllPages Pressable 9`] = ` - - - - Press Outside This View + + Scroll to end - - - `; -exports[`snapshotAllPages Pressable 10`] = ` - - + - - + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + - Native Methods Exist + Scrolling enabled = true - -`; - -exports[`snapshotAllPages Pressable 11`] = ` -[ - - Disabled Pressable - - , - - - Enabled Pressable + + Disable Scrolling - , -] -`; - -exports[`snapshotAllPages Pressable 12`] = ` - + - - Press Me + + Enable Scrolling `; -exports[`snapshotAllPages Pressable 13`] = ` -[ - + - + + - + + Item 0 + + + - Press Me - - - , - - - , - - - - Click to focus textbox - + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + - , -] -`; - -exports[`snapshotAllPages Pressable 14`] = ` -[ - + + - - Press Me - - - - , - - - - defaultText - - , -] -`; - -exports[`snapshotAllPages Pressable 15`] = ` -[ - + > + + setContentContainerStyle + + - - Press Me + } + > + + setContentInset - , - , -] -`; - -exports[`snapshotAllPages Pressable 16`] = ` - - + `; -exports[`snapshotAllPages Pressable 17`] = ` - - - + - - - + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + + - + + Deceleration Rate: normal + + + + +`; + +exports[`snapshotAllPages ScrollView 7`] = ` + + - - - - + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + + - + + setDisableIntervalMomentum: false + + + + > + + setDisableScrollViewPanResponder: false + + + `; -exports[`snapshotAllPages Pressable 18`] = ` - - - - Pressable with accessible=true and focusable=true - - - - - Pressable with accessible=false - - - - - Pressable with focusable=false - - - - - Pressable with accessible=false and focusable=false - - - -`; - -exports[`snapshotAllPages Pressable 19`] = ` +exports[`snapshotAllPages ScrollView 8`] = ` - - - Pressable with ToolTip "Pressable" - - - -`; - -exports[`snapshotAllPages Pressable 20`] = ` - - - - Parent Pressable - - - - Child Pressable - - - - -`; - -exports[`snapshotAllPages Pressable 21`] = ` - - - View #1, front is visible, back is hidden. - - - + - Front + STICKY HEADER - - + + Item 0 + + + + + Item 1 + + + - - Back (You should not see this) - - - - - View #2, front is hidden, back is visible. - - + > + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + - Front (You should not see this) + invertStickyHeaders: false - Back + Scroll to top - - -`; - -exports[`snapshotAllPages Pressable 23`] = ` - - - - Pressable 1 of 3 - - - - - Pressable 2 of 3 - - - - - Pressable 3 of 3 - + testID="scroll_to_bottom_button" + > + + Scroll to bottom + + `; -exports[`snapshotAllPages RTLExample 1`] = ` +exports[`snapshotAllPages ScrollView 9`] = ` - - - Left-to-Right - - - - - forceRTL - - - + + - - - -`; - -exports[`snapshotAllPages RTLExample 2`] = ` - - - + + Sticky Header 1 + + + + undefined, + ] + } + > + + Item 0 + + - - LTR + + Item 1 - - - - + > + + Item 2 + + - + Item 3 + + + + + Item 4 + + + + "backgroundColor": "#cccccc", + "borderRadius": 3, + "margin": 5, + "minWidth": 96, + "padding": 5, + }, + undefined, + ] + } + > + + Item 5 + - + Item 6 + + + - - Text Text Text - - + "backgroundColor": "#cccccc", + "borderRadius": 3, + "margin": 5, + "minWidth": 96, + "padding": 5, + }, + undefined, + ] + } + > + + Item 7 + - + Item 8 + + + - - Button - - + "backgroundColor": "#cccccc", + "borderRadius": 3, + "margin": 5, + "minWidth": 96, + "padding": 5, + }, + undefined, + ] + } + > + + Item 9 + - - + > + + Item 10 + + - + Item 11 + + + + "backgroundColor": "yellow", + }, + ] + } + > + + Sticky Header 2 + - + Item 0 + + + - - Text Text Text - - + "backgroundColor": "#cccccc", + "borderRadius": 3, + "margin": 5, + "minWidth": 96, + "padding": 5, + }, + undefined, + ] + } + > + + Item 1 + - + Item 2 + + + - - Button - - + "backgroundColor": "#cccccc", + "borderRadius": 3, + "margin": 5, + "minWidth": 96, + "padding": 5, + }, + undefined, + ] + } + > + + Item 3 + - - - -`; - -exports[`snapshotAllPages RTLExample 3`] = ` - - - + undefined, + ] + } + > + + Item 4 + + - - LTR + + Item 5 - - - - - Left-to-Right language without text alignment. - - + + Item 6 + + + - من اليمين إلى اليسار اللغة دون محاذاة النص - - + + Item 7 + + + - מימין לשמאל השפה בלי יישור טקסט - - - -`; - -exports[`snapshotAllPages RTLExample 4`] = ` - - - + + Item 8 + + + + + Item 9 + + + + undefined, + ] + } + > + + Item 10 + + - - LTR + + Item 11 - - - - - Left-to-Right language without text alignment. - - - من اليمين إلى اليسار اللغة دون محاذاة النص - - - מימין לשמאל השפה בלי יישור טקסט - - - -`; - -exports[`snapshotAllPages RTLExample 5`] = ` - - - + ] + } + > + + Sticky Header 3 + + - - LTR + + Item 0 - - - - - Left-to-Right language without text alignment. - - - من اليمين إلى اليسار اللغة دون محاذاة النص - - - מימין לשמאל השפה בלי יישור טקסט - - - -`; - -exports[`snapshotAllPages RTLExample 6`] = ` - - - - - LTR + + Item 1 - - - - - LRT or RTL TextInput. - - - - -`; - -exports[`snapshotAllPages RTLExample 7`] = ` - - - + undefined, + ] + } + > + + Item 2 + + - - LTR + + Item 3 - - - - - + + Item 4 + + + - + + Item 5 + + + - Without directional meaning - - - + Item 6 + + + - + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + - + + Item 10 + + + - With directional meaning - + + Item 11 + + - - -`; - -exports[`snapshotAllPages RTLExample 8`] = ` - - + + - - - - LTR - - + + Scroll to top + - - - + + Scroll to bottom + `; -exports[`snapshotAllPages RTLExample 9`] = ` - - - Styles - - - paddingStart: 50, - - - paddingEnd: 10 - - - - Demo: - - - The - teal - is padding. - + } +> - + + + + + Press to change color + + + + + + + + + + + + + + + - LTR + scroll to top - - - -`; - -exports[`snapshotAllPages RTLExample 10`] = ` - - - Styles - - - marginStart: 50, - - - marginEnd: 10 - - - - Demo: - - - The green is margin. - - - - LTR + scroll to bottom @@ -48174,55 +46279,37 @@ exports[`snapshotAllPages RTLExample 10`] = ` `; -exports[`snapshotAllPages RTLExample 11`] = ` +exports[`snapshotAllPages ScrollView 11`] = ` - - Styles - - - start: 50 - - - - Demo: - - - The orange is position. - - + - + - - - - LTR - - - + + Button + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + - - - - Styles - - - end: 50 - - + - Demo: - - - The orange is position. + Keyboard Dismiss Mode - + none + + + - - - - LTR - - - - + } + accessible={true} + collapsable={false} + focusable={true} + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onKeyDown={[Function]} + onKeyUp={[Function]} + onMouseEnter={[Function]} + onMouseLeave={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "alignItems": "center", + "backgroundColor": "#cccccc", + "borderRadius": 3, + "margin": 5, + "opacity": 1, + "padding": 5, + } + } + > + + on-drag + - -`; - -exports[`snapshotAllPages RTLExample 12`] = ` - - - Styles - - - borderStartWidth: 10, - - - borderEndWidth: 50 - - - Demo: + Keyboard Should Persist taps - - - - - - LTR - - - - - + + never + - - -`; - -exports[`snapshotAllPages RTLExample 13`] = ` - - - Styles - - - borderStartColor: 'red', - - - borderEndColor: 'green', - - - - Demo: - - + > + + always + + - - - - - - LTR - - - - - + + handled + `; -exports[`snapshotAllPages RTLExample 14`] = ` +exports[`snapshotAllPages ScrollView 12`] = ` - - Styles - - - borderTopStartRadius: 10, - - - borderTopEndRadius: 20, - - - borderBottomStartRadius: 30, - - - borderBottomEndRadius: 40 - - - - Demo: - - - - - - - - - LTR - - - - - - - - -`; - -exports[`snapshotAllPages RTLExample 15`] = ` - - - Styles - - - borderStartStartRadius: 10, - - - borderStartEndRadius: 20, - - - borderEndStartRadius: 30, - - - borderEndEndRadius: 40 - - - - Demo: - - - - - - - - - LTR - - - - - - - - -`; - -exports[`snapshotAllPages RTLExample 16`] = ` - - - Styles - - - borderStartColor: 'red', - - - borderEndColor: 'green', - - - borderStartWidth: 10, - - - borderEndWidth: 50, - - - borderTopStartRadius: 10, - - - borderTopEndRadius: 20, - - borderBottomStartRadius: 30, - - - borderBottomEndRadius: 40 - - - - Demo: + Content Size Changed: + original - - - - - - - - LTR - - - - - - - - -`; - -exports[`snapshotAllPages ScrollView 1`] = ` - - Scroll to top - - - - - Scroll to bottom - - - - - Flash scroll indicators + Change Content Size `; -exports[`snapshotAllPages ScrollView 2`] = ` +exports[`snapshotAllPages ScrollView 13`] = ` - + Scroll State: + none + + - + - LTR Layout - - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - + > + + Item 0 + - - + + Item 1 + + + - - Scroll to start - - - + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + - - Scroll to end - + > + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + - + `; -exports[`snapshotAllPages ScrollView 3`] = ` +exports[`snapshotAllPages ScrollView 14`] = ` - + onScroll: + none + + - + - RTL Layout - - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - + > + + Item 0 + - - - - Scroll to start - - - - - Scroll to end - - - - -`; - -exports[`snapshotAllPages ScrollView 4`] = ` - - - - RTL Layout - - - - - - Item 0 - - - - - - - Scroll to start - - - - - Scroll to end - - - - -`; - -exports[`snapshotAllPages ScrollView 5`] = ` - - - - - - Item 0 - - - - - Item 1 - - - + + Item 1 + + + @@ -50750,130 +47664,19 @@ exports[`snapshotAllPages ScrollView 5`] = ` - - Scrolling enabled = true - - - - Disable Scrolling - - - - - Enable Scrolling - - `; -exports[`snapshotAllPages ScrollView 5`] = ` +exports[`snapshotAllPages ScrollView 15`] = ` + } style={ [ { @@ -50886,6 +47689,7 @@ exports[`snapshotAllPages ScrollView 5`] = ` ] } > + - - +`; + +exports[`snapshotAllPages ScrollView 16`] = ` + + + + - - setContentContainerStyle - - - - - setContentInset - - - - -`; - -exports[`snapshotAllPages ScrollView 6`] = ` - - - - - - Item 0 - - - + + Item 0 + + + @@ -51450,64 +48148,62 @@ exports[`snapshotAllPages ScrollView 6`] = ` - - - - Deceleration Rate: normal - - + } + > + + removeClippedSubviews: false + `; -exports[`snapshotAllPages ScrollView 7`] = ` +exports[`snapshotAllPages ScrollView 17`] = ` - - - - setDisableIntervalMomentum: false - - - + + setScrollIndicatorInsets + + + - - setDisableScrollViewPanResponder: false - - + } + > + + showsHorizontalScrollIndicator: true + + + + + showsVerticalScrollIndicator: true + `; -exports[`snapshotAllPages ScrollView 8`] = ` +exports[`snapshotAllPages ScrollView 18`] = ` - - STICKY HEADER - - - + + snapToEnd: true + + + + + snapToStart: true + + + + + setSnapToInterval + + + + + reset snapToOffsets + + + +`; + +exports[`snapshotAllPages ScrollView 19`] = ` + + + - invertStickyHeaders: false + Item 0 + + Item 1 + + + + + Item 2 + + + - Scroll to top + Item 3 + + Item 4 + + + + + Item 5 + + + - Scroll to bottom + Item 6 - - -`; - -exports[`snapshotAllPages ScrollView 9`] = ` - - - - - - Sticky Header 1 - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + +`; + +exports[`snapshotAllPages ScrollView 20`] = ` + + + - Item 6 + Item 0 - Item 7 + Item 1 - Item 8 + Item 2 - Item 9 + Item 3 - Item 10 + Item 4 - Item 11 - - - - - Sticky Header 2 + Item 5 + + + + @@ -52580,7 +49480,7 @@ exports[`snapshotAllPages ScrollView 9`] = ` "minWidth": 96, "padding": 5, }, - undefined, + null, ] } > @@ -52598,7 +49498,7 @@ exports[`snapshotAllPages ScrollView 9`] = ` "minWidth": 96, "padding": 5, }, - undefined, + null, ] } > @@ -52616,7 +49516,7 @@ exports[`snapshotAllPages ScrollView 9`] = ` "minWidth": 96, "padding": 5, }, - undefined, + null, ] } > @@ -52634,7 +49534,7 @@ exports[`snapshotAllPages ScrollView 9`] = ` "minWidth": 96, "padding": 5, }, - undefined, + null, ] } > @@ -52652,7 +49552,7 @@ exports[`snapshotAllPages ScrollView 9`] = ` "minWidth": 96, "padding": 5, }, - undefined, + null, ] } > @@ -52660,353 +49560,233 @@ exports[`snapshotAllPages ScrollView 9`] = ` Item 5 - + + + - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - + + Add to top + + + - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - + + Remove top + + + - - Sticky Header 3 - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - + + Change height top + + + + + - - Item 9 - - - - - Item 10 - - - - - Item 11 - - + } + > + + Add to end + - - - Scroll to top + Remove end - Scroll to bottom + Change height end `; -exports[`snapshotAllPages ScrollView 10`] = ` +exports[`snapshotAllPages ScrollViewAnimated 1`] = ` + - - - - - - Press to change color - - - - - - - - - - - - - - + - - - - scroll to top - - + + Scroll me horizontally + - + + +`; + +exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` + + + + - - - - scroll to bottom - - - - + Item 0 + - + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + - - - Press to change color - - - - - + > + + Item 0 + + - - + > + + Item 1 + + - - + > + + Item 2 + + - - - - -`; - -exports[`snapshotAllPages ScrollView 11`] = ` - - - - - + + Item 3 + + + - - Button - - - - - Item 0 - - - - - Item 1 - - - + + Item 4 + + + - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - + + Item 5 + + + - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - + + Item 6 + + + - - Item 8 - - - + + Item 7 + + + - - Item 9 - - - + + Item 8 + + + - - Item 10 - - - + + Item 9 + + + - - Item 11 - - - - - - Keyboard Dismiss Mode - - - - - none - - - - - on-drag - - - - - Keyboard Should Persist taps - - - - - never - - - - - always - - - - - handled - - - - -`; - -exports[`snapshotAllPages ScrollView 12`] = ` - - - Content Size Changed: - original - - - - + + Item 10 + + + - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - + + Item 11 + + + - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - + + Item 12 + + + - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - + + Item 13 + + + - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - - - Change Content Size - - - -`; - -exports[`snapshotAllPages ScrollView 13`] = ` - - - Scroll State: - none - - - - + + Item 14 + + + - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - + + Item 15 + + + - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - + + Item 16 + + + - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - + + Item 17 + + + - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - -`; - -exports[`snapshotAllPages ScrollView 14`] = ` - - - onScroll: - none - - - - + + Item 18 + + + - - Item 0 - - - - - Item 1 - - - - - Item 2 - + "opacity": 1, + "padding": 50, + } + } + > + + Item 19 + + - + - - Item 3 - - - - - Item 4 - - - + - - Item 5 - - - + + - - Item 6 - - - - - Item 7 - - - + - - Item 8 - - - + + - - Item 9 - - - - - Item 10 - - - + - - Item 11 - - + Item 7 + - - -`; - -exports[`snapshotAllPages ScrollView 15`] = ` - - - } - style={ - [ + - - - + - - Item 0 - - - + + - - Item 1 - - - - - Item 2 - - - + - - Item 3 - - - + + - - Item 4 - - - - - Item 5 - - - + - - Item 6 - - - + + - - Item 7 - - - - - Item 8 - - - + - - Item 9 - - - + + - - Item 10 - - - + - - Item 11 - - + Item 12 + - - -`; - -exports[`snapshotAllPages ScrollView 16`] = ` - - - - - - Item 0 - - - - - Item 1 - - - + - - Item 2 - - - + + - - Item 3 - - - - - Item 4 - - - + - - Item 5 - - - + + - - Item 6 - - - - - Item 7 - - - + - - Item 8 - - - + + - - Item 9 - - - - - Item 10 - - - + - - Item 11 - - + Item 16 + - - - - removeClippedSubviews: false - - - -`; - -exports[`snapshotAllPages ScrollView 17`] = ` - - + + Item 17 + + + - - + - - Item 0 - - - + + - - Item 1 - - - - - Item 2 - - - + - - Item 3 - - - + + + + - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - + + Item 0 + + + - - Item 7 - - - - - Item 8 - - - + + Item 1 + + + - - Item 9 - - - + + Item 2 + + + - - Item 10 - - - + + Item 3 + + + - - Item 11 - - - - - - - setScrollIndicatorInsets - - - - - showsHorizontalScrollIndicator: true - - - - - showsVerticalScrollIndicator: true - - - -`; - -exports[`snapshotAllPages ScrollView 18`] = ` - - - - - - Item 0 - - - + + Item 4 + + + - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - + + Item 5 + + + - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - + + Item 6 + + + - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - + + Item 7 + + + - - Item 10 - - - + + Item 8 + + + - - Item 11 - - - - - - - snapToEnd: true - - - - - snapToStart: true - - - - - setSnapToInterval - - - - - reset snapToOffsets - - - -`; - -exports[`snapshotAllPages ScrollView 19`] = ` - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - -`; - -exports[`snapshotAllPages ScrollView 20`] = ` - - - - + + Item 9 + + + - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - + + Item 10 + + + - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - - - + + Item 11 + + + - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - + + Item 12 + + + - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - - - - Add to top - - - - - Remove top - - - - - Change height top - - - - - - - Add to end - - - - - Remove end - - - - - Change height end - - - - -`; - -exports[`snapshotAllPages ScrollViewAnimated 1`] = ` - - - - - + + Item 13 + + + - - - Scroll me horizontally + + Item 14 - - - - -`; - -exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 0 + Item 15 - Item 1 + Item 16 - Item 2 + Item 17 - Item 3 + Item 18 - Item 4 + Item 19 + + + + - Item 5 + Item 0 - Item 6 + Item 1 - Item 7 + Item 2 - Item 8 + Item 3 - Item 9 + Item 4 + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + @@ -58259,6 +54022,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "margin": 5, "opacity": 1, "padding": 50, + "width": 200, } } > @@ -58315,6 +54079,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "margin": 5, "opacity": 1, "padding": 50, + "width": 200, } } > @@ -58371,6 +54136,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "margin": 5, "opacity": 1, "padding": 50, + "width": 200, } } > @@ -58427,6 +54193,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "margin": 5, "opacity": 1, "padding": 50, + "width": 200, } } > @@ -58483,6 +54250,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "margin": 5, "opacity": 1, "padding": 50, + "width": 200, } } > @@ -58539,6 +54307,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "margin": 5, "opacity": 1, "padding": 50, + "width": 200, } } > @@ -58595,6 +54364,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "margin": 5, "opacity": 1, "padding": 50, + "width": 200, } } > @@ -58651,6 +54421,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "margin": 5, "opacity": 1, "padding": 50, + "width": 200, } } > @@ -58707,6 +54478,7 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` "margin": 5, "opacity": 1, "padding": 50, + "width": 200, } } > @@ -58718,23385 +54490,14767 @@ exports[`snapshotAllPages ScrollViewSimpleExample 1`] = ` - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - Item 12 - - - - - Item 13 - - - - - Item 14 - - - - - Item 15 - - - - - Item 16 - - - - - Item 17 - - - - - Item 18 - - - - - Item 19 - - - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - Item 12 - - - - - Item 13 - - - - - Item 14 - - - - - Item 15 - - - - - Item 16 - - - - - Item 17 - - - - - Item 18 - - - - - Item 19 - - - - - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - Item 12 - - - - - Item 13 - - - - - Item 14 - - - - - Item 15 - - - - - Item 16 - - - - - Item 17 - - - - - Item 18 - - - - - Item 19 - - - - - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - Item 12 - - - - - Item 13 - - - - - Item 14 - - - - - Item 15 - - - - - Item 16 - - - - - Item 17 - - - - - Item 18 - - - - - Item 19 - - - - - - - - - Item 0 - - - - - Item 1 - - - - - Item 2 - - - - - Item 3 - - - - - Item 4 - - - - - Item 5 - - - - - Item 6 - - - - - Item 7 - - - - - Item 8 - - - - - Item 9 - - - - - Item 10 - - - - - Item 11 - - - - - Item 12 - - - - - Item 13 - - - - - Item 14 - - - - - Item 15 - - - - - Item 16 - - - - - Item 17 - - - - - Item 18 - - - - - Item 19 - - - - - - -`; - -exports[`snapshotAllPages SectionList 1`] = ` -[ - - - Menu - - , - - - - contentInset top: 44 - - - - - - Toggle header size - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - , -] -`; - -exports[`snapshotAllPages SectionList 2`] = ` - - - - - - - - Test - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 3`] = ` - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 4`] = ` - - - - - - Main dishes - - - - - - Section separator for leading undefined and trailing Pizza has not been pressed - - - - - Pizza - - - - - separator for leading Pizza and trailing Burger has not been pressed - - - - - - - - Burger - - - - - separator for leading Burger and trailing Risotto has not been pressed - - - - - - - - Risotto - - - - - Section separator for leading Risotto and trailing undefined has not been pressed - - - - - - - - Sides - - - - - - Section separator for leading undefined and trailing French Fries has not been pressed - - - - - French Fries - - - - - separator for leading French Fries and trailing Onion Rings has not been pressed - - - - - - - - Onion Rings - - - - - separator for leading Onion Rings and trailing Fried Shrimps has not been pressed - - - - - - - - Fried Shrimps - - - - - Section separator for leading Fried Shrimps and trailing undefined has not been pressed - - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 5`] = ` - - - - stickySectionHeadersEnabled false - - - - - - Sticky On - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 6`] = ` - - - - inverted false - - - - - - Toggle true - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 7`] = ` - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - Virtualized - : - - - - - - Log Viewable - : - - - - - - Debug - : - - - - - - Inverted - : - - - - - - - - scroll to: - - - - - - - Top - - - - - - - - - - - 3rd Section - - - - - - - - - - - 6th Section - - - - - - - - - - - Out of Viewable Area (See warning) - - - - - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + Item 12 + + + + + Item 13 + + + + + Item 14 + + + + + Item 15 + + + + + Item 16 + + + + + Item 17 + + + + + Item 18 + + + + + Item 19 + + + + + + + + + Item 0 + + + + + Item 1 + + + + + Item 2 + + + + + Item 3 + + + + + Item 4 + + + + + Item 5 + + + + + Item 6 + + + + + Item 7 + + + + + Item 8 + + + + + Item 9 + + + + + Item 10 + + + + + Item 11 + + + + + Item 12 + + + + + Item 13 + + + + + Item 14 + + + + + Item 15 + + + + + Item 16 + + + + + Item 17 + + + + + Item 18 + + + + + Item 19 + + + + + + +`; + +exports[`snapshotAllPages SectionList 1`] = ` +[ + + + Menu + + , + + + + contentInset top: 44 + + + + + + Toggle header size + + + + + + + + + + Main dishes + + + + + + Pizza + + + + + + + Burger + + + + + + + Risotto + + + + + + + Sides + + + + + + French Fries + + + + + + + Onion Rings + + + + + + + Fried Shrimps + + + + + + + + , +] +`; + +exports[`snapshotAllPages SectionList 2`] = ` + + + + + + + + Test + + + + + + + + + + Main dishes + + + + + + Pizza + + + + + + + Burger + + + + + + + Risotto + + + + + + + Sides + + + + + + French Fries + + + + + + + Onion Rings + + + + + + + Fried Shrimps + + + + + + + + +`; + +exports[`snapshotAllPages SectionList 3`] = ` + + + + + + + + + Main dishes + + + + + + Pizza + + + + + + + Burger + + + + + + + Risotto + + + + + + + Sides + + + + + + French Fries + + + + + + + Onion Rings + + + + + + + Fried Shrimps + + + + + + + + +`; + +exports[`snapshotAllPages SectionList 4`] = ` + + + + + + Main dishes + + + + + + + Section separator for leading undefined and trailing Pizza has not been pressed + + + + + Pizza + + + + + separator for leading Pizza and trailing Burger has not been pressed + + + + + + + + + Burger + + + + + separator for leading Burger and trailing Risotto has not been pressed + + + + + + + + + Risotto + + + + + Section separator for leading Risotto and trailing undefined has not been pressed + + + + + + + + Sides + + + + + + + Section separator for leading undefined and trailing French Fries has not been pressed + + + + + French Fries + + + + + separator for leading French Fries and trailing Onion Rings has not been pressed + + + + + + + + + Onion Rings + + + + + separator for leading Onion Rings and trailing Fried Shrimps has not been pressed + + + + + + + + + Fried Shrimps + + + + + Section separator for leading Fried Shrimps and trailing undefined has not been pressed + + + + + + + + + +`; + +exports[`snapshotAllPages SectionList 5`] = ` + + + + stickySectionHeadersEnabled false + + + + + + Sticky On + + + + + + + + + + Main dishes + + + + + + Pizza + + + + + + + Burger + + + + + + + Risotto + + + + + + + Sides + + + + + + French Fries + + + + + + + Onion Rings + + + + + + + Fried Shrimps + + + + + + + + +`; + +exports[`snapshotAllPages SectionList 6`] = ` + + + + inverted false + + + + + + Toggle true + + + + + + + + + + Main dishes + + + + + + Pizza + + + + + + + Burger + + + + + + + Risotto + + + + + + + Sides + + + + + + French Fries + + + + + + + Onion Rings + + + + + + + Fried Shrimps + + + + + + + + +`; + +exports[`snapshotAllPages SectionList 7`] = ` + + + + + + + + Virtualized + : + + + + + + Log Viewable + : + + + + + + Debug + : + + + + + + Inverted + : + + + + + + + + scroll to: + + + + + + + Top + + + + + + + + + + + 3rd Section + + + + + + + + + + + 6th Section + + + + + + + + + + + Out of Viewable Area (See warning) + + + + + + + + + - } - refreshing={false} - renderItem={[Function]} - scrollEventThrottle={0.0001} - stickyHeaderIndices={ - [ - 1, - 3, - 6, - 10, - ] - } - style={ - { - "backgroundColor": "white", - } - } - viewabilityConfig={ - { - "minimumViewTime": 3000, - "viewAreaCoveragePercentThreshold": 100, - "waitForInteraction": true, - } - } - > - - - - - - - LIST HEADER - - - - - - - - - SECTION HEADER: - empty section - - - - - - - - SECTION FOOTER: - empty section - - - - - - - - SECTION HEADER: - s1 - - - - - - - - - SECTION SEPARATOR - - - - - Item In Header Section - - - Section s1 - - - - - - SECTION SEPARATOR - - - - - - - - SECTION FOOTER: - s1 - - - - - - - - SECTION HEADER: - s2 - - - - - - - - - SECTION SEPARATOR - - - - - ITEM SEPARATOR - - - - - - - - - SECTION SEPARATOR - - - - - - - - SECTION FOOTER: - s2 - - - - - - - - SECTION HEADER: - 0 - 9 - - - - - - - - - - - LIST FOOTER - - - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 11`] = ` - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages SectionList 12`] = ` - - - - - - - - - - Main dishes - - - - - - Pizza - - - - - - - Burger - - - - - - - Risotto - - - - - - - Sides - - - - - - French Fries - - - - - - - Onion Rings - - - - - - - Fried Shrimps - - - - - - - - -`; - -exports[`snapshotAllPages Share 1`] = ` - - - Native Experience - - - Our top priority for React Native is to match the expectations people have for each platform. This is why React Native renders to platform primitives. We value native look-and-feel over cross-platform consistency. For example, the TextInput in React Native renders to a UITextField on iOS. This ensures that integration with password managers and keyboard controls work out of the box. By using platform primitives, React Native apps are also able to stay up-to-date with design and behavior changes from new releases of Android and iOS. - - - - - - SHARE - - - - - -`; - -exports[`snapshotAllPages Share 2`] = ` - - - Massive Scale - - - Hundreds of screens in the Facebook app are implemented with React Native. The Facebook app is used by billions of people on a huge range of devices. This is why we invest in the most challenging problems at scale. Deploying React Native in our apps lets us identify problems that we wouldn’t see at a smaller scale. For example, Facebook focuses on improving performance across a broad spectrum of devices from the newest iPhone to many older generations of Android devices. This focus informs our architecture projects such as Hermes, Fabric, and TurboModules. - - - - - - SHARE - - - - - -`; - -exports[`snapshotAllPages Share 3`] = ` - - - action: - null - - - Create native apps - - - React Native combines the best parts of native development with React, a best-in-class JavaScript library for building user interfaces. - - - - - - SHARE - - - - - -`; - -exports[`snapshotAllPages SwipeableCard 1`] = ` -[ - - - - - - - - - Section # - 0 - - - - - - - - Section # - 1 - - - - - - - - Section # - 2 - - - - - - - - Section # - 3 - - - - - - - - Section # - 4 - - - - - - - - , - - - - - - - - - Section # - 0 - - - - - - - - Section # - 1 - - - - - - - - Section # - 2 - - - - - - - - Section # - 3 - - - - - - - - Section # - 4 - - - - - - - - , -] -`; - -exports[`snapshotAllPages Switch 1`] = ` - - - - - Off - - - - - - On - - - -`; - -exports[`snapshotAllPages Switch 2`] = ` - - - - - Off - - - - - - On - - - -`; - -exports[`snapshotAllPages Switch 3`] = ` - - - - - - Off - - - - - - - On - - - -`; - -exports[`snapshotAllPages Switch 4`] = ` - -`; - -exports[`snapshotAllPages Switch 5`] = ` - - - - -`; - -exports[`snapshotAllPages Switch 6`] = ` - - - -`; - -exports[`snapshotAllPages Switch 7`] = ` - - - -`; - -exports[`snapshotAllPages Switch 8`] = ` - - - - - - - - - - -`; - -exports[`snapshotAllPages Text 1`] = ` - - - Text with background color only - - - Text with background color and uniform borderRadii - - - Text with background color and non-uniform borders - - - Text with borderWidth - - - Text with background AND borderWidth - - -`; - -exports[`snapshotAllPages Text 2`] = ` - - - Truncated text is baaaaad. - - - Shrinking to fit available space is much better! - - - Add text to me to watch me shrink! - - - Multiline text component shrinking is supported, watch as this reeeeaaaally loooooong teeeeeeext grooooows and then shriiiinks as you add text to me! ioahsdia soady auydoa aoisyd aosdy - - - Text limited by height, watch as this reeeeaaaally loooooong teeeeeeext grooooows and then shriiiinks as you add text to me! ioahsdia soady auydoa aoisyd aosdy - - - - Differently sized nested elements will shrink together. - - - LARGE TEXT! - - - - - Reset - - - Remove Text - - - Add Text - - - -`; - -exports[`snapshotAllPages Text 3`] = ` -[ - - - - This is adjusting text. - - - , - - - - - - Set Height to 20 - - - - - , - - - - - - Set Height to 40 - - - - - , - - - - - - Set Height to 60 - - - - - , -] -`; - -exports[`snapshotAllPages Text 4`] = ` - - - None: - - WillNotHaveAHyphenWhenBreakingForNewLine - , - - - Full: - - WillHaveAHyphenWhenBreakingForNewLine - , -] -`; - -exports[`snapshotAllPages Text 6`] = ` - - This text is indented by 10px padding on all sides. - -`; - -exports[`snapshotAllPages Text 7`] = ` - - - Increase size - - - Decrease size - - - - Language - - - - - - Arabic - - - - - - - Chinese - - - - - + } + refreshing={false} + renderItem={[Function]} + scrollEventThrottle={0.0001} + stickyHeaderIndices={ + [ + 1, + 3, + 6, + 10, + ] + } + style={ + { + "backgroundColor": "white", + } + } + viewabilityConfig={ + { + "minimumViewTime": 3000, + "viewAreaCoveragePercentThreshold": 100, + "waitForInteraction": true, + } + } + > + + + - - English - + + + LIST HEADER + + + + - - - - Emoji - + + SECTION HEADER: + empty section + + + - - - - German - + + SECTION FOOTER: + empty section + + + - - - - Greek - + + SECTION HEADER: + s1 + + + - - + + + + SECTION SEPARATOR + + + + + Item In Header Section + - + Section s1 + + + + + + SECTION SEPARATOR + + + + + - - Hebrew - + + SECTION FOOTER: + s1 + + + - - - - Hindi - + + SECTION HEADER: + s2 + + + - - - + - Igbo - + > + + SECTION SEPARATOR + + + + + ITEM SEPARATOR + + + - - - + - Irish - + > + + SECTION SEPARATOR + + + - - - - Japanese - + + SECTION FOOTER: + s2 + + + - - - - Korean - - - - + } + > + + SECTION HEADER: + 0 - 9 + + + + + - - Norwegian - + + + + LIST FOOTER + + + + + + +`; + +exports[`snapshotAllPages Share 1`] = ` + + + Native Experience + + + Our top priority for React Native is to match the expectations people have for each platform. This is why React Native renders to platform primitives. We value native look-and-feel over cross-platform consistency. For example, the TextInput in React Native renders to a UITextField on iOS. This ensures that integration with password managers and keyboard controls work out of the box. By using platform primitives, React Native apps are also able to stay up-to-date with design and behavior changes from new releases of Android and iOS. + + + - - - Polish - - + SHARE + + + + +`; + +exports[`snapshotAllPages Share 2`] = ` + + + Massive Scale + + + Hundreds of screens in the Facebook app are implemented with React Native. The Facebook app is used by billions of people on a huge range of devices. This is why we invest in the most challenging problems at scale. Deploying React Native in our apps lets us identify problems that we wouldn’t see at a smaller scale. For example, Facebook focuses on improving performance across a broad spectrum of devices from the newest iPhone to many older generations of Android devices. This focus informs our architecture projects such as Hermes, Fabric, and TurboModules. + + + - - - Romanian - - + SHARE + - + + +`; + +exports[`snapshotAllPages Share 3`] = ` + + + action: + null + + + Create native apps + + + React Native combines the best parts of native development with React, a best-in-class JavaScript library for building user interfaces. + + + + - - - Russian - - + SHARE + - + + +`; + +exports[`snapshotAllPages SwipeableCard 1`] = ` +[ + + + - - - Swedish - - - - + + + + + Section # + 0 + + + + + + + + Section # + 1 + + + + + + + + Section # + 2 + + + + + + + + Section # + 3 + + + + + + + + Section # + 4 + + + + + + + + , + + + - - - Thai - - + + + + + Section # + 0 + + + + + + + + Section # + 1 + + + + + + + + Section # + 2 + + + + + + + + Section # + 3 + + + + + + + + Section # + 4 + + + + + - - - , +] +`; + +exports[`snapshotAllPages Switch 1`] = ` + + + + - The quick brown fox jumps over the lazy dog. + Off - - Alignment: - - + + On + + + +`; + +exports[`snapshotAllPages Switch 2`] = ` + + + - - - Left Align - - - - + + Off + + + + - - - Center Align - - - - + + On + + + +`; + +exports[`snapshotAllPages Switch 3`] = ` + + + + + + Off + + + + + + - - - Right Align - - - + On + `; -exports[`snapshotAllPages Text 8`] = ` -[ - - Sans-Serif - , - +`; + +exports[`snapshotAllPages Switch 5`] = ` + + - Sans-Serif Bold - , - + - Serif - , - + +`; + +exports[`snapshotAllPages Switch 6`] = ` + + - Serif Bold - , - + +`; + +exports[`snapshotAllPages Switch 7`] = ` + + - Monospace - , - + +`; + +exports[`snapshotAllPages Switch 8`] = ` + + - Monospace Bold (After 5.0) - , - + + + - Unknown Font Family - , -] + + + + `; -exports[`snapshotAllPages Text 9`] = ` +exports[`snapshotAllPages Text 1`] = ` - - - showSoftInputOnFocus: false - - - - - - -`; - -exports[`snapshotAllPages TextInput 20`] = ` - - - Uncontrolled: - - - - Controlled: - - - - - - - Update controlled Input - - - - - -`; - -exports[`snapshotAllPages TextInput 21`] = ` - - - Do not clear text on focus: - - - - Clear text on focus: - - - -`; - -exports[`snapshotAllPages TextInput 22`] = ` - - - Measure: - setTimeout - ( - fn, 200 - ) - - 0 - - - - - Measure: - setTimeout - ( - fn, 500 - ) - - 0 - - `; @@ -97530,154 +84513,6 @@ exports[`snapshotAllPages Touchable* and onPress 14`] = ` `; -exports[`snapshotAllPages Touchable* and onPress 15`] = ` - - - - Touchable Highlight (Control 1 in Set of 3) - - - - - Touchable Opacity (Control 2 in Set of 3) - - - - TouchableWithoutFeedback (Control 3 in Set of 3) - - -`; - exports[`snapshotAllPages TransferProperties 1`] = ` - - - - - RepeatedlyFetch - - - -