react-native-toastify-pro/dist/index.js

A customizable toast notification component for React Native, designed to work seamlessly on both Android and iOS platforms and allows you to add notifications to your react-native app (ios, android) with ease. No more nonsense!

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-native");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=o(e);const{width:n,height:a}=t.Dimensions.get("window");var s;exports.positionType=void 0,(s=exports.positionType||(exports.positionType={})).top="top",s.bottom="bottom";const i=r.default.forwardRef(((o,n)=>{const[s,i]=e.useState({message:"",type:"",position:"top",positionOffset:50,backgroundColor:"blue",textColor:"white",duration:3e3}),[l,d]=e.useState(!1),c=e.useRef(new t.Animated.Value(0)).current,p=e.useRef(new t.Animated.Value(0)).current,m=e.useRef(null),f=e=>{switch(e){case"success":return{backgroundColor:"green",textColor:"white"};case"error":return{backgroundColor:"red",textColor:"white"};case"info":return{backgroundColor:"blue",textColor:"white"};default:return{backgroundColor:"gray",textColor:"white"}}};r.default.useImperativeHandle(n,(()=>({show:({message:e="",type:o="info",position:r="top",positionOffset:n=50,duration:s=3e3,backgroundColor:u="",textColor:l=""})=>{m.current&&(clearTimeout(m.current),m.current=null);const{backgroundColor:h,textColor:b}=u||l?{backgroundColor:u||f(o).backgroundColor,textColor:l||f(o).textColor}:f(o);i({message:e,type:o,position:r,positionOffset:n,backgroundColor:h,textColor:b,duration:s}),d(!0),c.setValue("top"===r?-100:a),t.Animated.parallel([t.Animated.timing(p,{toValue:1,duration:300,useNativeDriver:!0}),t.Animated.spring(c,{toValue:0,useNativeDriver:!0})]).start(),m.current=setTimeout((()=>g(r)),s)},hide:()=>g(s.position)})));const g=e=>{t.Animated.parallel([t.Animated.timing(p,{toValue:0,duration:300,useNativeDriver:!0}),t.Animated.timing(c,{toValue:"top"===e?-100:a,duration:300,useNativeDriver:!0})]).start((()=>{d(!1),null!==m.current&&clearTimeout(m.current),m.current=null}))},h=e.useRef(t.PanResponder.create({onMoveShouldSetPanResponder:(e,t)=>{const{dx:o,dy:r}=t;return Math.abs(o)>10||Math.abs(r)>10},onPanResponderMove:(e,t)=>{const{dy:o}=t;c.setValue(o)},onPanResponderRelease:(e,o)=>{const{dy:r}=o;Math.abs(r)>50?g(s.position):t.Animated.spring(c,{toValue:0,useNativeDriver:!0}).start()}})).current;return l?r.default.createElement(t.TouchableWithoutFeedback,{onPress:()=>g(s.position),style:{zIndex:1e18}},r.default.createElement(t.View,{style:[u.container,"bottom"===s.position?{bottom:s.positionOffset}:{top:s.positionOffset}]},r.default.createElement(t.Animated.View,{...h.panHandlers,style:[u.toast,{backgroundColor:s.backgroundColor},{opacity:p,transform:[{translateY:c}]}]},r.default.createElement(t.Text,{style:[u.message,{color:s.textColor}]},s.message)))):null})),u=t.StyleSheet.create({container:{position:"absolute",left:0,right:0,alignItems:"center",zIndex:9999},toast:{minWidth:200,maxWidth:.9*n,padding:12,borderRadius:8,justifyContent:"center",alignItems:"center",shadowColor:"#000",shadowOpacity:.2,shadowRadius:10,elevation:5},message:{textAlign:"center"}}),l=e.createContext(void 0);exports.ToastProvider=({children:t})=>{const o=e.useRef(null);return r.default.createElement(l.Provider,{value:{showToast:e=>{o.current?.show(e)}}},t,r.default.createElement(i,{ref:o}))},exports.useToast=()=>{const t=e.useContext(l);if(!t)throw new Error("useToast must be used within a ToastProvider");return t};