@coinflowlabs/react 0.1.0

package/README.md

@@ -0,0 +1,35 @@
+# Coinflow React
+
+## Withdraw Usage
+```
+import {useWallet} from '@solana/wallet-adapter-react';
+const wallet = useWallet();
+const connection = useConnection();
+
+<CoinflowWithdraw wallet={wallet} merchantId='<YOUR MERCHANT ID>' env='prod|sandbox|staging' connection={connection} />;
+```
+
+Props:
+* `wallet`: The Solana Wallet Adapter Wallet
+* `merchantId`: Your Merchant ID (Contact Coinflow support for this)
+* `connection`: Solana Connection
+* `env` (optional): This defaults to `prod`
+    - For testing set to `staging`
+* `onSuccess` (optional): function to run when the withdrawal process is successful
+
+## Purchase Usage
+```
+import {useWallet} from '@solana/wallet-adapter-react';
+const wallet = useWallet();
+const connection = useConnection();
+
+<CoinflowPurchase wallet={wallet} merchantId='<YOUR MERCHANT ID>' env='prod|sandbox|staging' connection={connection} />;
+```
+
+Props:
+* `wallet`: The Solana Wallet Adapter Wallet
+* `merchantId`: Your Merchant ID (Contact Coinflow support for this)
+* `connection`: Solana Connection
+* `env` (optional): This defaults to `prod`
+  - For testing set to `staging`
+* `onSuccess` (optional): function to run when the purchase process is successful

package/build/cjs/CoinflowIFrame.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export type CoinflowEnvs = 'prod' | 'staging' | 'sandbox' | 'local';
+type CoinflowIFrameProps = {
+    publicKey: string;
+    IFrameRef: React.RefObject<HTMLIFrameElement>;
+    env?: CoinflowEnvs;
+    route: string;
+};
+declare function CoinflowIFrame({ publicKey, IFrameRef, env, route, }: CoinflowIFrameProps): JSX.Element;
+export declare const CoinflowIframe: React.MemoExoticComponent<typeof CoinflowIFrame>;
+export {};

package/build/cjs/CoinflowIFrame.js

@@ -0,0 +1,23 @@
+"use strict";
+exports.__esModule = true;
+exports.CoinflowIframe = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+function getCoinflowUrl(env) {
+    if (!env || env === 'prod')
+        return 'https://coinflow.cash';
+    if (env === 'local')
+        return 'http://localhost:3000';
+    return "https://".concat(env, ".coinflow.cash");
+}
+function CoinflowIFrame(_a) {
+    var publicKey = _a.publicKey, IFrameRef = _a.IFrameRef, env = _a.env, route = _a.route;
+    var url = new URL(route, getCoinflowUrl(env));
+    url.searchParams.append('pubkey', publicKey);
+    return (react_1["default"].createElement("iframe", { ref: IFrameRef, style: {
+            width: '100%',
+            height: '100%'
+        }, title: "withdraw", frameBorder: "0", src: url.toString() }));
+}
+exports.CoinflowIframe = react_1["default"].memo(CoinflowIFrame);
+//# sourceMappingURL=CoinflowIFrame.js.map

package/build/cjs/CoinflowIFrame.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoinflowIFrame.js","sourceRoot":"","sources":["../../src/CoinflowIFrame.tsx"],"names":[],"mappings":";;;;AAAA,wDAA0B;AAW1B,SAAS,cAAc,CAAC,GAAkB;IACxC,IAAI,CAAC,GAAG,IAAI,GAAG,KAAK,MAAM;QAAE,OAAO,uBAAuB,CAAC;IAC3D,IAAI,GAAG,KAAK,OAAO;QAAE,OAAO,uBAAuB,CAAC;IAEpD,OAAO,kBAAW,GAAG,mBAAgB,CAAC;AACxC,CAAC;AAED,SAAS,cAAc,CAAC,EAKF;QAJpB,SAAS,eAAA,EACT,SAAS,eAAA,EACT,GAAG,SAAA,EACH,KAAK,WAAA;IAEL,IAAM,GAAG,GAAG,IAAI,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;IAChD,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAE7C,OAAO,CACL,6CACE,GAAG,EAAE,SAAS,EACd,KAAK,EAAE;YACL,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;SACf,EACD,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,GAAG,EACf,GAAG,EAAE,GAAG,CAAC,QAAQ,EAAE,GACnB,CACH,CAAC;AACJ,CAAC;AAEY,QAAA,cAAc,GAAG,kBAAK,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC"}

