diff --git a/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js b/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js
index 001464fd63d..6133080a4ad 100644
--- a/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js
+++ b/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js
@@ -1024,6 +1024,72 @@ class EnabledExample extends React.Component<
}
}
+class DisplayOptionsStatusExample extends React.Component<{}> {
+ render(): React.Node {
+ const isAndroid = Platform.OS === 'android';
+ return (
+
+
+
+ {isAndroid ? null : (
+ <>
+
+
+
+
+ >
+ )}
+
+ );
+ }
+}
+
+function DisplayOptionStatusExample({optionName, optionChecker, notification}) {
+ const [statusEnabled, setStatusEnabled] = React.useState(false);
+ React.useEffect(() => {
+ AccessibilityInfo.addEventListener(notification, setStatusEnabled);
+ optionChecker().then(isEnabled => {
+ setStatusEnabled(isEnabled);
+ });
+ return function cleanup() {
+ AccessibilityInfo.removeEventListener(notification, setStatusEnabled);
+ };
+ }, [optionChecker, notification]);
+ return (
+
+
+ {optionName}
+ {' is '}
+ {statusEnabled ? 'enabled' : 'disabled'}.
+
+
+ );
+}
+
exports.title = 'Accessibility';
exports.documentationURL = 'https://reactnative.dev/docs/accessibilityinfo';
exports.description = 'Examples of using Accessibility APIs.';
@@ -1058,6 +1124,12 @@ exports.examples = [
return ;
},
},
+ {
+ title: 'Check if the display options are enabled',
+ render(): React.Element {
+ return ;
+ },
+ },
{
title: 'Check if the screen reader announces',
render(): React.Element {