diff --git a/packages/core/docs/AMAProvider.md b/packages/core/docs/AMAProvider.md index ea8adecf..6cc0155d 100644 --- a/packages/core/docs/AMAProvider.md +++ b/packages/core/docs/AMAProvider.md @@ -6,7 +6,7 @@ The provider manages the failure message that appears when AMA accessibility fai ## Usage ```jsx {1-4,8-9} -import { AMAProvider } from 'react-native-ama'; +import { AMAProvider } from '@react-native-ama/core'; const App = () => { return ( @@ -36,7 +36,7 @@ export type AMAContextValue = { }; ``` -Check [useAMAContext](../hooks/useAMAContext) for more info. +Check [useAMAContext](./hooks/useAMAContext.md) for more info. :::dev diff --git a/packages/core/docs/core.md b/packages/core/docs/core.md index b62933d3..13c64af5 100644 --- a/packages/core/docs/core.md +++ b/packages/core/docs/core.md @@ -18,22 +18,31 @@ npm install @react-native-ama/core ### Config File -If you install the `react-native-ama` package, the ama.rules.json file should be generated automatically. In case it doesn't generate automatically: +When you install the `@react-native-ama/core` package, the ama.rules.json file should be generated automatically. In cases it doesn't generate automatically, run the following from the root of your project: ```bash +# Create ama.rules.json with an empty JSON object if it doesn't exist echo "{}" >> ama.rules.json -cd node_modules/react-native-ama -ln -s ../../ama.rules.json . + +# Navigate to the internal directory +cd node_modules/@react-native-ama/internal + +# Create symlinks in src and dist directories +ln -s ../../../ama.rules.json src/ama.rules.json +ln -s ../../../ama.rules.json dist/ama.rules.json + +# Go back to the root directory +cd - ``` -For more detailed information about the config file, please refer to [this documentation](/config-file). +For more detailed information about the config file, please refer to [this documentation](../../../website/docs/ama/config-file.md). ## Usage -You must include the [AMAProvider](../components/AMAProvider) in your app, as some components and hooks require it. +You must include the [AMAProvider](./AMAProvider.md) in your app, as some components and hooks require it. ```jsx {1-4,8-9} -import { AMAProvider } from 'react-native-ama'; +import { AMAProvider } from '@react-native-ama/core'; const App = () => { return ( diff --git a/packages/core/docs/hooks/useAMAContext.md b/packages/core/docs/hooks/useAMAContext.md index 4931fc30..ed145c60 100644 --- a/packages/core/docs/hooks/useAMAContext.md +++ b/packages/core/docs/hooks/useAMAContext.md @@ -5,7 +5,7 @@ The hook provides information on various accessibility services and can be used ## Usage ```js title=packages/core/src/hooks/useAMAContext.ts -import { useAMAContext } from 'react-native-ama'; +import { useAMAContext } from '@react-native-ama/core'; const { isReduceTransparencyEnabled: boolean, @@ -69,7 +69,7 @@ animation: 'default' | 'fade'; #### Example -```jsx {1-5,7-10} +```jsx {2-5,7-10} const { reactNavigationScreenOptions } = useAMAContext(); return ( diff --git a/packages/core/docs/hooks/useFocus.md b/packages/core/docs/hooks/useFocus.md index 0a59496e..b8319e4c 100644 --- a/packages/core/docs/hooks/useFocus.md +++ b/packages/core/docs/hooks/useFocus.md @@ -5,8 +5,8 @@ the [setFocus](#set-focus-programmatically) function. ## Usage -```tsx -import { useFocus } from 'react-native-ama'; +```tsx {1-2} +import { useFocus } from '@react-native-ama/core'; const { setFocus } = useFocus(refComponent); ``` @@ -22,9 +22,9 @@ const { setFocus } = useFocus(refComponent); Automatically focus the `` component when _MyFancyScreen_ is mounted: ```tsx +import { useFocus } from '@react-native-ama/core'; import * as React from 'react'; import { Text } from 'react-native'; -import { useFocus } from 'react-native-ama'; const MyFancyScreen = () => { const componentRef = React.useRef(null); @@ -45,9 +45,10 @@ const MyFancyScreen = () => { ### Set focus programmatically ```tsx +import { useFocus } from '@react-native-ama/core'; +import { Pressable } from '@react-native-ama/react-native'; import * as React from 'react'; import { Text } from 'react-native'; -import { Pressable, useFocus } from 'react-native-ama'; const MyFancyScreen = () => { const componentRef = React.useRef(null); @@ -68,4 +69,4 @@ const MyFancyScreen = () => { ## Related guidelines -- [Focus](/guidelines/focus) +- [Focus](../../../../website/guidelines/focus.md) diff --git a/packages/core/docs/hooks/useTimedAction.md b/packages/core/docs/hooks/useTimedAction.md index 85d2a3b9..90c13e0d 100644 --- a/packages/core/docs/hooks/useTimedAction.md +++ b/packages/core/docs/hooks/useTimedAction.md @@ -4,10 +4,10 @@ This hook allows to execute (or not) a callback respecting the user "Time to tak ## Usage -```jsx -import {useTimedAction} from 'react-native-ama'; +```jsx {1-2} +import { useTimedAction } from '@react-native-ama/core'; -const {onTimeout} = useTimedAction(); +const { onTimeout } = useTimedAction(); ``` ### onTimeout @@ -28,10 +28,10 @@ async onTimeout(callback, timeInMilliseconds) ```jsx await onTimeout(() => { - setShowContent(false); + setShowContent(false); }, 30 * 1000); ``` ## Related guidelines -- [Timed actions](../guidelines/timed-actions) +- [Timed actions](../../../../website/guidelines/timed-actions.md)