fix: multiple typos and unclear sentences fixed in the readme

Author: FanchenBao

README.md

@@ -109,7 +109,7 @@ The example app is running from [`./example/App.tsx`](./example/App.tsx)
 | `sensitivity`              | `number`                                 | `10`       | The amount of pixels a drawer needs to slide to trigger state change (peek to open or open to peek). The smaller the value, the more sensitive the state change. Default to 10.                |
 | `expandable`               | `boolean`                                | `true`     | A flag indicating whether a drawer is static (non-expandable) or dynamic (expandable). Default to true, i.e. the drawer is dynamic.                                                            |
 | `isInitialPeek`            | `boolean`                                | `true`     | A flag indicating whether the initial state of the drawer is peek or open. Default to true, i.e. the initial state is peek.                                                                    |
-| `enableSlideOpen`       | `boolean`                                | `true`    | A flag indicating whether a drawer can be opened with sliding (e.g. open upon a button press). Default to true.                                                                            |
+| `enableSlideOpen`       | `boolean`                                | `true`    | A flag indicating whether a drawer can be opened with sliding. Default to true.                                                                            |
 | `enableNonSlideOpen`       | `boolean`                                | `false`    | A flag indicating whether a drawer can be opened without sliding (e.g. open upon a button press). Default to false.                                                                            |
 | `nonSlideOpen`             | `boolean`                                | `false`    | A flag indicating whether to open or close a drawer. Applicable only when `enableNonSlideOpen` is set to true. Default to false, i.e. to close the drawer.                                     |
 | `onDrawerOpen`             | `() => void`                             | `() => {}` | A callback function when the drawer reaches the open state. See the caveat section for the particularity of its usage. Default to a no-operation function.                                     |
@@ -128,7 +128,7 @@ Some caveats and gotchas while using `react-native-sliding-drawer`
 
 `<SlidingDrawer></SlidingDrawer>` is sensitive to position. Its own position prop is set to "absolute", but if some of its parent components have restricting positioning or sizing, the rendered sliding drawer might have unexpected height, width, peek size, etc. It is thus highly recommended that `<SlidingDrawer></SlidingDrawer>` has as few parents as possible (i.e. it is coded as close to top level component as possible). This way, there is less risk of the sliding drawer being constraint by some other components. If, however, the sliding drawer must be deeply nested, make sure that each of its parent has loose positioning or sizing.
 
-For instance, the minimal workable example is a valid way use `<SlidingDrawer></SlidingDrawer>`, because its parent spreads the entire screen. However, if we put a restricting style on the parent such as the one shown below
+For instance, the minimal workable example is a valid way to use `<SlidingDrawer></SlidingDrawer>`, because its parent spreads the entire screen. However, if we put a restricting style on the parent such as the one shown below
 
 ```js
 import * as React from 'react';
@@ -145,7 +145,7 @@ const App = () => {
         justifyContent: 'center',
         alignItems: 'center',
         backgroundColor: 'yellow',
-        width: 100,
+        width: 100, // restricting style
       }}>
       <Text>Minimal Example</Text>
       <SlidingDrawer peekSize={peekSize} openSize={openSize} fixedLoc="bottom">
@@ -165,7 +165,7 @@ const App = () => {
 export default App;
 ```
 
-The sliding drawer no longer behaves as expected
+The sliding drawer no longer behaves as expected (it doesn't cover the entire width of the screen)
 
 ![Sliding drawer under a restricting parent](./docs/images/caveats/restrictingParent/problem.gif)
 
@@ -185,7 +185,7 @@ const App = () => {
           justifyContent: 'center',
           alignItems: 'center',
           backgroundColor: 'yellow',
-          width: 100,
+          width: 100, // restricting style
         }}>
         <Text>Minimal Example</Text>
       </View>
@@ -204,7 +204,7 @@ const App = () => {
 };
 ```
 
-Now the sliding drawer behavior is normal
+Now the sliding drawer behavior is normal (drawer covers the entire width of the screen)
 
 ![Sliding drawer taken out of a restricting parent](./docs/images/caveats/restrictingParent/solution.gif)
 
@@ -284,12 +284,12 @@ export default App;
 
 ![Sliding does not work with dynamic variable](./docs/images/caveats/dynamicCallbackInSliding/problem.gif)
 
-The desired behavior is that each time the drawer opens or closes, the counter counts up. We can see that the desired behavior is achieved using the non-slide open feature. However, when the drawer slides open or close, the counter gets stuck at 1. This is `onDrawerOpen` and `onDrawerPeek` are cached in a ref (hence, the value in `count` is forever the initialized value, which is 0) when the drawer is opened or closed via sliding. Any further change to `count` does not alter its cached value inside the ref. On the other hand, the two callbacks are NOT cached when the drawer is opened or closed via the non-slide open feature. Hence, the value in `count` does change.
+The desired behavior is that each time the drawer opens or closes, the counter counts up. We can see that the desired behavior is achieved using the non-slide open feature. However, when the drawer slides open or close, the counter gets stuck at 1. This is because `onDrawerOpen` and `onDrawerPeek` are cached in a ref when the drawer is opened or closed via sliding. Hence, the value in `count` is forever the initialized value, which is 0. Any further change to `count` does not alter its cached value inside the ref. On the other hand, if the drawer is opened or closed via the non-slide open feature, the callbacks are NOT cached; thus, their value in `count` does change.
 
 There are two ways to work around this limtation.
 
 1. If the values in the callback can be hard coded, do it! For instance, instead of using `setIsInitialPeek(!isInitialPeek)` for both `onDrawerOpen` and `onDrawerPeek`, hard code the true and false value.
-2. If including dynamic variables is inevitable for the two callbacks, consider disabling the slide open feature. This can be achieved by setting the prop `enableSlideOpen` to false.
+2. If including dynamic variables is inevitable for the two callbacks, consider disabling the slide open feature. In other words, force the user to open the drawer via the non-slide open feature, such that the callback is always executed as desired. This can be achieved by setting the prop `enableSlideOpen` to false.
 
 Of course, if anyone has a solution to directly resolve this issue, please share your thoughts and open a pull request.