[component] Create Tooltip

[theoribbi]

Summary

Implement the Tooltip component for NativeUI, inspired by the shadcn/ui Tooltip.

Requirements

• Use Modal, View, and Pressable from react-native as base components.
• Support the following features:
  • Display informative text when users tap or long-press on an element.
  • Configurable placement: top, bottom, left, right.
  • Optional pointer (caret) to indicate the tooltip's target.
  • Controlled and uncontrolled visibility states.
  • Customizable delay before showing or hiding the tooltip.
  • Accessibility support with appropriate roles and labels.
• Style the component using nativewind utility classes.
• Allow passing a className prop to customize or extend the default styles.
• Ensure type safety with TypeScript.

Deliverables

• Create a tooltip.tsx file under /registry/tooltip.
• Follow the structure and naming conventions similar to shadcn/ui Tooltip.

References

• shadcn/ui Tooltip Documentation
• React Native Tooltip Example
• nativewind Documentation

Notes

Focus on creating a responsive and accessible Tooltip component that can be easily customized and integrated into various parts of the application. Consider potential use cases like providing additional information for icons, buttons, or form fields.

---