diff --git a/packages/core/docs/AMAProvider.md b/packages/core/docs/components/AMAProvider.md
similarity index 100%
rename from packages/core/docs/AMAProvider.md
rename to packages/core/docs/components/AMAProvider.md
diff --git a/packages/core/docs/components/AutofocusContainer.md b/packages/core/docs/components/AutofocusContainer.md
new file mode 100644
index 00000000..35e8306e
--- /dev/null
+++ b/packages/core/docs/components/AutofocusContainer.md
@@ -0,0 +1,59 @@
+# AutofocusContainer
+
+It is a utility component that automatically calls the [useFocus](../hooks/useFocus) hook when it is mounted.
+
+## Usage
+
+```jsx
+import { AutofocusContainer } from 'react-native-ama';
+
+<AutofocusContainer>{children}</AutofocusContainer>;
+```
+
+## Example
+
+This component can be used to move the focus on dynamically shown components, for example:
+
+```jsx title="UseTimedAction.screen.tsx"
+<View style={styles.centeredView}>
+  <CTAPressable title="Show timed content" onPress={handleOnPress} />
+  {showContent ? (
+    <AutofocusContainer>
+      <Text>Great! You did it :)</Text>
+      <Spacer height="big" />
+      <CTAPressable title="Show home screen" />
+    </AutofocusContainer>
+  ) : null}
+</View>
+```
+
+In this example, we want to move the focus to the view rendered once the user taps on "Show timed content".
+
+## Accessibility
+
+- Once the focus is moved makes, the screen reader announces all the text present in that container
+
+## Props
+
+### `accessibilityLabel`
+
+The label to assign to the wrapping View container.
+
+### `wrapChildrenInAccessibleView`
+
+Weather or not the child should be wrapped in an accessible View. By default, this is the case.
+
+:::warning
+**Autofocus may not work as expected when this prop is false!**
+
+If `wrapChildrenInAccessibleView` is set to `false` the children of the AutofocusContainer will not be wrapped in an accessible view and **autofocus** will only works if the container contains accessible elements, like Text, Buttons, etc.
+
+:::
+
+| Type    | Default |
+| ------- | ------- |
+| boolean | true    |
+
+## Related guidelines
+
+- [Focus](/guidelines/focus)
diff --git a/packages/core/docs/components/_category_.json b/packages/core/docs/components/_category_.json
new file mode 100644
index 00000000..92f583da
--- /dev/null
+++ b/packages/core/docs/components/_category_.json
@@ -0,0 +1,5 @@
+{
+  "label": "Components",
+  "collapsible": true,
+  "collapsed": false
+}
diff --git a/packages/core/docs/core.md b/packages/core/docs/core.md
index df2e0135..f5d0cb80 100644
--- a/packages/core/docs/core.md
+++ b/packages/core/docs/core.md
@@ -39,7 +39,7 @@ For more detailed information about the config file, please refer to [this docum
 
 ## Usage
 
-You must include the [AMAProvider](./AMAProvider.md) in your app, as some components and hooks require it.
+You must include the [AMAProvider](./components/AMAProvider.md) in your app, as some components and hooks require it.
 
 ```jsx {2-4,6,8-9}
 import { AMAProvider } from '@react-native-ama/core';
diff --git a/packages/core/docs/hooks/_category_.json b/packages/core/docs/hooks/_category_.json
index 2a88a556..15dc8a9e 100644
--- a/packages/core/docs/hooks/_category_.json
+++ b/packages/core/docs/hooks/_category_.json
@@ -1,3 +1,5 @@
 {
-  "label": "Hooks"
+  "label": "Hooks",
+  "collapsible": true,
+  "collapsed": false
 }