Skip to content

Commit 58bc783

Browse files
korneliosyaovikorneliosyaovi
committed
added project build
1 parent a084cd5 commit 58bc783

40 files changed

+1374
-6
lines changed

‎.gitignore

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,4 +56,3 @@ bundles/
5656

5757
coverage/
5858
.env
59-
dist

‎dist/FlutterwaveButton.d.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import React from 'react';
2+
import { StyleProp, ViewStyle } from 'react-native';
3+
interface FlutterwaveButtonProps {
4+
style?: StyleProp<ViewStyle>;
5+
disabled?: boolean;
6+
alignLeft?: boolean;
7+
onPress?: () => void;
8+
}
9+
declare const FlutterwaveButton: React.FC<FlutterwaveButtonProps>;
10+
export default FlutterwaveButton;
11+
//# sourceMappingURL=FlutterwaveButton.d.ts.map

‎dist/FlutterwaveButton.d.ts.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/FlutterwaveButton.js

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
import React from 'react';
2+
import { StyleSheet, Image, TouchableHighlight, View, } from 'react-native';
3+
import { colors } from './configs';
4+
var pryContent = require('./assets/pry-button-content.png');
5+
var contentSizeDimension = 8.2962962963;
6+
var FlutterwaveButton = function FlutterwaveButton(_a) {
7+
var style = _a.style, alignLeft = _a.alignLeft, children = _a.children, disabled = _a.disabled, onPress = _a.onPress;
8+
// render primary button
9+
return (<TouchableHighlight underlayColor={colors.primaryLight} disabled={disabled} onPress={onPress} style={[
10+
styles.button,
11+
disabled ? styles.buttonBusy : {},
12+
alignLeft ? styles.buttonAlignLeft : {},
13+
style
14+
]} activeOpacity={1} testID='flw-button'>
15+
<>
16+
{children ? children : (<Image source={pryContent} resizeMode="contain" resizeMethod="resize" style={styles.buttonContent} fadeDuration={0}/>)}
17+
{disabled
18+
? (<View style={styles.buttonBusyOvelay}/>)
19+
: null}
20+
</>
21+
</TouchableHighlight>);
22+
};
23+
// component UI styles
24+
var styles = StyleSheet.create({
25+
buttonBusyOvelay: {
26+
position: 'absolute',
27+
left: 0,
28+
top: 0,
29+
bottom: 0,
30+
right: 0,
31+
backgroundColor: 'rgba(255, 255, 255, 0.6)'
32+
},
33+
buttonBusy: {
34+
borderColor: colors.primaryLight
35+
},
36+
buttonAlignLeft: {
37+
justifyContent: 'flex-start'
38+
},
39+
button: {
40+
paddingHorizontal: 16,
41+
minWidth: 100,
42+
height: 52,
43+
borderColor: colors.primary,
44+
borderWidth: 1,
45+
borderRadius: 6,
46+
backgroundColor: colors.primary,
47+
alignItems: 'center',
48+
justifyContent: 'center',
49+
flexDirection: 'row',
50+
overflow: 'hidden'
51+
},
52+
buttonContent: {
53+
resizeMode: 'contain',
54+
width: 187.3,
55+
height: 187.3 / contentSizeDimension
56+
}
57+
});
58+
// export component as default
59+
export default FlutterwaveButton;

‎dist/FlutterwaveCheckout.d.ts

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import React from 'react';
2+
export interface FlutterwaveCheckoutProps {
3+
onRedirect?: (data: any) => void;
4+
onAbort?: () => void;
5+
link?: string;
6+
visible?: boolean;
7+
}
8+
interface FlutterwaveCheckoutErrorProps {
9+
hasLink: boolean;
10+
onTryAgain: () => void;
11+
}
12+
declare const FlutterwaveCheckout: React.FC<FlutterwaveCheckoutProps>;
13+
export declare const FlutterwaveCheckoutError: React.FC<FlutterwaveCheckoutErrorProps>;
14+
export default FlutterwaveCheckout;
15+
//# sourceMappingURL=FlutterwaveCheckout.d.ts.map

‎dist/FlutterwaveCheckout.d.ts.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/FlutterwaveCheckout.js

