useAMAContext

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

Usage

packages/core/src/hooks/useAMAContext.ts

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

iOS

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

isBoldTextEnabled

iOS

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

isGrayscaleEnabled

iOS

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

isInvertColorsEnabled

iOS

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';

• animationEnabled is true is isReduceMotionEnabled is false
• animation is default isReduceMotionEnabled is false

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:

name	type	description
uniqueID	string	The 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:

name	type	description
uniqueID	string	The component unique ID