react-native-paper-toast
Version:
A toast implementation for React Native Paper
64 lines • 2.27 kB
TypeScript
import React from 'react';
import type { ToastMethods, ToastOptions, ToastParams, ToastProviderProps, ToastStyles, ToastType, ToastPosition } from './types';
/**
* Wrap your component tree with ToastProvider. This should be after SafeAreaProvider & PaperProvider!
* ## Usage
* ```tsx
* import React from 'react';
* import { DefaultTheme, Provider as PaperProvider } from 'react-native-paper';
* import { initialWindowMetrics, SafeAreaProvider } from 'react-native-safe-area-context';
* import { ToastProvider } from 'react-native-paper-toast';
* import Application from './application';
*
* export default function App() {
* return (
* <SafeAreaProvider initialMetrics={initialWindowMetrics}>
* <PaperProvider theme={DefaultTheme}>
* <ToastProvider overrides={{ position: 'top' }}>
* <Application />
* </ToastProvider>
* </PaperProvider>
* </SafeAreaProvider>
* );
* }
* ```
*/
declare const ToastProvider: React.FC<ToastProviderProps>;
/**
* useToast hook is used to show and hide Toast messages.
* ## Usage
* Import the `useToast` hook from the library. Calling it will return you an object with two functions `show` and `hide` to show or hide toast.
*
* ```tsx
* import { useToast } from 'react-native-paper-toast';
*
* export const Screen: React.FC<Props> = (props) => {
* const toaster = useToast();
* // You can now toast methods from handler functions, effects or onPress props!
*
* // Call from handler function
* const handleError = () =>
* toaster.show({ message: 'Invalid Username', type: 'error' });
*
* // Call from Effects
* useEffect(() => {
* login(username, password).then((v) =>
* toaster.show({ message: 'Login successful', duration: 2000 })
* );
* });
*
* return (
* <Surface>
* <Button onPress={() => toaster.show({ message: 'Here is a toast for ya!' })}>
* Show Toast
* </Button>
* <Button onPress={toaster.hide}>Hide Toast</Button>
* </Surface>
* );
* };
* ```
*/
declare const useToast: () => ToastMethods;
export { ToastProvider, useToast };
export type { ToastOptions, ToastProviderProps, ToastParams, ToastStyles, ToastType, ToastPosition, };
//# sourceMappingURL=index.d.ts.map