-
Notifications
You must be signed in to change notification settings - Fork 16
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Update home docs for
next
version (#231)
* update getting-started doc * fix links in config file to be url links * Add explicit sidebar
- Loading branch information
Showing
4 changed files
with
53 additions
and
29 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,40 +1,55 @@ | ||
--- | ||
sidebar_position: 1 | ||
displayed_sidebar: docs | ||
--- | ||
|
||
# Getting started | ||
|
||
AMA is made of the following packages: | ||
|
||
- `react-native-ama` the core components and hooks | ||
- `react-native-ama/animations` to create accessible animations | ||
- `react-native-ama/forms` to create accessible forms | ||
- `react-native-ama/lists` to create accessible lists | ||
- `react-native-ama/react-native` for accessibility-first React Native replacement components | ||
- `@react-native-ama/core`: the core components and hooks, providers and consumers used by AMA packages | ||
- `@react-native-ama/animations`: to create accessible animations | ||
- `@react-native-ama/react-native`: for accessibility-first React Native replacement components | ||
- `@react-native-ama/forms`: to create accessible forms | ||
- `@react-native-ama/lists`: to create accessible lists | ||
- `@react-native-ama/extras`: extra compound components and hooks beyond the scope of the base React Native components for building accessible react native apps | ||
|
||
## Setup | ||
|
||
The `core` package, is the minimum installable setup for AMA to function. This package contains the AMA context provider and consumer as well various other hooks and utilities for focusing, WCAG checks, accessibility tree management, etc. | ||
|
||
Start off by installing `core` and then any other packages you wish to make use of for building an accessible mobile app. | ||
|
||
```bash npm2yarn | ||
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. If this didn't happen you can run the following from the root of your project: | ||
|
||
```bash | ||
|
||
echo "{}" >> ama.rules.json | ||
cd node_modules/react-native-ama | ||
ln -s ../../ama.rules.json . | ||
cd node_modules/@react-native-ama/internal | ||
ln -s ../../../ama.rules.json src/ama.rules.json | ||
ln -s ../../../ama.rules.json dist/ama.rules.json | ||
cd - | ||
``` | ||
|
||
See more on configuring AMA rules and severity [here](./config-file.md). | ||
|
||
### Jest | ||
|
||
When running a test, if jest fails with the following error: | ||
|
||
> Cannot find module './../../ama.rules.json' from 'node_modules/react-native-ama/dist/commonjs/internal/logger.js' | ||
> Cannot find module './../../ama.rules.json' from 'node_modules/@react-native-ama/internal/dist/utils/logger.js' | ||
add those lines to the `.jest.config.js` file: | ||
Add the following mock to your jest setup file which can be configured via the `.jest.config.js` or `.jest.config.ts` file (see [setupFilesAfterEnv](https://jestjs.io/docs/configuration#setupfilesafterenv-array)): | ||
|
||
```js | ||
jest.mock('react-native-ama/dist/commonjs/internal/logger.js', () => { | ||
```js title="setup-jest.js" | ||
jest.mock('@react-native-ama/internal/dist/utils/logger.js', () => { | ||
return { | ||
getContrastCheckerMaxDepth: () => 5, | ||
shouldIgnoreContrastCheckForDisabledElement: () => true, | ||
}; | ||
}); | ||
``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,7 @@ | ||
--- | ||
displayed_sidebar: docs | ||
--- | ||
|
||
# Usage | ||
|
||
## Installation | ||
|