package/build/cjs/CoinflowPurchase.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { WalletContextState } from '@solana/wallet-adapter-react';
+import { Connection } from '@solana/web3.js';
+import { CoinflowEnvs } from './CoinflowIFrame';
+import { OnSuccessMethod } from './IFrameWalletConnector';
+type Props = {
+    wallet: WalletContextState;
+    merchantId: string;
+    connection: Connection;
+    env?: CoinflowEnvs;
+    onSuccess?: OnSuccessMethod;
+};
+export declare function CoinflowPurchase({ wallet, merchantId, env, connection, onSuccess, }: Props): JSX.Element | null;
+export {};

package/build/cjs/CoinflowPurchase.js

@@ -0,0 +1,16 @@
+"use strict";
+exports.__esModule = true;
+exports.CoinflowPurchase = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var CoinflowIFrame_1 = require("./CoinflowIFrame");
+var IFrameWalletConnector_1 = require("./IFrameWalletConnector");
+function CoinflowPurchase(_a) {
+    var wallet = _a.wallet, merchantId = _a.merchantId, env = _a.env, connection = _a.connection, onSuccess = _a.onSuccess;
+    var IFrameRef = (0, IFrameWalletConnector_1.useIframeWallet)({ wallet: wallet, connection: connection, onSuccess: onSuccess }).IFrameRef;
+    if (!wallet.publicKey || !wallet.connected)
+        return null;
+    return (react_1["default"].createElement(CoinflowIFrame_1.CoinflowIframe, { publicKey: wallet.publicKey.toString(), IFrameRef: IFrameRef, route: "/purchase/".concat(merchantId), env: env }));
+}
+exports.CoinflowPurchase = CoinflowPurchase;
+//# sourceMappingURL=CoinflowPurchase.js.map

package/build/cjs/CoinflowPurchase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoinflowPurchase.js","sourceRoot":"","sources":["../../src/CoinflowPurchase.tsx"],"names":[],"mappings":";;;;AACA,wDAA0B;AAE1B,mDAA8D;AAC9D,iEAAyE;AAUzE,SAAgB,gBAAgB,CAAC,EAMzB;QALN,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,GAAG,SAAA,EACH,UAAU,gBAAA,EACV,SAAS,eAAA;IAEF,IAAA,SAAS,GAAI,IAAA,uCAAe,EAAC,EAAC,MAAM,QAAA,EAAE,UAAU,YAAA,EAAE,SAAS,WAAA,EAAC,CAAC,UAApD,CAAqD;IAErE,IAAI,CAAC,MAAM,CAAC,SAAS,IAAI,CAAC,MAAM,CAAC,SAAS;QAAE,OAAO,IAAI,CAAC;IAExD,OAAO,CACL,iCAAC,+BAAc,IACb,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,QAAQ,EAAE,EACtC,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,oBAAa,UAAU,CAAE,EAChC,GAAG,EAAE,GAAG,GACR,CACH,CAAC;AACJ,CAAC;AAnBD,4CAmBC"}

package/build/cjs/CoinflowWithdraw.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { WalletContextState } from '@solana/wallet-adapter-react';
+import { Connection } from '@solana/web3.js';
+import { CoinflowEnvs } from './CoinflowIFrame';
+import { OnSuccessMethod } from './IFrameWalletConnector';
+type Props = {
+    wallet: WalletContextState;
+    merchantId: string;
+    connection: Connection;
+    env?: CoinflowEnvs;
+    onSuccess?: OnSuccessMethod;
+};
+export declare function CoinflowWithdraw({ wallet, merchantId, env, connection, onSuccess, }: Props): JSX.Element | null;
+export {};

