Overview:

The react-native-styled-toast is a fully customizable toast library for React Native. It supports multiple toasts, is compatible with both iOS and Android, and is written using React Hooks and TypeScript.

Features:

Pure JS implementation
Supports multiple toasts
iOS and Android compatible
Styled with theme constraints
Written using React Hooks
Fully typed with TypeScript

Usage:

Wrap your app in the ThemeProvider component from styled-components to ensure that the toasts rely on theming.
Use the ToastProvider and wrap the rest of your app.
Access the Toast context by using the provided useToast hook to trigger a toast anywhere in your app. If you can't use hooks, you can still use the ToastContext.Consumer to fire off a toast.
Configure your theme object to contain at least a spacing scale with some default colors. The theme object should look something like this:

{
  spacing: [0, 4, 8, 16, 32],
  colors: {
    background: '#FFF',
    text: '#000',
    success: '#00FF00',
    info: '#0000FF',
    error: '#FF0000',
    muted: '#888'
  }
}

If your theme object does not contain the required color keys, you can customize these values in the toast configuration object.

Summary:

The react-native-styled-toast library provides a fully customizable toast solution for React Native apps. It supports multiple toasts, is compatible with both iOS and Android, and is written using React Hooks and TypeScript. The library relies on theming and styled-components to style the toasts, and can be easily integrated into any React Native app.

Jeanverster

Chakra UI Steps

React Native Styled Toast