File tree Expand file tree Collapse file tree 4 files changed +19
-3
lines changed Expand file tree Collapse file tree 4 files changed +19
-3
lines changed Original file line number Diff line number Diff line change 3
3
# #
4
4
# # Get latest from https://github.com/github/gitignore/blob/master/VisualStudio.gitignore
5
5
6
+ .DS_Store
7
+
6
8
# User-specific files
7
9
* .rsuser
8
10
* .suo
Original file line number Diff line number Diff line change @@ -79,6 +79,20 @@ Wrap your root component in `AutocompleteDropdownContextProvider` from `react-na
79
79
< / AutocompleteDropdownContextProvider>
80
80
```
81
81
82
+ If you have a header component, you can pass an offset. For example with react navigation
83
+
84
+ ``` js
85
+ // ...
86
+ import { useHeaderHeight } from ' @react-navigation/elements' ;
87
+ // ...
88
+ const headerHeight = useHeaderHeight ();
89
+ // ...
90
+
91
+ < AutocompleteDropdownContextProvider headerOffset= {headerHeight} >
92
+ < AppRootOrWhatever/ >
93
+ < / AutocompleteDropdownContextProvider>
94
+ ```
95
+
82
96
import the package
83
97
84
98
``` js
Original file line number Diff line number Diff line change @@ -20,7 +20,7 @@ export const AutocompleteDropdownContext = React.createContext<IAutocompleteDrop
20
20
activeInputRef : undefined
21
21
} )
22
22
23
- export const AutocompleteDropdownContextProvider : FC < any > = ( { children } ) => {
23
+ export const AutocompleteDropdownContextProvider : FC < any > = ( { headerOffset = 0 , children } ) => {
24
24
const [ content , setContent ] = useState < IAutocompleteDropdownContext [ 'content' ] > ( )
25
25
const [ direction , setDirection ] = useState < IAutocompleteDropdownContext [ 'direction' ] > ( undefined )
26
26
const [ show , setShow ] = useState ( false )
@@ -42,14 +42,14 @@ export const AutocompleteDropdownContextProvider: FC<any> = ({ children }) => {
42
42
43
43
if ( dropdownHeight && direction === 'up' ) {
44
44
setContentStyles ( {
45
- top : inputMeasurements . y - dropdownHeight - 10 ,
45
+ top : inputMeasurements . y - dropdownHeight - 10 - headerOffset ,
46
46
left : inputMeasurements . x ,
47
47
width : inputMeasurements . width
48
48
} )
49
49
setOpacity ( 1 )
50
50
} else if ( direction === 'down' ) {
51
51
setContentStyles ( {
52
- top : inputMeasurements . y + inputMeasurements . height + 5 ,
52
+ top : inputMeasurements . y + inputMeasurements . height + 5 - headerOffset ,
53
53
left : inputMeasurements . x ,
54
54
width : inputMeasurements . width
55
55
} )
You can’t perform that action at this time.
0 commit comments