Fix/types (#149)

* release: 4.1.0

* release: 4.2.0

* fix: fix types

Author: onmotion

.commitlintrc.json

@@ -0,0 +1,24 @@
+{
+  "extends": ["@commitlint/config-conventional"],
+  "rules": {
+    "type-enum": [
+      2,
+      "always",
+      [
+        "build",
+        "chore",
+        "ci",
+        "docs",
+        "feat",
+        "fix",
+        "perf",
+        "refactor",
+        "revert",
+        "style",
+        "test",
+        "release"
+      ]
+    ],
+    "subject-case": [2, "never", ["sentence-case", "start-case", "pascal-case", "upper-case"]]
+  }
+}

.markdownlint.json

@@ -1,6 +1,7 @@
 {
     "default": true,
-    "MD007": { "indent": 4 },
+    "MD007": { "indent": 8 },
+    "MD045": false,
     "MD013": {"line_length": 800},
     "MD033": false,
     "no-hard-tabs": false

README.md

@@ -28,19 +28,19 @@ or download the [Expo Go](https://expo.dev/go) app and scan the QR code below
 ## Nav
 
 - [react-native-autocomplete-dropdown](#react-native-autocomplete-dropdown)
-    - [Demo](#demo)
-    - [Nav](#nav)
-    - [Installation](#installation)
-    - [Post-install Steps](#post-install-steps)
-        - [iOS](#ios)
-        - [Android](#android)
-    - [Usage](#usage)
-        - [Dataset item format](#dataset-item-format)
-        - [Example with local Dataset](#example-with-local-dataset)
-        - [Example with remote requested Dataset](#example-with-remote-requested-dataset)
-    - [Playground](#playground)
-    - [Options](#options)
-    - [Contribution](#contribution)
+        - [Demo](#demo)
+        - [Nav](#nav)
+        - [Installation](#installation)
+        - [Post-install Steps](#post-install-steps)
+                - [iOS](#ios)
+                - [Android](#android)
+        - [Usage](#usage)
+                - [Dataset item format](#dataset-item-format)
+                - [Example with local Dataset](#example-with-local-dataset)
+                - [Example with remote requested Dataset](#example-with-remote-requested-dataset)
+        - [Playground](#playground)
+        - [Options](#options)
+        - [Usage with a Modal](#usage-with-a-modal)
 
 ## Installation
 
@@ -85,6 +85,8 @@ Wrap your root component in `AutocompleteDropdownContextProvider` from `react-na
 </AutocompleteDropdownContextProvider>
 ```
 
+The dropdown position is relative to the `AutocompleteDropdownContextProvider`, so put this in the right place, it should cover all the screen/modal.
+
 If you have a header component, you can pass an offset.  For example with react navigation
 
 ```js
@@ -305,4 +307,22 @@ yarn android
 | `textInputProps` 	| text input props 	                                                                                              | TextInputProps 	| 	                                             |
 | `flatListProps` 	| props for \ component 	                                                                                         | FlatListProps\ 	| 	                                             |
 
-## Contribution
+## Usage with a Modal
+
+if you want to use the dropdown in a modal, you need to wrap the dropdown in another `AutocompleteDropdownContextProvider` inside the modal component
+
+```js
+    <Modal
+        visible={opened}
+        presentationStyle="formSheet"
+        animationType="slide"
+        onRequestClose={() => setOpened(false)}>
+        <SafeAreaView style={{ flex: 1, backgroundColor: 'transparent' }}>
+          <AutocompleteDropdownContextProvider>
+            <View style={{ paddingHorizontal: 20, flex: 1, paddingTop: 20 }}>
+              <AutocompleteDropdown {...props}/>
+            </View>
+          </AutocompleteDropdownContextProvider>
+        </SafeAreaView>
+    </Modal>
+```

example/package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-native-autocomplete-dropdown-playground",
-    "version": "4.0.0",
+    "version": "4.1.0",
     "private": true,
     "license": "MIT",
     "author": "Alexandr Kozhevnikov <[email protected]>",

package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-native-autocomplete-dropdown",
-    "version": "4.0.0",
+    "version": "4.2.0",
     "description": "Dropdown Item picker with search and autocomplete (typeahead) functionality for react native",
     "keywords": [
         "react-native",
@@ -48,11 +48,6 @@
         "tsc": "tsc --noEmit",
         "typecheck": "tsc --noEmit"
     },
-    "commitlint": {
-        "extends": [
-            "@commitlint/config-conventional"
-        ]
-    },
     "resolutions": {
         "@types/react": "^18.2.44"
     },

src/types/index.ts

@@ -11,7 +11,7 @@ export interface IAutocompleteDropdownRef {
   clear: () => void
   close: () => void
   blur: () => void
-  open: (params: { focused: false }) => Promise<void>
+  open: (params?: { focused: boolean }) => Promise<void>
   setInputText: (text: string) => void
   toggle: () => void
   setItem: (item: AutocompleteDropdownItem) => void