https://evkii.com/assets/Pay-DXwivHRW.js

1import{d as K,Y as z,r,j as e,S as G,a6 as J,v as W,E as H,a2 as X}from"./index-CeBKV1R4.js";import{p as Q,g as Z,C as D,a as M,P as ee,b as B,c as O,f as P}from"./customerBilling-DkkZN-dP.js";import{I as u}from"./input-CBYPG4hi.js";import{L as te}from"./label-x5jAe_ol.js";import{T as ae}from"./textarea-BHkTQQKR.js";import{a as se}from"./stripe-6Sk8LkDA.js";import{R as ie}from"./refresh-cw-CpLQurH4.js";import{L as ne}from"./lock-BLSwnzj_.js";import{S as A}from"./shield-check-DvfhfS-Q.js";/**
2 * @license lucide-react v0.462.0 - ISC
3 *
4 * This source code is licensed under the ISC license.
5 * See the LICENSE file in the root directory of this source tree.
6 */const F=K("CreditCard",[["rect",{width:"20",height:"14",x:"2",y:"5",rx:"2",key:"ynyp8z"}],["line",{x1:"2",x2:"22",y1:"10",y2:"10",key:"1b3vmo"}]]);/**
7 * @license lucide-react v0.462.0 - ISC
8 *
9 * This source code is licensed under the ISC license.
10 * See the LICENSE file in the root directory of this source tree.
11 */const re=K("Info",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"M12 16v-4",key:"1dtifu"}],["path",{d:"M12 8h.01",key:"e9boi3"}]]),R="evkii_pay_progress",le=s=>new Intl.NumberFormat("en-US",{style:"currency",currency:"USD"}).format(s/100),oe=s=>/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(s),me={billingType:"one_time",billingDay:"15",customerName:"",customerEmail:"",amountInput:"",description:"",companyName:"",phone:"",invoiceNumber:"",notes:""};function N(s,n){if(typeof window>"u")return;const t=window;Array.isArray(t.dataLayer)&&t.dataLayer.push({event:s,page:"/pay",billing_type:n})}const fe=()=>{const[s]=z(),n=s.get("checkout")==="cancelled",[t,m]=r.useState(me),[x,I]=r.useState({}),[w,k]=r.useState(!1),[E,y]=r.useState(null),[S,U]=r.useState(""),C=r.useRef(!1);r.useEffect(()=>{let a={};try{const h=localStorage.getItem(R);h&&(a=JSON.parse(h))}catch{}const i=s.get("type"),p={customerName:s.get("name")||"",customerEmail:s.get("email")||"",amountInput:s.get("amount")||"",description:s.get("description")||"",companyName:s.get("company")||"",invoiceNumber:s.get("invoice")||"",billingDay:s.get("day")||"",...i==="monthly"||i==="one_time"?{billingType:i}:{}};m(h=>({...h,...a,...Object.fromEntries(Object.entries(p).filter(([,Y])=>Y!==""))})),N("customer_payment_page_view")},[]),r.useEffect(()=>{try{localStorage.setItem(R,JSON.stringify(t))}catch{}},[t]);const c=r.useMemo(()=>Q(t.amountInput),[t.amountInput]),d=Number(t.billingDay),j=r.useMemo(()=>t.billingType==="monthly"?Z(d):null,[d,t.billingType]),T=r.useMemo(()=>{const a={};return t.customerName.trim()?t.customerName.length>120&&(a.customerName="Name is too long."):a.customerName="Enter your name.",t.customerEmail.trim()?oe(t.customerEmail)||(a.customerEmail="Enter a valid email."):a.customerEmail="Enter your email.",t.amountInput.trim()?c===null?a.amountInput="Enter a valid dollar amount.":c<D?a.amountInput="Minimum amount is $1.00.":c>M&&(a.amountInput="Maximum amount is $100,000.00."):a.amountInput="Enter an amount.",t.description.trim()?t.description.length>200&&(a.description="Keep this under 200 characters."):a.description="Add what this is for.",t.billingType==="monthly"&&(!Number.isInteger(d)||d<1||d>28)&&(a.billingDay="Choose a day from the 1st through the 28th."),a},[c,d,t]),_=Object.keys(T).length===0,l=a=>i=>{y(null),C.current||(C.current=!0,N("customer_payment_form_start",t.billingType)),m(p=>({...p,[a]:i.target.value}))},g=a=>()=>I(i=>({...i,[a]:!0})),L=a=>{y(null),m(i=>({...i,billingType:a})),N("customer_payment_type_select",a)},$=async a=>{if(a.preventDefault(),I({customerName:!0,customerEmail:!0,amountInput:!0,description:!0,billingDay:!0}),!(!_||w)){k(!0),y(null),N("customer_payment_checkout_start",t.billingType);try{const i=H(),{data:p,error:h}=await X.functions.invoke("create-customer-payment-checkout",{body:{customerName:t.customerName.trim(),customerEmail:t.customerEmail.trim(),companyName:t.companyName.trim(),phone:t.phone.trim(),invoiceNumber:t.invoiceNumber.trim(),description:t.description.trim(),notes:t.notes.trim(),amountInput:t.amountInput.trim(),billingType:t.billingType,...t.billingType==="monthly"?{billingDay:d}:{},environment:se(),returnOrigin:window.location.origin,pageUrl:window.location.href,referrer:document.referrer||"",localTimestamp:new Date().toISOString(),website:S,...i}});if(h||!(p!=null&&p.url)){y("We couldn't start Stripe checkout. Please try again or email [email protected]."),k(!1);return}window.location.href=p.url}catch{y("Something went wrong. Please try again or email [email protected]."),k(!1)}}},b=a=>x[a]&&T[a],q=c!==null&&c>=D&&c<=M;return e.jsxs("div",{className:"min-h-screen bg-[#ffffff] text-ink",children:[e.jsx(G,{title:"Pay EVKII — Secure Payment or Monthly Autopay",description:"Pay an EVKII invoice once or securely set up monthly marketing services through Stripe.",path:"/pay",noindex:!0,noCanonical:!0}),e.jsx(ee,{}),e.jsxs("main",{children:[e.jsx("section",{className:"border-b border-black/10 bg-[#0a0a0a] text-white",children:e.jsxs("div",{className:"container max-w-6xl py-9 md:py-12",children:[e.jsx("p",{className:"font-mono text-[12px] font-bold uppercase tracking-[0.22em] text-primary",children:"EVKII client billing"}),e.jsxs("div",{className:"mt-3 grid gap-5 lg:grid-cols-[1.25fr_.75fr] lg:items-end",children:[e.jsx("h1",{className:"max-w-3xl font-display text-4xl font-bold leading-[0.95] tracking-[-0.045em] md:text-6xl",children:"Pay once. Or put monthly marketing on auto

11pay."}),e.jsx("p",{className:"max-w-md text-sm leading-6 text-white/65 lg:justify-self-end",children:"Enter the amount, choose the billing date, and finish securely with Stripe. EVKII never sees or stores card details."})]})]})}),e.jsxs("div",{className:"container max-w-6xl py-8 md:py-12",children:[n&&e.jsxs("div",{className:"mb-6 flex items-start gap-3 rounded-xl border border-black/10 bg-white px-4 py-3 text-sm text-ink/70",children:[e.jsx(re,{className:"mt-0.5 h-4 w-4 shrink-0 text-ink/50"}),"Stripe checkout was closed. No payment was made and no autopay was started."]}),e.jsxs("div",{className:"grid gap-7 lg:grid-cols-[minmax(0,1.35fr)_minmax(300px,.65fr)]",children:[e.jsxs("form",{onSubmit:$,className:"overflow-hidden rounded-2xl border border-black/10 bg-white shadow-[0_18px_60px_rgba(0,0,0,.07)]",noValidate:!0,children:[e.jsxs("div",{className:"border-b border-black/10 p-5 md:p-7",children:[e.jsx("p",{className:"font-mono text-[12px] font-bold uppercase tracking-[0.18em] text-primary",children:"01 / Choose billing"}),e.jsxs("div",{className:"mt-4 grid gap-3 sm:grid-cols-2",role:"radiogroup","aria-label":"Billing type",children:[e.jsx(V,{active:t.billingType==="one_time",icon:e.jsx(F,{className:"h-5 w-5"}),title:"One-time payment",body:"Pay an invoice or project balance once.",onClick:()=>L("one_time")}

11),e.jsx(V,{active:t.billingType==="monthly",icon:e.jsx(ie,{className:"h-5 w-5"}),title:"Monthly autopay",body:"Choose the amount and monthly billing day.",onClick:()=>L("monthly")})]})]}),e.jsxs("div",{className:"p-5 md:p-7",children:[e.jsxs("div",{"aria-hidden":!0,className:"absolute -left-[9999px] top-0 h-0 w-0 overflow-hidden",children:[e.jsx("label",{htmlFor:"pay-website",children:"Website"}),e.jsx("input",{id:"pay-website",type:"text",tabIndex:-1,autoComplete:"off",value:S,onChange:a=>U(a.target.value)})]}),e.jsx("p",{className:"font-mono text-[12px] font-bold uppercase tracking-[0.18em] text-primary",children:"02 / Your details"}),e.jsxs("div",{className:"mt-4 grid gap-4 sm:grid-cols-2",children:[e.jsx(o,{id:"customer-name",label:"Full name",required:!0,error:b("customerName"),children:e.jsx(u,{id:"customer-name",value:t.customerName,onChange:l("customerName"),onBlur:g("customerName"),maxLength:120,placeholder:"Jane Smith",autoComplete:"name"})}),e.jsx(o,{id:"customer-email",label:"Email",required:!0,error:b("customerEmail"),children:e.jsx(u,{id:"customer-email",type:"email",value:t.customerEmail,onChange:l("customerEmail"),onBlur:g("customerEmail"),maxLength:254,placeholder:"[email protected]",autoComplete:"email"})})]}),e.jsxs("div",{className:"mt-4 grid gap-4 sm:grid-cols-2",children:[e.jsx(o,{id:"amount",label:t.billingType==="monthly"?"Monthly amount (USD)":"Payment amount (USD)",required:!0,error:b("amountInput"),children:e.jsxs("div",{className:"relative",children:[e.jsx("span",{className:"pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-ink/50",children:"$"}),e.jsx(u,{id:"amount",className:"pl-7",inputMode:"decimal",value:t.amountInput,onChange:l("amountInput"),onBlur:g("amountInput"),maxLength:30,placeholder:"3,500.00"})]})}),t.billingType==="monthly"?e.jsx(o,{id:"billing-day",label:"Bill me monthly on the",required:!0,error:b("billingDay"),children:e.jsx("select",{id:"billing-day",value:t.billingDay,onChange:l("billingDay"),onBlur:g("billingDay"),className:"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-ink outline-none ring-offset-background focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",children:Array.from({length:28},(a,i)=>i+1).map(a=>e.jsxs("option",{value:a,children:[B(a)," of every month"]},a))})}):e.jsx(o,{id:"reference",label:"Invoice / reference",children:e.jsx(u,{id:"reference",value:t.invoiceNumber,onChange:l("invoiceNumber"),maxLength:80,placeholder:"INV-1024"})})]}),t.billingType==="monthly"&&j&&e.jsxs("div",{className:"mt-4 flex items-start gap-3 rounded-xl border border-primary/25 bg-primary/[0.06] px-4 py-3 text-sm",children:[e.jsx(O,{className:"mt-0.5 h-4 w-4 shrink-0 text-primary"}),e.jsxs("div",{children:[e.jsxs("span",{className:"font-semibold text-ink",children:["First charge: ",P(j),"."]})," ",e.jsx("span",{className:"text-ink/65",children:"Your card is saved today; nothing is charged until that date."})]})]}),e.jsx("div",{className:"mt-4",children:e.jsx(o,{id:"description",label:"What is this for?",required:!0,error:b("description"),children:e.jsx(u,{id:"description",value:t.description,onChange:l("description"),onBlur:g("description"),maxLength:200,placeholder:"Monthly growth marketing services"})})}),t.billingType==="monthly"&&e.jsx("div",{className:"mt-4",children:e.jsx(o,{id:"reference",label:"Agreement / invoice reference",children:e.jsx(u,{id:"reference",value:t.invoiceNumber,onChange:l("invoiceNumber"),maxLength:80,placeholder:"Optional"})})}),e.jsxs("details",{className:"mt-5 rounded-xl border border-black/10 bg-[#ffffff]",children:[e.jsxs("summary",{className:"cursor-pointer select-none px-4 py-3 text-sm font-medium text-ink/70",children:["Add company, phone, or a note ",e.jsx("span",{className:"text-ink/40",children:"(optional)"})]}),e.jsxs("div",{className:"grid gap-4 border-t border-black/10 p-4 sm:grid-cols-2",children:[e.jsx(o,{id:"company",label:"Company name",children:e.jsx(u,{id:"company",value:t.companyName,onChange:l("companyName"),maxLength:160,placeholder:"Acme Co",autoComplete:"organization"})}),e.jsx(o,{id:"phone",label:"Phone",children:e.jsx(u,{id:"phone",type:"tel",value:t.phone,onChange:l("phone"),maxLength:40,placeholder:"+1 555 123 4567",autoComplete:"tel"})}),e.jsx("div",{className:"sm:col-span-2",children:e.jsx(o,{id:"notes",label:"Notes",children:e.jsx(ae,{id:"notes",value:t.notes,onChange:l("notes"),maxLength:1e3,rows:3,placeholder:"Anything EVKII should know?"})})})]})]}),E&&e.jsx("p",{className:"mt-4 text-sm font-medium text-destructive",role:"alert",children:E}),e.jsxs(J,{type:"submit",size:"lg",variant:"hero",disabled:!_||w,className:"mt-6 h-12 w-full text-sm",children:[e.jsx(ne,{className:"h-4 w-4"}),w?"Opening secure Stripe checkout…":t.billingType==="monthly"?"Set Up Monthly Autopay with Stripe":"Pay Securely with Stripe"]}),e.jsxs("p",{className:"mt-3 flex items-center justify-center gap-1.5 text-center text-xs text-ink/50",children:[e.jsx(A,{className:"h-3.5 w-3.5 shrink-0 text-primary"}),"Card information stays with Stripe. EVKII never sees or stores it."]})]})]}),e.jsxs("aside",{className:"space-y-5 lg:sticky lg:top-6 lg:self-start",children:[e.jsxs("div",{className:"rounded-2xl border border-black/10 bg-[#0a0a0a] p-5 text-white md:p-6",children:[e.jsx("p",{className:"font-mono text-[12px] font-bold uppercase tracking-[0.18em] text-primary",children:"Your setup"}),e.jsxs("div",{className:"mt-5 space-y-3 text-sm",children:[e.jsx(f,{label:"Billing",value:t.billingType==="monthly"?"Monthly autopay":"One time"}),e.jsx(f,{label:"For",value:t.description||"—"}),t.invoiceNumber&&e.jsx(f,{label:"Reference",value:t.invoiceNumber}),t.billingType==="monthly"&&e.jsx(f,{label:"Billing day",value:

11B(d)}),t.billingType==="monthly"&&j&&e.jsx(f,{label:"First charge",value:P(j)})]}),e.jsxs("div",{className:"mt-5 flex items-baseline justify-between border-t border-white/15 pt-5",children:[e.jsx("span",{className:"text-sm text-white/60",children:t.billingType==="monthly"?"Each month":"Total"}),e.jsx("span",{className:"font-display text-3xl font-bold tracking-tight",children:q?le(c):"$0.00"})]}),t.billingType==="monthly"&&e.jsx("p",{className:"mt-3 text-xs leading-5 text-white/50",children:"Due today: $0.00. The full monthly amount begins on the date shown above."})]}),e.jsx("div",{className:"rounded-2xl border border-black/10 bg-white p-5 md:p-6",children:e.jsxs("ul",{className:"space-y-4 text-sm text-ink/70",children:[e.jsx(v,{icon:e.jsx(A,{className:"h-4 w-4 text-primary"}),children:"Stripe securely collects and stores the payment method."}),t.billingType==="monthly"?e.jsxs(e.Fragment,{children:[e.jsx(v,{icon:e.jsx(O,{className:"h-4 w-4 text-primary"}),children:"No prorated surprise charge. The first full payment happens on the selected date."}),e.jsx(v,{icon:e.jsx(W,{className:"h-4 w-4 text-primary"}),children:"EVKII emails a branded confirmation with a secure link to review or cancel future billing."})]}):e.jsx(v,{icon:e.jsx(F,{className:"h-4 w-4 text-primary"}),children:"This selection is a one-time payment with no recurring charges."})]})}),e.jsxs("p",{className:"px-2 text-xs leading-5 text-ink/50",children:["Need help before continuing? Email ",e.jsx("a",{href:"mailto:[email protected]",className:"font-semibold text-primary hover:underline",children:"[email protected]"}),"."]})]})]})]})]})]})},V=({active:s,icon:n,title:t,body:m,onClick:x})=>e.jsxs("button",{type:"button",role:"radio","aria-checked":s,onClick:x,className:`flex items-start gap-3 rounded-xl border p-4 text-left transition ${s?"border-primary bg-primary/[0.06] ring-1 ring-primary":"border-black/10 bg-[#ffffff] hover:border-black/25"}`,children:[e.jsx("span",{className:`mt-0.5 ${s?"text-primary":"text-ink/45"}`,children:n}),e.jsxs("span",{children:[e.jsx("strong",{className:"block text-sm text-ink",children:t}),e.jsx("span",{className:"mt-1 block text-xs leading-5 text-ink/55",children:m})]})]}),o=({id:s,label:n,required:t,error:m,children:x})=>e.jsxs("div",{children:[e.jsxs(te,{htmlFor:s,className:"mb-1.5 block text-sm text-ink/80",children:[n,t&&e.jsx("span",{className:"text-primary",children:" *"})]}),x,m&&e.jsx("p",{className:"mt-1 text-xs text-destructive",children:m})]}),f=({label:s,value:n})=>e.jsxs("div",{className:"flex items-start justify-between gap-4",children:[e.jsx("span",{className:"text-white/45",children:s}),e.jsx("span",{className:"max-w-[65%] text-right text-white/90",children:n})]}),v=({icon:s,children:n})=>e.jsxs("li",{className:"flex items-start gap-2.5",children:[e.jsx("span",{className:"mt-0.5 shrink-0",children:s}),e.jsx("span",{className:"leading-relaxed",children:n})]});export{fe as default};