Skip to main content

useAMAContext

The hook provides information on various accessibility services and can be used to trigger the AMA error banner.

Usage

import { useAMAContext } from 'react-native-ama';

const {
isReduceTransparencyEnabled: boolean,
isBoldTextEnabled: boolean,
isGrayscaleEnabled: boolean,
isInvertColorsEnabled: boolean,
isReduceMotionEnabled: boolean,
isScreenReaderEnabled: boolean,
reactNavigationScreenOptions: {
animationEnabled: boolean;
animation: 'default' | 'fade';
}
trackError: (id: string) => void; // dev mode only
removeError: (id: string) => void; // dev mode only
} = useAMAContext();
Dev mode only!

The trackError and removeError functions are available only when the DEV flag is true. These functions are stripped from the production code!

Properties

isReduceTransparencyEnabled

Is true if the user switched on the accessibility setting: Reduce Transparency.

isBoldTextEnabled

Is true if the user switched on the accessibility setting: Bold Text.

isGrayscaleEnabled

Is true if the user switched on the accessibility setting: Grayscale.

isInvertColorsEnabled

Is true if the user switched on the accessibility setting: Invert colors.

isReduceMotionEnabled

Is true if the user switched on the accessibility setting: Reduce motion on iOS or switches off the Animations on Android.

isScreenReaderEnabled

Is true if the user is using a screen reader, like VoiceOver or Talkback.

reactNavigationScreenOptions

Returns an object to be used for the React Navigation screenOptions prop. It's an object containing the following values:

animationEnabled: boolean;
animation: 'default' | 'fade';

Example

const { reactNavigationScreenOptions } = useAMAContext();

return (
<NavigationContainer>
<Stack.Navigator
screenOptions={reactNavigationScreenOptions}>
{/* ... */}
</Stack.Navigator>
</NavigationContainer>
)

Methods

Dev mode only!

The following methods are only available when DEV is set to true

trackError

trackError(uniqueID: string): void;

The function adds the failed item to an internal list that keeps track of components that have not passed the accessibility checks.

Parameters:

nametypedescription
uniqueIDstringThe component unique ID. This is used to prevent adding the same component(s) after re-rendering(s)

removeError

removeError(uniqueID: string): void;

The function removes the failed item from the list of failed accessibility checks.

note

The AMA error banner is automatically hidden when the list of failed items becomes empty.

Parameters:

nametypedescription
uniqueIDstringThe component unique ID