omnipay-savings-sdk
Version:
Omnipay Savings SDK
77 lines (76 loc) • 2.87 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ToastProvider = exports.useToast = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const react_native_1 = require("react-native");
const ToastContext = (0, react_1.createContext)(null);
const useToast = () => {
const ctx = (0, react_1.useContext)(ToastContext);
if (!ctx) {
throw new Error('useToast must be used within a ToastProvider');
}
return ctx;
};
exports.useToast = useToast;
const ToastProvider = ({ children }) => {
const [toast, setToast] = (0, react_1.useState)(null);
const fadeAnim = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
const showToast = (options) => {
setToast(options);
react_native_1.Animated.timing(fadeAnim, {
toValue: 1,
duration: 200,
useNativeDriver: true,
}).start();
setTimeout(() => {
react_native_1.Animated.timing(fadeAnim, {
toValue: 0,
duration: 200,
useNativeDriver: true,
}).start(() => setToast(null));
}, options.duration || 3000);
};
const getToastStyle = (type = 'info') => {
switch (type) {
case 'success':
return { backgroundColor: '#38A169' };
case 'error':
return { backgroundColor: '#FF3E3E' };
case 'info':
default:
return { backgroundColor: '#007aa5' };
}
};
return ((0, jsx_runtime_1.jsxs)(ToastContext.Provider, Object.assign({ value: { showToast } }, { children: [children, toast && ((0, jsx_runtime_1.jsx)(react_native_1.Animated.View, Object.assign({ style: [
styles.toastContainer,
getToastStyle(toast.type),
{ opacity: fadeAnim },
] }, { children: (0, jsx_runtime_1.jsx)(react_native_1.TouchableOpacity, Object.assign({ onPress: () => setToast(null), activeOpacity: 0.8, style: styles.toastContent }, { children: (0, jsx_runtime_1.jsx)(react_native_1.Text, Object.assign({ style: styles.toastText }, { children: toast.message })) })) })))] })));
};
exports.ToastProvider = ToastProvider;
const styles = react_native_1.StyleSheet.create({
toastContainer: {
position: 'absolute',
top: 50,
left: 20,
right: 20,
borderRadius: 8,
padding: 12,
zIndex: 1000,
elevation: 10,
shadowColor: '#000',
shadowOpacity: 0.3,
shadowRadius: 5,
shadowOffset: { width: 0, height: 2 },
},
toastContent: {
alignItems: 'center',
justifyContent: 'center',
},
toastText: {
color: 'white',
fontSize: 15,
textAlign: 'center',
},
});