You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
|`targetRef`|`React.RefObject`| Yes | - | Reference to the component you want to highlight |
76
+
|`children`|`React.ReactNode`| Yes | - | Content to display in the tooltip |
77
+
|`onRequestClose`|`() => void`| Yes | - | Function called when the tooltip should be closed |
78
+
|`tooltipPosition`|`TooltipPosition`| No | 'bottom' | Position of the tooltip relative to the target |
79
+
|`offset`|`{ x?: number; y?: number }`| No |`{ x: 0, y: 0 }`| Offset for tooltip positioning |
80
+
|`allowOverlap`|`boolean`| No |`false`| Whether to allow tooltip to overlap with the target |
81
+
|`androidOffsetY`|`number`| No |`0`| Y-axis offset applied on Android to correct coordinate misalignment |
81
82
82
83
### TooltipPosition Types
83
84
@@ -125,6 +126,26 @@ You can customize the tooltip's appearance by wrapping your content in a styled
125
126
</HighlightToolTip>
126
127
```
127
128
129
+
### Coordinate Measurement Correction (Android)
130
+
131
+
If you notice that the highlight position is slightly off on Android devices—often due to varying status-bar or navigation-bar heights—you can supply `androidOffsetY` to nudge the measured Y-coordinate.
132
+
133
+
```jsx
134
+
<HighlightToolTip
135
+
targetRef={targetRef}
136
+
androidOffsetY={-24} // moves the highlight 24px upward on Android
> Use positive values to push the highlight downward and negative values to pull it upward. On iOS this prop is ignored, so you can safely leave the same code across platforms.
148
+
128
149
## Contributing
129
150
130
151
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
0 commit comments