function MainComponent() { const LoadingSpinner = ()=>/*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center p-4", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 border-4 border-[#B8A355] border-t-transparent rounded-full animate-spin", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this })); const [step, setStep] = useState(1); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [sequences, setSequences] = useState(null); const [formData, setFormData] = useState({ industry: "", role: "", painPoints: [ "" ], nightlyConcerns: "", valueProposition: "", sellingPoints: "", successStories: "", campaignName: "", desiredOutcome: "", timeOffer: "" }); const addPainPoint = ()=>{ setFormData((prev)=>({ ...prev, painPoints: [ ...prev.painPoints, "" ] })); }; const updatePainPoint = (index, value)=>{ const newPainPoints = [ ...formData.painPoints ]; newPainPoints[index] = value; setFormData((prev)=>({ ...prev, painPoints: newPainPoints })); }; const removePainPoint = (index)=>{ if (formData.painPoints.length > 1) { const newPainPoints = formData.painPoints.filter((_, i)=>i !== index); setFormData((prev)=>({ ...prev, painPoints: newPainPoints })); } }; const handleSubmit = async ()=>{ setLoading(true); setError(null); try { const campaignResponse = await fetch("/api/create-campaign", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ campaign_name: formData.campaignName, target_industry: formData.industry, prospect_role: formData.role, value_proposition: formData.valueProposition, pain_points: formData.painPoints }) }); const campaignData = await campaignResponse.json(); if (campaignData.error) { throw new Error(campaignData.error); } const sequenceResponse = await fetch("/api/generate-sequence", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ campaign_id: campaignData.campaign.id }) }); const sequenceData = await sequenceResponse.json(); if (sequenceData.error) { throw new Error(sequenceData.error); } setSequences(sequenceData.sequences); setStep(4); } catch (err) { setError(err.message); setStep(3); } finally{ setLoading(false); } }; const renderStep = ()=>{ switch(step){ case 1: return /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 95, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 96, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block", __source: { fileName: "", lineNumber: 97, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 98, columnNumber: 17 }, __self: this }, "Industry/Market"), /*#__PURE__*/ React.createElement("input", { type: "text", className: "mt-2 block w-full rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", value: formData.industry, onChange: (e)=>setFormData((prev)=>({ ...prev, industry: e.target.value })), placeholder: "e.g., SaaS, Healthcare, Finance", __source: { fileName: "", lineNumber: 101, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "block", __source: { fileName: "", lineNumber: 115, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 116, columnNumber: 17 }, __self: this }, "Job Role/Position"), /*#__PURE__*/ React.createElement("input", { type: "text", className: "mt-2 block w-full rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", value: formData.role, onChange: (e)=>setFormData((prev)=>({ ...prev, role: e.target.value })), placeholder: "e.g., CTO, Marketing Director", __source: { fileName: "", lineNumber: 119, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 130, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "block text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 131, columnNumber: 17 }, __self: this }, "Key Pain Points"), formData.painPoints.map((point, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "flex gap-2", __source: { fileName: "", lineNumber: 135, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", className: "flex-1 rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", value: point, onChange: (e)=>updatePainPoint(index, e.target.value), placeholder: "e.g., High operational costs", __source: { fileName: "", lineNumber: 136, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>removePainPoint(index), className: "text-[#9EA3B0] hover:text-[#B8A355] transition-colors duration-300", __source: { fileName: "", lineNumber: 143, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 147, columnNumber: 23 }, __self: this })))), /*#__PURE__*/ React.createElement("button", { onClick: addPainPoint, className: "text-sm text-[#B8A355] hover:text-[#8E7B2D] transition-colors duration-300", __source: { fileName: "", lineNumber: 151, columnNumber: 17 }, __self: this }, "+ Add Another Pain Point")), /*#__PURE__*/ React.createElement("label", { className: "block", __source: { fileName: "", lineNumber: 159, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 160, columnNumber: 17 }, __self: this }, "What keeps them up at night?"), /*#__PURE__*/ React.createElement("textarea", { className: "mt-2 block w-full rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", rows: "3", value: formData.nightlyConcerns, onChange: (e)=>setFormData((prev)=>({ ...prev, nightlyConcerns: e.target.value })), placeholder: "Describe their biggest concerns and challenges", __source: { fileName: "", lineNumber: 163, columnNumber: 17 }, __self: this })))); case 2: return /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 181, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block", __source: { fileName: "", lineNumber: 182, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 183, columnNumber: 15 }, __self: this }, "Main Value Proposition"), /*#__PURE__*/ React.createElement("textarea", { className: "mt-2 block w-full rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", rows: "3", value: formData.valueProposition, onChange: (e)=>setFormData((prev)=>({ ...prev, valueProposition: e.target.value })), placeholder: "What unique value do you provide?", __source: { fileName: "", lineNumber: 186, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "block", __source: { fileName: "", lineNumber: 200, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 201, columnNumber: 15 }, __self: this }, "Unique Selling Points"), /*#__PURE__*/ React.createElement("textarea", { className: "mt-2 block w-full rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", rows: "3", value: formData.sellingPoints, onChange: (e)=>setFormData((prev)=>({ ...prev, sellingPoints: e.target.value })), placeholder: "What makes your solution stand out?", __source: { fileName: "", lineNumber: 204, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "block", __source: { fileName: "", lineNumber: 218, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 219, columnNumber: 15 }, __self: this }, "Success Stories"), /*#__PURE__*/ React.createElement("textarea", { className: "mt-2 block w-full rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", rows: "3", value: formData.successStories, onChange: (e)=>setFormData((prev)=>({ ...prev, successStories: e.target.value })), placeholder: "Share some customer success stories", __source: { fileName: "", lineNumber: 222, columnNumber: 15 }, __self: this }))); case 3: return /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 239, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block", __source: { fileName: "", lineNumber: 240, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 241, columnNumber: 15 }, __self: this }, "Campaign Name"), /*#__PURE__*/ React.createElement("input", { type: "text", className: "mt-2 block w-full rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", value: formData.campaignName, onChange: (e)=>setFormData((prev)=>({ ...prev, campaignName: e.target.value })), placeholder: "e.g., Q1 Enterprise Outreach", __source: { fileName: "", lineNumber: 244, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "block", __source: { fileName: "", lineNumber: 258, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 259, columnNumber: 15 }, __self: this }, "Desired Outcome"), /*#__PURE__*/ React.createElement("textarea", { className: "mt-2 block w-full rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", rows: "3", value: formData.desiredOutcome, onChange: (e)=>setFormData((prev)=>({ ...prev, desiredOutcome: e.target.value })), placeholder: "What's your goal for this campaign?", __source: { fileName: "", lineNumber: 262, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "block", __source: { fileName: "", lineNumber: 276, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#9EA3B0] text-sm font-medium tracking-wide", __source: { fileName: "", lineNumber: 277, columnNumber: 15 }, __self: this }, "Time-Sensitive Offers"), /*#__PURE__*/ React.createElement("textarea", { className: "mt-2 block w-full rounded-lg bg-[#141518] border border-[#B8A35520] text-white placeholder-[#9EA3B0]/50 focus:border-[#B8A355] focus:ring-1 focus:ring-[#B8A35530] transition-all duration-300", rows: "3", value: formData.timeOffer, onChange: (e)=>setFormData((prev)=>({ ...prev, timeOffer: e.target.value })), placeholder: "Any special offers or deadlines?", __source: { fileName: "", lineNumber: 280, columnNumber: 15 }, __self: this }))); case 4: return /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 297, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-semibold text-white tracking-wide mb-6", __source: { fileName: "", lineNumber: 298, columnNumber: 13 }, __self: this }, "Generated Email Sequence"), loading ? /*#__PURE__*/ React.createElement("div", { className: "text-center space-y-4", __source: { fileName: "", lineNumber: 302, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement(LoadingSpinner, { __source: { fileName: "", lineNumber: 303, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-[#9EA3B0]", __source: { fileName: "", lineNumber: 304, columnNumber: 17 }, __self: this }, "Generating your email sequence...")) : sequences ? /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 309, columnNumber: 15 }, __self: this }, sequences.map((seq, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-[#141518] border border-[#B8A35520] rounded-lg p-6 hover:border-[#B8A35540] transition-all duration-300 hover:shadow-lg hover:shadow-[#B8A35520] hover:-translate-y-0.5", __source: { fileName: "", lineNumber: 311, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-medium text-[#B8A355] text-lg mb-4", __source: { fileName: "", lineNumber: 315, columnNumber: 21 }, __self: this }, "Email ", index + 1), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 318, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm text-[#9EA3B0]", __source: { fileName: "", lineNumber: 319, columnNumber: 23 }, __self: this }, "Subject: ", seq.subject_line), /*#__PURE__*/ React.createElement("div", { className: "text-white whitespace-pre-wrap", __source: { fileName: "", lineNumber: 322, columnNumber: 23 }, __self: this }, seq.email_body), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-[#9EA3B0] mt-4", __source: { fileName: "", lineNumber: 325, columnNumber: 23 }, __self: this }, "Wait ", seq.wait_days, " days before next email"))))) : /*#__PURE__*/ React.createElement("div", { className: "text-[#9EA3B0] italic", __source: { fileName: "", lineNumber: 333, columnNumber: 15 }, __self: this }, "No sequences generated yet.")); default: return null; } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#0A0B0D]", __source: { fileName: "", lineNumber: 345, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-3xl mx-auto p-6 bg-gradient-to-br from-[#0A0B0D] to-[#141518] rounded-xl shadow-2xl border border-[#B8A35520] animate-fade-in", __source: { fileName: "", lineNumber: 346, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 347, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-6", __source: { fileName: "", lineNumber: 348, columnNumber: 11 }, __self: this }, [ 1, 2, 3 ].map((stepNumber)=>/*#__PURE__*/ React.createElement("div", { key: stepNumber, className: `flex items-center ${stepNumber < 3 ? "flex-1" : ""}`, __source: { fileName: "", lineNumber: 350, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `w-10 h-10 rounded-full flex items-center justify-center transition-all duration-500 ${step >= stepNumber ? "bg-gradient-to-r from-[#B8A355] to-[#8E7B2D] text-white shadow-lg shadow-[#B8A35530]" : "bg-[#141518] text-[#9EA3B0] border border-[#B8A35520]"}`, __source: { fileName: "", lineNumber: 354, columnNumber: 17 }, __self: this }, stepNumber), stepNumber < 3 && /*#__PURE__*/ React.createElement("div", { className: `flex-1 h-0.5 mx-4 transition-all duration-500 ${step > stepNumber ? "bg-gradient-to-r from-[#B8A355] to-[#8E7B2D]" : "bg-[#141518]"}`, __source: { fileName: "", lineNumber: 364, columnNumber: 19 }, __self: this })))), /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-semibold text-white tracking-wide", __source: { fileName: "", lineNumber: 375, columnNumber: 11 }, __self: this }, step === 1 ? "About the Target" : step === 2 ? "About Your Solution" : step === 3 ? "Campaign Details" : "Generated Sequence")), error && /*#__PURE__*/ React.createElement("div", { className: "mb-4 p-4 bg-red-900/10 border border-red-500/20 text-red-400 rounded-lg", __source: { fileName: "", lineNumber: 387, columnNumber: 11 }, __self: this }, error), /*#__PURE__*/ React.createElement("div", { className: "bg-[#0A0B0D]/50 p-6 rounded-lg border border-[#B8A35520] shadow-lg backdrop-blur-sm", __source: { fileName: "", lineNumber: 392, columnNumber: 9 }, __self: this }, renderStep()), /*#__PURE__*/ React.createElement("div", { className: "mt-8 flex justify-between", __source: { fileName: "", lineNumber: 396, columnNumber: 9 }, __self: this }, step > 1 && step < 4 && /*#__PURE__*/ React.createElement("button", { onClick: ()=>setStep((prev)=>prev - 1), className: "px-6 py-3 border border-[#B8A35540] rounded-lg text-[#B8A355] hover:bg-[#B8A35510] transition-all duration-300 hover:shadow-lg hover:shadow-[#B8A35520] hover:-translate-y-0.5", __source: { fileName: "", lineNumber: 398, columnNumber: 13 }, __self: this }, "Previous"), step < 3 && /*#__PURE__*/ React.createElement("button", { onClick: ()=>setStep((prev)=>prev + 1), className: "ml-auto px-6 py-3 bg-gradient-to-r from-[#B8A355] to-[#8E7B2D] text-white rounded-lg hover:shadow-lg hover:shadow-[#B8A35530] transition-all duration-300 hover:-translate-y-0.5", __source: { fileName: "", lineNumber: 406, columnNumber: 13 }, __self: this }, "Next"), step === 3 && /*#__PURE__*/ React.createElement("button", { onClick: handleSubmit, disabled: loading, className: "ml-auto px-6 py-3 bg-gradient-to-r from-[#B8A355] to-[#8E7B2D] text-white rounded-lg hover:shadow-lg hover:shadow-[#B8A35530] transition-all duration-300 hover:-translate-y-0.5 disabled:opacity-50 disabled:hover:transform-none", __source: { fileName: "", lineNumber: 414, columnNumber: 13 }, __self: this }, loading ? "Generating..." : "Generate Sequence"))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 424, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in { animation: fadeIn 0.5s ease forwards; } `)); }