Add some more adjustments

packages/docs-reanimated/docs/debugging/accurate-call-stacks.mdx

@@ -6,9 +6,18 @@ sidebar_position: 1
 
 # Accurate Call Stacks
 
-When debugging Reanimated code, you may encounter error or warning call stacks that don’t clearly indicate the root cause of a problem. This occurs because, by default, React Native displays the entire call stack up to the point where the error was thrown or the warning was logged. This can be misleading, as it often highlights code from Reanimated internals instead of the specific problematic code within your project.
+When debugging Reanimated code, you may encounter error or warning call stacks that do not clearly indicate the root cause of the problem. These stacks can be misleading, as they often highlight code from Reanimated's internals rather than the misuse of the Reanimated API that is the source of the problem.
 
-To address this, Metro provides a way to enhance stack traces through the Metro `symbolicator`. Reanimated utilizes this feature by exporting a Metro config wrapper called `wrapWithReanimatedMetroConfig`. This wrapper configures the symbolicator to improve the accuracy of stack traces, making it easier to identify issues within your code.
+To address this, Reanimated provides a Metro configuration wrapper called `wrapWithReanimatedMetroConfig`. This wrapper automatically adjusts your Metro config to enhance the accuracy of call stacks in warnings and errors generated by the Reanimated library.
+
+<details>
+<summary>How does it work?</summary>
+
+By default, React Native displays the entire call stack up to the point where an error is thrown or a warning is logged, including all stack frames except those from the React Native source code.
+
+To modify this behavior, we can use the `symbolicator` field in the Metro config, which allows customization of the displayed stack frames. Reanimated leverages this feature to adjust which stack frames are **hidden** (**collapsed**) in the stack trace. By doing so, stack frames from Reanimated internals are hidden, ensuring that the stack trace only highlights the relevant parts of the call stack.
+
+</details>
 
 ## Reference
 
@@ -36,6 +45,16 @@ The following example shows the difference in call stacks before and after apply
 
 ## Remarks
 
+- The `wrapWithReanimatedMetroConfig` doesn't remove any stack frames from the call stack; it only collapses the frames that are not relevant to the user. Collapsed stack frames can be expanded by pressing on the **See N more frames** text at the bottom of the **Call Stack**.
+
+<Indent>
+
+| Collapsed                                                      | Expanded                                                     |
+| -------------------------------------------------------------- | ------------------------------------------------------------ |
+| ![Collapsed Call Stack](/img/debugging/CallStackCollapsed.png) | ![Expanded Call Stack](/img/debugging/CallStackExpanded.png) |
+
+</Indent>
+
 - Some errors, especially those caused by asynchronous code, may still result in stack traces that point to Reanimated internals rather than the specific line in your code that triggered the error. This happens because the stack trace loses track of the component or function that initiated the asynchronous operation.
 
 - Unfortunately, there's nothing you can do to prevent this behavior, as it's a limitation of how stack traces in asynchronous code are handled. You'll need to manually debug the issue based on the error message to identify the potential cause of the problem.

packages/docs-reanimated/docs/debugging/logger-configuration.mdx

@@ -60,6 +60,8 @@ A boolean value that enables or disables strict mode. When strict mode is enable
 
 - The `configureReanimatedLogger` function should be called before any Reanimated animations are created, e.g. in the root file of your app.
 
+- The `configureReanimatedLogger` function is intended for application developers. If you are creating a library that relies on Reanimated, do not include this function call in your library source code.
+
 ## Platform compatibility
 
 <PlatformCompatibility android ios web />

packages/docs-reanimated/docs/fundamentals/getting-started.mdx

@@ -169,7 +169,7 @@ To use Reanimated on the web all you need to do is to install and add [`@babel/p
 
     npx expo install @babel/plugin-proposal-export-namespace-from
 
-  </TabItem>
+  </TabItem>Custom animations
   <TabItem value="npm" label="NPM">
 
     npm install @babel/plugin-proposal-export-namespace-from