Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: updated guideline links #313

Merged
merged 6 commits into from
Jan 27, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion website/docs/ama/usage.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ npm install @react-native-ama/core

## Wrap App with Provider

You need to add the [AMAProvider](../components/AMAProvider) to your app as it is needed by the components, hooks, and to provide information about accessbility violations.
You need to add the [AMAProvider](/core/components/AMAProvider) to your app as it is needed by the components, hooks, and to provide information about accessibility violations.

```jsx {1-4,8-9}
import { AMAProvider } from '@react-native-ama/core';
Expand Down
10 changes: 5 additions & 5 deletions website/guidelines/accessibility-label.md
Original file line number Diff line number Diff line change
Expand Up @@ -157,15 +157,15 @@ This is used when a component has the `accessibilityLabel` prop in all caps.

:::tip

Is it possible to specify a list of allowed all caps accessibility labels, [more info here](/guidelines/guidelines.md)
Is it possible to specify a list of allowed all caps accessibility labels, [more info here](/guidelines)
:::

## Related AMA components

- [ExpandablePressable](/core/components/expandablepressable)
- [Pressable](/core/components/pressable)
- [TouchableOpacity](/core/components/touchableopacity)
- [TouchableWithoutFeedback](/core/components/TouchableWithoutFeedback)
- [ExpandablePressable](/react-native/components/expandablepressable)
- [Pressable](/react-native/components/pressable)
- [TouchableOpacity](/react-native/components/touchableopacity)
- [TouchableWithoutFeedback](/react-native/components/TouchableWithoutFeedback)

## External resources

Expand Down
8 changes: 4 additions & 4 deletions website/guidelines/accessibility-role.md
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@ This rule is mandatory and cannot be turned off!

## Related AMA components

- [ExpandablePressable](/core/components/expandablepressable)
- [Pressable](/core/components/pressable)
- [TouchableOpacity](/core/components/touchableopacity)
- [TouchableWithoutFeedback](/core/components/TouchableWithoutFeedback)
- [ExpandablePressable](/react-native/components/expandablepressable)
- [Pressable](/react-native/components/pressable)
- [TouchableOpacity](/react-native/components/touchableopacity)
- [TouchableWithoutFeedback](/react-native/components/TouchableWithoutFeedback)
25 changes: 10 additions & 15 deletions website/guidelines/accessibility-states.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,8 +49,7 @@ const AddToCart = ({ productID }: { productID: string }) => {
accessibilityLabel="Add to cart"
accessibilityRole="button"
ariaBusy={isAddingToCart}
onPress={isAddingToCart ? undefined : onPress}
>
onPress={isAddingToCart ? undefined : onPress}>
{isAddingToCart} ? <ActivityIndicator /> : <Text>Add to cart</Text>
</Pressable>
);
Expand Down Expand Up @@ -119,8 +118,7 @@ export const ToggleButton = ({ checked, label }: ToggleButtonProps) => {
<Pressable
accessibilityLabel={label}
ariaChecked={checked}
ariaRole="button"
>
ariaRole="button">
{label}
</Pressable>
);
Expand Down Expand Up @@ -173,8 +171,7 @@ const AddToCart = ({ disabled }) => {
<Pressable
accessibilityLabel="Add to cart"
accessibilityRole="button"
disabled={disabled}
>
disabled={disabled}>
Add to cart
</Pressable>
);
Expand Down Expand Up @@ -221,8 +218,7 @@ export const Content = ({ content }) => {
accessibilityLabel="Show more"
accessibilityRole="button"
ariaExpanded={isShowingMore}
onPress={() => setIsShowingMore(showMore => !showMore)}
>
onPress={() => setIsShowingMore(showMore => !showMore)}>
{isShowingMore ? 'Show less' : 'Show more'}
</Pressable>
</View>
Expand Down Expand Up @@ -262,14 +258,13 @@ Indicates whether a selectable element is currently selected or not.

### Screen Reader behaviour

```jsx {1-5,7-19,21-99}
```jsx {1-5,7-18,20-99}
const OptionButton = ({ selected, label }) => {
return (
<Pressable
accessibilityLabel={label}
accessibilityRole="button"
ariaSelected={selected}
>
ariaSelected={selected}>
<Text>{label}</Text>
</Pressable>
);
Expand Down Expand Up @@ -306,10 +301,10 @@ const TestScreen = () => {

## Related AMA components

- [ExpandablePressable](/core/components/expandablepressable)
- [Pressable](/core/components/pressable)
- [TouchableOpacity](/core/components/touchableopacity)
- [TouchableWithoutFeedback](/core/components/TouchableWithoutFeedback)
- [ExpandablePressable](/react-native/components/expandablepressable)
- [Pressable](/react-native/components/pressable)
- [TouchableOpacity](/react-native/components/touchableopacity)
- [TouchableWithoutFeedback](/react-native/components/TouchableWithoutFeedback)

## External references

Expand Down
12 changes: 6 additions & 6 deletions website/guidelines/animations.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,11 +28,11 @@ Some people might turn off animation on the device because moving content can di

## Related AMA components & hooks

- [AnimatedContainer](../components/animatedcontainer)
- [BottomSheet](../components/bottomsheet)
- [useAMAContext](../hooks/useAMAContext)
- [useAnimation](../hooks/useAnimation)
- [useAnimationDuration](../hooks/useanimationduration)
- [useReanimatedTiming](../hooks/useReanimatedTiming)
- [AnimatedContainer](/animations/components/animatedcontainer)
- [BottomSheet](/extras/components/bottomsheet)
- [useAMAContext](/core/hooks/useAMAContext)
- [useAnimation](/animations/hooks/useAnimation)
- [useAnimationDuration](/animations/hooks/useanimationduration)
- [useReanimatedTiming](/animations/hooks/useReanimatedTiming)

[^1]: If removed, it would fundamentally change the information or functionality of the content, and information and functionality cannot be achieved in another way that would conform. Basic content scrolling is considered an essential function and is excluded from this requirement.
10 changes: 5 additions & 5 deletions website/guidelines/contrast.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,11 +42,11 @@ The visual presentation of text and images of text has a contrast ratio of at le

AMA performs a contrast check between the component background and its children for:

- [ExpandablePressable](../components/expandablepressable)
- [Pressable](../components/pressable)
- [TouchableOpacity](../components/touchableopacity)
- [TouchableWithoutFeedback](../components/TouchableWithoutFeedback)
- [usePressable](/hooks/usePressable)
- [ExpandablePressable](/react-native/components/expandablepressable)
- [Pressable](/react-native/components/pressable)
- [TouchableOpacity](/react-native/components/touchableopacity)
- [TouchableWithoutFeedback](/react-native/components/TouchableWithoutFeedback)
- [usePressable](/react-native/hooks/usePressable)

The check is performed on the component children and sub children up to a depth level of [5](./custom-log-rules.md#constants).

Expand Down
18 changes: 9 additions & 9 deletions website/guidelines/forms.md
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@ When on TextInput, the user should be able to access the next field or submit th

:::tip

The built-in [TextInput](../components/TextInput) automatically handles the `returnKeyLabel` property and its action.
The built-in [TextInput](/forms/components/TextInput) automatically handles the `returnKeyLabel` property and its action.

:::

Expand All @@ -132,15 +132,15 @@ Alternatively, the first failed field should be autofocused if no message is ava

### NO_FORM_LABEL

This error is used when no label has been provided for the [TextInput](../components/TextInput) component.
This error is used when no label has been provided for the [TextInput](/forms/components/TextInput) component.

### NO_FORM_ERROR

This error is used when no error has been provided for the [TextInput](../components/TextInput) component.
This error is used when no error has been provided for the [TextInput](/forms/components/TextInput) component.

### NO_KEYBOARD_TRAP <MustNot />

This error is triggered by the [TextInput](../components/TextInput) component if the next input field does not have the focus as expected.
This error is triggered by the [TextInput](/forms/components/TextInput) component if the next input field does not have the focus as expected.

:::note

Expand All @@ -149,8 +149,8 @@ This rule cannot be turned off!

## Related AMA components

- [Form](../components/form)
- [FormField](../components/formfield)
- [SwitchListItem](../components/switchlistitem)
- [SwitchWrapper](../components/switchwrapper)
- [TextInput](../components/textinput)
- [Form](/forms/components/form)
- [FormField](/forms/components/formfield)
- [SwitchListItem](/react-native/components/switchlistitem)
- [SwitchWrapper](/react-native/components/switchwrapper)
- [TextInput](/forms/components/textinput)
Loading