package/build/cjs/CoinflowWithdraw.js

@@ -0,0 +1,16 @@
+"use strict";
+exports.__esModule = true;
+exports.CoinflowWithdraw = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var CoinflowIFrame_1 = require("./CoinflowIFrame");
+var IFrameWalletConnector_1 = require("./IFrameWalletConnector");
+function CoinflowWithdraw(_a) {
+    var wallet = _a.wallet, merchantId = _a.merchantId, env = _a.env, connection = _a.connection, onSuccess = _a.onSuccess;
+    var IFrameRef = (0, IFrameWalletConnector_1.useIframeWallet)({ wallet: wallet, connection: connection, onSuccess: onSuccess }).IFrameRef;
+    if (!wallet.publicKey || !wallet.connected)
+        return null;
+    return (react_1["default"].createElement(CoinflowIFrame_1.CoinflowIframe, { publicKey: wallet.publicKey.toString(), IFrameRef: IFrameRef, route: "/withdraw/".concat(merchantId), env: env }));
+}
+exports.CoinflowWithdraw = CoinflowWithdraw;
+//# sourceMappingURL=CoinflowWithdraw.js.map

package/build/cjs/CoinflowWithdraw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoinflowWithdraw.js","sourceRoot":"","sources":["../../src/CoinflowWithdraw.tsx"],"names":[],"mappings":";;;;AACA,wDAA0B;AAE1B,mDAA8D;AAC9D,iEAAyE;AAUzE,SAAgB,gBAAgB,CAAC,EAMzB;QALN,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,GAAG,SAAA,EACH,UAAU,gBAAA,EACV,SAAS,eAAA;IAEF,IAAA,SAAS,GAAI,IAAA,uCAAe,EAAC,EAAC,MAAM,QAAA,EAAE,UAAU,YAAA,EAAE,SAAS,WAAA,EAAC,CAAC,UAApD,CAAqD;IAErE,IAAI,CAAC,MAAM,CAAC,SAAS,IAAI,CAAC,MAAM,CAAC,SAAS;QAAE,OAAO,IAAI,CAAC;IAExD,OAAO,CACL,iCAAC,+BAAc,IACb,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,QAAQ,EAAE,EACtC,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,oBAAa,UAAU,CAAE,EAChC,GAAG,EAAE,GAAG,GACR,CACH,CAAC;AACJ,CAAC;AAnBD,4CAmBC"}

package/build/cjs/IFrameWalletConnector.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { Connection } from '@solana/web3.js';
+import { WalletContextState } from '@solana/wallet-adapter-react';
+export type WalletCall = {
+    method: string;
+    data: string;
+};
+export type OnSuccessMethod = (params: string) => void | Promise<void>;
+type Props = {
+    wallet: WalletContextState;
+    connection: Connection;
+    onSuccess?: OnSuccessMethod;
+};
+export declare function useIframeWallet({ wallet, connection, onSuccess }: Props): {
+    IFrameRef: import("react").RefObject<HTMLIFrameElement>;
+};
+export {};

package/build/cjs/IFrameWalletConnector.js

