Natural Pleistocene Monsters

    react-native-tooltip-alert
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.0 • Public • Published

    react-native-tooltip-alert

    npm version npm downloads

    Showcase iOS Showcase Android

    Installation

    npm i react-native-tooltip-alert --save
    

    or

    yarn add react-native-tooltip-alert
    

    Example

    Class component

    import React, { Component } from "react";
    import { View } from "react-native";
    import TooltipAlert from "react-native-tooltip-alert";
     
    export default class Example extends Component {
      render() {
        return (
          <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
            <TooltipAlert>
              <View>
                  <Text>Open Tooltip</Text>
              </View>
            </TooltipAlert>
          </View>
        );
      }
    }

    Functional component

    import React, { useRef } from "react";
    import { View } from "react-native";
    import TooltipAlert from "react-native-tooltip-alert";
     
    export default function Example() {
      const refTooltipAlert = useRef();
      return (
        <View
          style={{
            flex: 1,
            justifyContent: "center",
            alignItems: "center",
            backgroundColor: "#000"
          }}
        >
          <TooltipAlert>
            <View>
                <Text>Open Tooltip</Text>
            </View>
          </TooltipAlert>
        </View>
      );
    }

    Props

    title, contentText, confirmButtonText, cancelButtonText, color, height

    Props Type Description Default
    title string Tooltip title text "Title"
    contentText string Tooltip content text "Content text"
    onConfirm function Callback when on confirm clicked (onClose call after) null
    onCancel function Callback when on cancel clicked (onClose call after) null
    confirmButtonText string Tooltip confirm button text "Confirm"
    confirmButtonText string Tooltip cancel button text "Close"
    height number Height of tooltip 260
    closeOnPressMask boolean Press the area outside to close Bottom Sheet true
    closeOnPressBack boolean Press back android to close Bottom Sheet (Android only) true
    customStyles object Custom style to Bottom Sheet {}

    Available Custom Style

    customStyles: {
      wrapper: {...}, // The Root of Component (You can change the `backgroundColor` or any styles)
      container: {...}, // The Container of Bottom Sheet
      draggableIcon: {...} // The Draggable Icon (If you set closeOnDragDown to true)
    }
    

    License

    This project is licensed under the MIT License - see the LICENSE.md file for details

    Author

    Made by Idanlevi1.

    Install

    npm i react-native-tooltip-alert

    DownloadsWeekly Downloads

    7

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    21.3 kB

    Total Files

    10

    Last publish

    Collaborators

    • idanlevi2