@coinflowlabs/react 0.1.0 → 0.2.0

package/README.md

@@ -33,3 +33,4 @@ Props:
 * `env` (optional): This defaults to `prod`
   - For testing set to `staging`
 * `onSuccess` (optional): function to run when the purchase process is successful
+* `transaction` (optional): transaction for the user to run which redeems their credits with your smart contract. Create this transaction just like you would for a normal user who has USDC in their account.

package/build/cjs/CoinflowIFrame.d.ts

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

package/build/cjs/CoinflowIFrame.js

@@ -1,8 +1,9 @@
 "use strict";
 exports.__esModule = true;
-exports.CoinflowIframe = void 0;
+exports.CoinflowIFrame = void 0;
 var tslib_1 = require("tslib");
-var react_1 = tslib_1.__importDefault(require("react"));
+var react_1 = tslib_1.__importStar(require("react"));
+var bs58_1 = tslib_1.__importDefault(require("bs58"));
 function getCoinflowUrl(env) {
     if (!env || env === 'prod')
         return 'https://coinflow.cash';
@@ -11,13 +12,27 @@ function getCoinflowUrl(env) {
     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: {
+    var publicKey = _a.publicKey, IFrameRef = _a.IFrameRef, env = _a.env, route = _a.route, transaction = _a.transaction, amount = _a.amount;
+    var url = (0, react_1.useMemo)(function () {
+        var url = new URL(route, getCoinflowUrl(env));
+        url.searchParams.append('pubkey', publicKey);
+        if (transaction) {
+            var serializedTx = bs58_1["default"].encode(transaction.serialize({
+                requireAllSignatures: false,
+                verifySignatures: false
+            }));
+            url.searchParams.append('transaction', serializedTx);
+        }
+        if (amount) {
+            url.searchParams.append('amount', amount.toString());
+        }
+        console.log({ url: url });
+        return url;
+    }, [amount, env, publicKey, route, transaction]);
+    return (0, react_1.useMemo)(function () { return (react_1["default"].createElement("iframe", { ref: IFrameRef, style: {
             width: '100%',
             height: '100%'
-        }, title: "withdraw", frameBorder: "0", src: url.toString() }));
+        }, title: "withdraw", frameBorder: "0", src: url.toString() })); }, [IFrameRef, url]);
 }
-exports.CoinflowIframe = react_1["default"].memo(CoinflowIFrame);
+exports.CoinflowIFrame = CoinflowIFrame;
 //# sourceMappingURL=CoinflowIFrame.js.map

package/build/cjs/CoinflowIFrame.js.map

@@ -1 +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"}
+{"version":3,"file":"CoinflowIFrame.js","sourceRoot":"","sources":["../../src/CoinflowIFrame.tsx"],"names":[],"mappings":";;;;AAAA,qDAAqC;AAErC,sDAA0B;AAa1B,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,SAAgB,cAAc,CAAC,EAOT;QANpB,SAAS,eAAA,EACT,SAAS,eAAA,EACT,GAAG,SAAA,EACH,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,MAAM,YAAA;IAEN,IAAM,GAAG,GAAG,IAAA,eAAO,EAAC;QAClB,IAAM,GAAG,GAAG,IAAI,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;QAChD,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;QAC7C,IAAI,WAAW,EAAE;YACf,IAAM,YAAY,GAAG,iBAAM,CAAC,MAAM,CAChC,WAAW,CAAC,SAAS,CAAC;gBACpB,oBAAoB,EAAE,KAAK;gBAC3B,gBAAgB,EAAE,KAAK;aACxB,CAAC,CACH,CAAC;YACF,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,aAAa,EAAE,YAAY,CAAC,CAAC;SACtD;QACD,IAAI,MAAM,EAAE;YACV,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC;SACtD;QACD,OAAO,CAAC,GAAG,CAAC,EAAC,GAAG,KAAA,EAAC,CAAC,CAAC;QACnB,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC;IAEjD,OAAO,IAAA,eAAO,EACZ,cAAM,OAAA,CACJ,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,EAXK,CAWL,EACD,CAAC,SAAS,EAAE,GAAG,CAAC,CACjB,CAAC;AACJ,CAAC;AA1CD,wCA0CC"}

package/build/cjs/CoinflowPurchase.d.ts

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

package/build/cjs/CoinflowPurchase.js

@@ -6,11 +6,11 @@ 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 wallet = _a.wallet, merchantId = _a.merchantId, env = _a.env, connection = _a.connection, onSuccess = _a.onSuccess, transaction = _a.transaction, amount = _a.amount;
     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 }));
+    return (react_1["default"].createElement(CoinflowIFrame_1.CoinflowIFrame, { publicKey: wallet.publicKey.toString(), IFrameRef: IFrameRef, route: "/purchase/".concat(merchantId), env: env, transaction: transaction, amount: amount }));
 }
 exports.CoinflowPurchase = CoinflowPurchase;
 //# sourceMappingURL=CoinflowPurchase.js.map

package/build/cjs/CoinflowPurchase.js.map

@@ -1 +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"}
+{"version":3,"file":"CoinflowPurchase.js","sourceRoot":"","sources":["../../src/CoinflowPurchase.tsx"],"names":[],"mappings":";;;;AACA,wDAA0B;AAE1B,mDAA8D;AAC9D,iEAAyE;AAYzE,SAAgB,gBAAgB,CAAC,EAQzB;QAPN,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,GAAG,SAAA,EACH,UAAU,gBAAA,EACV,SAAS,eAAA,EACT,WAAW,iBAAA,EACX,MAAM,YAAA;IAEC,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,EACR,WAAW,EAAE,WAAW,EACxB,MAAM,EAAE,MAAM,GACd,CACH,CAAC;AACJ,CAAC;AAvBD,4CAuBC"}