@@ -0,0 +1,135 @@
+"use strict";
+exports.__esModule = true;
+exports.useIframeWallet = void 0;
+var tslib_1 = require("tslib");
+var react_1 = require("react");
+var bs58_1 = tslib_1.__importDefault(require("bs58"));
+var web3_js_1 = require("@solana/web3.js");
+function useIframeWallet(_a) {
+    var _this = this;
+    var wallet = _a.wallet, connection = _a.connection, onSuccess = _a.onSuccess;
+    var IFrameRef = (0, react_1.useRef)(null);
+    var sendIFrameMessage = (0, react_1.useCallback)(function (message) {
+        var _a;
+        if (!((_a = IFrameRef === null || IFrameRef === void 0 ? void 0 : IFrameRef.current) === null || _a === void 0 ? void 0 : _a.contentWindow))
+            throw new Error('Iframe not defined');
+        IFrameRef.current.contentWindow.postMessage(message, '*');
+    }, [IFrameRef]);
+    var handleSignMessage = (0, react_1.useCallback)(function (_a) {
+        var data = _a.data;
+        return tslib_1.__awaiter(_this, void 0, void 0, function () {
+            var signature;
+            return tslib_1.__generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        if (!wallet.signMessage)
+                            return [2 /*return*/];
+                        return [4 /*yield*/, wallet.signMessage(bs58_1["default"].decode(data))];
+                    case 1:
+                        signature = _b.sent();
+                        sendIFrameMessage(bs58_1["default"].encode(signature));
+                        return [2 /*return*/];
+                }
+            });
+        });
+    }, [sendIFrameMessage, wallet]);
+    var handleSignTransaction = (0, react_1.useCallback)(function (_a) {
+        var data = _a.data;
+        return tslib_1.__awaiter(_this, void 0, void 0, function () {
+            var tx, _b, signature;
+            return tslib_1.__generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        tx = web3_js_1.Transaction.from(bs58_1["default"].decode(data));
+                        _b = tx;
+                        return [4 /*yield*/, connection.getLatestBlockhash()];
+                    case 1:
+                        _b.recentBlockhash = (_c.sent()).blockhash;
+                        return [4 /*yield*/, wallet.sendTransaction(tx, connection)];
+                    case 2:
+                        signature = _c.sent();
+                        sendIFrameMessage(signature);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    }, [connection, sendIFrameMessage, wallet]);
+    var handleIframeMessages = (0, react_1.useCallback)(function (_a) {
+        var data = _a.data;
+        return tslib_1.__awaiter(_this, void 0, void 0, function () {
+            var parsedData, _b, e_1;
+            return tslib_1.__generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        _c.trys.push([0, 8, , 9]);
+                        if (!wallet)
+                            return [2 /*return*/];
+                        parsedData = parseJSON(data);
+                        if (!parsedData)
+                            return [2 /*return*/];
+                        _b = parsedData.method;
+                        switch (_b) {
+                            case 'signMessage': return [3 /*break*/, 1];
+                            case 'sendTransaction': return [3 /*break*/, 3];
+                            case 'success': return [3 /*break*/, 5];
+                        }
+                        return [3 /*break*/, 6];
+                    case 1: return [4 /*yield*/, handleSignMessage(parsedData)];
+                    case 2:
+                        _c.sent();
+                        return [3 /*break*/, 7];
+                    case 3: return [4 /*yield*/, handleSignTransaction(parsedData)];
+                    case 4:
+                        _c.sent();
+                        return [3 /*break*/, 7];
+                    case 5:
+                        {
+                            if (onSuccess)
+                                onSuccess(data);
+                            return [3 /*break*/, 7];
+                        }
+                        _c.label = 6;
+                    case 6:
+                        {
+                            throw new Error("Unsupported Wallet Method ".concat(parsedData.method, ", must be signMessage or signTransaction"));
+                        }
+                        _c.label = 7;
+                    case 7: return [3 /*break*/, 9];
+                    case 8:
+                        e_1 = _c.sent();
+                        console.error('handleIframeMessages', e_1);
+                        sendIFrameMessage('ERROR');
+                        return [3 /*break*/, 9];
+                    case 9: return [2 /*return*/];
+                }
+            });
+        });
+    }, [
+        handleSignMessage,
+        handleSignTransaction,
+        onSuccess,
+        sendIFrameMessage,
+        wallet,
+    ]);
+    (0, react_1.useEffect)(function () {
+        if (!window)
+            throw new Error('Window not defined');
+        window.onmessage = handleIframeMessages;
+    }, [handleIframeMessages]);
+    return { IFrameRef: IFrameRef };
+}
+exports.useIframeWallet = useIframeWallet;
+function parseJSON(data) {
+    try {
+        var res = JSON.parse(data);
+        if (!res.method)
+            return null;
+        if (!res.data)
+            return null;
+        return res;
+    }
+    catch (e) {
+        return null;
+    }
+}
+//# sourceMappingURL=IFrameWalletConnector.js.map

