@clickaroo/checkout-ui 0.1.3-beta → 0.1.5-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1 -1
- package/dist/index.mjs +1 -1
- package/dist/storybook/storybook-static/assets/APIs.en-BZfNNuoc.js +372 -0
- package/dist/storybook/storybook-static/assets/APIs.en-BZzPbEJW.js +372 -0
- package/dist/storybook/storybook-static/assets/APIs.en-Bf5J1Ifk.js +372 -0
- package/dist/storybook/storybook-static/assets/APIs.en-DSVQkUt3.js +372 -0
- package/dist/storybook/storybook-static/assets/APIs.en-DcEWunRx.js +372 -0
- package/dist/storybook/storybook-static/assets/APIs.en-DfWH0fys.js +372 -0
- package/dist/storybook/storybook-static/assets/APIs.en-TWb_-3VC.js +372 -0
- package/dist/storybook/storybook-static/assets/APIs.en-m6cq4XTv.js +372 -0
- package/dist/storybook/storybook-static/assets/APIs.en-nicPQ5AW.js +372 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage-BsnzMxJk.js +3 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage-CDW7SRyI.js +3 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage-CrHN6Fcv.js +3 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage-DFb28rrp.js +3 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage-DSLcTghb.js +3 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage-DYMMhAMX.js +3 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage-DgZ1RopD.js +3 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage-DvHYA1Jd.js +3 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage-d8MZfjpI.js +3 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.en-BeknEgWZ.js +147 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.en-Bsh4jm31.js +147 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.en-Byu6MnFF.js +147 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.en-C5I1UUQc.js +147 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.en-CNVaEQvK.js +147 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.en-D87qzfwm.js +147 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.en-DLb_7NPf.js +147 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.en-DQ0u0fHa.js +147 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.en-DiHMI_iH.js +147 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.stories-B5y94bOo.js +44 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.stories-B8Vyz9GJ.js +44 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.stories-BRP4VrvR.js +44 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.stories-BahbUp4O.js +44 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.stories-DAo0u2QI.js +44 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.stories-DFK1bMdr.js +44 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.stories-DLD3oWo_.js +44 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.stories-DeC6lyzr.js +44 -0
- package/dist/storybook/storybook-static/assets/CheckoutPage.stories-DvaZetee.js +44 -0
- package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-B0J9WR4k.js +1 -0
- package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-BE_XGTCZ.js +1 -0
- package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-B_hoSOu5.js +1 -0
- package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-Bly_OAJP.js +1 -0
- package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-BorkAxO4.js +1 -0
- package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-C2GhQi7e.js +1 -0
- package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-D3zu28Rn.js +1 -0
- package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-DI94E3AI.js +1 -0
- package/dist/storybook/storybook-static/assets/Color-YHDXOIA2-DVI1_7_g.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.en-8VNcggT9.js +211 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.en-BMJEFVTk.js +211 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.en-Bg4oz9hS.js +211 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.en-Bq25x8qa.js +211 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.en-BvF7SmOy.js +211 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.en-CckpRGsp.js +211 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.en-D80ZpldF.js +211 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.en-uXQeih6h.js +211 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.en-wshSoFMr.js +211 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.stories-B8CnjGCn.js +6 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.stories-BQkpNbox.js +6 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.stories-BrF5j7zs.js +6 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.stories-CKQKzMq0.js +6 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.stories-DhCrUQc1.js +6 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.stories-F2GZKkIG.js +6 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.stories-V2NHLbZo.js +6 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.stories-ZCeqtMGJ.js +6 -0
- package/dist/storybook/storybook-static/assets/CustomCheckout.stories-rMIVoUs4.js +6 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo-BMTfZ9z3.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo-BqCSWi4I.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo-BwyY9803.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo-CPNuEjrH.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo-CTx1dFS3.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo-Cp0u57C5.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo-D3WHpN32.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo-DShSrjMR.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo-mKAI6gWW.js +1 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo.stories-BAbhNSal.js +9 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo.stories-BeF8Yh1A.js +9 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo.stories-BwCrEBgN.js +9 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo.stories-CYx1hKNg.js +9 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo.stories-D1l3Glaq.js +9 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo.stories-DB2C3zqQ.js +9 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo.stories-Dv6cHWui.js +9 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo.stories-jpdDC3ta.js +9 -0
- package/dist/storybook/storybook-static/assets/CustomerInfo.stories-tyhy9PWf.js +9 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress-CD42v0od.js +2 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress-CeuByf4d.js +2 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress-DOxyPw17.js +2 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress-DY5lFnTv.js +2 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress-DaRy4l-D.js +2 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress-Lfanl1PO.js +2 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress-QAGxLlLf.js +2 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress-TRtlNz2v.js +2 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress-X81XGbKD.js +2 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-BvAXTiNm.js +9 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-C1JtetLS.js +9 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-C8sE6JJZ.js +9 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-CBScReyV.js +9 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-CTyS3zFt.js +9 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-CqmJ_Wn7.js +9 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-DHyw5QNl.js +9 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-FMwTSh9f.js +9 -0
- package/dist/storybook/storybook-static/assets/DeliveryAddress.stories-vQ0cdVl6.js +9 -0
- package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-4VFo0TRH.js +2 -0
- package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-BKek9MhZ.js +2 -0
- package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-C4t3f4os.js +2 -0
- package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-CtrnOF1G.js +2 -0
- package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-DU1kBIGp.js +2 -0
- package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-DzgR8M-W.js +2 -0
- package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-OiuU2wez.js +2 -0
- package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-Q5WDl3Gp.js +2 -0
- package/dist/storybook/storybook-static/assets/DocsRenderer-CFRXHY34-sE6BxCwu.js +2 -0
- package/dist/storybook/storybook-static/assets/Guide.en-BJ4qiYIc.js +107 -0
- package/dist/storybook/storybook-static/assets/Guide.en-BRVwtDXj.js +107 -0
- package/dist/storybook/storybook-static/assets/Guide.en-Boc44Lax.js +107 -0
- package/dist/storybook/storybook-static/assets/Guide.en-CKA244dX.js +107 -0
- package/dist/storybook/storybook-static/assets/Guide.en-CiR7CrYZ.js +107 -0
- package/dist/storybook/storybook-static/assets/Guide.en-Citkzdg9.js +107 -0
- package/dist/storybook/storybook-static/assets/Guide.en-DPJzC5RR.js +107 -0
- package/dist/storybook/storybook-static/assets/Guide.en-Dn9xb9YI.js +107 -0
- package/dist/storybook/storybook-static/assets/Guide.en-XzxJQK_F.js +107 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods-BFtlMopq.js +2 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods-BNEEARzu.js +2 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods-BnPZRrAs.js +2 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods-Buladk2O.js +2 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods-CBXk2f9N.js +2 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods-DmV3o0ow.js +2 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods-DxorWSOl.js +2 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods-afz1CTO5.js +2 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods-e9HqQtxN.js +2 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods.stories-6fZvfvMO.js +9 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods.stories-Bc4jYrum.js +9 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods.stories-CcjSRFbb.js +9 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods.stories-ChiL9TJn.js +9 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods.stories-D1SSfWqv.js +9 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods.stories-DJpOtGJg.js +9 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods.stories-Dyg3R8Cs.js +9 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods.stories-U-xbCFtF.js +9 -0
- package/dist/storybook/storybook-static/assets/PaymentMethods.stories-pOuLDPwE.js +9 -0
- package/dist/storybook/storybook-static/assets/QuickStart.en-8otT6VDx.js +136 -0
- package/dist/storybook/storybook-static/assets/QuickStart.en-B2goyY4Q.js +136 -0
- package/dist/storybook/storybook-static/assets/QuickStart.en-Bz56Z2wW.js +136 -0
- package/dist/storybook/storybook-static/assets/QuickStart.en-C1fKNHfm.js +136 -0
- package/dist/storybook/storybook-static/assets/QuickStart.en-CEFLfOWt.js +136 -0
- package/dist/storybook/storybook-static/assets/QuickStart.en-Ct2dMZNT.js +136 -0
- package/dist/storybook/storybook-static/assets/QuickStart.en-D5OiYfrB.js +136 -0
- package/dist/storybook/storybook-static/assets/QuickStart.en-D6K1vnx2.js +136 -0
- package/dist/storybook/storybook-static/assets/QuickStart.en-wgtxGAFt.js +136 -0
- package/dist/storybook/storybook-static/assets/ValidateInput-BKNagaQv.js +2 -0
- package/dist/storybook/storybook-static/assets/ValidateInput-BMZhq5zE.js +2 -0
- package/dist/storybook/storybook-static/assets/ValidateInput-CECRKp4c.js +2 -0
- package/dist/storybook/storybook-static/assets/ValidateInput-CXYuXafK.js +2 -0
- package/dist/storybook/storybook-static/assets/ValidateInput-Cl2O4HCX.js +2 -0
- package/dist/storybook/storybook-static/assets/ValidateInput-DcnOO9py.js +2 -0
- package/dist/storybook/storybook-static/assets/ValidateInput-LNzX4jJP.js +2 -0
- package/dist/storybook/storybook-static/assets/ValidateInput-np1-zwvJ.js +2 -0
- package/dist/storybook/storybook-static/assets/ValidateInput-sZgX3GCF.js +2 -0
- package/dist/storybook/storybook-static/assets/entry-preview-BAF1DioI.js +2 -0
- package/dist/storybook/storybook-static/assets/entry-preview-BAb-nh3P.js +2 -0
- package/dist/storybook/storybook-static/assets/entry-preview-BQMc41xo.js +2 -0
- package/dist/storybook/storybook-static/assets/entry-preview-Bnn64O7J.js +2 -0
- package/dist/storybook/storybook-static/assets/entry-preview-C4SPQchM.js +2 -0
- package/dist/storybook/storybook-static/assets/entry-preview-CAnH1TUA.js +2 -0
- package/dist/storybook/storybook-static/assets/entry-preview-Dbi49YCK.js +2 -0
- package/dist/storybook/storybook-static/assets/entry-preview-GhM6ttN0.js +2 -0
- package/dist/storybook/storybook-static/assets/entry-preview-hHv11-z5.js +2 -0
- package/dist/storybook/storybook-static/assets/iframe-CakT_Hx-.js +211 -0
- package/dist/storybook/storybook-static/assets/iframe-Ce3kgeV4.js +211 -0
- package/dist/storybook/storybook-static/assets/iframe-Crv4raYy.js +211 -0
- package/dist/storybook/storybook-static/assets/iframe-CueR_wS4.js +211 -0
- package/dist/storybook/storybook-static/assets/iframe-DWFwLXCc.js +211 -0
- package/dist/storybook/storybook-static/assets/iframe-DsSsblW_.js +211 -0
- package/dist/storybook/storybook-static/assets/iframe-PThBYPHV.js +211 -0
- package/dist/storybook/storybook-static/assets/iframe-SJLFWhX6.js +211 -0
- package/dist/storybook/storybook-static/assets/iframe-eGyOKkka.js +211 -0
- package/dist/storybook/storybook-static/assets/index-3vMs57rT.js +575 -0
- package/dist/storybook/storybook-static/assets/index-BlPVJQpb.js +575 -0
- package/dist/storybook/storybook-static/assets/index-Bz3Q1Yw_.js +575 -0
- package/dist/storybook/storybook-static/assets/index-CZFGp9Su.js +575 -0
- package/dist/storybook/storybook-static/assets/index-CkNSuRJg.js +575 -0
- package/dist/storybook/storybook-static/assets/index-D66ljFJA.js +575 -0
- package/dist/storybook/storybook-static/assets/index-DnrKlQ76.js +575 -0
- package/dist/storybook/storybook-static/assets/index-DoDFfets.js +575 -0
- package/dist/storybook/storybook-static/assets/index-LRKEu_dQ.js +575 -0
- package/dist/storybook/storybook-static/assets/preview-884UjfA3.js +2 -0
- package/dist/storybook/storybook-static/assets/preview-C1X5Ys-q.js +2 -0
- package/dist/storybook/storybook-static/assets/preview-CbAwkmzD.js +2 -0
- package/dist/storybook/storybook-static/assets/preview-DGJdQn9n.js +2 -0
- package/dist/storybook/storybook-static/assets/preview-DJkpO_nB.js +2 -0
- package/dist/storybook/storybook-static/assets/preview-DNROAajq.js +2 -0
- package/dist/storybook/storybook-static/assets/preview-De1PUXkc.js +2 -0
- package/dist/storybook/storybook-static/assets/preview-DyVoah3G.js +2 -0
- package/dist/storybook/storybook-static/assets/preview-EmPtksy2.js +2 -0
- package/dist/storybook/storybook-static/assets/useCheckoutContext-3YTrU8Qh.js +27 -0
- package/dist/storybook/storybook-static/assets/useCheckoutContext-B8tsk5b5.js +27 -0
- package/dist/storybook/storybook-static/assets/useCheckoutContext-BW2h13W8.js +27 -0
- package/dist/storybook/storybook-static/assets/useCheckoutContext-BXtGY5u3.js +27 -0
- package/dist/storybook/storybook-static/assets/useCheckoutContext-C6u4Rp5U.js +27 -0
- package/dist/storybook/storybook-static/assets/useCheckoutContext-C7KjDyWW.js +27 -0
- package/dist/storybook/storybook-static/assets/useCheckoutContext-CroxIBFh.js +27 -0
- package/dist/storybook/storybook-static/assets/useCheckoutContext-DuJ1Ep0-.js +27 -0
- package/dist/storybook/storybook-static/assets/useCheckoutContext-L3zhltsm.js +27 -0
- package/dist/storybook/storybook-static/iframe.html +1 -1
- package/dist/storybook/storybook-static/project.json +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{j as f}from"./jsx-runtime-DiklIkkE.js";import{b as q,t as _}from"./useCheckoutContext-BW2h13W8.js";import{r as k,g as Re,R as u}from"./index-DRjF_FHU.js";const W=()=>f.jsx("div",{className:"absolute inset-0 flex items-center justify-center z-10",children:f.jsxs("svg",{className:"animate-spin h-6 w-6 text-black",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",fill:"none",children:[f.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),f.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]})});W.__docgenInfo={description:"",methods:[],displayName:"Loading"};var V=(r=>(r.OneTime="one-time",r.Subscription="subscription",r))(V||{});const Ie=()=>{const{cart:r,clickarooInfoMap:e,offerPricePoints:t}=q(),n=k.useMemo(()=>r.reduce((o,i)=>{const c=e[i.offerPricePoint];if(!c)return o;const s=H(c);return s&&s.priceInCents>0&&o.push({...i,priceInCents:s.priceInCents,currency:s.currency,quantity:s.quantity,paymentType:c.type==="one_off"?V.OneTime:V.Subscription}),o},[]),[r,e]),a=k.useMemo(()=>{let o=0;return t.forEach(i=>{const c=e[i];if(!c)return;const s=H(c);s&&(o+=s.priceInCents*s.quantity)}),o},[t,e]);return{checkoutProducts:n,totalAmount:a}},H=r=>{if(console.log(r),r.type==="one_off"&&r.one_off)return{priceInCents:r.one_off.price_in_cents||0,currency:r.one_off.currency||"usd",quantity:r.one_off.quantity||1};if(r.type==="subscription_schedules"&&r.subscription_schedules){const e=r.subscription_schedules.find(t=>t.phase===1);if(e)return{priceInCents:e.price_in_cents||0,currency:e.currency||"usd",quantity:e.quantity||1}}return null};var ne={exports:{}},Ae="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",Te=Ae,Ne=Te;function oe(){}function ae(){}ae.resetWarningCache=oe;var Le=function(){function r(n,a,o,i,c,s){if(s!==Ne){var h=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw h.name="Invariant Violation",h}}r.isRequired=r;function e(){return r}var t={array:r,bigint:r,bool:r,func:r,number:r,object:r,string:r,symbol:r,any:r,arrayOf:e,element:r,elementType:r,instanceOf:e,node:r,objectOf:e,oneOf:e,oneOfType:e,shape:e,exact:e,checkPropTypes:ae,resetWarningCache:oe};return t.PropTypes=t,t};ne.exports=Le();var Me=ne.exports;const l=Re(Me);function X(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);e&&(n=n.filter(function(a){return Object.getOwnPropertyDescriptor(r,a).enumerable})),t.push.apply(t,n)}return t}function Q(r){for(var e=1;e<arguments.length;e++){var t=arguments[e]!=null?arguments[e]:{};e%2?X(Object(t),!0).forEach(function(n){se(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):X(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}function U(r){"@babel/helpers - typeof";return typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?U=function(e){return typeof e}:U=function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},U(r)}function se(r,e,t){return e in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function Ue(r,e){if(r==null)return{};var t={},n=Object.keys(r),a,o;for(o=0;o<n.length;o++)a=n[o],!(e.indexOf(a)>=0)&&(t[a]=r[a]);return t}function We(r,e){if(r==null)return{};var t=Ue(r,e),n,a;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(r);for(a=0;a<o.length;a++)n=o[a],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}function ie(r,e){return qe(r)||Be(r,e)||Fe(r,e)||De()}function qe(r){if(Array.isArray(r))return r}function Be(r,e){var t=r&&(typeof Symbol<"u"&&r[Symbol.iterator]||r["@@iterator"]);if(t!=null){var n=[],a=!0,o=!1,i,c;try{for(t=t.call(r);!(a=(i=t.next()).done)&&(n.push(i.value),!(e&&n.length===e));a=!0);}catch(s){o=!0,c=s}finally{try{!a&&t.return!=null&&t.return()}finally{if(o)throw c}}return n}}function Fe(r,e){if(r){if(typeof r=="string")return Z(r,e);var t=Object.prototype.toString.call(r).slice(8,-1);if(t==="Object"&&r.constructor&&(t=r.constructor.name),t==="Map"||t==="Set")return Array.from(r);if(t==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return Z(r,e)}}function Z(r,e){(e==null||e>r.length)&&(e=r.length);for(var t=0,n=new Array(e);t<e;t++)n[t]=r[t];return n}function De(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
|
|
2
|
+
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}var C=function(e,t,n){var a=!!n,o=u.useRef(n);u.useEffect(function(){o.current=n},[n]),u.useEffect(function(){if(!a||!e)return function(){};var i=function(){o.current&&o.current.apply(o,arguments)};return e.on(t,i),function(){e.off(t,i)}},[a,t,e,o])},$=function(e){var t=u.useRef(e);return u.useEffect(function(){t.current=e},[e]),t.current},w=function(e){return e!==null&&U(e)==="object"},Ve=function(e){return w(e)&&typeof e.then=="function"},$e=function(e){return w(e)&&typeof e.elements=="function"&&typeof e.createToken=="function"&&typeof e.createPaymentMethod=="function"&&typeof e.confirmCardPayment=="function"},ee="[object Object]",ze=function r(e,t){if(!w(e)||!w(t))return e===t;var n=Array.isArray(e),a=Array.isArray(t);if(n!==a)return!1;var o=Object.prototype.toString.call(e)===ee,i=Object.prototype.toString.call(t)===ee;if(o!==i)return!1;if(!o&&!n)return e===t;var c=Object.keys(e),s=Object.keys(t);if(c.length!==s.length)return!1;for(var h={},v=0;v<c.length;v+=1)h[c[v]]=!0;for(var E=0;E<s.length;E+=1)h[s[E]]=!0;var p=Object.keys(h);if(p.length!==c.length)return!1;var x=e,b=t,y=function(A){return r(x[A],b[A])};return p.every(y)},ce=function(e,t,n){return w(e)?Object.keys(e).reduce(function(a,o){var i=!w(t)||!ze(e[o],t[o]);return n.includes(o)?(i&&console.warn("Unsupported prop change: options.".concat(o," is not a mutable property.")),a):i?Q(Q({},a||{}),{},se({},o,e[o])):a},null):null},ue="Invalid prop `stripe` supplied to `Elements`. We recommend using the `loadStripe` utility from `@stripe/stripe-js`. See https://stripe.com/docs/stripe-js/react#elements-props-stripe for details.",te=function(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:ue;if(e===null||$e(e))return e;throw new Error(t)},Je=function(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:ue;if(Ve(e))return{tag:"async",stripePromise:Promise.resolve(e).then(function(a){return te(a,t)})};var n=te(e,t);return n===null?{tag:"empty"}:{tag:"sync",stripe:n}},Ye=function(e){!e||!e._registerWrapper||!e.registerAppInfo||(e._registerWrapper({name:"react-stripe-js",version:"3.10.0"}),e.registerAppInfo({name:"react-stripe-js",version:"3.10.0",url:"https://stripe.com/docs/stripe-js/react"}))},B=u.createContext(null);B.displayName="ElementsContext";var le=function(e,t){if(!e)throw new Error("Could not find Elements context; You need to wrap the part of your app that ".concat(t," in an <Elements> provider."));return e},pe=function(e){var t=e.stripe,n=e.options,a=e.children,o=u.useMemo(function(){return Je(t)},[t]),i=u.useState(function(){return{stripe:o.tag==="sync"?o.stripe:null,elements:o.tag==="sync"?o.stripe.elements(n):null}}),c=ie(i,2),s=c[0],h=c[1];u.useEffect(function(){var p=!0,x=function(y){h(function(O){return O.stripe?O:{stripe:y,elements:y.elements(n)}})};return o.tag==="async"&&!s.stripe?o.stripePromise.then(function(b){b&&p&&x(b)}):o.tag==="sync"&&!s.stripe&&x(o.stripe),function(){p=!1}},[o,s,n]);var v=$(t);u.useEffect(function(){v!==null&&v!==t&&console.warn("Unsupported prop change on Elements: You cannot change the `stripe` prop after setting it.")},[v,t]);var E=$(n);return u.useEffect(function(){if(s.elements){var p=ce(n,E,["clientSecret","fonts"]);p&&s.elements.update(p)}},[n,E,s.elements]),u.useEffect(function(){Ye(s.stripe)},[s.stripe]),u.createElement(B.Provider,{value:s},a)};pe.propTypes={stripe:l.any,options:l.object};var Ke=function(e){var t=u.useContext(B);return le(t,e)},Ge=function(){var e=Ke("calls useElements()"),t=e.elements;return t};l.func.isRequired;var fe=u.createContext(null);fe.displayName="CheckoutSdkContext";var He=function(e,t){if(!e)throw new Error("Could not find CheckoutProvider context; You need to wrap the part of your app that ".concat(t," in an <CheckoutProvider> provider."));return e},Xe=u.createContext(null);Xe.displayName="CheckoutContext";l.any,l.shape({fetchClientSecret:l.func.isRequired,elementsOptions:l.object}).isRequired;var z=function(e){var t=u.useContext(fe),n=u.useContext(B);if(t&&n)throw new Error("You cannot wrap the part of your app that ".concat(e," in both <CheckoutProvider> and <Elements> providers."));return t?He(t,e):le(n,e)},Qe=["mode"],Ze=function(e){return e.charAt(0).toUpperCase()+e.slice(1)},d=function(e,t){var n="".concat(Ze(e),"Element"),a=function(s){var h=s.id,v=s.className,E=s.options,p=E===void 0?{}:E,x=s.onBlur,b=s.onFocus,y=s.onReady,O=s.onChange,A=s.onEscape,ge=s.onClick,Se=s.onLoadError,Ce=s.onLoaderStart,Ee=s.onNetworksChange,be=s.onConfirm,xe=s.onCancel,Pe=s.onShippingAddressChange,je=s.onShippingRateChange,ke=s.onSavedPaymentMethodRemove,_e=s.onSavedPaymentMethodUpdate,T=z("mounts <".concat(n,">")),N="elements"in T?T.elements:null,P="checkoutSdk"in T?T.checkoutSdk:null,we=u.useState(null),J=ie(we,2),g=J[0],Oe=J[1],j=u.useRef(null),F=u.useRef(null);C(g,"blur",x),C(g,"focus",b),C(g,"escape",A),C(g,"click",ge),C(g,"loaderror",Se),C(g,"loaderstart",Ce),C(g,"networkschange",Ee),C(g,"confirm",be),C(g,"cancel",xe),C(g,"shippingaddresschange",Pe),C(g,"shippingratechange",je),C(g,"savedpaymentmethodremove",ke),C(g,"savedpaymentmethodupdate",_e),C(g,"change",O);var D;y&&(e==="expressCheckout"?D=y:D=function(){y(g)}),C(g,"ready",D),u.useLayoutEffect(function(){if(j.current===null&&F.current!==null&&(N||P)){var S=null;if(P)switch(e){case"payment":S=P.createPaymentElement(p);break;case"address":if("mode"in p){var K=p.mode,G=We(p,Qe);if(K==="shipping")S=P.createShippingAddressElement(G);else if(K==="billing")S=P.createBillingAddressElement(G);else throw new Error("Invalid options.mode. mode must be 'billing' or 'shipping'.")}else throw new Error("You must supply options.mode. mode must be 'billing' or 'shipping'.");break;case"expressCheckout":S=P.createExpressCheckoutElement(p);break;case"currencySelector":S=P.createCurrencySelectorElement();break;case"taxId":S=P.createTaxIdElement(p);break;default:throw new Error("Invalid Element type ".concat(n,". You must use either the <PaymentElement />, <AddressElement options={{mode: 'shipping'}} />, <AddressElement options={{mode: 'billing'}} />, or <ExpressCheckoutElement />."))}else N&&(S=N.create(e,p));j.current=S,Oe(S),S&&S.mount(F.current)}},[N,P,p]);var Y=$(p);return u.useEffect(function(){if(j.current){var S=ce(p,Y,["paymentRequest"]);S&&"update"in j.current&&j.current.update(S)}},[p,Y]),u.useLayoutEffect(function(){return function(){if(j.current&&typeof j.current.destroy=="function")try{j.current.destroy(),j.current=null}catch{}}},[]),u.createElement("div",{id:h,className:v,ref:F})},o=function(s){z("mounts <".concat(n,">"));var h=s.id,v=s.className;return u.createElement("div",{id:h,className:v})},i=t?o:a;return i.propTypes={id:l.string,className:l.string,onChange:l.func,onBlur:l.func,onFocus:l.func,onReady:l.func,onEscape:l.func,onClick:l.func,onLoadError:l.func,onLoaderStart:l.func,onNetworksChange:l.func,onConfirm:l.func,onCancel:l.func,onShippingAddressChange:l.func,onShippingRateChange:l.func,onSavedPaymentMethodRemove:l.func,onSavedPaymentMethodUpdate:l.func,options:l.object},i.displayName=n,i.__elementType=e,i},m=typeof window>"u",et=u.createContext(null);et.displayName="EmbeddedCheckoutProviderContext";var tt=function(){var e=z("calls useStripe()"),t=e.stripe;return t};d("auBankAccount",m);d("card",m);d("cardNumber",m);d("cardExpiry",m);d("cardCvc",m);d("fpxBank",m);d("iban",m);d("idealBank",m);d("p24Bank",m);d("epsBank",m);var rt=d("payment",m);d("expressCheckout",m);d("currencySelector",m);d("paymentRequestButton",m);d("linkAuthentication",m);d("address",m);d("shippingAddress",m);d("paymentMethodMessaging",m);d("affirmMessage",m);d("afterpayClearpayMessage",m);d("taxId",m);var de="basil",nt=function(e){return e===3?"v3":e},me="https://js.stripe.com",ot="".concat(me,"/").concat(de,"/stripe.js"),at=/^https:\/\/js\.stripe\.com\/v3\/?(\?.*)?$/,st=/^https:\/\/js\.stripe\.com\/(v3|[a-z]+)\/stripe\.js(\?.*)?$/;var it=function(e){return at.test(e)||st.test(e)},ct=function(){for(var e=document.querySelectorAll('script[src^="'.concat(me,'"]')),t=0;t<e.length;t++){var n=e[t];if(it(n.src))return n}return null},re=function(e){var t="",n=document.createElement("script");n.src="".concat(ot).concat(t);var a=document.head||document.body;if(!a)throw new Error("Expected document.body not to be null. Stripe.js requires a <body> element.");return a.appendChild(n),n},ut=function(e,t){!e||!e._registerWrapper||e._registerWrapper({name:"stripe-js",version:"7.9.0",startTime:t})},R=null,L=null,M=null,lt=function(e){return function(t){e(new Error("Failed to load Stripe.js",{cause:t}))}},pt=function(e,t){return function(){window.Stripe?e(window.Stripe):t(new Error("Stripe.js not available"))}},ft=function(e){return R!==null?R:(R=new Promise(function(t,n){if(typeof window>"u"||typeof document>"u"){t(null);return}if(window.Stripe){t(window.Stripe);return}try{var a=ct();if(!(a&&e)){if(!a)a=re(e);else if(a&&M!==null&&L!==null){var o;a.removeEventListener("load",M),a.removeEventListener("error",L),(o=a.parentNode)===null||o===void 0||o.removeChild(a),a=re(e)}}M=pt(t,n),L=lt(n),a.addEventListener("load",M),a.addEventListener("error",L)}catch(i){n(i);return}}),R.catch(function(t){return R=null,Promise.reject(t)}))},dt=function(e,t,n){if(e===null)return null;var a=t[0],o=a.match(/^pk_test/),i=nt(e.version),c=de;o&&i!==c&&console.warn("Stripe.js@".concat(i," was loaded on the page, but @stripe/stripe-js@").concat("7.9.0"," expected Stripe.js@").concat(c,". This may result in unexpected behavior. For more information, see https://docs.stripe.com/sdks/stripejs-versioning"));var s=e.apply(void 0,t);return ut(s,n),s},I,ve=!1,he=function(){return I||(I=ft(null).catch(function(e){return I=null,Promise.reject(e)}),I)};Promise.resolve().then(function(){return he()}).catch(function(r){ve||console.warn(r)});var mt=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];ve=!0;var a=Date.now();return he().then(function(o){return dt(o,t,a)})};const vt=({onStripeReady:r,checkoutProducts:e,totalAmount:t})=>{const n=tt(),a=Ge(),{setStripeComplete:o,setStripeLoading:i,onPaymentInfoComplete:c}=q(),[s,h]=k.useState(!1);return k.useEffect(()=>{n&&a&&r(n,a)},[n,a,r]),f.jsx(rt,{onLoaderStart:()=>{_("before_stripe_form_success")},onReady:()=>{i(!1),_("after_stripe_form_success")},onLoadError:v=>{var E;console.error("Payment element load error:",v),i(!1),_("after_stripe_form_failure",{error:((E=v.error)==null?void 0:E.message)||"Unknown error"})},onChange:({complete:v})=>{o(v),v&&!s&&c&&(h(!0),c(e,t))}})},ye=()=>{var x;const{stripeState:r,clickarooInfoMap:e,offerPricePoints:t,setStripe:n,setStripeElements:a}=q(),o=t[0]?e[t[0]]:null,{checkoutProducts:i,totalAmount:c}=Ie(),s=k.useCallback((b,y)=>{b&&n(b),y&&a(y)},[n,a]),[h]=k.useState(()=>{if(!o)return null;const b=mt(o.payment.data.publishable_key,{stripeAccount:o.payment.data.account_id});return b.then(y=>{y&&_("after_stripe_sdk_success")}).catch(y=>{_("after_stripe_sdk_failure",{error:(y==null?void 0:y.message)||"Failed to load Stripe SDK"})}),b});if(!o||t.length===0||!h)return f.jsx("div",{className:"flex items-center justify-center h-20",children:f.jsx(W,{})});const v=o.type==="one_off"?"payment":"subscription",E=(x=i[0])==null?void 0:x.currency.toLowerCase(),p=c<=0;return k.useEffect(()=>{p&&_("after_stripe_form_failure",{error:"Invalid payment amount",totalAmount:c})},[p,c]),p?f.jsx("div",{className:"flex items-center justify-center h-20",children:f.jsx("div",{className:"text-[#df1b41]",children:"Invalid payment amount"})}):f.jsxs("div",{className:"relative",children:[r.isLoading&&f.jsx("div",{className:"absolute inset-0 flex items-center justify-center z-10",children:f.jsx(W,{})}),f.jsx(pe,{stripe:h,options:{mode:v,currency:E,amount:c,payment_method_types:["card"],locale:"en",appearance:{theme:"stripe",variables:{colorPrimary:"#8AA3D4"}}},children:f.jsx(vt,{onStripeReady:s,checkoutProducts:i,totalAmount:c})})]})};ye.__docgenInfo={description:"",methods:[],displayName:"StripePayment"};const ht=({showText:r=!0})=>{const{clickarooInfoMap:e,offerPricePoints:t}=q(),n=t.length>0&&Object.keys(e).length>0&&t.every(a=>e[a]);return f.jsxs("div",{className:"w-full",children:[r&&f.jsxs(f.Fragment,{children:[f.jsx("div",{className:"text-lg md:text-2xl mb-2 font-medium",children:"Payment Methods"}),f.jsx("div",{className:"text-grey text-md mb-5",children:"All transactions are secure encrypted."})]}),n?f.jsx("div",{id:"stripe-payment-element",className:"relative min-h-8",children:f.jsx(ye,{})}):f.jsx("div",{className:"relative flex items-center justify-center h-20",children:f.jsx(W,{})})]})};ht.__docgenInfo={description:"",methods:[],displayName:"PaymentMethods",props:{showText:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}}}};export{ht as P,Ie as u};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{j as f}from"./jsx-runtime-DiklIkkE.js";import{b as q,t as _}from"./useCheckoutContext-CroxIBFh.js";import{r as k,g as Re,R as u}from"./index-DRjF_FHU.js";const W=()=>f.jsx("div",{className:"absolute inset-0 flex items-center justify-center z-10",children:f.jsxs("svg",{className:"animate-spin h-6 w-6 text-black",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",fill:"none",children:[f.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),f.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]})});W.__docgenInfo={description:"",methods:[],displayName:"Loading"};var V=(r=>(r.OneTime="one-time",r.Subscription="subscription",r))(V||{});const Ie=()=>{const{cart:r,clickarooInfoMap:e,offerPricePoints:t}=q(),n=k.useMemo(()=>r.reduce((o,i)=>{const c=e[i.offerPricePoint];if(!c)return o;const s=H(c);return s&&s.priceInCents>0&&o.push({...i,priceInCents:s.priceInCents,currency:s.currency,quantity:s.quantity,paymentType:c.type==="one_off"?V.OneTime:V.Subscription}),o},[]),[r,e]),a=k.useMemo(()=>{let o=0;return t.forEach(i=>{const c=e[i];if(!c)return;const s=H(c);s&&(o+=s.priceInCents*s.quantity)}),o},[t,e]);return{checkoutProducts:n,totalAmount:a}},H=r=>{if(console.log(r),r.type==="one_off"&&r.one_off)return{priceInCents:r.one_off.price_in_cents||0,currency:r.one_off.currency||"usd",quantity:r.one_off.quantity||1};if(r.type==="subscription_schedules"&&r.subscription_schedules){const e=r.subscription_schedules.find(t=>t.phase===1);if(e)return{priceInCents:e.price_in_cents||0,currency:e.currency||"usd",quantity:e.quantity||1}}return null};var ne={exports:{}},Ae="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",Te=Ae,Ne=Te;function oe(){}function ae(){}ae.resetWarningCache=oe;var Le=function(){function r(n,a,o,i,c,s){if(s!==Ne){var h=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw h.name="Invariant Violation",h}}r.isRequired=r;function e(){return r}var t={array:r,bigint:r,bool:r,func:r,number:r,object:r,string:r,symbol:r,any:r,arrayOf:e,element:r,elementType:r,instanceOf:e,node:r,objectOf:e,oneOf:e,oneOfType:e,shape:e,exact:e,checkPropTypes:ae,resetWarningCache:oe};return t.PropTypes=t,t};ne.exports=Le();var Me=ne.exports;const l=Re(Me);function X(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);e&&(n=n.filter(function(a){return Object.getOwnPropertyDescriptor(r,a).enumerable})),t.push.apply(t,n)}return t}function Q(r){for(var e=1;e<arguments.length;e++){var t=arguments[e]!=null?arguments[e]:{};e%2?X(Object(t),!0).forEach(function(n){se(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):X(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}function U(r){"@babel/helpers - typeof";return typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?U=function(e){return typeof e}:U=function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},U(r)}function se(r,e,t){return e in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function Ue(r,e){if(r==null)return{};var t={},n=Object.keys(r),a,o;for(o=0;o<n.length;o++)a=n[o],!(e.indexOf(a)>=0)&&(t[a]=r[a]);return t}function We(r,e){if(r==null)return{};var t=Ue(r,e),n,a;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(r);for(a=0;a<o.length;a++)n=o[a],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}function ie(r,e){return qe(r)||Be(r,e)||Fe(r,e)||De()}function qe(r){if(Array.isArray(r))return r}function Be(r,e){var t=r&&(typeof Symbol<"u"&&r[Symbol.iterator]||r["@@iterator"]);if(t!=null){var n=[],a=!0,o=!1,i,c;try{for(t=t.call(r);!(a=(i=t.next()).done)&&(n.push(i.value),!(e&&n.length===e));a=!0);}catch(s){o=!0,c=s}finally{try{!a&&t.return!=null&&t.return()}finally{if(o)throw c}}return n}}function Fe(r,e){if(r){if(typeof r=="string")return Z(r,e);var t=Object.prototype.toString.call(r).slice(8,-1);if(t==="Object"&&r.constructor&&(t=r.constructor.name),t==="Map"||t==="Set")return Array.from(r);if(t==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return Z(r,e)}}function Z(r,e){(e==null||e>r.length)&&(e=r.length);for(var t=0,n=new Array(e);t<e;t++)n[t]=r[t];return n}function De(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
|
|
2
|
+
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}var C=function(e,t,n){var a=!!n,o=u.useRef(n);u.useEffect(function(){o.current=n},[n]),u.useEffect(function(){if(!a||!e)return function(){};var i=function(){o.current&&o.current.apply(o,arguments)};return e.on(t,i),function(){e.off(t,i)}},[a,t,e,o])},$=function(e){var t=u.useRef(e);return u.useEffect(function(){t.current=e},[e]),t.current},w=function(e){return e!==null&&U(e)==="object"},Ve=function(e){return w(e)&&typeof e.then=="function"},$e=function(e){return w(e)&&typeof e.elements=="function"&&typeof e.createToken=="function"&&typeof e.createPaymentMethod=="function"&&typeof e.confirmCardPayment=="function"},ee="[object Object]",ze=function r(e,t){if(!w(e)||!w(t))return e===t;var n=Array.isArray(e),a=Array.isArray(t);if(n!==a)return!1;var o=Object.prototype.toString.call(e)===ee,i=Object.prototype.toString.call(t)===ee;if(o!==i)return!1;if(!o&&!n)return e===t;var c=Object.keys(e),s=Object.keys(t);if(c.length!==s.length)return!1;for(var h={},v=0;v<c.length;v+=1)h[c[v]]=!0;for(var E=0;E<s.length;E+=1)h[s[E]]=!0;var p=Object.keys(h);if(p.length!==c.length)return!1;var x=e,b=t,y=function(A){return r(x[A],b[A])};return p.every(y)},ce=function(e,t,n){return w(e)?Object.keys(e).reduce(function(a,o){var i=!w(t)||!ze(e[o],t[o]);return n.includes(o)?(i&&console.warn("Unsupported prop change: options.".concat(o," is not a mutable property.")),a):i?Q(Q({},a||{}),{},se({},o,e[o])):a},null):null},ue="Invalid prop `stripe` supplied to `Elements`. We recommend using the `loadStripe` utility from `@stripe/stripe-js`. See https://stripe.com/docs/stripe-js/react#elements-props-stripe for details.",te=function(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:ue;if(e===null||$e(e))return e;throw new Error(t)},Je=function(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:ue;if(Ve(e))return{tag:"async",stripePromise:Promise.resolve(e).then(function(a){return te(a,t)})};var n=te(e,t);return n===null?{tag:"empty"}:{tag:"sync",stripe:n}},Ye=function(e){!e||!e._registerWrapper||!e.registerAppInfo||(e._registerWrapper({name:"react-stripe-js",version:"3.10.0"}),e.registerAppInfo({name:"react-stripe-js",version:"3.10.0",url:"https://stripe.com/docs/stripe-js/react"}))},B=u.createContext(null);B.displayName="ElementsContext";var le=function(e,t){if(!e)throw new Error("Could not find Elements context; You need to wrap the part of your app that ".concat(t," in an <Elements> provider."));return e},pe=function(e){var t=e.stripe,n=e.options,a=e.children,o=u.useMemo(function(){return Je(t)},[t]),i=u.useState(function(){return{stripe:o.tag==="sync"?o.stripe:null,elements:o.tag==="sync"?o.stripe.elements(n):null}}),c=ie(i,2),s=c[0],h=c[1];u.useEffect(function(){var p=!0,x=function(y){h(function(O){return O.stripe?O:{stripe:y,elements:y.elements(n)}})};return o.tag==="async"&&!s.stripe?o.stripePromise.then(function(b){b&&p&&x(b)}):o.tag==="sync"&&!s.stripe&&x(o.stripe),function(){p=!1}},[o,s,n]);var v=$(t);u.useEffect(function(){v!==null&&v!==t&&console.warn("Unsupported prop change on Elements: You cannot change the `stripe` prop after setting it.")},[v,t]);var E=$(n);return u.useEffect(function(){if(s.elements){var p=ce(n,E,["clientSecret","fonts"]);p&&s.elements.update(p)}},[n,E,s.elements]),u.useEffect(function(){Ye(s.stripe)},[s.stripe]),u.createElement(B.Provider,{value:s},a)};pe.propTypes={stripe:l.any,options:l.object};var Ke=function(e){var t=u.useContext(B);return le(t,e)},Ge=function(){var e=Ke("calls useElements()"),t=e.elements;return t};l.func.isRequired;var fe=u.createContext(null);fe.displayName="CheckoutSdkContext";var He=function(e,t){if(!e)throw new Error("Could not find CheckoutProvider context; You need to wrap the part of your app that ".concat(t," in an <CheckoutProvider> provider."));return e},Xe=u.createContext(null);Xe.displayName="CheckoutContext";l.any,l.shape({fetchClientSecret:l.func.isRequired,elementsOptions:l.object}).isRequired;var z=function(e){var t=u.useContext(fe),n=u.useContext(B);if(t&&n)throw new Error("You cannot wrap the part of your app that ".concat(e," in both <CheckoutProvider> and <Elements> providers."));return t?He(t,e):le(n,e)},Qe=["mode"],Ze=function(e){return e.charAt(0).toUpperCase()+e.slice(1)},d=function(e,t){var n="".concat(Ze(e),"Element"),a=function(s){var h=s.id,v=s.className,E=s.options,p=E===void 0?{}:E,x=s.onBlur,b=s.onFocus,y=s.onReady,O=s.onChange,A=s.onEscape,ge=s.onClick,Se=s.onLoadError,Ce=s.onLoaderStart,Ee=s.onNetworksChange,be=s.onConfirm,xe=s.onCancel,Pe=s.onShippingAddressChange,je=s.onShippingRateChange,ke=s.onSavedPaymentMethodRemove,_e=s.onSavedPaymentMethodUpdate,T=z("mounts <".concat(n,">")),N="elements"in T?T.elements:null,P="checkoutSdk"in T?T.checkoutSdk:null,we=u.useState(null),J=ie(we,2),g=J[0],Oe=J[1],j=u.useRef(null),F=u.useRef(null);C(g,"blur",x),C(g,"focus",b),C(g,"escape",A),C(g,"click",ge),C(g,"loaderror",Se),C(g,"loaderstart",Ce),C(g,"networkschange",Ee),C(g,"confirm",be),C(g,"cancel",xe),C(g,"shippingaddresschange",Pe),C(g,"shippingratechange",je),C(g,"savedpaymentmethodremove",ke),C(g,"savedpaymentmethodupdate",_e),C(g,"change",O);var D;y&&(e==="expressCheckout"?D=y:D=function(){y(g)}),C(g,"ready",D),u.useLayoutEffect(function(){if(j.current===null&&F.current!==null&&(N||P)){var S=null;if(P)switch(e){case"payment":S=P.createPaymentElement(p);break;case"address":if("mode"in p){var K=p.mode,G=We(p,Qe);if(K==="shipping")S=P.createShippingAddressElement(G);else if(K==="billing")S=P.createBillingAddressElement(G);else throw new Error("Invalid options.mode. mode must be 'billing' or 'shipping'.")}else throw new Error("You must supply options.mode. mode must be 'billing' or 'shipping'.");break;case"expressCheckout":S=P.createExpressCheckoutElement(p);break;case"currencySelector":S=P.createCurrencySelectorElement();break;case"taxId":S=P.createTaxIdElement(p);break;default:throw new Error("Invalid Element type ".concat(n,". You must use either the <PaymentElement />, <AddressElement options={{mode: 'shipping'}} />, <AddressElement options={{mode: 'billing'}} />, or <ExpressCheckoutElement />."))}else N&&(S=N.create(e,p));j.current=S,Oe(S),S&&S.mount(F.current)}},[N,P,p]);var Y=$(p);return u.useEffect(function(){if(j.current){var S=ce(p,Y,["paymentRequest"]);S&&"update"in j.current&&j.current.update(S)}},[p,Y]),u.useLayoutEffect(function(){return function(){if(j.current&&typeof j.current.destroy=="function")try{j.current.destroy(),j.current=null}catch{}}},[]),u.createElement("div",{id:h,className:v,ref:F})},o=function(s){z("mounts <".concat(n,">"));var h=s.id,v=s.className;return u.createElement("div",{id:h,className:v})},i=t?o:a;return i.propTypes={id:l.string,className:l.string,onChange:l.func,onBlur:l.func,onFocus:l.func,onReady:l.func,onEscape:l.func,onClick:l.func,onLoadError:l.func,onLoaderStart:l.func,onNetworksChange:l.func,onConfirm:l.func,onCancel:l.func,onShippingAddressChange:l.func,onShippingRateChange:l.func,onSavedPaymentMethodRemove:l.func,onSavedPaymentMethodUpdate:l.func,options:l.object},i.displayName=n,i.__elementType=e,i},m=typeof window>"u",et=u.createContext(null);et.displayName="EmbeddedCheckoutProviderContext";var tt=function(){var e=z("calls useStripe()"),t=e.stripe;return t};d("auBankAccount",m);d("card",m);d("cardNumber",m);d("cardExpiry",m);d("cardCvc",m);d("fpxBank",m);d("iban",m);d("idealBank",m);d("p24Bank",m);d("epsBank",m);var rt=d("payment",m);d("expressCheckout",m);d("currencySelector",m);d("paymentRequestButton",m);d("linkAuthentication",m);d("address",m);d("shippingAddress",m);d("paymentMethodMessaging",m);d("affirmMessage",m);d("afterpayClearpayMessage",m);d("taxId",m);var de="basil",nt=function(e){return e===3?"v3":e},me="https://js.stripe.com",ot="".concat(me,"/").concat(de,"/stripe.js"),at=/^https:\/\/js\.stripe\.com\/v3\/?(\?.*)?$/,st=/^https:\/\/js\.stripe\.com\/(v3|[a-z]+)\/stripe\.js(\?.*)?$/;var it=function(e){return at.test(e)||st.test(e)},ct=function(){for(var e=document.querySelectorAll('script[src^="'.concat(me,'"]')),t=0;t<e.length;t++){var n=e[t];if(it(n.src))return n}return null},re=function(e){var t="",n=document.createElement("script");n.src="".concat(ot).concat(t);var a=document.head||document.body;if(!a)throw new Error("Expected document.body not to be null. Stripe.js requires a <body> element.");return a.appendChild(n),n},ut=function(e,t){!e||!e._registerWrapper||e._registerWrapper({name:"stripe-js",version:"7.9.0",startTime:t})},R=null,L=null,M=null,lt=function(e){return function(t){e(new Error("Failed to load Stripe.js",{cause:t}))}},pt=function(e,t){return function(){window.Stripe?e(window.Stripe):t(new Error("Stripe.js not available"))}},ft=function(e){return R!==null?R:(R=new Promise(function(t,n){if(typeof window>"u"||typeof document>"u"){t(null);return}if(window.Stripe){t(window.Stripe);return}try{var a=ct();if(!(a&&e)){if(!a)a=re(e);else if(a&&M!==null&&L!==null){var o;a.removeEventListener("load",M),a.removeEventListener("error",L),(o=a.parentNode)===null||o===void 0||o.removeChild(a),a=re(e)}}M=pt(t,n),L=lt(n),a.addEventListener("load",M),a.addEventListener("error",L)}catch(i){n(i);return}}),R.catch(function(t){return R=null,Promise.reject(t)}))},dt=function(e,t,n){if(e===null)return null;var a=t[0],o=a.match(/^pk_test/),i=nt(e.version),c=de;o&&i!==c&&console.warn("Stripe.js@".concat(i," was loaded on the page, but @stripe/stripe-js@").concat("7.9.0"," expected Stripe.js@").concat(c,". This may result in unexpected behavior. For more information, see https://docs.stripe.com/sdks/stripejs-versioning"));var s=e.apply(void 0,t);return ut(s,n),s},I,ve=!1,he=function(){return I||(I=ft(null).catch(function(e){return I=null,Promise.reject(e)}),I)};Promise.resolve().then(function(){return he()}).catch(function(r){ve||console.warn(r)});var mt=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];ve=!0;var a=Date.now();return he().then(function(o){return dt(o,t,a)})};const vt=({onStripeReady:r,checkoutProducts:e,totalAmount:t})=>{const n=tt(),a=Ge(),{setStripeComplete:o,setStripeLoading:i,onPaymentInfoComplete:c}=q(),[s,h]=k.useState(!1);return k.useEffect(()=>{n&&a&&r(n,a)},[n,a,r]),f.jsx(rt,{onLoaderStart:()=>{_("before_stripe_form_success")},onReady:()=>{i(!1),_("after_stripe_form_success")},onLoadError:v=>{var E;console.error("Payment element load error:",v),i(!1),_("after_stripe_form_failure",{error:((E=v.error)==null?void 0:E.message)||"Unknown error"})},onChange:({complete:v})=>{o(v),v&&!s&&c&&(h(!0),c(e,t))}})},ye=()=>{var x;const{stripeState:r,clickarooInfoMap:e,offerPricePoints:t,setStripe:n,setStripeElements:a}=q(),o=t[0]?e[t[0]]:null,{checkoutProducts:i,totalAmount:c}=Ie(),s=k.useCallback((b,y)=>{b&&n(b),y&&a(y)},[n,a]),[h]=k.useState(()=>{if(!o)return null;const b=mt(o.payment.data.publishable_key,{stripeAccount:o.payment.data.account_id});return b.then(y=>{y&&_("after_stripe_sdk_success")}).catch(y=>{_("after_stripe_sdk_failure",{error:(y==null?void 0:y.message)||"Failed to load Stripe SDK"})}),b});if(!o||t.length===0||!h)return f.jsx("div",{className:"flex items-center justify-center h-20",children:f.jsx(W,{})});const v=o.type==="one_off"?"payment":"subscription",E=(x=i[0])==null?void 0:x.currency.toLowerCase(),p=c<=0;return k.useEffect(()=>{p&&_("after_stripe_form_failure",{error:"Invalid payment amount",totalAmount:c})},[p,c]),p?f.jsx("div",{className:"flex items-center justify-center h-20",children:f.jsx("div",{className:"text-[#df1b41]",children:"Invalid payment amount"})}):f.jsxs("div",{className:"relative",children:[r.isLoading&&f.jsx("div",{className:"absolute inset-0 flex items-center justify-center z-10",children:f.jsx(W,{})}),f.jsx(pe,{stripe:h,options:{mode:v,currency:E,amount:c,payment_method_types:["card"],locale:"en",appearance:{theme:"stripe",variables:{colorPrimary:"#8AA3D4"}}},children:f.jsx(vt,{onStripeReady:s,checkoutProducts:i,totalAmount:c})})]})};ye.__docgenInfo={description:"",methods:[],displayName:"StripePayment"};const ht=({showText:r=!0})=>{const{clickarooInfoMap:e,offerPricePoints:t}=q(),n=t.length>0&&Object.keys(e).length>0&&t.every(a=>e[a]);return f.jsxs("div",{className:"w-full",children:[r&&f.jsxs(f.Fragment,{children:[f.jsx("div",{className:"text-lg md:text-2xl mb-2 font-medium",children:"Payment Methods"}),f.jsx("div",{className:"text-grey text-md mb-5",children:"All transactions are secure encrypted."})]}),n?f.jsx("div",{id:"stripe-payment-element",className:"relative min-h-8",children:f.jsx(ye,{})}):f.jsx("div",{className:"relative flex items-center justify-center h-20",children:f.jsx(W,{})})]})};ht.__docgenInfo={description:"",methods:[],displayName:"PaymentMethods",props:{showText:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}}}};export{ht as P,Ie as u};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{j as f}from"./jsx-runtime-DiklIkkE.js";import{b as q,t as _}from"./useCheckoutContext-BXtGY5u3.js";import{r as k,g as Re,R as u}from"./index-DRjF_FHU.js";const W=()=>f.jsx("div",{className:"absolute inset-0 flex items-center justify-center z-10",children:f.jsxs("svg",{className:"animate-spin h-6 w-6 text-black",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",fill:"none",children:[f.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),f.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]})});W.__docgenInfo={description:"",methods:[],displayName:"Loading"};var V=(r=>(r.OneTime="one-time",r.Subscription="subscription",r))(V||{});const Ie=()=>{const{cart:r,clickarooInfoMap:e,offerPricePoints:t}=q(),n=k.useMemo(()=>r.reduce((o,i)=>{const c=e[i.offerPricePoint];if(!c)return o;const s=H(c);return s&&s.priceInCents>0&&o.push({...i,priceInCents:s.priceInCents,currency:s.currency,quantity:s.quantity,paymentType:c.type==="one_off"?V.OneTime:V.Subscription}),o},[]),[r,e]),a=k.useMemo(()=>{let o=0;return t.forEach(i=>{const c=e[i];if(!c)return;const s=H(c);s&&(o+=s.priceInCents*s.quantity)}),o},[t,e]);return{checkoutProducts:n,totalAmount:a}},H=r=>{if(console.log(r),r.type==="one_off"&&r.one_off)return{priceInCents:r.one_off.price_in_cents||0,currency:r.one_off.currency||"usd",quantity:r.one_off.quantity||1};if(r.type==="subscription_schedules"&&r.subscription_schedules){const e=r.subscription_schedules.find(t=>t.phase===1);if(e)return{priceInCents:e.price_in_cents||0,currency:e.currency||"usd",quantity:e.quantity||1}}return null};var ne={exports:{}},Ae="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",Te=Ae,Ne=Te;function oe(){}function ae(){}ae.resetWarningCache=oe;var Le=function(){function r(n,a,o,i,c,s){if(s!==Ne){var h=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw h.name="Invariant Violation",h}}r.isRequired=r;function e(){return r}var t={array:r,bigint:r,bool:r,func:r,number:r,object:r,string:r,symbol:r,any:r,arrayOf:e,element:r,elementType:r,instanceOf:e,node:r,objectOf:e,oneOf:e,oneOfType:e,shape:e,exact:e,checkPropTypes:ae,resetWarningCache:oe};return t.PropTypes=t,t};ne.exports=Le();var Me=ne.exports;const l=Re(Me);function X(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);e&&(n=n.filter(function(a){return Object.getOwnPropertyDescriptor(r,a).enumerable})),t.push.apply(t,n)}return t}function Q(r){for(var e=1;e<arguments.length;e++){var t=arguments[e]!=null?arguments[e]:{};e%2?X(Object(t),!0).forEach(function(n){se(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):X(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}function U(r){"@babel/helpers - typeof";return typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?U=function(e){return typeof e}:U=function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},U(r)}function se(r,e,t){return e in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function Ue(r,e){if(r==null)return{};var t={},n=Object.keys(r),a,o;for(o=0;o<n.length;o++)a=n[o],!(e.indexOf(a)>=0)&&(t[a]=r[a]);return t}function We(r,e){if(r==null)return{};var t=Ue(r,e),n,a;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(r);for(a=0;a<o.length;a++)n=o[a],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}function ie(r,e){return qe(r)||Be(r,e)||Fe(r,e)||De()}function qe(r){if(Array.isArray(r))return r}function Be(r,e){var t=r&&(typeof Symbol<"u"&&r[Symbol.iterator]||r["@@iterator"]);if(t!=null){var n=[],a=!0,o=!1,i,c;try{for(t=t.call(r);!(a=(i=t.next()).done)&&(n.push(i.value),!(e&&n.length===e));a=!0);}catch(s){o=!0,c=s}finally{try{!a&&t.return!=null&&t.return()}finally{if(o)throw c}}return n}}function Fe(r,e){if(r){if(typeof r=="string")return Z(r,e);var t=Object.prototype.toString.call(r).slice(8,-1);if(t==="Object"&&r.constructor&&(t=r.constructor.name),t==="Map"||t==="Set")return Array.from(r);if(t==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return Z(r,e)}}function Z(r,e){(e==null||e>r.length)&&(e=r.length);for(var t=0,n=new Array(e);t<e;t++)n[t]=r[t];return n}function De(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
|
|
2
|
+
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}var C=function(e,t,n){var a=!!n,o=u.useRef(n);u.useEffect(function(){o.current=n},[n]),u.useEffect(function(){if(!a||!e)return function(){};var i=function(){o.current&&o.current.apply(o,arguments)};return e.on(t,i),function(){e.off(t,i)}},[a,t,e,o])},$=function(e){var t=u.useRef(e);return u.useEffect(function(){t.current=e},[e]),t.current},w=function(e){return e!==null&&U(e)==="object"},Ve=function(e){return w(e)&&typeof e.then=="function"},$e=function(e){return w(e)&&typeof e.elements=="function"&&typeof e.createToken=="function"&&typeof e.createPaymentMethod=="function"&&typeof e.confirmCardPayment=="function"},ee="[object Object]",ze=function r(e,t){if(!w(e)||!w(t))return e===t;var n=Array.isArray(e),a=Array.isArray(t);if(n!==a)return!1;var o=Object.prototype.toString.call(e)===ee,i=Object.prototype.toString.call(t)===ee;if(o!==i)return!1;if(!o&&!n)return e===t;var c=Object.keys(e),s=Object.keys(t);if(c.length!==s.length)return!1;for(var h={},v=0;v<c.length;v+=1)h[c[v]]=!0;for(var E=0;E<s.length;E+=1)h[s[E]]=!0;var p=Object.keys(h);if(p.length!==c.length)return!1;var x=e,b=t,y=function(A){return r(x[A],b[A])};return p.every(y)},ce=function(e,t,n){return w(e)?Object.keys(e).reduce(function(a,o){var i=!w(t)||!ze(e[o],t[o]);return n.includes(o)?(i&&console.warn("Unsupported prop change: options.".concat(o," is not a mutable property.")),a):i?Q(Q({},a||{}),{},se({},o,e[o])):a},null):null},ue="Invalid prop `stripe` supplied to `Elements`. We recommend using the `loadStripe` utility from `@stripe/stripe-js`. See https://stripe.com/docs/stripe-js/react#elements-props-stripe for details.",te=function(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:ue;if(e===null||$e(e))return e;throw new Error(t)},Je=function(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:ue;if(Ve(e))return{tag:"async",stripePromise:Promise.resolve(e).then(function(a){return te(a,t)})};var n=te(e,t);return n===null?{tag:"empty"}:{tag:"sync",stripe:n}},Ye=function(e){!e||!e._registerWrapper||!e.registerAppInfo||(e._registerWrapper({name:"react-stripe-js",version:"3.10.0"}),e.registerAppInfo({name:"react-stripe-js",version:"3.10.0",url:"https://stripe.com/docs/stripe-js/react"}))},B=u.createContext(null);B.displayName="ElementsContext";var le=function(e,t){if(!e)throw new Error("Could not find Elements context; You need to wrap the part of your app that ".concat(t," in an <Elements> provider."));return e},pe=function(e){var t=e.stripe,n=e.options,a=e.children,o=u.useMemo(function(){return Je(t)},[t]),i=u.useState(function(){return{stripe:o.tag==="sync"?o.stripe:null,elements:o.tag==="sync"?o.stripe.elements(n):null}}),c=ie(i,2),s=c[0],h=c[1];u.useEffect(function(){var p=!0,x=function(y){h(function(O){return O.stripe?O:{stripe:y,elements:y.elements(n)}})};return o.tag==="async"&&!s.stripe?o.stripePromise.then(function(b){b&&p&&x(b)}):o.tag==="sync"&&!s.stripe&&x(o.stripe),function(){p=!1}},[o,s,n]);var v=$(t);u.useEffect(function(){v!==null&&v!==t&&console.warn("Unsupported prop change on Elements: You cannot change the `stripe` prop after setting it.")},[v,t]);var E=$(n);return u.useEffect(function(){if(s.elements){var p=ce(n,E,["clientSecret","fonts"]);p&&s.elements.update(p)}},[n,E,s.elements]),u.useEffect(function(){Ye(s.stripe)},[s.stripe]),u.createElement(B.Provider,{value:s},a)};pe.propTypes={stripe:l.any,options:l.object};var Ke=function(e){var t=u.useContext(B);return le(t,e)},Ge=function(){var e=Ke("calls useElements()"),t=e.elements;return t};l.func.isRequired;var fe=u.createContext(null);fe.displayName="CheckoutSdkContext";var He=function(e,t){if(!e)throw new Error("Could not find CheckoutProvider context; You need to wrap the part of your app that ".concat(t," in an <CheckoutProvider> provider."));return e},Xe=u.createContext(null);Xe.displayName="CheckoutContext";l.any,l.shape({fetchClientSecret:l.func.isRequired,elementsOptions:l.object}).isRequired;var z=function(e){var t=u.useContext(fe),n=u.useContext(B);if(t&&n)throw new Error("You cannot wrap the part of your app that ".concat(e," in both <CheckoutProvider> and <Elements> providers."));return t?He(t,e):le(n,e)},Qe=["mode"],Ze=function(e){return e.charAt(0).toUpperCase()+e.slice(1)},d=function(e,t){var n="".concat(Ze(e),"Element"),a=function(s){var h=s.id,v=s.className,E=s.options,p=E===void 0?{}:E,x=s.onBlur,b=s.onFocus,y=s.onReady,O=s.onChange,A=s.onEscape,ge=s.onClick,Se=s.onLoadError,Ce=s.onLoaderStart,Ee=s.onNetworksChange,be=s.onConfirm,xe=s.onCancel,Pe=s.onShippingAddressChange,je=s.onShippingRateChange,ke=s.onSavedPaymentMethodRemove,_e=s.onSavedPaymentMethodUpdate,T=z("mounts <".concat(n,">")),N="elements"in T?T.elements:null,P="checkoutSdk"in T?T.checkoutSdk:null,we=u.useState(null),J=ie(we,2),g=J[0],Oe=J[1],j=u.useRef(null),F=u.useRef(null);C(g,"blur",x),C(g,"focus",b),C(g,"escape",A),C(g,"click",ge),C(g,"loaderror",Se),C(g,"loaderstart",Ce),C(g,"networkschange",Ee),C(g,"confirm",be),C(g,"cancel",xe),C(g,"shippingaddresschange",Pe),C(g,"shippingratechange",je),C(g,"savedpaymentmethodremove",ke),C(g,"savedpaymentmethodupdate",_e),C(g,"change",O);var D;y&&(e==="expressCheckout"?D=y:D=function(){y(g)}),C(g,"ready",D),u.useLayoutEffect(function(){if(j.current===null&&F.current!==null&&(N||P)){var S=null;if(P)switch(e){case"payment":S=P.createPaymentElement(p);break;case"address":if("mode"in p){var K=p.mode,G=We(p,Qe);if(K==="shipping")S=P.createShippingAddressElement(G);else if(K==="billing")S=P.createBillingAddressElement(G);else throw new Error("Invalid options.mode. mode must be 'billing' or 'shipping'.")}else throw new Error("You must supply options.mode. mode must be 'billing' or 'shipping'.");break;case"expressCheckout":S=P.createExpressCheckoutElement(p);break;case"currencySelector":S=P.createCurrencySelectorElement();break;case"taxId":S=P.createTaxIdElement(p);break;default:throw new Error("Invalid Element type ".concat(n,". You must use either the <PaymentElement />, <AddressElement options={{mode: 'shipping'}} />, <AddressElement options={{mode: 'billing'}} />, or <ExpressCheckoutElement />."))}else N&&(S=N.create(e,p));j.current=S,Oe(S),S&&S.mount(F.current)}},[N,P,p]);var Y=$(p);return u.useEffect(function(){if(j.current){var S=ce(p,Y,["paymentRequest"]);S&&"update"in j.current&&j.current.update(S)}},[p,Y]),u.useLayoutEffect(function(){return function(){if(j.current&&typeof j.current.destroy=="function")try{j.current.destroy(),j.current=null}catch{}}},[]),u.createElement("div",{id:h,className:v,ref:F})},o=function(s){z("mounts <".concat(n,">"));var h=s.id,v=s.className;return u.createElement("div",{id:h,className:v})},i=t?o:a;return i.propTypes={id:l.string,className:l.string,onChange:l.func,onBlur:l.func,onFocus:l.func,onReady:l.func,onEscape:l.func,onClick:l.func,onLoadError:l.func,onLoaderStart:l.func,onNetworksChange:l.func,onConfirm:l.func,onCancel:l.func,onShippingAddressChange:l.func,onShippingRateChange:l.func,onSavedPaymentMethodRemove:l.func,onSavedPaymentMethodUpdate:l.func,options:l.object},i.displayName=n,i.__elementType=e,i},m=typeof window>"u",et=u.createContext(null);et.displayName="EmbeddedCheckoutProviderContext";var tt=function(){var e=z("calls useStripe()"),t=e.stripe;return t};d("auBankAccount",m);d("card",m);d("cardNumber",m);d("cardExpiry",m);d("cardCvc",m);d("fpxBank",m);d("iban",m);d("idealBank",m);d("p24Bank",m);d("epsBank",m);var rt=d("payment",m);d("expressCheckout",m);d("currencySelector",m);d("paymentRequestButton",m);d("linkAuthentication",m);d("address",m);d("shippingAddress",m);d("paymentMethodMessaging",m);d("affirmMessage",m);d("afterpayClearpayMessage",m);d("taxId",m);var de="basil",nt=function(e){return e===3?"v3":e},me="https://js.stripe.com",ot="".concat(me,"/").concat(de,"/stripe.js"),at=/^https:\/\/js\.stripe\.com\/v3\/?(\?.*)?$/,st=/^https:\/\/js\.stripe\.com\/(v3|[a-z]+)\/stripe\.js(\?.*)?$/;var it=function(e){return at.test(e)||st.test(e)},ct=function(){for(var e=document.querySelectorAll('script[src^="'.concat(me,'"]')),t=0;t<e.length;t++){var n=e[t];if(it(n.src))return n}return null},re=function(e){var t="",n=document.createElement("script");n.src="".concat(ot).concat(t);var a=document.head||document.body;if(!a)throw new Error("Expected document.body not to be null. Stripe.js requires a <body> element.");return a.appendChild(n),n},ut=function(e,t){!e||!e._registerWrapper||e._registerWrapper({name:"stripe-js",version:"7.9.0",startTime:t})},R=null,L=null,M=null,lt=function(e){return function(t){e(new Error("Failed to load Stripe.js",{cause:t}))}},pt=function(e,t){return function(){window.Stripe?e(window.Stripe):t(new Error("Stripe.js not available"))}},ft=function(e){return R!==null?R:(R=new Promise(function(t,n){if(typeof window>"u"||typeof document>"u"){t(null);return}if(window.Stripe){t(window.Stripe);return}try{var a=ct();if(!(a&&e)){if(!a)a=re(e);else if(a&&M!==null&&L!==null){var o;a.removeEventListener("load",M),a.removeEventListener("error",L),(o=a.parentNode)===null||o===void 0||o.removeChild(a),a=re(e)}}M=pt(t,n),L=lt(n),a.addEventListener("load",M),a.addEventListener("error",L)}catch(i){n(i);return}}),R.catch(function(t){return R=null,Promise.reject(t)}))},dt=function(e,t,n){if(e===null)return null;var a=t[0],o=a.match(/^pk_test/),i=nt(e.version),c=de;o&&i!==c&&console.warn("Stripe.js@".concat(i," was loaded on the page, but @stripe/stripe-js@").concat("7.9.0"," expected Stripe.js@").concat(c,". This may result in unexpected behavior. For more information, see https://docs.stripe.com/sdks/stripejs-versioning"));var s=e.apply(void 0,t);return ut(s,n),s},I,ve=!1,he=function(){return I||(I=ft(null).catch(function(e){return I=null,Promise.reject(e)}),I)};Promise.resolve().then(function(){return he()}).catch(function(r){ve||console.warn(r)});var mt=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];ve=!0;var a=Date.now();return he().then(function(o){return dt(o,t,a)})};const vt=({onStripeReady:r,checkoutProducts:e,totalAmount:t})=>{const n=tt(),a=Ge(),{setStripeComplete:o,setStripeLoading:i,onPaymentInfoComplete:c}=q(),[s,h]=k.useState(!1);return k.useEffect(()=>{n&&a&&r(n,a)},[n,a,r]),f.jsx(rt,{onLoaderStart:()=>{_("before_stripe_form_success")},onReady:()=>{i(!1),_("after_stripe_form_success")},onLoadError:v=>{var E;console.error("Payment element load error:",v),i(!1),_("after_stripe_form_failure",{error:((E=v.error)==null?void 0:E.message)||"Unknown error"})},onChange:({complete:v})=>{o(v),v&&!s&&c&&(h(!0),c(e,t))}})},ye=()=>{var x;const{stripeState:r,clickarooInfoMap:e,offerPricePoints:t,setStripe:n,setStripeElements:a}=q(),o=t[0]?e[t[0]]:null,{checkoutProducts:i,totalAmount:c}=Ie(),s=k.useCallback((b,y)=>{b&&n(b),y&&a(y)},[n,a]),[h]=k.useState(()=>{if(!o)return null;const b=mt(o.payment.data.publishable_key,{stripeAccount:o.payment.data.account_id});return b.then(y=>{y&&_("after_stripe_sdk_success")}).catch(y=>{_("after_stripe_sdk_failure",{error:(y==null?void 0:y.message)||"Failed to load Stripe SDK"})}),b});if(!o||t.length===0||!h)return f.jsx("div",{className:"flex items-center justify-center h-20",children:f.jsx(W,{})});const v=o.type==="one_off"?"payment":"subscription",E=(x=i[0])==null?void 0:x.currency.toLowerCase(),p=c<=0;return k.useEffect(()=>{p&&_("after_stripe_form_failure",{error:"Invalid payment amount",totalAmount:c})},[p,c]),p?f.jsx("div",{className:"flex items-center justify-center h-20",children:f.jsx("div",{className:"text-[#df1b41]",children:"Invalid payment amount"})}):f.jsxs("div",{className:"relative",children:[r.isLoading&&f.jsx("div",{className:"absolute inset-0 flex items-center justify-center z-10",children:f.jsx(W,{})}),f.jsx(pe,{stripe:h,options:{mode:v,currency:E,amount:c,payment_method_types:["card"],locale:"en",appearance:{theme:"stripe",variables:{colorPrimary:"#8AA3D4"}}},children:f.jsx(vt,{onStripeReady:s,checkoutProducts:i,totalAmount:c})})]})};ye.__docgenInfo={description:"",methods:[],displayName:"StripePayment"};const ht=({showText:r=!0})=>{const{clickarooInfoMap:e,offerPricePoints:t}=q(),n=t.length>0&&Object.keys(e).length>0&&t.every(a=>e[a]);return f.jsxs("div",{className:"w-full",children:[r&&f.jsxs(f.Fragment,{children:[f.jsx("div",{className:"text-lg md:text-2xl mb-2 font-medium",children:"Payment Methods"}),f.jsx("div",{className:"text-grey text-md mb-5",children:"All transactions are secure encrypted."})]}),n?f.jsx("div",{id:"stripe-payment-element",className:"relative min-h-8",children:f.jsx(ye,{})}):f.jsx("div",{className:"relative flex items-center justify-center h-20",children:f.jsx(W,{})})]})};ht.__docgenInfo={description:"",methods:[],displayName:"PaymentMethods",props:{showText:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}}}};export{ht as P,Ie as u};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{j as f}from"./jsx-runtime-DiklIkkE.js";import{b as q,t as _}from"./useCheckoutContext-DuJ1Ep0-.js";import{r as k,g as Re,R as u}from"./index-DRjF_FHU.js";const W=()=>f.jsx("div",{className:"absolute inset-0 flex items-center justify-center z-10",children:f.jsxs("svg",{className:"animate-spin h-6 w-6 text-black",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",fill:"none",children:[f.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),f.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]})});W.__docgenInfo={description:"",methods:[],displayName:"Loading"};var V=(r=>(r.OneTime="one-time",r.Subscription="subscription",r))(V||{});const Ie=()=>{const{cart:r,clickarooInfoMap:e,offerPricePoints:t}=q(),n=k.useMemo(()=>r.reduce((o,i)=>{const c=e[i.offerPricePoint];if(!c)return o;const s=H(c);return s&&s.priceInCents>0&&o.push({...i,priceInCents:s.priceInCents,currency:s.currency,quantity:s.quantity,paymentType:c.type==="one_off"?V.OneTime:V.Subscription}),o},[]),[r,e]),a=k.useMemo(()=>{let o=0;return t.forEach(i=>{const c=e[i];if(!c)return;const s=H(c);s&&(o+=s.priceInCents*s.quantity)}),o},[t,e]);return{checkoutProducts:n,totalAmount:a}},H=r=>{if(console.log(r),r.type==="one_off"&&r.one_off)return{priceInCents:r.one_off.price_in_cents||0,currency:r.one_off.currency||"usd",quantity:r.one_off.quantity||1};if(r.type==="subscription_schedules"&&r.subscription_schedules){const e=r.subscription_schedules.find(t=>t.phase===1);if(e)return{priceInCents:e.price_in_cents||0,currency:e.currency||"usd",quantity:e.quantity||1}}return null};var ne={exports:{}},Ae="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",Te=Ae,Ne=Te;function oe(){}function ae(){}ae.resetWarningCache=oe;var Le=function(){function r(n,a,o,i,c,s){if(s!==Ne){var h=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw h.name="Invariant Violation",h}}r.isRequired=r;function e(){return r}var t={array:r,bigint:r,bool:r,func:r,number:r,object:r,string:r,symbol:r,any:r,arrayOf:e,element:r,elementType:r,instanceOf:e,node:r,objectOf:e,oneOf:e,oneOfType:e,shape:e,exact:e,checkPropTypes:ae,resetWarningCache:oe};return t.PropTypes=t,t};ne.exports=Le();var Me=ne.exports;const l=Re(Me);function X(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);e&&(n=n.filter(function(a){return Object.getOwnPropertyDescriptor(r,a).enumerable})),t.push.apply(t,n)}return t}function Q(r){for(var e=1;e<arguments.length;e++){var t=arguments[e]!=null?arguments[e]:{};e%2?X(Object(t),!0).forEach(function(n){se(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):X(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}function U(r){"@babel/helpers - typeof";return typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?U=function(e){return typeof e}:U=function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},U(r)}function se(r,e,t){return e in r?Object.defineProperty(r,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[e]=t,r}function Ue(r,e){if(r==null)return{};var t={},n=Object.keys(r),a,o;for(o=0;o<n.length;o++)a=n[o],!(e.indexOf(a)>=0)&&(t[a]=r[a]);return t}function We(r,e){if(r==null)return{};var t=Ue(r,e),n,a;if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(r);for(a=0;a<o.length;a++)n=o[a],!(e.indexOf(n)>=0)&&Object.prototype.propertyIsEnumerable.call(r,n)&&(t[n]=r[n])}return t}function ie(r,e){return qe(r)||Be(r,e)||Fe(r,e)||De()}function qe(r){if(Array.isArray(r))return r}function Be(r,e){var t=r&&(typeof Symbol<"u"&&r[Symbol.iterator]||r["@@iterator"]);if(t!=null){var n=[],a=!0,o=!1,i,c;try{for(t=t.call(r);!(a=(i=t.next()).done)&&(n.push(i.value),!(e&&n.length===e));a=!0);}catch(s){o=!0,c=s}finally{try{!a&&t.return!=null&&t.return()}finally{if(o)throw c}}return n}}function Fe(r,e){if(r){if(typeof r=="string")return Z(r,e);var t=Object.prototype.toString.call(r).slice(8,-1);if(t==="Object"&&r.constructor&&(t=r.constructor.name),t==="Map"||t==="Set")return Array.from(r);if(t==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return Z(r,e)}}function Z(r,e){(e==null||e>r.length)&&(e=r.length);for(var t=0,n=new Array(e);t<e;t++)n[t]=r[t];return n}function De(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
|
|
2
|
+
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}var C=function(e,t,n){var a=!!n,o=u.useRef(n);u.useEffect(function(){o.current=n},[n]),u.useEffect(function(){if(!a||!e)return function(){};var i=function(){o.current&&o.current.apply(o,arguments)};return e.on(t,i),function(){e.off(t,i)}},[a,t,e,o])},$=function(e){var t=u.useRef(e);return u.useEffect(function(){t.current=e},[e]),t.current},w=function(e){return e!==null&&U(e)==="object"},Ve=function(e){return w(e)&&typeof e.then=="function"},$e=function(e){return w(e)&&typeof e.elements=="function"&&typeof e.createToken=="function"&&typeof e.createPaymentMethod=="function"&&typeof e.confirmCardPayment=="function"},ee="[object Object]",ze=function r(e,t){if(!w(e)||!w(t))return e===t;var n=Array.isArray(e),a=Array.isArray(t);if(n!==a)return!1;var o=Object.prototype.toString.call(e)===ee,i=Object.prototype.toString.call(t)===ee;if(o!==i)return!1;if(!o&&!n)return e===t;var c=Object.keys(e),s=Object.keys(t);if(c.length!==s.length)return!1;for(var h={},v=0;v<c.length;v+=1)h[c[v]]=!0;for(var E=0;E<s.length;E+=1)h[s[E]]=!0;var p=Object.keys(h);if(p.length!==c.length)return!1;var x=e,b=t,y=function(A){return r(x[A],b[A])};return p.every(y)},ce=function(e,t,n){return w(e)?Object.keys(e).reduce(function(a,o){var i=!w(t)||!ze(e[o],t[o]);return n.includes(o)?(i&&console.warn("Unsupported prop change: options.".concat(o," is not a mutable property.")),a):i?Q(Q({},a||{}),{},se({},o,e[o])):a},null):null},ue="Invalid prop `stripe` supplied to `Elements`. We recommend using the `loadStripe` utility from `@stripe/stripe-js`. See https://stripe.com/docs/stripe-js/react#elements-props-stripe for details.",te=function(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:ue;if(e===null||$e(e))return e;throw new Error(t)},Je=function(e){var t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:ue;if(Ve(e))return{tag:"async",stripePromise:Promise.resolve(e).then(function(a){return te(a,t)})};var n=te(e,t);return n===null?{tag:"empty"}:{tag:"sync",stripe:n}},Ye=function(e){!e||!e._registerWrapper||!e.registerAppInfo||(e._registerWrapper({name:"react-stripe-js",version:"3.10.0"}),e.registerAppInfo({name:"react-stripe-js",version:"3.10.0",url:"https://stripe.com/docs/stripe-js/react"}))},B=u.createContext(null);B.displayName="ElementsContext";var le=function(e,t){if(!e)throw new Error("Could not find Elements context; You need to wrap the part of your app that ".concat(t," in an <Elements> provider."));return e},pe=function(e){var t=e.stripe,n=e.options,a=e.children,o=u.useMemo(function(){return Je(t)},[t]),i=u.useState(function(){return{stripe:o.tag==="sync"?o.stripe:null,elements:o.tag==="sync"?o.stripe.elements(n):null}}),c=ie(i,2),s=c[0],h=c[1];u.useEffect(function(){var p=!0,x=function(y){h(function(O){return O.stripe?O:{stripe:y,elements:y.elements(n)}})};return o.tag==="async"&&!s.stripe?o.stripePromise.then(function(b){b&&p&&x(b)}):o.tag==="sync"&&!s.stripe&&x(o.stripe),function(){p=!1}},[o,s,n]);var v=$(t);u.useEffect(function(){v!==null&&v!==t&&console.warn("Unsupported prop change on Elements: You cannot change the `stripe` prop after setting it.")},[v,t]);var E=$(n);return u.useEffect(function(){if(s.elements){var p=ce(n,E,["clientSecret","fonts"]);p&&s.elements.update(p)}},[n,E,s.elements]),u.useEffect(function(){Ye(s.stripe)},[s.stripe]),u.createElement(B.Provider,{value:s},a)};pe.propTypes={stripe:l.any,options:l.object};var Ke=function(e){var t=u.useContext(B);return le(t,e)},Ge=function(){var e=Ke("calls useElements()"),t=e.elements;return t};l.func.isRequired;var fe=u.createContext(null);fe.displayName="CheckoutSdkContext";var He=function(e,t){if(!e)throw new Error("Could not find CheckoutProvider context; You need to wrap the part of your app that ".concat(t," in an <CheckoutProvider> provider."));return e},Xe=u.createContext(null);Xe.displayName="CheckoutContext";l.any,l.shape({fetchClientSecret:l.func.isRequired,elementsOptions:l.object}).isRequired;var z=function(e){var t=u.useContext(fe),n=u.useContext(B);if(t&&n)throw new Error("You cannot wrap the part of your app that ".concat(e," in both <CheckoutProvider> and <Elements> providers."));return t?He(t,e):le(n,e)},Qe=["mode"],Ze=function(e){return e.charAt(0).toUpperCase()+e.slice(1)},d=function(e,t){var n="".concat(Ze(e),"Element"),a=function(s){var h=s.id,v=s.className,E=s.options,p=E===void 0?{}:E,x=s.onBlur,b=s.onFocus,y=s.onReady,O=s.onChange,A=s.onEscape,ge=s.onClick,Se=s.onLoadError,Ce=s.onLoaderStart,Ee=s.onNetworksChange,be=s.onConfirm,xe=s.onCancel,Pe=s.onShippingAddressChange,je=s.onShippingRateChange,ke=s.onSavedPaymentMethodRemove,_e=s.onSavedPaymentMethodUpdate,T=z("mounts <".concat(n,">")),N="elements"in T?T.elements:null,P="checkoutSdk"in T?T.checkoutSdk:null,we=u.useState(null),J=ie(we,2),g=J[0],Oe=J[1],j=u.useRef(null),F=u.useRef(null);C(g,"blur",x),C(g,"focus",b),C(g,"escape",A),C(g,"click",ge),C(g,"loaderror",Se),C(g,"loaderstart",Ce),C(g,"networkschange",Ee),C(g,"confirm",be),C(g,"cancel",xe),C(g,"shippingaddresschange",Pe),C(g,"shippingratechange",je),C(g,"savedpaymentmethodremove",ke),C(g,"savedpaymentmethodupdate",_e),C(g,"change",O);var D;y&&(e==="expressCheckout"?D=y:D=function(){y(g)}),C(g,"ready",D),u.useLayoutEffect(function(){if(j.current===null&&F.current!==null&&(N||P)){var S=null;if(P)switch(e){case"payment":S=P.createPaymentElement(p);break;case"address":if("mode"in p){var K=p.mode,G=We(p,Qe);if(K==="shipping")S=P.createShippingAddressElement(G);else if(K==="billing")S=P.createBillingAddressElement(G);else throw new Error("Invalid options.mode. mode must be 'billing' or 'shipping'.")}else throw new Error("You must supply options.mode. mode must be 'billing' or 'shipping'.");break;case"expressCheckout":S=P.createExpressCheckoutElement(p);break;case"currencySelector":S=P.createCurrencySelectorElement();break;case"taxId":S=P.createTaxIdElement(p);break;default:throw new Error("Invalid Element type ".concat(n,". You must use either the <PaymentElement />, <AddressElement options={{mode: 'shipping'}} />, <AddressElement options={{mode: 'billing'}} />, or <ExpressCheckoutElement />."))}else N&&(S=N.create(e,p));j.current=S,Oe(S),S&&S.mount(F.current)}},[N,P,p]);var Y=$(p);return u.useEffect(function(){if(j.current){var S=ce(p,Y,["paymentRequest"]);S&&"update"in j.current&&j.current.update(S)}},[p,Y]),u.useLayoutEffect(function(){return function(){if(j.current&&typeof j.current.destroy=="function")try{j.current.destroy(),j.current=null}catch{}}},[]),u.createElement("div",{id:h,className:v,ref:F})},o=function(s){z("mounts <".concat(n,">"));var h=s.id,v=s.className;return u.createElement("div",{id:h,className:v})},i=t?o:a;return i.propTypes={id:l.string,className:l.string,onChange:l.func,onBlur:l.func,onFocus:l.func,onReady:l.func,onEscape:l.func,onClick:l.func,onLoadError:l.func,onLoaderStart:l.func,onNetworksChange:l.func,onConfirm:l.func,onCancel:l.func,onShippingAddressChange:l.func,onShippingRateChange:l.func,onSavedPaymentMethodRemove:l.func,onSavedPaymentMethodUpdate:l.func,options:l.object},i.displayName=n,i.__elementType=e,i},m=typeof window>"u",et=u.createContext(null);et.displayName="EmbeddedCheckoutProviderContext";var tt=function(){var e=z("calls useStripe()"),t=e.stripe;return t};d("auBankAccount",m);d("card",m);d("cardNumber",m);d("cardExpiry",m);d("cardCvc",m);d("fpxBank",m);d("iban",m);d("idealBank",m);d("p24Bank",m);d("epsBank",m);var rt=d("payment",m);d("expressCheckout",m);d("currencySelector",m);d("paymentRequestButton",m);d("linkAuthentication",m);d("address",m);d("shippingAddress",m);d("paymentMethodMessaging",m);d("affirmMessage",m);d("afterpayClearpayMessage",m);d("taxId",m);var de="basil",nt=function(e){return e===3?"v3":e},me="https://js.stripe.com",ot="".concat(me,"/").concat(de,"/stripe.js"),at=/^https:\/\/js\.stripe\.com\/v3\/?(\?.*)?$/,st=/^https:\/\/js\.stripe\.com\/(v3|[a-z]+)\/stripe\.js(\?.*)?$/;var it=function(e){return at.test(e)||st.test(e)},ct=function(){for(var e=document.querySelectorAll('script[src^="'.concat(me,'"]')),t=0;t<e.length;t++){var n=e[t];if(it(n.src))return n}return null},re=function(e){var t="",n=document.createElement("script");n.src="".concat(ot).concat(t);var a=document.head||document.body;if(!a)throw new Error("Expected document.body not to be null. Stripe.js requires a <body> element.");return a.appendChild(n),n},ut=function(e,t){!e||!e._registerWrapper||e._registerWrapper({name:"stripe-js",version:"7.9.0",startTime:t})},R=null,L=null,M=null,lt=function(e){return function(t){e(new Error("Failed to load Stripe.js",{cause:t}))}},pt=function(e,t){return function(){window.Stripe?e(window.Stripe):t(new Error("Stripe.js not available"))}},ft=function(e){return R!==null?R:(R=new Promise(function(t,n){if(typeof window>"u"||typeof document>"u"){t(null);return}if(window.Stripe){t(window.Stripe);return}try{var a=ct();if(!(a&&e)){if(!a)a=re(e);else if(a&&M!==null&&L!==null){var o;a.removeEventListener("load",M),a.removeEventListener("error",L),(o=a.parentNode)===null||o===void 0||o.removeChild(a),a=re(e)}}M=pt(t,n),L=lt(n),a.addEventListener("load",M),a.addEventListener("error",L)}catch(i){n(i);return}}),R.catch(function(t){return R=null,Promise.reject(t)}))},dt=function(e,t,n){if(e===null)return null;var a=t[0],o=a.match(/^pk_test/),i=nt(e.version),c=de;o&&i!==c&&console.warn("Stripe.js@".concat(i," was loaded on the page, but @stripe/stripe-js@").concat("7.9.0"," expected Stripe.js@").concat(c,". This may result in unexpected behavior. For more information, see https://docs.stripe.com/sdks/stripejs-versioning"));var s=e.apply(void 0,t);return ut(s,n),s},I,ve=!1,he=function(){return I||(I=ft(null).catch(function(e){return I=null,Promise.reject(e)}),I)};Promise.resolve().then(function(){return he()}).catch(function(r){ve||console.warn(r)});var mt=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];ve=!0;var a=Date.now();return he().then(function(o){return dt(o,t,a)})};const vt=({onStripeReady:r,checkoutProducts:e,totalAmount:t})=>{const n=tt(),a=Ge(),{setStripeComplete:o,setStripeLoading:i,onPaymentInfoComplete:c}=q(),[s,h]=k.useState(!1);return k.useEffect(()=>{n&&a&&r(n,a)},[n,a,r]),f.jsx(rt,{onLoaderStart:()=>{_("stripe_form_loader_start")},onReady:()=>{i(!1),_("stripe_form_loaded",{success:!0})},onLoadError:v=>{var E;console.error("Payment element load error:",v),i(!1),_("stripe_form_loaded",{success:!1,error:((E=v.error)==null?void 0:E.message)||"Unknown error"})},onChange:({complete:v})=>{o(v),v&&!s&&c&&(h(!0),c(e,t))}})},ye=()=>{var x;const{stripeState:r,clickarooInfoMap:e,offerPricePoints:t,setStripe:n,setStripeElements:a}=q(),o=t[0]?e[t[0]]:null,{checkoutProducts:i,totalAmount:c}=Ie(),s=k.useCallback((b,y)=>{b&&n(b),y&&a(y)},[n,a]),[h]=k.useState(()=>{if(!o)return null;const b=mt(o.payment.data.publishable_key,{stripeAccount:o.payment.data.account_id});return b.then(y=>{y&&_("stripe_sdk_loaded",{success:!0})}).catch(y=>{_("stripe_sdk_loaded",{success:!1,error:(y==null?void 0:y.message)||"Failed to load Stripe SDK"})}),b});if(!o||t.length===0||!h)return f.jsx("div",{className:"flex items-center justify-center h-20",children:f.jsx(W,{})});const v=o.type==="one_off"?"payment":"subscription",E=(x=i[0])==null?void 0:x.currency.toLowerCase(),p=c<=0;return k.useEffect(()=>{p&&_("stripe_form_loaded",{success:!1,error:"Invalid payment amount",totalAmount:c})},[p,c]),p?f.jsx("div",{className:"flex items-center justify-center h-20",children:f.jsx("div",{className:"text-[#df1b41]",children:"Invalid payment amount"})}):f.jsxs("div",{className:"relative",children:[r.isLoading&&f.jsx("div",{className:"absolute inset-0 flex items-center justify-center z-10",children:f.jsx(W,{})}),f.jsx(pe,{stripe:h,options:{mode:v,currency:E,amount:c,payment_method_types:["card"],locale:"en",appearance:{theme:"stripe",variables:{colorPrimary:"#8AA3D4"}}},children:f.jsx(vt,{onStripeReady:s,checkoutProducts:i,totalAmount:c})})]})};ye.__docgenInfo={description:"",methods:[],displayName:"StripePayment"};const ht=({showText:r=!0})=>{const{clickarooInfoMap:e,offerPricePoints:t}=q(),n=t.length>0&&Object.keys(e).length>0&&t.every(a=>e[a]);return f.jsxs("div",{className:"w-full",children:[r&&f.jsxs(f.Fragment,{children:[f.jsx("div",{className:"text-lg md:text-2xl mb-2 font-medium",children:"Payment Methods"}),f.jsx("div",{className:"text-grey text-md mb-5",children:"All transactions are secure encrypted."})]}),n?f.jsx("div",{id:"stripe-payment-element",className:"relative min-h-8",children:f.jsx(ye,{})}):f.jsx("div",{className:"relative flex items-center justify-center h-20",children:f.jsx(W,{})})]})};ht.__docgenInfo={description:"",methods:[],displayName:"PaymentMethods",props:{showText:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}}}};export{ht as P,Ie as u};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-DiklIkkE.js";import{P as p}from"./PaymentMethods-Buladk2O.js";import{C as u,S as d,c as l,D as h}from"./useCheckoutContext-3YTrU8Qh.js";import"./index-DRjF_FHU.js";l(h);const x=[{sku:"TEST001",offerPricePoint:d.SINGLE}],y={component:p,title:"Components/PaymentMethods",parameters:{docs:{description:{component:"Payment method selection component with Stripe integration. Requires CheckoutProvider wrapper."}}},decorators:[m=>r.jsx(u,{cart:x,children:r.jsx(m,{})})],argTypes:{showText:{description:"Whether to display the title and description text",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showText:!0}},t={args:{showText:!1}};var o,s,a;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
showText: true
|
|
4
|
+
}
|
|
5
|
+
}`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,c,i;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{
|
|
6
|
+
args: {
|
|
7
|
+
showText: false
|
|
8
|
+
}
|
|
9
|
+
}`,...(i=(c=t.parameters)==null?void 0:c.docs)==null?void 0:i.source}}};const S=["Default","WithoutText"];export{e as Default,t as WithoutText,S as __namedExportsOrder,y as default};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-DiklIkkE.js";import{P as p}from"./PaymentMethods-e9HqQtxN.js";import{C as u,S as d,c as l,D as h}from"./useCheckoutContext-DuJ1Ep0-.js";import"./index-DRjF_FHU.js";l(h);const x=[{sku:"TEST001",offerPricePoint:d.SINGLE}],y={component:p,title:"Components/PaymentMethods",parameters:{docs:{description:{component:"Payment method selection component with Stripe integration. Requires CheckoutProvider wrapper."}}},decorators:[m=>r.jsx(u,{cart:x,children:r.jsx(m,{})})],argTypes:{showText:{description:"Whether to display the title and description text",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showText:!0}},t={args:{showText:!1}};var o,s,a;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
showText: true
|
|
4
|
+
}
|
|
5
|
+
}`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,c,i;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{
|
|
6
|
+
args: {
|
|
7
|
+
showText: false
|
|
8
|
+
}
|
|
9
|
+
}`,...(i=(c=t.parameters)==null?void 0:c.docs)==null?void 0:i.source}}};const S=["Default","WithoutText"];export{e as Default,t as WithoutText,S as __namedExportsOrder,y as default};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-DiklIkkE.js";import{P as p}from"./PaymentMethods-BFtlMopq.js";import{C as u,S as d,c as l,D as h}from"./useCheckoutContext-C7KjDyWW.js";import"./index-DRjF_FHU.js";l(h);const x=[{sku:"TEST001",offerPricePoint:d.SINGLE}],y={component:p,title:"Components/PaymentMethods",parameters:{docs:{description:{component:"Payment method selection component with Stripe integration. Requires CheckoutProvider wrapper."}}},decorators:[m=>r.jsx(u,{cart:x,children:r.jsx(m,{})})],argTypes:{showText:{description:"Whether to display the title and description text",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showText:!0}},t={args:{showText:!1}};var o,s,a;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
showText: true
|
|
4
|
+
}
|
|
5
|
+
}`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,c,i;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{
|
|
6
|
+
args: {
|
|
7
|
+
showText: false
|
|
8
|
+
}
|
|
9
|
+
}`,...(i=(c=t.parameters)==null?void 0:c.docs)==null?void 0:i.source}}};const S=["Default","WithoutText"];export{e as Default,t as WithoutText,S as __namedExportsOrder,y as default};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-DiklIkkE.js";import{P as p}from"./PaymentMethods-BnPZRrAs.js";import{C as u,S as d,c as l,D as h}from"./useCheckoutContext-C6u4Rp5U.js";import"./index-DRjF_FHU.js";l(h);const x=[{sku:"TEST001",offerPricePoint:d.SINGLE}],y={component:p,title:"Components/PaymentMethods",parameters:{docs:{description:{component:"Payment method selection component with Stripe integration. Requires CheckoutProvider wrapper."}}},decorators:[m=>r.jsx(u,{cart:x,children:r.jsx(m,{})})],argTypes:{showText:{description:"Whether to display the title and description text",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showText:!0}},t={args:{showText:!1}};var o,s,a;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
showText: true
|
|
4
|
+
}
|
|
5
|
+
}`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,c,i;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{
|
|
6
|
+
args: {
|
|
7
|
+
showText: false
|
|
8
|
+
}
|
|
9
|
+
}`,...(i=(c=t.parameters)==null?void 0:c.docs)==null?void 0:i.source}}};const S=["Default","WithoutText"];export{e as Default,t as WithoutText,S as __namedExportsOrder,y as default};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-DiklIkkE.js";import{P as p}from"./PaymentMethods-afz1CTO5.js";import{C as u,S as d,c as l,D as h}from"./useCheckoutContext-BXtGY5u3.js";import"./index-DRjF_FHU.js";l(h);const x=[{sku:"TEST001",offerPricePoint:d.SINGLE}],y={component:p,title:"Components/PaymentMethods",parameters:{docs:{description:{component:"Payment method selection component with Stripe integration. Requires CheckoutProvider wrapper."}}},decorators:[m=>r.jsx(u,{cart:x,children:r.jsx(m,{})})],argTypes:{showText:{description:"Whether to display the title and description text",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showText:!0}},t={args:{showText:!1}};var o,s,a;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
showText: true
|
|
4
|
+
}
|
|
5
|
+
}`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,c,i;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{
|
|
6
|
+
args: {
|
|
7
|
+
showText: false
|
|
8
|
+
}
|
|
9
|
+
}`,...(i=(c=t.parameters)==null?void 0:c.docs)==null?void 0:i.source}}};const S=["Default","WithoutText"];export{e as Default,t as WithoutText,S as __namedExportsOrder,y as default};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-DiklIkkE.js";import{P as p}from"./PaymentMethods-CBXk2f9N.js";import{C as u,S as d,c as l,D as h}from"./useCheckoutContext-L3zhltsm.js";import"./index-DRjF_FHU.js";l(h);const x=[{sku:"TEST001",offerPricePoint:d.SINGLE}],y={component:p,title:"Components/PaymentMethods",parameters:{docs:{description:{component:"Payment method selection component with Stripe integration. Requires CheckoutProvider wrapper."}}},decorators:[m=>r.jsx(u,{cart:x,children:r.jsx(m,{})})],argTypes:{showText:{description:"Whether to display the title and description text",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showText:!0}},t={args:{showText:!1}};var o,s,a;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
showText: true
|
|
4
|
+
}
|
|
5
|
+
}`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,c,i;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{
|
|
6
|
+
args: {
|
|
7
|
+
showText: false
|
|
8
|
+
}
|
|
9
|
+
}`,...(i=(c=t.parameters)==null?void 0:c.docs)==null?void 0:i.source}}};const S=["Default","WithoutText"];export{e as Default,t as WithoutText,S as __namedExportsOrder,y as default};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-DiklIkkE.js";import{P as p}from"./PaymentMethods-DxorWSOl.js";import{C as u,S as d,c as l,D as h}from"./useCheckoutContext-CroxIBFh.js";import"./index-DRjF_FHU.js";l(h);const x=[{sku:"TEST001",offerPricePoint:d.SINGLE}],y={component:p,title:"Components/PaymentMethods",parameters:{docs:{description:{component:"Payment method selection component with Stripe integration. Requires CheckoutProvider wrapper."}}},decorators:[m=>r.jsx(u,{cart:x,children:r.jsx(m,{})})],argTypes:{showText:{description:"Whether to display the title and description text",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showText:!0}},t={args:{showText:!1}};var o,s,a;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
showText: true
|
|
4
|
+
}
|
|
5
|
+
}`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,c,i;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{
|
|
6
|
+
args: {
|
|
7
|
+
showText: false
|
|
8
|
+
}
|
|
9
|
+
}`,...(i=(c=t.parameters)==null?void 0:c.docs)==null?void 0:i.source}}};const S=["Default","WithoutText"];export{e as Default,t as WithoutText,S as __namedExportsOrder,y as default};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-DiklIkkE.js";import{P as p}from"./PaymentMethods-DmV3o0ow.js";import{C as u,S as d,c as l,D as h}from"./useCheckoutContext-BW2h13W8.js";import"./index-DRjF_FHU.js";l(h);const x=[{sku:"TEST001",offerPricePoint:d.SINGLE}],y={component:p,title:"Components/PaymentMethods",parameters:{docs:{description:{component:"Payment method selection component with Stripe integration. Requires CheckoutProvider wrapper."}}},decorators:[m=>r.jsx(u,{cart:x,children:r.jsx(m,{})})],argTypes:{showText:{description:"Whether to display the title and description text",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showText:!0}},t={args:{showText:!1}};var o,s,a;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
showText: true
|
|
4
|
+
}
|
|
5
|
+
}`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,c,i;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{
|
|
6
|
+
args: {
|
|
7
|
+
showText: false
|
|
8
|
+
}
|
|
9
|
+
}`,...(i=(c=t.parameters)==null?void 0:c.docs)==null?void 0:i.source}}};const S=["Default","WithoutText"];export{e as Default,t as WithoutText,S as __namedExportsOrder,y as default};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{j as r}from"./jsx-runtime-DiklIkkE.js";import{P as p}from"./PaymentMethods-BNEEARzu.js";import{C as u,S as d,c as l,D as h}from"./useCheckoutContext-B8tsk5b5.js";import"./index-DRjF_FHU.js";l(h);const x=[{sku:"TEST001",offerPricePoint:d.SINGLE}],y={component:p,title:"Components/PaymentMethods",parameters:{docs:{description:{component:"Payment method selection component with Stripe integration. Requires CheckoutProvider wrapper."}}},decorators:[m=>r.jsx(u,{cart:x,children:r.jsx(m,{})})],argTypes:{showText:{description:"Whether to display the title and description text",control:"boolean",table:{type:{summary:"boolean"},defaultValue:{summary:"true"}}}}},e={args:{showText:!0}},t={args:{showText:!1}};var o,s,a;e.parameters={...e.parameters,docs:{...(o=e.parameters)==null?void 0:o.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
showText: true
|
|
4
|
+
}
|
|
5
|
+
}`,...(a=(s=e.parameters)==null?void 0:s.docs)==null?void 0:a.source}}};var n,c,i;t.parameters={...t.parameters,docs:{...(n=t.parameters)==null?void 0:n.docs,source:{originalSource:`{
|
|
6
|
+
args: {
|
|
7
|
+
showText: false
|
|
8
|
+
}
|
|
9
|
+
}`,...(i=(c=t.parameters)==null?void 0:c.docs)==null?void 0:i.source}}};const S=["Default","WithoutText"];export{e as Default,t as WithoutText,S as __namedExportsOrder,y as default};
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import{j as e}from"./jsx-runtime-DiklIkkE.js";import{useMDXComponents as t}from"./index-ChEI-nsM.js";import{M as i,C as s}from"./index-D66ljFJA.js";import{D as c}from"./CheckoutPage.stories-DvaZetee.js";import"./index-DRjF_FHU.js";import"./iframe-CakT_Hx-.js";import"./index-B7ki2Uzk.js";import"./index-D-Mha1DF.js";import"./index-DrFu-skq.js";import"./useCheckoutContext-C7KjDyWW.js";import"./CheckoutPage-CDW7SRyI.js";import"./CustomerInfo-CPNuEjrH.js";import"./ValidateInput-BKNagaQv.js";import"./DeliveryAddress-CeuByf4d.js";import"./PaymentMethods-BFtlMopq.js";function r(o){const n={a:"a",blockquote:"blockquote",code:"code",h1:"h1",h3:"h3",h4:"h4",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",ul:"ul",...t(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Documentation/QuickStart"}),`
|
|
2
|
+
`,e.jsx(n.h1,{id:"overview",children:"Overview"}),`
|
|
3
|
+
`,e.jsxs(n.p,{children:["This component library is designed for the ",e.jsx(n.strong,{children:"checkout page"})," in your e-commerce flow. Here's how it fits into a typical purchase journey:"]}),`
|
|
4
|
+
`,e.jsxs(n.ol,{children:[`
|
|
5
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Product/Landing Page"}),": Users browse products on your product or landing page. You should provide a button or link that navigates users to the checkout page when they're ready to purchase."]}),`
|
|
6
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Checkout Page"}),": This is where you integrate this component library. Users can submit their purchase information here."]}),`
|
|
7
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Finish Page"}),": After successful payment, redirect users to a finish page to confirm their order completion."]}),`
|
|
8
|
+
`]}),`
|
|
9
|
+
`,e.jsx(n.h1,{id:"quick-start",children:"Quick Start"}),`
|
|
10
|
+
`,e.jsx(n.p,{children:"The checkout component handles the entire checkout process including customer information collection, delivery address management, and payment processing."}),`
|
|
11
|
+
`,e.jsx(n.p,{children:"In this guide, you will learn how to quickly integrate the checkout components into your React application. For more detailed information and advanced usage, check out the Guide section."}),`
|
|
12
|
+
`,e.jsx(n.h3,{id:"installation",children:"Installation"}),`
|
|
13
|
+
`,e.jsx(n.p,{children:"Install using your preferred package manager:"}),`
|
|
14
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-bash",children:`# pnpm (recommended)
|
|
15
|
+
pnpm add @clickaroo/checkout-ui
|
|
16
|
+
|
|
17
|
+
# or npm
|
|
18
|
+
npm install @clickaroo/checkout-ui
|
|
19
|
+
|
|
20
|
+
# or yarn
|
|
21
|
+
yarn add @clickaroo/checkout-ui
|
|
22
|
+
`})}),`
|
|
23
|
+
`,e.jsx(n.h4,{id:"peer-dependencies",children:"Peer Dependencies"}),`
|
|
24
|
+
`,e.jsxs(n.p,{children:["This library requires ",e.jsx(n.code,{children:"react"})," (>= 16.8.0) as peer dependencies."]}),`
|
|
25
|
+
`,e.jsxs(n.ul,{children:[`
|
|
26
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"npm 7+"}),": Will automatically install them"]}),`
|
|
27
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"npm 6 / pnpm"}),": You may need to install them manually if you see warnings"]}),`
|
|
28
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"yarn v2+"}),": Will error if they are missing"]}),`
|
|
29
|
+
`]}),`
|
|
30
|
+
`,e.jsx(n.p,{children:"Most React projects already have these installed, so you typically don't need to do anything extra."}),`
|
|
31
|
+
`,e.jsx(n.h3,{id:"token-parameter",children:"Token Parameter"}),`
|
|
32
|
+
`,e.jsxs(n.p,{children:["The component library requires a ",e.jsx(n.code,{children:"clro_token"})," parameter to identify the checkout session. This token should be provided in the URL query parameter when users navigate to the checkout page:"]}),`
|
|
33
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{children:`https://your-checkout-page.com?clro_token=YOUR_TOKEN_HERE
|
|
34
|
+
`})}),`
|
|
35
|
+
`,e.jsx(n.p,{children:"The token will be automatically extracted from the URL and stored in localStorage for subsequent requests."}),`
|
|
36
|
+
`,e.jsx(n.h3,{id:"use-checkout-all-in-one",children:"Use Checkout All in One"}),`
|
|
37
|
+
`,e.jsxs(n.p,{children:["The simplest way is to use the ",e.jsx(n.code,{children:"CheckoutPage"})," component directly, which includes the complete checkout flow."]}),`
|
|
38
|
+
`,e.jsx(s,{of:c}),`
|
|
39
|
+
`,e.jsxs(n.blockquote,{children:[`
|
|
40
|
+
`,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Note"}),": If you need Google address suggestions for the address field, you must provide a ",e.jsx(n.code,{children:"googleApiKey"})," that meets the ",e.jsx(n.a,{href:"https://developers.google.com/maps/documentation/places/web-service/get-api-key?hl=en&setupProd=prerequisites",rel:"nofollow",children:"google places api requirements"}),"."]}),`
|
|
41
|
+
`]}),`
|
|
42
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { CheckoutPage } from '@clickaroo/checkout-ui';
|
|
43
|
+
|
|
44
|
+
function MyCheckout() {
|
|
45
|
+
const cart = [
|
|
46
|
+
{
|
|
47
|
+
sku: "TEST001",
|
|
48
|
+
offerPricePoint: "OPP-TEST001",
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
sku: "TEST002",
|
|
52
|
+
offerPricePoint: "OPP-TEST002",
|
|
53
|
+
},
|
|
54
|
+
];
|
|
55
|
+
|
|
56
|
+
return <CheckoutPage cart={cart} googleApiKey={YOUR_GOOGLE_API_KEY} />;
|
|
57
|
+
}
|
|
58
|
+
`})}),`
|
|
59
|
+
`,e.jsxs(n.blockquote,{children:[`
|
|
60
|
+
`,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Tips"}),`:
|
|
61
|
+
Each object in the `,e.jsx(n.code,{children:"cart"})," array only needs to contain the two required fields: ",e.jsx(n.code,{children:"sku"})," and ",e.jsx(n.code,{children:"offerPricePoint"}),". However, you can also pass other optional product information fields (such as ",e.jsx(n.code,{children:"title"}),", ",e.jsx(n.code,{children:"price"}),", ",e.jsx(n.code,{children:"image"}),", etc.), which will be saved to the order's metadata."]}),`
|
|
62
|
+
`]}),`
|
|
63
|
+
`,e.jsxs(n.p,{children:["You can read more about all the possible configuration options in ",e.jsx(n.a,{href:"./?path=/docs/components-checkoutpage--checkoutpage-english",children:"CheckoutPage Documentation"}),"."]}),`
|
|
64
|
+
`,e.jsx(n.h3,{id:"event-callbacks",children:"Event Callbacks"}),`
|
|
65
|
+
`,e.jsxs(n.p,{children:["The ",e.jsx(n.code,{children:"CheckoutPage"})," component provides several event callbacks that allow you to monitor and respond to different stages of the checkout process. These callbacks enable you to track user behavior, handle loading states, and implement custom logic."]}),`
|
|
66
|
+
`,e.jsx(n.p,{children:"Here's a complete example that includes all event callbacks:"}),`
|
|
67
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { CheckoutPage } from '@clickaroo/checkout-ui';
|
|
68
|
+
import { useNavigate } from 'react-router-dom'; // or your routing library
|
|
69
|
+
|
|
70
|
+
function MyCheckout() {
|
|
71
|
+
const navigate = useNavigate();
|
|
72
|
+
|
|
73
|
+
const cart = [
|
|
74
|
+
{
|
|
75
|
+
sku: "TEST001",
|
|
76
|
+
offerPricePoint: "OPP-TEST001",
|
|
77
|
+
title: "Product 1",
|
|
78
|
+
price: 99.99,
|
|
79
|
+
},
|
|
80
|
+
];
|
|
81
|
+
|
|
82
|
+
return (
|
|
83
|
+
<CheckoutPage
|
|
84
|
+
cart={cart}
|
|
85
|
+
googleApiKey={YOUR_GOOGLE_API_KEY}
|
|
86
|
+
onCheckoutInit={() => {
|
|
87
|
+
console.log('Checkout initialized');
|
|
88
|
+
}}
|
|
89
|
+
onPaymentInfoComplete={(cart, totalAmount) => {
|
|
90
|
+
console.log('Payment info complete');
|
|
91
|
+
}}
|
|
92
|
+
onOrderSubmit={(cart, totalAmount) => {
|
|
93
|
+
console.log('Order submitted');
|
|
94
|
+
}}
|
|
95
|
+
onOrderSuccess={(orderCode, tradeCode) => {
|
|
96
|
+
console.log('Order successful:', orderCode);
|
|
97
|
+
// Redirect to finish page
|
|
98
|
+
navigate(\`/finish/\${orderCode}\`);
|
|
99
|
+
}}
|
|
100
|
+
/>
|
|
101
|
+
);
|
|
102
|
+
}
|
|
103
|
+
`})}),`
|
|
104
|
+
`,e.jsx(n.p,{children:e.jsx(n.strong,{children:"Key Points:"})}),`
|
|
105
|
+
`,e.jsxs(n.ul,{children:[`
|
|
106
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onCheckoutInit"}),": Triggered when the checkout page loads"]}),`
|
|
107
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onPaymentInfoComplete"}),": Triggered when the payment form is valid"]}),`
|
|
108
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onOrderSubmit"}),": Triggered when user clicks submit"]}),`
|
|
109
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onOrderSuccess"}),": Triggered when order is successfully created"]}),`
|
|
110
|
+
`]}),`
|
|
111
|
+
`,e.jsx(n.h3,{id:"display-order-details-on-finish-page",children:"Display Order Details on Finish Page"}),`
|
|
112
|
+
`,e.jsxs(n.p,{children:["After the user successfully completes the payment and is redirected to the finish page, you can use the ",e.jsx(n.code,{children:"useOrderDetail"})," hook to display order information:"]}),`
|
|
113
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { useOrderDetail } from '@clickaroo/checkout-ui';
|
|
114
|
+
import { useParams } from 'react-router-dom';
|
|
115
|
+
|
|
116
|
+
function OrderCompletePage() {
|
|
117
|
+
const { orderCode } = useParams();
|
|
118
|
+
const { orderDetail, loading, error } = useOrderDetail(orderCode || '');
|
|
119
|
+
|
|
120
|
+
if (loading) return <div>Loading order details...</div>;
|
|
121
|
+
if (error) return <div>Error: {error}</div>;
|
|
122
|
+
if (!orderDetail) return <div>Order not found</div>;
|
|
123
|
+
|
|
124
|
+
return (
|
|
125
|
+
<div>
|
|
126
|
+
<h1>Order Complete!</h1>
|
|
127
|
+
<p>Order Code: {orderDetail.order_code}</p>
|
|
128
|
+
<p>Customer Information: {orderDetail.customer.email} {orderDetail.customer.phone}</p>
|
|
129
|
+
<p>Total: {orderDetail.total_amount}</p>
|
|
130
|
+
<p>Product Detail: {orderDetail.metadata}</p>
|
|
131
|
+
{/* Display more order details as needed */}
|
|
132
|
+
</div>
|
|
133
|
+
);
|
|
134
|
+
}
|
|
135
|
+
`})}),`
|
|
136
|
+
`,e.jsxs(n.p,{children:["For more advanced usage, check out the ",e.jsx(n.a,{href:"./?path=/docs/documentation-apis--docs",children:"APIs documentation"}),"."]})]})}function b(o={}){const{wrapper:n}={...t(),...o.components};return n?e.jsx(n,{...o,children:e.jsx(r,{...o})}):r(o)}export{b as default};
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import{j as e}from"./jsx-runtime-DiklIkkE.js";import{useMDXComponents as t}from"./index-ChEI-nsM.js";import{M as i,C as s}from"./index-CkNSuRJg.js";import{D as c}from"./CheckoutPage.stories-DAo0u2QI.js";import"./index-DRjF_FHU.js";import"./iframe-DsSsblW_.js";import"./index-B7ki2Uzk.js";import"./index-D-Mha1DF.js";import"./index-DrFu-skq.js";import"./useCheckoutContext-C6u4Rp5U.js";import"./CheckoutPage-DYMMhAMX.js";import"./CustomerInfo-Cp0u57C5.js";import"./ValidateInput-sZgX3GCF.js";import"./DeliveryAddress-CD42v0od.js";import"./PaymentMethods-BnPZRrAs.js";function r(o){const n={a:"a",blockquote:"blockquote",code:"code",h1:"h1",h3:"h3",h4:"h4",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",ul:"ul",...t(),...o.components};return e.jsxs(e.Fragment,{children:[e.jsx(i,{title:"Documentation/QuickStart"}),`
|
|
2
|
+
`,e.jsx(n.h1,{id:"overview",children:"Overview"}),`
|
|
3
|
+
`,e.jsxs(n.p,{children:["This component library is designed for the ",e.jsx(n.strong,{children:"checkout page"})," in your e-commerce flow. Here's how it fits into a typical purchase journey:"]}),`
|
|
4
|
+
`,e.jsxs(n.ol,{children:[`
|
|
5
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Product/Landing Page"}),": Users browse products on your product or landing page. You should provide a button or link that navigates users to the checkout page when they're ready to purchase."]}),`
|
|
6
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Checkout Page"}),": This is where you integrate this component library. Users can submit their purchase information here."]}),`
|
|
7
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"Finish Page"}),": After successful payment, redirect users to a finish page to confirm their order completion."]}),`
|
|
8
|
+
`]}),`
|
|
9
|
+
`,e.jsx(n.h1,{id:"quick-start",children:"Quick Start"}),`
|
|
10
|
+
`,e.jsx(n.p,{children:"The checkout component handles the entire checkout process including customer information collection, delivery address management, and payment processing."}),`
|
|
11
|
+
`,e.jsx(n.p,{children:"In this guide, you will learn how to quickly integrate the checkout components into your React application. For more detailed information and advanced usage, check out the Guide section."}),`
|
|
12
|
+
`,e.jsx(n.h3,{id:"installation",children:"Installation"}),`
|
|
13
|
+
`,e.jsx(n.p,{children:"Install using your preferred package manager:"}),`
|
|
14
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-bash",children:`# pnpm (recommended)
|
|
15
|
+
pnpm add @clickaroo/checkout-ui
|
|
16
|
+
|
|
17
|
+
# or npm
|
|
18
|
+
npm install @clickaroo/checkout-ui
|
|
19
|
+
|
|
20
|
+
# or yarn
|
|
21
|
+
yarn add @clickaroo/checkout-ui
|
|
22
|
+
`})}),`
|
|
23
|
+
`,e.jsx(n.h4,{id:"peer-dependencies",children:"Peer Dependencies"}),`
|
|
24
|
+
`,e.jsxs(n.p,{children:["This library requires ",e.jsx(n.code,{children:"react"})," (>= 16.8.0) as peer dependencies."]}),`
|
|
25
|
+
`,e.jsxs(n.ul,{children:[`
|
|
26
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"npm 7+"}),": Will automatically install them"]}),`
|
|
27
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"npm 6 / pnpm"}),": You may need to install them manually if you see warnings"]}),`
|
|
28
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.strong,{children:"yarn v2+"}),": Will error if they are missing"]}),`
|
|
29
|
+
`]}),`
|
|
30
|
+
`,e.jsx(n.p,{children:"Most React projects already have these installed, so you typically don't need to do anything extra."}),`
|
|
31
|
+
`,e.jsx(n.h3,{id:"token-parameter",children:"Token Parameter"}),`
|
|
32
|
+
`,e.jsxs(n.p,{children:["The component library requires a ",e.jsx(n.code,{children:"clro_token"})," parameter to identify the checkout session. This token should be provided in the URL query parameter when users navigate to the checkout page:"]}),`
|
|
33
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{children:`https://your-checkout-page.com?clro_token=YOUR_TOKEN_HERE
|
|
34
|
+
`})}),`
|
|
35
|
+
`,e.jsx(n.p,{children:"The token will be automatically extracted from the URL and stored in localStorage for subsequent requests."}),`
|
|
36
|
+
`,e.jsx(n.h3,{id:"use-checkout-all-in-one",children:"Use Checkout All in One"}),`
|
|
37
|
+
`,e.jsxs(n.p,{children:["The simplest way is to use the ",e.jsx(n.code,{children:"CheckoutPage"})," component directly, which includes the complete checkout flow."]}),`
|
|
38
|
+
`,e.jsx(s,{of:c}),`
|
|
39
|
+
`,e.jsxs(n.blockquote,{children:[`
|
|
40
|
+
`,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Note"}),": If you need Google address suggestions for the address field, you must provide a ",e.jsx(n.code,{children:"googleApiKey"})," that meets the ",e.jsx(n.a,{href:"https://developers.google.com/maps/documentation/places/web-service/get-api-key?hl=en&setupProd=prerequisites",rel:"nofollow",children:"google places api requirements"}),"."]}),`
|
|
41
|
+
`]}),`
|
|
42
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { CheckoutPage } from '@clickaroo/checkout-ui';
|
|
43
|
+
|
|
44
|
+
function MyCheckout() {
|
|
45
|
+
const cart = [
|
|
46
|
+
{
|
|
47
|
+
sku: "TEST001",
|
|
48
|
+
offerPricePoint: "OPP-TEST001",
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
sku: "TEST002",
|
|
52
|
+
offerPricePoint: "OPP-TEST002",
|
|
53
|
+
},
|
|
54
|
+
];
|
|
55
|
+
|
|
56
|
+
return <CheckoutPage cart={cart} googleApiKey={YOUR_GOOGLE_API_KEY} />;
|
|
57
|
+
}
|
|
58
|
+
`})}),`
|
|
59
|
+
`,e.jsxs(n.blockquote,{children:[`
|
|
60
|
+
`,e.jsxs(n.p,{children:[e.jsx(n.strong,{children:"Tips"}),`:
|
|
61
|
+
Each object in the `,e.jsx(n.code,{children:"cart"})," array only needs to contain the two required fields: ",e.jsx(n.code,{children:"sku"})," and ",e.jsx(n.code,{children:"offerPricePoint"}),". However, you can also pass other optional product information fields (such as ",e.jsx(n.code,{children:"title"}),", ",e.jsx(n.code,{children:"price"}),", ",e.jsx(n.code,{children:"image"}),", etc.), which will be saved to the order's metadata."]}),`
|
|
62
|
+
`]}),`
|
|
63
|
+
`,e.jsxs(n.p,{children:["You can read more about all the possible configuration options in ",e.jsx(n.a,{href:"./?path=/docs/components-checkoutpage--checkoutpage-english",children:"CheckoutPage Documentation"}),"."]}),`
|
|
64
|
+
`,e.jsx(n.h3,{id:"event-callbacks",children:"Event Callbacks"}),`
|
|
65
|
+
`,e.jsxs(n.p,{children:["The ",e.jsx(n.code,{children:"CheckoutPage"})," component provides several event callbacks that allow you to monitor and respond to different stages of the checkout process. These callbacks enable you to track user behavior, handle loading states, and implement custom logic."]}),`
|
|
66
|
+
`,e.jsx(n.p,{children:"Here's a complete example that includes all event callbacks:"}),`
|
|
67
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { CheckoutPage } from '@clickaroo/checkout-ui';
|
|
68
|
+
import { useNavigate } from 'react-router-dom'; // or your routing library
|
|
69
|
+
|
|
70
|
+
function MyCheckout() {
|
|
71
|
+
const navigate = useNavigate();
|
|
72
|
+
|
|
73
|
+
const cart = [
|
|
74
|
+
{
|
|
75
|
+
sku: "TEST001",
|
|
76
|
+
offerPricePoint: "OPP-TEST001",
|
|
77
|
+
title: "Product 1",
|
|
78
|
+
price: 99.99,
|
|
79
|
+
},
|
|
80
|
+
];
|
|
81
|
+
|
|
82
|
+
return (
|
|
83
|
+
<CheckoutPage
|
|
84
|
+
cart={cart}
|
|
85
|
+
googleApiKey={YOUR_GOOGLE_API_KEY}
|
|
86
|
+
onCheckoutInit={() => {
|
|
87
|
+
console.log('Checkout initialized');
|
|
88
|
+
}}
|
|
89
|
+
onPaymentInfoComplete={(cart, totalAmount) => {
|
|
90
|
+
console.log('Payment info complete');
|
|
91
|
+
}}
|
|
92
|
+
onOrderSubmit={(cart, totalAmount) => {
|
|
93
|
+
console.log('Order submitted');
|
|
94
|
+
}}
|
|
95
|
+
onOrderSuccess={(orderCode, tradeCode) => {
|
|
96
|
+
console.log('Order successful:', orderCode);
|
|
97
|
+
// Redirect to finish page
|
|
98
|
+
navigate(\`/finish/\${orderCode}\`);
|
|
99
|
+
}}
|
|
100
|
+
/>
|
|
101
|
+
);
|
|
102
|
+
}
|
|
103
|
+
`})}),`
|
|
104
|
+
`,e.jsx(n.p,{children:e.jsx(n.strong,{children:"Key Points:"})}),`
|
|
105
|
+
`,e.jsxs(n.ul,{children:[`
|
|
106
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onCheckoutInit"}),": Triggered when the checkout page loads"]}),`
|
|
107
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onPaymentInfoComplete"}),": Triggered when the payment form is valid"]}),`
|
|
108
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onOrderSubmit"}),": Triggered when user clicks submit"]}),`
|
|
109
|
+
`,e.jsxs(n.li,{children:[e.jsx(n.code,{children:"onOrderSuccess"}),": Triggered when order is successfully created"]}),`
|
|
110
|
+
`]}),`
|
|
111
|
+
`,e.jsx(n.h3,{id:"display-order-details-on-finish-page",children:"Display Order Details on Finish Page"}),`
|
|
112
|
+
`,e.jsxs(n.p,{children:["After the user successfully completes the payment and is redirected to the finish page, you can use the ",e.jsx(n.code,{children:"useOrderDetail"})," hook to display order information:"]}),`
|
|
113
|
+
`,e.jsx(n.pre,{children:e.jsx(n.code,{className:"language-tsx",children:`import { useOrderDetail } from '@clickaroo/checkout-ui';
|
|
114
|
+
import { useParams } from 'react-router-dom';
|
|
115
|
+
|
|
116
|
+
function OrderCompletePage() {
|
|
117
|
+
const { orderCode } = useParams();
|
|
118
|
+
const { orderDetail, loading, error } = useOrderDetail(orderCode || '');
|
|
119
|
+
|
|
120
|
+
if (loading) return <div>Loading order details...</div>;
|
|
121
|
+
if (error) return <div>Error: {error}</div>;
|
|
122
|
+
if (!orderDetail) return <div>Order not found</div>;
|
|
123
|
+
|
|
124
|
+
return (
|
|
125
|
+
<div>
|
|
126
|
+
<h1>Order Complete!</h1>
|
|
127
|
+
<p>Order Code: {orderDetail.order_code}</p>
|
|
128
|
+
<p>Customer Information: {orderDetail.customer.email} {orderDetail.customer.phone}</p>
|
|
129
|
+
<p>Total: {orderDetail.total_amount}</p>
|
|
130
|
+
<p>Product Detail: {orderDetail.metadata}</p>
|
|
131
|
+
{/* Display more order details as needed */}
|
|
132
|
+
</div>
|
|
133
|
+
);
|
|
134
|
+
}
|
|
135
|
+
`})}),`
|
|
136
|
+
`,e.jsxs(n.p,{children:["For more advanced usage, check out the ",e.jsx(n.a,{href:"./?path=/docs/documentation-apis--docs",children:"APIs documentation"}),"."]})]})}function b(o={}){const{wrapper:n}={...t(),...o.components};return n?e.jsx(n,{...o,children:e.jsx(r,{...o})}):r(o)}export{b as default};
|