Updates core docs usage and links (#227)

* update AMAProvider * update useAMAContext doc * update useFocus hook doc * update useTimedAction hook doc * update core.md config, links and usage * fix type
FormidableLabs · Aug 7, 2024 · a45d61a · a45d61a
1 parent db5d6f1
commit a45d61a
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 20 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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 `<Text />` 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<Text>(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<Text>(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
@@ -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)