@zbdpay/ramp-react-native
Version:
React Native wrapper for ZBD Ramp widget
230 lines (229 loc) • 9.34 kB
JavaScript
function _define_property(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _object_spread(target) {
for(var i = 1; i < arguments.length; i++){
var source = arguments[i] != null ? arguments[i] : {};
var ownKeys = Object.keys(source);
if (typeof Object.getOwnPropertySymbols === "function") {
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
}));
}
ownKeys.forEach(function(key) {
_define_property(target, key, source[key]);
});
}
return target;
}
function _object_without_properties(source, excluded) {
if (source == null) return {};
var target = _object_without_properties_loose(source, excluded);
var key, i;
if (Object.getOwnPropertySymbols) {
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
for(i = 0; i < sourceSymbolKeys.length; i++){
key = sourceSymbolKeys[i];
if (excluded.indexOf(key) >= 0) continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
target[key] = source[key];
}
}
return target;
}
function _object_without_properties_loose(source, excluded) {
if (source == null) return {};
var target = {};
var sourceKeys = Object.keys(source);
var key, i;
for(i = 0; i < sourceKeys.length; i++){
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0) continue;
target[key] = source[key];
}
return target;
}
import { jsx as _jsx } from "react/jsx-runtime";
import { EnvironmentEnum, WidgetPostMessageEnum, getWidgetUrl } from '@zbdpay/ramp-ts';
import { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
import { WebView } from 'react-native-webview';
const buildWidgetUrlRN = ({ baseUrl, sessionToken, secret })=>{
const separator = baseUrl.includes('?') ? '&' : '?';
let url = `${baseUrl}${separator}session_token=${encodeURIComponent(sessionToken)}`;
if (secret) {
url += `&secret=${encodeURIComponent(secret)}`;
}
return url;
};
export const ZBDRamp = /*#__PURE__*/ forwardRef((_param, ref)=>{
var { style, webViewProps } = _param, rampOptions = _object_without_properties(_param, [
"style",
"webViewProps"
]);
const webViewRef = useRef(null);
const validateOptions = useCallback(()=>{
if (!rampOptions.sessionToken) {
throw new Error('sessionToken is required');
}
}, [
rampOptions.sessionToken
]);
useEffect(()=>{
validateOptions();
}, [
validateOptions
]);
const widgetUrl = useMemo(()=>{
const baseUrl = getWidgetUrl(rampOptions.environment || EnvironmentEnum.Production);
return buildWidgetUrlRN({
baseUrl,
sessionToken: rampOptions.sessionToken,
secret: rampOptions.secret
});
}, [
rampOptions.sessionToken,
rampOptions.environment,
rampOptions.secret
]);
const handleMessage = useCallback((event)=>{
try {
const data = JSON.parse(event.nativeEvent.data);
const { type, payload } = data;
switch(type){
case WidgetPostMessageEnum.TransactionComplete:
var _rampOptions_onSuccess;
(_rampOptions_onSuccess = rampOptions.onSuccess) === null || _rampOptions_onSuccess === void 0 ? void 0 : _rampOptions_onSuccess.call(rampOptions, payload);
break;
case WidgetPostMessageEnum.Error:
var _rampOptions_onError;
const error = {
code: (payload === null || payload === void 0 ? void 0 : payload.code) || 'UNKNOWN_ERROR',
message: (payload === null || payload === void 0 ? void 0 : payload.message) || 'An error occurred',
details: payload === null || payload === void 0 ? void 0 : payload.details
};
(_rampOptions_onError = rampOptions.onError) === null || _rampOptions_onError === void 0 ? void 0 : _rampOptions_onError.call(rampOptions, error);
break;
case WidgetPostMessageEnum.StepChange:
var _rampOptions_onStepChange;
(_rampOptions_onStepChange = rampOptions.onStepChange) === null || _rampOptions_onStepChange === void 0 ? void 0 : _rampOptions_onStepChange.call(rampOptions, payload === null || payload === void 0 ? void 0 : payload.step);
break;
case WidgetPostMessageEnum.Ready:
var _rampOptions_onReady;
(_rampOptions_onReady = rampOptions.onReady) === null || _rampOptions_onReady === void 0 ? void 0 : _rampOptions_onReady.call(rampOptions);
break;
case WidgetPostMessageEnum.KYCStatusChange:
var _rampOptions_onLog;
(_rampOptions_onLog = rampOptions.onLog) === null || _rampOptions_onLog === void 0 ? void 0 : _rampOptions_onLog.call(rampOptions, {
level: 'info',
message: 'KYC Status Change',
data: payload
});
break;
default:
console.debug('Unknown message type from widget:', type);
}
} catch (error) {
console.warn('Failed to parse message from widget:', error);
}
}, [
rampOptions
]);
const sendMessage = useCallback((message)=>{
if (webViewRef.current) {
webViewRef.current.postMessage(JSON.stringify(message));
}
}, []);
const updateConfig = useCallback((config)=>{
console.log('Config update:', config);
}, []);
const reload = useCallback(()=>{
var _webViewRef_current;
(_webViewRef_current = webViewRef.current) === null || _webViewRef_current === void 0 ? void 0 : _webViewRef_current.reload();
}, []);
useImperativeHandle(ref, ()=>({
sendMessage,
updateConfig,
reload
}), [
sendMessage,
updateConfig,
reload
]);
const handleLoadEnd = useCallback(()=>{
console.log('ZBD Ramp WebView: Load ended successfully');
}, []);
const handleLoadStart = useCallback(()=>{
console.log('ZBD Ramp WebView: Load started');
}, []);
const handleError = useCallback((syntheticEvent)=>{
const { nativeEvent } = syntheticEvent;
console.error('ZBD Ramp WebView Error:', nativeEvent);
}, []);
const handleHttpError = useCallback((syntheticEvent)=>{
const { nativeEvent } = syntheticEvent;
console.error('ZBD Ramp WebView HTTP Error:', nativeEvent);
}, []);
const handleRenderError = useCallback((syntheticEvent)=>{
const { nativeEvent } = syntheticEvent;
console.error('ZBD Ramp WebView Render Error:', nativeEvent);
}, []);
const handleShouldStartLoadWithRequest = useCallback((request)=>{
console.log('ZBD Ramp WebView: Should start load with request:', request.url);
return true;
}, []);
return /*#__PURE__*/ _jsx(WebView, _object_spread({
ref: webViewRef,
source: {
uri: widgetUrl
},
onMessage: handleMessage,
onLoadStart: handleLoadStart,
onLoadEnd: handleLoadEnd,
onError: handleError,
onHttpError: handleHttpError,
onRenderProcessGone: handleRenderError,
onShouldStartLoadWithRequest: handleShouldStartLoadWithRequest,
style: style,
javaScriptEnabled: true,
domStorageEnabled: true,
allowsInlineMediaPlayback: true,
mediaPlaybackRequiresUserAction: false,
startInLoadingState: true,
mixedContentMode: "compatibility",
incognito: false
}, webViewProps));
});
ZBDRamp.displayName = 'ZBDRamp';
export const useZBDRamp = (_options)=>{
const rampRef = useRef(null);
const sendMessage = useCallback((message)=>{
var _rampRef_current;
(_rampRef_current = rampRef.current) === null || _rampRef_current === void 0 ? void 0 : _rampRef_current.sendMessage(message);
}, []);
const updateConfig = useCallback((config)=>{
var _rampRef_current;
(_rampRef_current = rampRef.current) === null || _rampRef_current === void 0 ? void 0 : _rampRef_current.updateConfig(config);
}, []);
const reload = useCallback(()=>{
var _rampRef_current;
(_rampRef_current = rampRef.current) === null || _rampRef_current === void 0 ? void 0 : _rampRef_current.reload();
}, []);
return {
rampRef,
sendMessage,
updateConfig,
reload
};
};
export { QuoteCurrencyEnum, BaseCurrencyEnum, initRampSession, refreshAccessToken } from '@zbdpay/ramp-ts';
//# sourceMappingURL=index.js.map