### Install Universal Tooltip with Yarn

Source: https://github.com/alantoa/universal-tooltip/blob/main/README.md

Standard installation command for the universal-tooltip package using Yarn. This is the general method for adding the library to a project.

```sh
yarn add universal-tooltip
```

--------------------------------

### Install Universal Tooltip with Expo

Source: https://github.com/alantoa/universal-tooltip/blob/main/README.md

Specific installation commands for Expo projects, including the universal-tooltip package and expo-build-properties. Expo requires additional configuration for native modules.

```sh
expo install universal-tooltip expo-build-properties
```

--------------------------------

### Implement Universal Tooltip in React Native

Source: https://github.com/alantoa/universal-tooltip/blob/main/README.md

Demonstrates how to use the Universal Tooltip component in a React Native application. It shows setting up the root, trigger, and content elements, handling platform-specific behaviors for web and native, and configuring tooltip properties like animation, dismissal, and styling. This snippet is primarily for React Native/TypeScript.

```tsx
import { useState } from "react";
import * as Tooltip from "universal-tooltip";
import { Text, View, Pressable, Platform } from "react-native";

// because each platform has different behaviors, but you can replace the components yourself, of course.
const TriggerView = Platform.OS === "web" ? View : Pressable;

const [open, setOpen] = useState(false);

<Tooltip.Root
  // For web, I would like to be triggered automatically with the mouse.
  {...Platform.select({
    web: {},
    default: {
      open,
      onDismiss: () => {
        console.log("onDismiss");
        setOpen(false);
      },
    },
  })}
>
  <Tooltip.Trigger>
    <TriggerView
      {...Platform.select({
        web: {},
        default: {
          open,
          onPress: () => {
            setOpen(true);
          },
        },
      })}
    >
      <Text>Hello!👋</Text>
    </TriggerView>
  </Tooltip.Trigger>
  <Tooltip.Content
    sideOffset={3}
    containerStyle={{
      paddingLeft: 16,
      paddingRight: 16,
      paddingTop: 8,
      paddingBottom: 8,
    }}
    onTap={() => {
      setOpen(false);
      console.log("onTap");
    }}
    dismissDuration={500}
    disableTapToDismiss
    side="right"
    presetAnimation="fadeIn"
    backgroundColor="black"
    borderRadius={12}
  >
    <Tooltip.Text text="Some copy..." style={{ color: "#000", fontSize: 16 }} />
  </Tooltip.Content>
</Tooltip.Root>;
```

--------------------------------

### Expo Build Properties Configuration for Universal Tooltip

Source: https://github.com/alantoa/universal-tooltip/blob/main/README.md

Configuration snippet for `app.json` or `app.config.js` in an Expo project to set Android and iOS build properties. This is necessary for the native dependencies of the universal-tooltip component, particularly ensuring the `compileSdkVersion` meets the requirements of the Balloon library on Android.

```json
[
  "expo-build-properties",
  {
    "android": {
      "compileSdkVersion": 32,
      "targetSdkVersion": 32,
      "minSdkVersion": 23,
      "buildToolsVersion": "32.0.0",
      "kotlinVersion": "1.6.10"
    },
    "ios": {
      "deploymentTarget": "13.0"
    }
  }
]
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.