@bunnyapp/components 1.0.1 → 1.0.2

package/dist/cjs/index.js

@@ -2272,6 +2272,7 @@ var DemoPayForm = function (_a) {
             switch (_a.label) {
                 case 0:
                     _a.trys.push([0, 6, , 7]);
+                    validateCardDetails();
                     if (!onlySavePaymentMethod) return [3 /*break*/, 2];
                     setIsSaving(true);
                     return [4 /*yield*/, storePayment({
@@ -2299,14 +2300,6 @@ var DemoPayForm = function (_a) {
                 case 2:
                     if (!(amountDue !== undefined && currencyId)) return [3 /*break*/, 4];
                     setIsSaving(true);
-                    if (cardDetails.number !== TEST_CARD)
-                        throw new Error("Only the card number 4242 4242 4242 4242 will be accepted.");
-                    if (!isValidExpiry(cardDetails.expiry))
-                        throw new Error("Invalid expiry date");
-                    if (isCardExpired(cardDetails.expiry))
-                        throw new Error("Card is expired");
-                    if (cardDetails.cvc.length !== 3)
-                        throw new Error("Invalid CVC");
                     return [4 /*yield*/, confirmPayment({
                             amount: amountDue,
                             currency: currencyId,
@@ -2335,6 +2328,16 @@ var DemoPayForm = function (_a) {
             }
         });
     }); };
+    function validateCardDetails() {
+        if (cardDetails.number !== TEST_CARD)
+            throw new Error("Only the card number 4242 4242 4242 4242 will be accepted.");
+        if (!isValidExpiry(cardDetails.expiry))
+            throw new Error("Invalid expiry date");
+        if (isCardExpired(cardDetails.expiry))
+            throw new Error("Card is expired");
+        if (cardDetails.cvc.length !== 3)
+            throw new Error("Invalid CVC");
+    }
     var onCardNumberChange = function (number) {
         setCardDetails(__assign(__assign({}, cardDetails), { number: number }));
     };
@@ -3814,10 +3817,8 @@ var getPriceList = function (_a) {
 };
 
 function PaymentForms(_a) {
-    var quote = _a.quote, paying = _a.paying, setIsPaying = _a.setIsPaying, handlePaymentSaveSuccess = _a.handlePaymentSaveSuccess, handleSubmit = _a.handleSubmit, proceedingToPayment = _a.proceedingToPayment, accountId = _a.accountId;
-    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: quote ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: accountId && (jsxRuntime.jsx(PaymentContext.Provider, __assign({ value: { accountId: accountId, displayPayButtonNameAnyways: true } }, { children: jsxRuntime.jsx(PaymentForm, { isSaving: paying, setIsSaving: setIsPaying, onFail: function () {
-                        console.log("payment saving failed darn");
-                    }, onPaymentSuccess: handlePaymentSaveSuccess }) }))) })) : (jsxRuntime.jsx(InitialSignupForm, { onSubmit: handleSubmit, submitting: proceedingToPayment })) }));
+    var quote = _a.quote, paying = _a.paying, setIsPaying = _a.setIsPaying, handlePaymentSaveSuccess = _a.handlePaymentSaveSuccess, handlePaymentFail = _a.handlePaymentFail, handleSubmit = _a.handleSubmit, proceedingToPayment = _a.proceedingToPayment, accountId = _a.accountId;
+    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: quote ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: accountId && (jsxRuntime.jsx(PaymentContext.Provider, __assign({ value: { accountId: accountId, displayPayButtonNameAnyways: true } }, { children: jsxRuntime.jsx(PaymentForm, { isSaving: paying, setIsSaving: setIsPaying, onFail: handlePaymentFail, onPaymentSuccess: handlePaymentSaveSuccess }) }))) })) : (jsxRuntime.jsx(InitialSignupForm, { onSubmit: handleSubmit, submitting: proceedingToPayment })) }));
 }
 function InitialSignupForm(_a) {
     var onSubmit = _a.onSubmit, submitting = _a.submitting;
@@ -3854,10 +3855,10 @@ function InitialSignupForm(_a) {
 
 var Title = antd.Typography.Title, Text$a = antd.Typography.Text;
 function PaymentSuccessDisplay(_a) {
-    var className = _a.className, amountPaid = _a.amountPaid, style = _a.style, redirectUrl = _a.redirectUrl;
+    var className = _a.className, amountPaid = _a.amountPaid, style = _a.style, returnUrl = _a.returnUrl;
     var window = React.useContext(BunnyContext).window;
     var companyName = common.useCurrentUserData().companyName;
-    return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col items-center justify-center h-full ".concat(className), style: style }, { children: [jsxRuntime.jsx(CheckCircleFilled$1, { style: { fontSize: "48px", color: "rgb(52 211 153)" } }), jsxRuntime.jsxs(Title, __assign({ level: 3, className: "mt-2 m-0" }, { children: ["Payment of ", common.Misc.formatCurrency(amountPaid, "USD"), " successful"] })), redirectUrl && (jsxRuntime.jsxs(Text$a, __assign({ className: "text-slate-500 cursor-pointer underline", onClick: function () { return (window.location.href = redirectUrl); } }, { children: ["Back to ", companyName] })))] })));
+    return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col items-center justify-center h-full ".concat(className), style: style }, { children: [jsxRuntime.jsx(CheckCircleFilled$1, { style: { fontSize: "48px", color: "rgb(52 211 153)" } }), jsxRuntime.jsxs(Title, __assign({ level: 3, className: "mt-2 m-0" }, { children: ["Payment of ", common.Misc.formatCurrency(amountPaid, "USD"), " successful"] })), returnUrl && (jsxRuntime.jsxs(Text$a, __assign({ className: "text-slate-500 cursor-pointer underline", onClick: function () { return (window.location.href = returnUrl); } }, { children: ["Back to ", companyName] })))] })));
 }
 
 var Text$9 = antd.Typography.Text;
@@ -3894,8 +3895,9 @@ var StyedLink = styled__default["default"].a(templateObject_1$4 || (templateObje
 var StyledBunnyLink = styled__default["default"](StyedLink)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  &:hover {\n    color: ", " !important;\n  }\n"], ["\n  &:hover {\n    color: ", " !important;\n  }\n"])), common.PRIMARY_COLOR);
 var templateObject_1$4, templateObject_2;
 
+var showErrorNotification = common.NotificationUtils.useErrorNotification();
 function Signup(_a) {
-    var priceListCode = _a.priceListCode, redirectUrl = _a.redirectUrl;
+    var priceListCode = _a.priceListCode, returnUrl = _a.returnUrl;
     // Hooks
     var _b = React.useContext(BunnyContext), subdomain = _b.subdomain, token = _b.token, window = _b.window;
     reactQuery.useQuery({
@@ -3988,11 +3990,15 @@ function Signup(_a) {
             });
         });
     }
+    function handlePaymentFail(error) {
+        showErrorNotification(error.message);
+        setIsPaying(false);
+    }
     if (isMobile) {
-        return (jsxRuntime.jsx(Card, __assign({ className: "p-4 flex flex-col" }, { children: purchaseSucceeded ? (jsxRuntime.jsx(PaymentSuccessDisplay, { className: "w-full", amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, redirectUrl: redirectUrl })) : (jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsxRuntime.jsx("div", __assign({ className: "flex flex-col items-center" }, { children: jsxRuntime.jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsxRuntime.jsx("div", __assign({ className: "mx-8" }, { children: jsxRuntime.jsx(antd.Divider, { className: "h-full" }) })), jsxRuntime.jsx("div", __assign({ className: "flex items-center justify-center my-12" }, { children: jsxRuntime.jsx(PaymentForms, { quote: quote, paying: paying, setIsPaying: setIsPaying, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId || "" }) }))] }))) })));
+        return (jsxRuntime.jsx(Card, __assign({ className: "p-4 flex flex-col" }, { children: purchaseSucceeded ? (jsxRuntime.jsx(PaymentSuccessDisplay, { className: "w-full", amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, returnUrl: returnUrl })) : (jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsxRuntime.jsx("div", __assign({ className: "flex flex-col items-center" }, { children: jsxRuntime.jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsxRuntime.jsx("div", __assign({ className: "mx-8" }, { children: jsxRuntime.jsx(antd.Divider, { className: "h-full" }) })), jsxRuntime.jsx("div", __assign({ className: "flex items-center justify-center my-12" }, { children: jsxRuntime.jsx(PaymentForms, { quote: quote, paying: paying, setIsPaying: setIsPaying, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handlePaymentFail: handlePaymentFail, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId || "" }) }))] }))) })));
     }
     else {
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Card, __assign({ className: "p-4 flex flex-col w-screen h-screen" }, { children: purchaseSucceeded ? (jsxRuntime.jsx(PaymentSuccessDisplay, { className: "w-full", amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, redirectUrl: redirectUrl })) : (jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsxRuntime.jsx("div", __assign({ className: "flex flex-col w-1/2 items-center" }, { children: jsxRuntime.jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsxRuntime.jsx("div", __assign({ className: "my-4" }, { children: jsxRuntime.jsx(antd.Divider, { className: "h-full", type: "vertical" }) })), jsxRuntime.jsx("div", __assign({ className: "flex w-1/2 items-center justify-center my-12" }, { children: jsxRuntime.jsx(PaymentForms, { quote: quote, paying: paying, setIsPaying: setIsPaying, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId || "" }) }))] }))) })), jsxRuntime.jsx(Footer, {})] }));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Card, __assign({ className: "p-4 flex flex-col w-screen h-screen" }, { children: purchaseSucceeded ? (jsxRuntime.jsx(PaymentSuccessDisplay, { className: "w-full", amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, returnUrl: returnUrl })) : (jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsxRuntime.jsx("div", __assign({ className: "flex flex-col w-1/2 items-center" }, { children: jsxRuntime.jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsxRuntime.jsx("div", __assign({ className: "my-4" }, { children: jsxRuntime.jsx(antd.Divider, { className: "h-full", type: "vertical" }) })), jsxRuntime.jsx("div", __assign({ className: "flex w-1/2 items-center justify-center my-12" }, { children: jsxRuntime.jsx(PaymentForms, { quote: quote, paying: paying, setIsPaying: setIsPaying, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handlePaymentFail: handlePaymentFail, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId || "" }) }))] }))) })), jsxRuntime.jsx(Footer, {})] }));
     }
 }
 