Lines changed: 214 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,214 @@
1+
import React from 'react';
2+
import { StyleSheet, Modal, View, Animated, TouchableWithoutFeedback, Text, Alert, Image, Dimensions, Easing, TouchableOpacity, Platform, } from 'react-native';
3+
import WebView from 'react-native-webview';
4+
import { colors } from './configs';
5+
var loader = require('./assets/loader.gif');
6+
var borderRadiusDimension = 24 / 896;
7+
var windowHeight = Dimensions.get('window').height;
8+
var getRedirectParams = function (url) {
9+
// initialize result container
10+
var res = {};
11+
// if url has params
12+
if (url.split('?').length > 1) {
13+
// get query params in an array
14+
var params = url.split('?')[1].split('&');
15+
// add url params to result
16+
for (var i = 0; i < params.length; i++) {
17+
var param = params[i].split('=');
18+
var val = decodeURIComponent(param[1]).trim();
19+
res[param[0]] = String(val);
20+
}
21+
}
22+
// return result
23+
return res;
24+
};
25+
var FlutterwaveCheckout = function FlutterwaveCheckout(props) {
26+
var link = props.link, visible = props.visible, onRedirect = props.onRedirect, onAbort = props.onAbort;
27+
var _a = React.useState(false), show = _a[0], setShow = _a[1];
28+
var webviewRef = React.useRef(null);
29+
var animation = React.useRef(new Animated.Value(0));
30+
var animateIn = React.useCallback(function () {
31+
setShow(true);
32+
Animated.timing(animation.current, {
33+
toValue: 1,
34+
duration: 700,
35+
easing: Easing["in"](Easing.elastic(0.72)),
36+
useNativeDriver: false
37+
}).start();
38+
}, []);
39+
var animateOut = React.useCallback(function () {
40+
return new Promise(function (resolve) {
41+
Animated.timing(animation.current, {
42+
toValue: 0,
43+
duration: 400,
44+
useNativeDriver: false
45+
}).start(function () {
46+
setShow(false);
47+
resolve();
48+
});
49+
});
50+
}, []);
51+
var handleReload = React.useCallback(function () {
52+
if (webviewRef.current) {
53+
webviewRef.current.reload();
54+
}
55+
}, []);
56+
var handleAbort = React.useCallback(function (confirmed) {
57+
if (confirmed === void 0) { confirmed = false; }
58+
if (!confirmed) {
59+
Alert.alert('', 'Are you sure you want to cancel this payment?', [
60+
{ text: 'No' },
61+
{
62+
text: 'Yes, Cancel',
63+
style: 'destructive',
64+
onPress: function () { return handleAbort(true); }
65+
},
66+
]);
67+
return;
68+
}
69+
// remove tx_ref and dismiss
70+
animateOut().then(onAbort);
71+
}, [onAbort, animateOut]);
72+
var handleNavigationStateChange = React.useCallback(function (ev) {
73+
// cregex to check if redirect has occured on completion/cancel
74+
var rx = /\/flutterwave\.com\/rn-redirect/;
75+
// Don't end payment if not redirected back
76+
if (!rx.test(ev.url)) {
77+
return;
78+
}
79+
// dismiss modal
80+
animateOut().then(function () {
81+
if (onRedirect) {
82+
onRedirect(getRedirectParams(ev.url));
83+
}
84+
});
85+
}, [onRedirect]);
86+
var doAnimate = React.useCallback(function () {
87+
if (visible === show) {
88+
return;
89+
}
90+
if (visible) {
91+
return animateIn();
92+
}
93+
animateOut().then(function () { });
94+
}, [visible, show, animateOut, animateIn]);
95+
React.useEffect(function () {
96+
doAnimate();
97+
return function () { };
98+
}, [doAnimate]);
99+
var marginTop = animation.current.interpolate({
100+
inputRange: [0, 1],
101+
outputRange: [windowHeight, 0]
102+
});
103+
var opacity = animation.current.interpolate({
104+
inputRange: [0, 0.3, 1],
105+
outputRange: [0, 1, 1]
106+
});
107+
return (<Modal transparent={true} animated={false} hardwareAccelerated={false} visible={show}>
108+
<FlutterwaveCheckoutBackdrop onPress={function () { return handleAbort(); }} animation={animation.current}/>
109+
<Animated.View style={[
110+
styles.webviewContainer,
111+
{
112+
marginTop: marginTop,
113+
opacity: opacity
114+
}
115+
]} testID='flw-checkout-dialog'>
116+
<WebView ref={webviewRef} source={{ uri: link || '' }} style={styles.webview} startInLoadingState={true} scalesPageToFit={true} javaScriptEnabled={true} onNavigationStateChange={handleNavigationStateChange} renderError={function () { return <FlutterwaveCheckoutError hasLink={!!link} onTryAgain={handleReload}/>; }} renderLoading={function () { return <FlutterwaveCheckoutLoader />; }}/>
117+
</Animated.View>
118+
</Modal>);
119+
};
120+
var FlutterwaveCheckoutBackdrop = function FlutterwaveCheckoutBackdrop(_a) {
121+
var animation = _a.animation, onPress = _a.onPress;
122+
// Interpolation backdrop animation
123+
var backgroundColor = animation.interpolate({
124+
inputRange: [0, 0.3, 1],
125+
outputRange: [colors.transparent, colors.transparent, 'rgba(0,0,0,0.5)']
126+
});
127+
return (<TouchableWithoutFeedback testID='flw-checkout-backdrop' onPress={onPress}>
128+
<Animated.View style={Object.assign({}, styles.backdrop, { backgroundColor: backgroundColor })}/>
129+
</TouchableWithoutFeedback>);
130+
};
131+
export var FlutterwaveCheckoutError = function (_a) {
132+
var hasLink = _a.hasLink, onTryAgain = _a.onTryAgain;
133+
return (<View style={styles.error} testID="flw-checkout-error">
134+
{hasLink ? (<>
135+
<Text style={styles.errorText}>
136+
An error occurred, please tab below to try again.
137+
</Text>
138+
<TouchableOpacity style={styles.errorActionButton} onPress={onTryAgain}>
139+
<Text style={styles.errorActionButtonText}>Try Again</Text>
140+
</TouchableOpacity>
141+
</>) : (<Text style={styles.errorText}>
142+
An error occurred, please close the checkout dialog and try again.
143+
</Text>)}
144+
</View>);
145+
};
146+
var FlutterwaveCheckoutLoader = function () {
147+
return (<View style={styles.loading} testID="flw-checkout-loader">
148+
<Image source={loader} resizeMode="contain" style={styles.loadingImage}/>
149+
</View>);
150+
};
151+
var styles = StyleSheet.create({
152+
errorActionButtonText: {
153+
textAlign: 'center',
154+
color: colors.primary,
155+
fontSize: 16
156+
},
157+
errorActionButton: {
158+
paddingHorizontal: 16,
159+
paddingVertical: 16
160+
},
161+
errorText: {
162+
color: colors.secondary,
163+
textAlign: 'center',
164+
marginBottom: 32,
165+
fontSize: 18
166+
},
167+
error: {
168+
position: 'absolute',
169+
left: 0,
170+
right: 0,
171+
bottom: 0,
172+
top: 0,
173+
backgroundColor: '#ffffff',
174+
justifyContent: 'center',
175+
alignItems: 'center',
176+
paddingHorizontal: 56
177+
},
178+
backdrop: {
179+
position: 'absolute',
180+
left: 0,
181+
right: 0,
182+
bottom: 0,
183+
top: 0
184+
},
185+
loadingImage: {
186+
width: 64,
187+
height: 64,
188+
resizeMode: 'contain'
189+
},
190+
loading: {
191+
position: 'absolute',
192+
top: 0,
193+
right: 0,
194+
bottom: 0,
195+
left: 0,
196+
backgroundColor: 'rgba(255, 255, 255, 0.3)',
197+
justifyContent: 'center',
198+
alignItems: 'center'
199+
},
200+
webviewContainer: {
201+
top: Platform.select({ ios: 96, android: 64 }),
202+
flex: 1,
203+
backgroundColor: '#efefef',
204+
paddingBottom: Platform.select({ ios: 96, android: 64 }),
205+
overflow: 'hidden',
206+
borderTopLeftRadius: windowHeight * borderRadiusDimension,
207+
borderTopRightRadius: windowHeight * borderRadiusDimension
208+
},
209+
webview: {
210+
flex: 1,
211+
backgroundColor: 'rgba(0,0,0,0)'
212+
}
213+
});
214+
export default FlutterwaveCheckout;