package/build/cjs/IFrameWalletConnector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IFrameWalletConnector.js","sourceRoot":"","sources":["../../src/IFrameWalletConnector.ts"],"names":[],"mappings":"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"}

package/build/cjs/index.d.ts

@@ -0,0 +1,2 @@
+export * from './CoinflowWithdraw';
+export * from './CoinflowPurchase';

package/build/cjs/index.js

@@ -0,0 +1,6 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./CoinflowWithdraw"), exports);
+tslib_1.__exportStar(require("./CoinflowPurchase"), exports);
+//# sourceMappingURL=index.js.map

package/build/cjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;AAAA,6DAAmC;AACnC,6DAAmC"}

package/build/esm/CoinflowIFrame.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export type CoinflowEnvs = 'prod' | 'staging' | 'sandbox' | 'local';
+type CoinflowIFrameProps = {
+    publicKey: string;
+    IFrameRef: React.RefObject<HTMLIFrameElement>;
+    env?: CoinflowEnvs;
+    route: string;
+};
+declare function CoinflowIFrame({ publicKey, IFrameRef, env, route, }: CoinflowIFrameProps): JSX.Element;
+export declare const CoinflowIframe: React.MemoExoticComponent<typeof CoinflowIFrame>;
+export {};

package/build/esm/CoinflowIFrame.js

@@ -0,0 +1,19 @@
+import React from 'react';
+function getCoinflowUrl(env) {
+    if (!env || env === 'prod')
+        return 'https://coinflow.cash';
+    if (env === 'local')
+        return 'http://localhost:3000';
+    return "https://".concat(env, ".coinflow.cash");
+}
+function CoinflowIFrame(_a) {
+    var publicKey = _a.publicKey, IFrameRef = _a.IFrameRef, env = _a.env, route = _a.route;
+    var url = new URL(route, getCoinflowUrl(env));
+    url.searchParams.append('pubkey', publicKey);
+    return (React.createElement("iframe", { ref: IFrameRef, style: {
+            width: '100%',
+            height: '100%'
+        }, title: "withdraw", frameBorder: "0", src: url.toString() }));
+}
+export var CoinflowIframe = React.memo(CoinflowIFrame);
+//# sourceMappingURL=CoinflowIFrame.js.map

package/build/esm/CoinflowIFrame.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoinflowIFrame.js","sourceRoot":"","sources":["../../src/CoinflowIFrame.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,SAAS,cAAc,CAAC,GAAkB;IACxC,IAAI,CAAC,GAAG,IAAI,GAAG,KAAK,MAAM;QAAE,OAAO,uBAAuB,CAAC;IAC3D,IAAI,GAAG,KAAK,OAAO;QAAE,OAAO,uBAAuB,CAAC;IAEpD,OAAO,kBAAW,GAAG,mBAAgB,CAAC;AACxC,CAAC;AAED,SAAS,cAAc,CAAC,EAKF;QAJpB,SAAS,eAAA,EACT,SAAS,eAAA,EACT,GAAG,SAAA,EACH,KAAK,WAAA;IAEL,IAAM,GAAG,GAAG,IAAI,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;IAChD,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAE7C,OAAO,CACL,gCACE,GAAG,EAAE,SAAS,EACd,KAAK,EAAE;YACL,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;SACf,EACD,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,GAAG,EACf,GAAG,EAAE,GAAG,CAAC,QAAQ,EAAE,GACnB,CACH,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,IAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC"}