package/dist/cjs/src/components/Signup/PaymentForms.d.ts

@@ -1,11 +1,12 @@
 import "../../styles/index.less";
 import { Quote } from "@bunnyapp/common";
 import { OnPaymentSuccessType } from "../PaymentForm/PaymentFormTypes";
-export default function PaymentForms({ quote, paying, setIsPaying, handlePaymentSaveSuccess, handleSubmit, proceedingToPayment, accountId, }: {
+export default function PaymentForms({ quote, paying, setIsPaying, handlePaymentSaveSuccess, handlePaymentFail, handleSubmit, proceedingToPayment, accountId, }: {
     quote?: Quote;
     paying: boolean;
     setIsPaying: (paying: boolean) => void;
     handlePaymentSaveSuccess: (paymentSuccess: OnPaymentSuccessType) => void;
+    handlePaymentFail: (error: any) => void;
     handleSubmit: (formData: FormData) => void;
     proceedingToPayment: boolean;
     accountId?: string;

package/dist/cjs/src/components/Signup/PaymentSuccess.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-export default function PaymentSuccessDisplay({ className, amountPaid, style, redirectUrl, }: {
+export default function PaymentSuccessDisplay({ className, amountPaid, style, returnUrl, }: {
     className: string;
     amountPaid: number;
     style?: React.CSSProperties;
-    redirectUrl?: string;
+    returnUrl?: string;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/src/components/Signup/Signup.d.ts

@@ -1,5 +1,5 @@
 import "../../styles/index.less";
-export default function Signup({ priceListCode, redirectUrl, }: {
+export default function Signup({ priceListCode, returnUrl, }: {
     priceListCode: string;
-    redirectUrl?: string;
+    returnUrl?: string;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/esm/index.js

@@ -2243,6 +2243,7 @@ var DemoPayForm = function (_a) {
             switch (_a.label) {
                 case 0:
                     _a.trys.push([0, 6, , 7]);
+                    validateCardDetails();
                     if (!onlySavePaymentMethod) return [3 /*break*/, 2];
                     setIsSaving(true);
                     return [4 /*yield*/, storePayment({
@@ -2270,14 +2271,6 @@ var DemoPayForm = function (_a) {
                 case 2:
                     if (!(amountDue !== undefined && currencyId)) return [3 /*break*/, 4];
                     setIsSaving(true);
-                    if (cardDetails.number !== TEST_CARD)
-                        throw new Error("Only the card number 4242 4242 4242 4242 will be accepted.");
-                    if (!isValidExpiry(cardDetails.expiry))
-                        throw new Error("Invalid expiry date");
-                    if (isCardExpired(cardDetails.expiry))
-                        throw new Error("Card is expired");
-                    if (cardDetails.cvc.length !== 3)
-                        throw new Error("Invalid CVC");
                     return [4 /*yield*/, confirmPayment({
                             amount: amountDue,
                             currency: currencyId,
@@ -2306,6 +2299,16 @@ var DemoPayForm = function (_a) {
             }
         });
     }); };
+    function validateCardDetails() {
+        if (cardDetails.number !== TEST_CARD)
+            throw new Error("Only the card number 4242 4242 4242 4242 will be accepted.");
+        if (!isValidExpiry(cardDetails.expiry))
+            throw new Error("Invalid expiry date");
+        if (isCardExpired(cardDetails.expiry))
+            throw new Error("Card is expired");
+        if (cardDetails.cvc.length !== 3)
+            throw new Error("Invalid CVC");
+    }
     var onCardNumberChange = function (number) {
         setCardDetails(__assign(__assign({}, cardDetails), { number: number }));
     };
@@ -3785,10 +3788,8 @@ var getPriceList = function (_a) {
 };
 
 function PaymentForms(_a) {
-    var quote = _a.quote, paying = _a.paying, setIsPaying = _a.setIsPaying, handlePaymentSaveSuccess = _a.handlePaymentSaveSuccess, handleSubmit = _a.handleSubmit, proceedingToPayment = _a.proceedingToPayment, accountId = _a.accountId;
-    return (jsx(Fragment, { children: quote ? (jsx(Fragment, { children: accountId && (jsx(PaymentContext.Provider, __assign({ value: { accountId: accountId, displayPayButtonNameAnyways: true } }, { children: jsx(PaymentForm, { isSaving: paying, setIsSaving: setIsPaying, onFail: function () {
-                        console.log("payment saving failed darn");
-                    }, onPaymentSuccess: handlePaymentSaveSuccess }) }))) })) : (jsx(InitialSignupForm, { onSubmit: handleSubmit, submitting: proceedingToPayment })) }));
+    var quote = _a.quote, paying = _a.paying, setIsPaying = _a.setIsPaying, handlePaymentSaveSuccess = _a.handlePaymentSaveSuccess, handlePaymentFail = _a.handlePaymentFail, handleSubmit = _a.handleSubmit, proceedingToPayment = _a.proceedingToPayment, accountId = _a.accountId;
+    return (jsx(Fragment, { children: quote ? (jsx(Fragment, { children: accountId && (jsx(PaymentContext.Provider, __assign({ value: { accountId: accountId, displayPayButtonNameAnyways: true } }, { children: jsx(PaymentForm, { isSaving: paying, setIsSaving: setIsPaying, onFail: handlePaymentFail, onPaymentSuccess: handlePaymentSaveSuccess }) }))) })) : (jsx(InitialSignupForm, { onSubmit: handleSubmit, submitting: proceedingToPayment })) }));
 }
 function InitialSignupForm(_a) {
     var onSubmit = _a.onSubmit, submitting = _a.submitting;
@@ -3825,10 +3826,10 @@ function InitialSignupForm(_a) {
 
 var Title = Typography.Title, Text$a = Typography.Text;
 function PaymentSuccessDisplay(_a) {
-    var className = _a.className, amountPaid = _a.amountPaid, style = _a.style, redirectUrl = _a.redirectUrl;
+    var className = _a.className, amountPaid = _a.amountPaid, style = _a.style, returnUrl = _a.returnUrl;
     var window = useContext(BunnyContext).window;
     var companyName = useCurrentUserData().companyName;
-    return (jsxs("div", __assign({ className: "flex flex-col items-center justify-center h-full ".concat(className), style: style }, { children: [jsx(CheckCircleFilled$1, { style: { fontSize: "48px", color: "rgb(52 211 153)" } }), jsxs(Title, __assign({ level: 3, className: "mt-2 m-0" }, { children: ["Payment of ", Misc.formatCurrency(amountPaid, "USD"), " successful"] })), redirectUrl && (jsxs(Text$a, __assign({ className: "text-slate-500 cursor-pointer underline", onClick: function () { return (window.location.href = redirectUrl); } }, { children: ["Back to ", companyName] })))] })));
+    return (jsxs("div", __assign({ className: "flex flex-col items-center justify-center h-full ".concat(className), style: style }, { children: [jsx(CheckCircleFilled$1, { style: { fontSize: "48px", color: "rgb(52 211 153)" } }), jsxs(Title, __assign({ level: 3, className: "mt-2 m-0" }, { children: ["Payment of ", Misc.formatCurrency(amountPaid, "USD"), " successful"] })), returnUrl && (jsxs(Text$a, __assign({ className: "text-slate-500 cursor-pointer underline", onClick: function () { return (window.location.href = returnUrl); } }, { children: ["Back to ", companyName] })))] })));
 }
 
 var Text$9 = Typography.Text;
@@ -3865,8 +3866,9 @@ var StyedLink = styled.a(templateObject_1$4 || (templateObject_1$4 = __makeTempl
 var StyledBunnyLink = styled(StyedLink)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  &:hover {\n    color: ", " !important;\n  }\n"], ["\n  &:hover {\n    color: ", " !important;\n  }\n"])), PRIMARY_COLOR);
 var templateObject_1$4, templateObject_2;
 
+var showErrorNotification = NotificationUtils.useErrorNotification();
 function Signup(_a) {
-    var priceListCode = _a.priceListCode, redirectUrl = _a.redirectUrl;
+    var priceListCode = _a.priceListCode, returnUrl = _a.returnUrl;
     // Hooks
     var _b = useContext(BunnyContext), subdomain = _b.subdomain, token = _b.token, window = _b.window;
     useQuery({
@@ -3959,11 +3961,15 @@ function Signup(_a) {
             });
         });
     }
+    function handlePaymentFail(error) {
+        showErrorNotification(error.message);
+        setIsPaying(false);
+    }
     if (isMobile) {
-        return (jsx(Card, __assign({ className: "p-4 flex flex-col" }, { children: purchaseSucceeded ? (jsx(PaymentSuccessDisplay, { className: "w-full", amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, redirectUrl: redirectUrl })) : (jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsx("div", __assign({ className: "flex flex-col items-center" }, { children: jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsx("div", __assign({ className: "mx-8" }, { children: jsx(Divider, { className: "h-full" }) })), jsx("div", __assign({ className: "flex items-center justify-center my-12" }, { children: jsx(PaymentForms, { quote: quote, paying: paying, setIsPaying: setIsPaying, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId || "" }) }))] }))) })));
+        return (jsx(Card, __assign({ className: "p-4 flex flex-col" }, { children: purchaseSucceeded ? (jsx(PaymentSuccessDisplay, { className: "w-full", amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, returnUrl: returnUrl })) : (jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsx("div", __assign({ className: "flex flex-col items-center" }, { children: jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsx("div", __assign({ className: "mx-8" }, { children: jsx(Divider, { className: "h-full" }) })), jsx("div", __assign({ className: "flex items-center justify-center my-12" }, { children: jsx(PaymentForms, { quote: quote, paying: paying, setIsPaying: setIsPaying, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handlePaymentFail: handlePaymentFail, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId || "" }) }))] }))) })));
     }
     else {
-        return (jsxs(Fragment, { children: [jsx(Card, __assign({ className: "p-4 flex flex-col w-screen h-screen" }, { children: purchaseSucceeded ? (jsx(PaymentSuccessDisplay, { className: "w-full", amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, redirectUrl: redirectUrl })) : (jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsx("div", __assign({ className: "flex flex-col w-1/2 items-center" }, { children: jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsx("div", __assign({ className: "my-4" }, { children: jsx(Divider, { className: "h-full", type: "vertical" }) })), jsx("div", __assign({ className: "flex w-1/2 items-center justify-center my-12" }, { children: jsx(PaymentForms, { quote: quote, paying: paying, setIsPaying: setIsPaying, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId || "" }) }))] }))) })), jsx(Footer, {})] }));
+        return (jsxs(Fragment, { children: [jsx(Card, __assign({ className: "p-4 flex flex-col w-screen h-screen" }, { children: purchaseSucceeded ? (jsx(PaymentSuccessDisplay, { className: "w-full", amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, returnUrl: returnUrl })) : (jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsx("div", __assign({ className: "flex flex-col w-1/2 items-center" }, { children: jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsx("div", __assign({ className: "my-4" }, { children: jsx(Divider, { className: "h-full", type: "vertical" }) })), jsx("div", __assign({ className: "flex w-1/2 items-center justify-center my-12" }, { children: jsx(PaymentForms, { quote: quote, paying: paying, setIsPaying: setIsPaying, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handlePaymentFail: handlePaymentFail, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId || "" }) }))] }))) })), jsx(Footer, {})] }));
     }
 }
 

package/dist/esm/src/components/Signup/PaymentForms.d.ts

@@ -1,11 +1,12 @@
 import "../../styles/index.less";
 import { Quote } from "@bunnyapp/common";
 import { OnPaymentSuccessType } from "../PaymentForm/PaymentFormTypes";
-export default function PaymentForms({ quote, paying, setIsPaying, handlePaymentSaveSuccess, handleSubmit, proceedingToPayment, accountId, }: {
+export default function PaymentForms({ quote, paying, setIsPaying, handlePaymentSaveSuccess, handlePaymentFail, handleSubmit, proceedingToPayment, accountId, }: {
     quote?: Quote;
     paying: boolean;
     setIsPaying: (paying: boolean) => void;
     handlePaymentSaveSuccess: (paymentSuccess: OnPaymentSuccessType) => void;
+    handlePaymentFail: (error: any) => void;
     handleSubmit: (formData: FormData) => void;
     proceedingToPayment: boolean;
     accountId?: string;

package/dist/esm/src/components/Signup/PaymentSuccess.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-export default function PaymentSuccessDisplay({ className, amountPaid, style, redirectUrl, }: {
+export default function PaymentSuccessDisplay({ className, amountPaid, style, returnUrl, }: {
     className: string;
     amountPaid: number;
     style?: React.CSSProperties;
-    redirectUrl?: string;
+    returnUrl?: string;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/esm/src/components/Signup/Signup.d.ts

@@ -1,5 +1,5 @@
 import "../../styles/index.less";
-export default function Signup({ priceListCode, redirectUrl, }: {
+export default function Signup({ priceListCode, returnUrl, }: {
     priceListCode: string;
-    redirectUrl?: string;
+    returnUrl?: string;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/index.d.ts

@@ -53,9 +53,9 @@ declare const Checkout: ({ onCancel, onSuccess, onFail, invoice, open, quote, se
 
 declare const getQuoteAmountDue: (quote: Quote$1) => number;
 
-declare function Signup({ priceListCode, redirectUrl, }: {
+declare function Signup({ priceListCode, returnUrl, }: {
     priceListCode: string;
-    redirectUrl?: string;
+    returnUrl?: string;
 }): react_jsx_runtime.JSX.Element;
 
 declare function BunnyProvider({ children, token, subdomain, window, accountId, darkMode, }: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bunnyapp/components",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Components from the Bunny portal to embed Bunny UI functionality into your application.",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",