‎dist/FlutterwaveInit.d.ts

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
/// <reference types="react-native" />
2+
export declare type Currency = 'GBP' | 'NGN' | 'USD' | 'GHS' | 'KES' | 'ZAR' | 'TZS';
3+
export interface FlutterwaveInitSubAccount {
4+
id: string;
5+
transaction_split_ratio?: number;
6+
transaction_charge_type?: string;
7+
transaction_charge?: number;
8+
}
9+
export interface FlutterwaveInitOptionsBase {
10+
amount: number;
11+
currency?: Currency;
12+
integrity_hash?: string;
13+
payment_options?: string;
14+
payment_plan?: number;
15+
redirect_url: string;
16+
subaccounts?: Array<FlutterwaveInitSubAccount>;
17+
}
18+
interface FlutterwavePaymentMeta {
19+
[k: string]: any;
20+
}
21+
export interface FlutterwaveInitCustomer {
22+
email: string;
23+
phonenumber?: string;
24+
name?: string;
25+
}
26+
export interface FlutterwaveInitCustomizations {
27+
title?: string;
28+
logo?: string;
29+
description?: string;
30+
}
31+
export declare type FlutterwaveInitOptions = FlutterwaveInitOptionsBase & {
32+
authorization: string;
33+
tx_ref: string;
34+
customer: FlutterwaveInitCustomer;
35+
meta?: FlutterwavePaymentMeta | null;
36+
customizations?: FlutterwaveInitCustomizations;
37+
};
38+
export interface FieldError {
39+
field: string;
40+
message: string;
41+
}
42+
export interface ResponseData {
43+
status?: 'success' | 'error';
44+
message: string;
45+
error_id?: string;
46+
errors?: Array<FieldError>;
47+
code?: string;
48+
data?: {
49+
link: string;
50+
};
51+
}
52+
/**
53+
* This function is responsible for making the request to
54+
* initialize a Flutterwave payment.
55+
* @param options FlutterwaveInitOptions
56+
* @param abortController AbortController
57+
* @return Promise<string>
58+
*/
59+
export default function FlutterwaveInit(options: FlutterwaveInitOptions, abortController?: AbortController): Promise<string>;
60+
export {};
61+
//# sourceMappingURL=FlutterwaveInit.d.ts.map

‎dist/FlutterwaveInit.d.ts.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)