package/build/esm/CoinflowPurchase.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { WalletContextState } from '@solana/wallet-adapter-react';
+import { Connection } from '@solana/web3.js';
+import { CoinflowEnvs } from './CoinflowIFrame';
+import { OnSuccessMethod } from './IFrameWalletConnector';
+type Props = {
+    wallet: WalletContextState;
+    merchantId: string;
+    connection: Connection;
+    env?: CoinflowEnvs;
+    onSuccess?: OnSuccessMethod;
+};
+export declare function CoinflowPurchase({ wallet, merchantId, env, connection, onSuccess, }: Props): JSX.Element | null;
+export {};

package/build/esm/CoinflowPurchase.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { CoinflowIframe } from './CoinflowIFrame';
+import { useIframeWallet } from './IFrameWalletConnector';
+export function CoinflowPurchase(_a) {
+    var wallet = _a.wallet, merchantId = _a.merchantId, env = _a.env, connection = _a.connection, onSuccess = _a.onSuccess;
+    var IFrameRef = useIframeWallet({ wallet: wallet, connection: connection, onSuccess: onSuccess }).IFrameRef;
+    if (!wallet.publicKey || !wallet.connected)
+        return null;
+    return (React.createElement(CoinflowIframe, { publicKey: wallet.publicKey.toString(), IFrameRef: IFrameRef, route: "/purchase/".concat(merchantId), env: env }));
+}
+//# sourceMappingURL=CoinflowPurchase.js.map

package/build/esm/CoinflowPurchase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoinflowPurchase.js","sourceRoot":"","sources":["../../src/CoinflowPurchase.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAe,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAkB,eAAe,EAAC,MAAM,yBAAyB,CAAC;AAUzE,MAAM,UAAU,gBAAgB,CAAC,EAMzB;QALN,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,GAAG,SAAA,EACH,UAAU,gBAAA,EACV,SAAS,eAAA;IAEF,IAAA,SAAS,GAAI,eAAe,CAAC,EAAC,MAAM,QAAA,EAAE,UAAU,YAAA,EAAE,SAAS,WAAA,EAAC,CAAC,UAApD,CAAqD;IAErE,IAAI,CAAC,MAAM,CAAC,SAAS,IAAI,CAAC,MAAM,CAAC,SAAS;QAAE,OAAO,IAAI,CAAC;IAExD,OAAO,CACL,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,QAAQ,EAAE,EACtC,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,oBAAa,UAAU,CAAE,EAChC,GAAG,EAAE,GAAG,GACR,CACH,CAAC;AACJ,CAAC"}

package/build/esm/CoinflowWithdraw.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { WalletContextState } from '@solana/wallet-adapter-react';
+import { Connection } from '@solana/web3.js';
+import { CoinflowEnvs } from './CoinflowIFrame';
+import { OnSuccessMethod } from './IFrameWalletConnector';
+type Props = {
+    wallet: WalletContextState;
+    merchantId: string;
+    connection: Connection;
+    env?: CoinflowEnvs;
+    onSuccess?: OnSuccessMethod;
+};
+export declare function CoinflowWithdraw({ wallet, merchantId, env, connection, onSuccess, }: Props): JSX.Element | null;
+export {};

package/build/esm/CoinflowWithdraw.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { CoinflowIframe } from './CoinflowIFrame';
+import { useIframeWallet } from './IFrameWalletConnector';
+export function CoinflowWithdraw(_a) {
+    var wallet = _a.wallet, merchantId = _a.merchantId, env = _a.env, connection = _a.connection, onSuccess = _a.onSuccess;
+    var IFrameRef = useIframeWallet({ wallet: wallet, connection: connection, onSuccess: onSuccess }).IFrameRef;
+    if (!wallet.publicKey || !wallet.connected)
+        return null;
+    return (React.createElement(CoinflowIframe, { publicKey: wallet.publicKey.toString(), IFrameRef: IFrameRef, route: "/withdraw/".concat(merchantId), env: env }));
+}
+//# sourceMappingURL=CoinflowWithdraw.js.map