package/build/cjs/CoinflowWithdraw.js

@@ -10,7 +10,7 @@ function CoinflowWithdraw(_a) {
     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 }));
+    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/esm/CoinflowIFrame.d.ts

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

package/build/esm/CoinflowIFrame.js

@@ -1,4 +1,5 @@
-import React from 'react';
+import React, { useMemo } from 'react';
+import base58 from 'bs58';
 function getCoinflowUrl(env) {
     if (!env || env === 'prod')
         return 'https://coinflow.cash';
@@ -6,14 +7,27 @@ function getCoinflowUrl(env) {
         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: {
+export function CoinflowIFrame(_a) {
+    var publicKey = _a.publicKey, IFrameRef = _a.IFrameRef, env = _a.env, route = _a.route, transaction = _a.transaction, amount = _a.amount;
+    var url = useMemo(function () {
+        var url = new URL(route, getCoinflowUrl(env));
+        url.searchParams.append('pubkey', publicKey);
+        if (transaction) {
+            var serializedTx = base58.encode(transaction.serialize({
+                requireAllSignatures: false,
+                verifySignatures: false
+            }));
+            url.searchParams.append('transaction', serializedTx);
+        }
+        if (amount) {
+            url.searchParams.append('amount', amount.toString());
+        }
+        console.log({ url: url });
+        return url;
+    }, [amount, env, publicKey, route, transaction]);
+    return useMemo(function () { return (React.createElement("iframe", { ref: IFrameRef, style: {
             width: '100%',
             height: '100%'
-        }, title: "withdraw", frameBorder: "0", src: url.toString() }));
+        }, title: "withdraw", frameBorder: "0", src: url.toString() })); }, [IFrameRef, url]);
 }
-export var CoinflowIframe = React.memo(CoinflowIFrame);
 //# sourceMappingURL=CoinflowIFrame.js.map

package/build/esm/CoinflowIFrame.js.map

@@ -1 +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"}
+{"version":3,"file":"CoinflowIFrame.js","sourceRoot":"","sources":["../../src/CoinflowIFrame.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,OAAO,EAAC,MAAM,OAAO,CAAC;AAErC,OAAO,MAAM,MAAM,MAAM,CAAC;AAa1B,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,MAAM,UAAU,cAAc,CAAC,EAOT;QANpB,SAAS,eAAA,EACT,SAAS,eAAA,EACT,GAAG,SAAA,EACH,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,MAAM,YAAA;IAEN,IAAM,GAAG,GAAG,OAAO,CAAC;QAClB,IAAM,GAAG,GAAG,IAAI,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;QAChD,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;QAC7C,IAAI,WAAW,EAAE;YACf,IAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAChC,WAAW,CAAC,SAAS,CAAC;gBACpB,oBAAoB,EAAE,KAAK;gBAC3B,gBAAgB,EAAE,KAAK;aACxB,CAAC,CACH,CAAC;YACF,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,aAAa,EAAE,YAAY,CAAC,CAAC;SACtD;QACD,IAAI,MAAM,EAAE;YACV,GAAG,CAAC,YAAY,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC;SACtD;QACD,OAAO,CAAC,GAAG,CAAC,EAAC,GAAG,KAAA,EAAC,CAAC,CAAC;QACnB,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC;IAEjD,OAAO,OAAO,CACZ,cAAM,OAAA,CACJ,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,EAXK,CAWL,EACD,CAAC,SAAS,EAAE,GAAG,CAAC,CACjB,CAAC;AACJ,CAAC"}

package/build/esm/CoinflowPurchase.d.ts

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

package/build/esm/CoinflowPurchase.js

@@ -1,11 +1,11 @@
 import React from 'react';
-import { CoinflowIframe } from './CoinflowIFrame';
+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 wallet = _a.wallet, merchantId = _a.merchantId, env = _a.env, connection = _a.connection, onSuccess = _a.onSuccess, transaction = _a.transaction, amount = _a.amount;
     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 }));
+    return (React.createElement(CoinflowIFrame, { publicKey: wallet.publicKey.toString(), IFrameRef: IFrameRef, route: "/purchase/".concat(merchantId), env: env, transaction: transaction, amount: amount }));
 }
 //# sourceMappingURL=CoinflowPurchase.js.map

package/build/esm/CoinflowPurchase.js.map

@@ -1 +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"}
+{"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;AAYzE,MAAM,UAAU,gBAAgB,CAAC,EAQzB;QAPN,MAAM,YAAA,EACN,UAAU,gBAAA,EACV,GAAG,SAAA,EACH,UAAU,gBAAA,EACV,SAAS,eAAA,EACT,WAAW,iBAAA,EACX,MAAM,YAAA;IAEC,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,EACR,WAAW,EAAE,WAAW,EACxB,MAAM,EAAE,MAAM,GACd,CACH,CAAC;AACJ,CAAC"}

package/build/esm/CoinflowWithdraw.js

@@ -1,11 +1,11 @@
 import React from 'react';
-import { CoinflowIframe } from './CoinflowIFrame';
+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 }));
+    return (React.createElement(CoinflowIFrame, { publicKey: wallet.publicKey.toString(), IFrameRef: IFrameRef, route: "/withdraw/".concat(merchantId), env: env }));
 }
 //# sourceMappingURL=CoinflowWithdraw.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinflowlabs/react",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "React Component for Coinflow Withdraw",
   "main": "./build/cjs/index.js",
   "module": "./build/esm/index.js",