package/build/esm/CoinflowWithdraw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoinflowWithdraw.js","sourceRoot":"","sources":["../../src/CoinflowWithdraw.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAe,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAkB,eAAe,EAAC,MAAM,yBAAyB,CAAC;AAUzE,MAAM,UAAU,gBAAgB,CAAC,EAMzB;QALN,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,GAAG,SAAA,EACH,UAAU,gBAAA,EACV,SAAS,eAAA;IAEF,IAAA,SAAS,GAAI,eAAe,CAAC,EAAC,MAAM,QAAA,EAAE,UAAU,YAAA,EAAE,SAAS,WAAA,EAAC,CAAC,UAApD,CAAqD;IAErE,IAAI,CAAC,MAAM,CAAC,SAAS,IAAI,CAAC,MAAM,CAAC,SAAS;QAAE,OAAO,IAAI,CAAC;IAExD,OAAO,CACL,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,QAAQ,EAAE,EACtC,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,oBAAa,UAAU,CAAE,EAChC,GAAG,EAAE,GAAG,GACR,CACH,CAAC;AACJ,CAAC"}

package/build/esm/IFrameWalletConnector.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { Connection } from '@solana/web3.js';
+import { WalletContextState } from '@solana/wallet-adapter-react';
+export type WalletCall = {
+    method: string;
+    data: string;
+};
+export type OnSuccessMethod = (params: string) => void | Promise<void>;
+type Props = {
+    wallet: WalletContextState;
+    connection: Connection;
+    onSuccess?: OnSuccessMethod;
+};
+export declare function useIframeWallet({ wallet, connection, onSuccess }: Props): {
+    IFrameRef: import("react").RefObject<HTMLIFrameElement>;
+};
+export {};

package/build/esm/IFrameWalletConnector.js

@@ -0,0 +1,131 @@
+import { __awaiter, __generator } from "tslib";
+import { useCallback, useEffect, useRef } from 'react';
+import base58 from 'bs58';
+import { Transaction } from '@solana/web3.js';
+export function useIframeWallet(_a) {
+    var _this = this;
+    var wallet = _a.wallet, connection = _a.connection, onSuccess = _a.onSuccess;
+    var IFrameRef = useRef(null);
+    var sendIFrameMessage = useCallback(function (message) {
+        var _a;
+        if (!((_a = IFrameRef === null || IFrameRef === void 0 ? void 0 : IFrameRef.current) === null || _a === void 0 ? void 0 : _a.contentWindow))
+            throw new Error('Iframe not defined');
+        IFrameRef.current.contentWindow.postMessage(message, '*');
+    }, [IFrameRef]);
+    var handleSignMessage = useCallback(function (_a) {
+        var data = _a.data;
+        return __awaiter(_this, void 0, void 0, function () {
+            var signature;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        if (!wallet.signMessage)
+                            return [2 /*return*/];
+                        return [4 /*yield*/, wallet.signMessage(base58.decode(data))];
+                    case 1:
+                        signature = _b.sent();
+                        sendIFrameMessage(base58.encode(signature));
+                        return [2 /*return*/];
+                }
+            });
+        });
+    }, [sendIFrameMessage, wallet]);
+    var handleSignTransaction = useCallback(function (_a) {
+        var data = _a.data;
+        return __awaiter(_this, void 0, void 0, function () {
+            var tx, _b, signature;
+            return __generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        tx = Transaction.from(base58.decode(data));
+                        _b = tx;
+                        return [4 /*yield*/, connection.getLatestBlockhash()];
+                    case 1:
+                        _b.recentBlockhash = (_c.sent()).blockhash;
+                        return [4 /*yield*/, wallet.sendTransaction(tx, connection)];
+                    case 2:
+                        signature = _c.sent();
+                        sendIFrameMessage(signature);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    }, [connection, sendIFrameMessage, wallet]);
+    var handleIframeMessages = useCallback(function (_a) {
+        var data = _a.data;
+        return __awaiter(_this, void 0, void 0, function () {
+            var parsedData, _b, e_1;
+            return __generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        _c.trys.push([0, 8, , 9]);
+                        if (!wallet)
+                            return [2 /*return*/];
+                        parsedData = parseJSON(data);
+                        if (!parsedData)
+                            return [2 /*return*/];
+                        _b = parsedData.method;
+                        switch (_b) {
+                            case 'signMessage': return [3 /*break*/, 1];
+                            case 'sendTransaction': return [3 /*break*/, 3];
+                            case 'success': return [3 /*break*/, 5];
+                        }
+                        return [3 /*break*/, 6];
+                    case 1: return [4 /*yield*/, handleSignMessage(parsedData)];
+                    case 2:
+                        _c.sent();
+                        return [3 /*break*/, 7];
+                    case 3: return [4 /*yield*/, handleSignTransaction(parsedData)];
+                    case 4:
+                        _c.sent();
+                        return [3 /*break*/, 7];
+                    case 5:
+                        {
+                            if (onSuccess)
+                                onSuccess(data);
+                            return [3 /*break*/, 7];
+                        }
+                        _c.label = 6;
+                    case 6:
+                        {
+                            throw new Error("Unsupported Wallet Method ".concat(parsedData.method, ", must be signMessage or signTransaction"));
+                        }
+                        _c.label = 7;
+                    case 7: return [3 /*break*/, 9];
+                    case 8:
+                        e_1 = _c.sent();
+                        console.error('handleIframeMessages', e_1);
+                        sendIFrameMessage('ERROR');
+                        return [3 /*break*/, 9];
+                    case 9: return [2 /*return*/];
+                }
+            });
+        });
+    }, [
+        handleSignMessage,
+        handleSignTransaction,
+        onSuccess,
+        sendIFrameMessage,
+        wallet,
+    ]);
+    useEffect(function () {
+        if (!window)
+            throw new Error('Window not defined');
+        window.onmessage = handleIframeMessages;
+    }, [handleIframeMessages]);
+    return { IFrameRef: IFrameRef };
+}
+function parseJSON(data) {
+    try {
+        var res = JSON.parse(data);
+        if (!res.method)
+            return null;
+        if (!res.data)
+            return null;
+        return res;
+    }
+    catch (e) {
+        return null;
+    }
+}
+//# sourceMappingURL=IFrameWalletConnector.js.map

package/build/esm/IFrameWalletConnector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IFrameWalletConnector.js","sourceRoot":"","sources":["../../src/IFrameWalletConnector.ts"],"names":[],"mappings":"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"}

package/build/esm/index.d.ts

@@ -0,0 +1,2 @@
+export * from './CoinflowWithdraw';
+export * from './CoinflowPurchase';

package/build/esm/index.js

@@ -0,0 +1,3 @@
+export * from './CoinflowWithdraw';
+export * from './CoinflowPurchase';
+//# sourceMappingURL=index.js.map

package/build/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}

package/package.json

@@ -0,0 +1,57 @@
+{
+  "name": "@coinflowlabs/react",
+  "version": "0.1.0",
+  "description": "React Component for Coinflow Withdraw",
+  "main": "./build/cjs/index.js",
+  "module": "./build/esm/index.js",
+  "types": "./build/esm/index.d.ts",
+  "license": "Apache-2.0",
+  "keywords": [
+    "react",
+    "typescript",
+    "solana",
+    "web3"
+  ],
+  "scripts": {
+    "clean": "rimraf build",
+    "build": "npm run build:esm && npm run build:cjs",
+    "build:esm": "tsc",
+    "build:cjs": "tsc --module commonjs --outDir build/cjs"
+  },
+  "files": [
+    "build",
+    "README.md"
+  ],
+  "dependencies": {
+    "bs58": "^5.0.0",
+    "@solana/web3.js": "^1.66.2"
+  },
+  "devDependencies": {
+    "@types/react": "^18.0.25",
+    "eslint-config-react-app": "^7.0.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "typescript": "^4.9.3"
+  },
+  "peerDependencies": {
+    "react": ">=16"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}