https://www.skribil.ai/_next/static/chunks/pages/channel-mix-43ce71fd1cef1892.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6777],{61111:function(e,s,t){(window.__NEXT_P=window.__NEXT_P||[]).push(["/channel-mix",function(){return t(29574)}])},76678:function(e,s,t){"use strict";var a=t(85893);t(67294);var n=t(9475),l=t(92429),r=t(92761),i=t(83989);s.Z=e=>{let{title:s,subtitle:t,children:c,currentStep:d,totalSteps:o,onNext:x,onBack:m,onSkip:h,onExit:u,showSkip:p=!1,isWalkthrough:j=!1,nextButtonText:g="Next →",hideExitButton:b=!1,aiInsights:N=[],hideNavigation:v=!1}=e;return(0,a.jsxs)("div",{className:"container mx-auto px-4 py-8 max-w-7xl",children:[(0,a.jsxs)("div",{className:"mb-6",children:["string"==typeof s?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)("h1",{className:"text-3xl font-bold mb-2",children:s}),t&&(0,a.jsx)("p",{className:"text-gray-600",children:t})]}):s,j&&d&&o&&(0,a.jsxs)("div",{className:"mt-4",children:[(0,a.jsxs)("div",{className:"flex justify-between items-center mb-2",children:[(0,a.jsxs)("div",{className:"text-sm text-gray-500",children:["Step ",d," of ",o]}),!b&&u&&(0,a.jsxs)("button",{onClick:u,className:"text-sm text-gray-500 hover:text-gray-700 flex items-center",children:[(0,a.jsx)(n.Z,{className:"w-4 h-4 mr-1"}),"Exit Walkthrough"]})]}),(0,a.jsx)("div",{className:"w-full bg-gray-200 rounded-full h-2",children:(0,a.jsx)("div",{className:"bg-blue-600 h-2 rounded-full transition-all duration-300",style:{width:"".concat(d/o*100,"%")}})})]})]}),N&&N.length>0&&(0,a.jsxs)("div",{className:"mb-8 p-4 bg-indigo-50 rounded-lg border border-indigo-100",children:[(0,a.jsxs)("h3",{className:"font-medium mb-2 flex items-center text-indigo-800",children:[(0,a.jsx)(l.Z,{className:"w-5 h-5 mr-2 text-indigo-500"}),"AI Insights"]}),(0,a.jsx)("ul",{className:"space-y-2",children:N.map((e,s)=>(0,a.jsxs)("li",{className:"text-sm text-indigo-700 flex items-start",children:[(0,a.jsx)("span",{className:"text-indigo-500 mr-2",children:"•"}),e]},s))})]}),(0,a.jsx)("div",{className:"mb-8",children:c}),j&&!v&&(0,a.jsxs)("div",{className:"flex justify-between items-center",children:[(0,a.jsxs)("button",{onClick:m,className:"px-4 py-2 text-gray-600 flex items-center ".concat(m?"":"invisible"),children:[(0,a.jsx)(r.Z,{className:"w-4 h-4 mr-2"}),"Back"]}),(0,a.jsxs)("div",{className:"flex gap-4",children:[p&&h&&(0,a.jsx)("button",{onClick:h,className:"px-4 py-2 text-gray-600 border border-gray-300 rounded-lg hover:bg-gray-50",children:"Skip this step"}),x&&(0,a.jsxs)("button",{onClick:x,className:"px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 flex items-center",children:[g,!g.includes("→")&&(0,a.jsx)(i.Z,{className:"w-4 h-4 ml-2"})]})]})]})]})}},89346:function(e,s,t){"use strict";t.d(s,{Ol:function(){return l},Zb:function(){return n},aY:function(){return i},ll:function(){return r}});var a=t(85893);t(67294);let n=e=>{let{children:s,className:t="",...n}=e;return(0,a.jsx)("div",{className:"bg-white rounded-lg shadow ".concat(t),...n,children:s})},l=e=>{let{children:s,className:t="",...n}=e;return(0,a.jsx)("div",{className:"p-6 pb-0 ".concat(t),...n,children:s})},r=e=>{let{children:s,className:t="",...n}=e;return(0,a.jsx)("h3",{className:"text-lg font-medium ".concat(t),...n,children:s})},i=e=>{let{children:s,className:t="",...n}=e;return(0,a.jsx)("div",{className:"p-6 ".concat(t),...n,children:s})}},29574:function(e,s,t){"use strict";t.r(s),t.d(s,{default:function(){return b}});var a=t(85893),n=t(67294),l=t(89346),r=t(64715),i=t(11565),c=t(67017),d=t(25615),o=t(88793),x=t(24570),m=t(78042),h=t(31712);let u=e=>{let s=e.leads>0?e.spend/e.leads:0,t=e.opportunities>0?e.spend/e.opportunities:0,a=e.deals>0?e.spend/e.deals:0,n=e.spend>0?(e.revenue-e.spend)/e.spend:0,l=e.leads>0?e.deals/e.leads*100:0;return{cpl:s.toFixed(2),cpo:t.toFixed(2),cpd:a.toFixed(2),roi:(100*n).toFixed(1),conversionRate:l.toFixed(1)}},p=e=>{let{channels:s}=e,t=(0,n.useMemo)(()=>{if(!s.length)return[];let e=[],t=s.reduce((e,s)=>e+s.spend,0),a=s.reduce((e,s)=>{let t=s.revenue>0?(s.revenue-s.spend)/s.spend:0;return t>e.roi?{name:s.name,roi:t}:e},{name:"",roi:-1/0}),n=s.reduce((e,s)=>e+(s.leads>0?s.spend/s.leads:0),0)/s.length;e.push({icon:"\uD83D\uDCB0",text:"Total marketing investment of $".concat(t.toLocaleStr

1ing()," across ").concat(s.length," channels")}),a.roi>0&&e.push({icon:"\uD83C\uDFAF",text:"".concat(a.name," is your best performing channel with ").concat((100*a.roi).toFixed(1),"% ROI")}),e.push({icon:"\uD83D\uDCCA",text:"Average cost per lead across channels is $".concat(n.toFixed(2))});let l=s.filter(e=>50>parseFloat(u(e).roi));return l.length>0&&e.push({icon:"\uD83D\uDCA1",text:"Consider optimizing ".concat(l.length," channels showing ROI below 50%")}),e},[s]);return(0,a.jsxs)(l.Zb,{className:"mb-8 bg-slate-50",children:[(0,a.jsx)(l.Ol,{children:(0,a.jsxs)(l.ll,{className:"flex items-center gap-2",children:[(0,a.jsx)("span",{className:"text-blue-600",children:"✨"}),"AI Insights"]})}),(0,a.jsx)(l.aY,{children:(0,a.jsx)("div",{className:"space-y-4",children:t.map((e,s)=>(0,a.jsxs)("div",{className:"flex items-start gap-3",children:[(0,a.jsx)("span",{className:"text-lg",children:e.icon}),(0,a.jsx)("p",{className:"text-slate-600",children:e.text})]},s))})})]})};var j=()=>{let[e,s]=(0,n.useState)([{name:"Content Marketing",spend:5e3,leads:250,opportunities:50,deals:10,revenue:5e4,timeframe:"Q1"},{name:"Paid Search",spend:3e3,leads:150,opportunities:30,deals:6,revenue:3e4,timeframe:"Q1"}]),t=(t,a,n)=>{let l=[...e];l[t]={...l[t],[a]:Number(n)},s(l)},j=e=>{let{channel:s,index:n}=e,r=u(s);return(0,a.jsxs)(l.Zb,{className:"mb-6",children:[(0,a.jsxs)(l.Ol,{className:"flex flex-row items-center justify-between pb-2",children:[(0,a.jsx)(l.ll,{className:"text-xl font-bold text-slate-900",children:s.name}),(0,a.jsx)("span",{className:"text-sm text-slate-500",children:s.timeframe})]}),(0,a.jsxs)(l.aY,{children:[(0,a.jsxs)("div",{className:"grid grid-cols-2 md:grid-cols-4 gap-4 mb-6",children:[(0,a.jsxs)("div",{children:[(0,a.jsx)("p",{className:"text-sm text-slate-600",children:"Cost per Lead"}),(0,a.jsxs)("p",{className:"text-2xl font-bold text-slate-900",children:["$",r.cpl]})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)("p",{className:"text-sm text-slate-600",children:"Cost per Opportunity"}),(0,a.jsxs)("p",{className:"text-2xl font-bold text-slate-900",children:["$",r.cpo]})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)("p",{className:"text-sm text-slate-600",children:"Cost per Deal"}),(0,a.jsxs)("p",{className:"text-2xl font-bold text-slate-900",children:["$",r.cpd]})]}),(0,a.jsxs)("div",{children:[(0,a.jsx)("p",{className:"text-sm text-slate-600",children:"ROI"}),(0,a.jsxs)("p",{className:"text-2xl font-bold text-green-600",children:[r.roi,"%"]})]})]}),(0,a.jsxs)("div",{className:"grid grid-cols-2 md:grid-cols-5 gap-4",children:[(0,a.jsxs)("div",{className:"p-4 bg-slate-50 rounded",children:[(0,a.jsx)("label",{className:"text-sm text-slate-600",children:"Spend"}),(0,a.jsx)("input",{type:"number",value:s.spend,onChange:e=>t(n,"spend",e.target.value),className:"w-full mt-1 p-2 border rounded bg-white"})]}),(0,a.jsxs)("div",{className:"p-4 bg-slate-50 rounded",children:[(0,a.jsx)("label",{className:"text-sm text-slate-600",children:"Leads"}),(0,a.jsx)("input",{type:"number",value:s.leads,onChange:e=>t(n,"leads",e.target.value),className:"w-full mt-1 p-2 border rounded bg-white"})]}),(0,a.jsxs)("div",{className:"p-4 bg-slate-50 rounded",children:[(0,a.jsx)("label",{className:"text-sm text-slate-600",children:"Opportunities"}),(0,a.jsx)("input",{type:"number",value:s.opportunities,onChange:e=>t(n,"opportunities",e.target.value),className:"w-full mt-1 p-2 border rounded bg-white"})]}),(0,a.jsxs)("div",{className:"p-4 bg-slate-50 rounded",children:[(0,a.jsx)("label",{className:"text-sm text-slate-600",children:"Deals"}),(0,a.jsx)("input",{type:"number",value:s.deals,onChange:e=>t(n,"deals",e.target.value),className:"w-full mt-1 p-2 border rounded bg-white"})]}),(0,a.jsxs)("div",{className:"p-4 bg-slate-50 rounded",children:[(0,a.jsx)("label",{className:"text-sm text-slate-600",children:"Revenue"}),(0,a.jsx)("input",{type:"number",value:s.revenue,onChange:e=>t(n,"revenue",e.target.value),className:"w-full mt-1 p-2 border rounded bg-white"})]})]})]})]})};return(0,a.jsxs)("div",{className:"max-w-7xl mx-auto p-8",children:[(0,a.jsxs)("div",{className:"flex justify-between items-center mb-8",children:[(0,a.jsx)("h1",{className:"text-2xl font-bold text-slate-900",children:"Marketing ROI Calculator"}),(0,a.jsx)("button",{onClick:()=>s([...e,{name:"Channel ".concat(e.length+1),spend:0,leads:0,opportunities:0,deals:0,revenue:0,timeframe:"Q1"}]),className:"px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700",children:"Add Channel"})]}),(0,a.jsx)(p,{channels:e}),(0,a.jsxs)(l.Zb,{className:"mb-8",children:[(0,a.jsx)(l.Ol,{children:(0,a.jsx)(l.ll,{children:"Performance Overview"})}),(0,a.jsx)(l.aY,{children:(0,a.jsx)(()=>{let s=e.map(e=>({name:e.name,roi:parseFloat(u(e).roi),cpl:parseFloat(u(e).cpl),conversionRate:parseFloat(u(e).conversionRate)}));return(0,a.jsx)("div",{className:"h-96",children:(0,a.jsx)(r.h,{width:"100%",height:"100%",children:(0,a.jsxs)(i.w,{data:s,children:[(0,a.jsx)(c.q,{strokeDasharray:"3 3"}),(0,a.jsx)(d.K,{dataKey:"name"}),(0,a.jsx)(o.B,{yAxisId:"left"}),(0,a.jsx)(o.B,{yAxisId:"right",orientation:"right"}),(0,a.jsx)(x.u,{}),(0,a.jsx)(m.D,{}),(0,a.jsx)(h.x,{yAxisId:"left",type:"monotone",dataKey:"roi",stroke:"#22c55e",name:"ROI %"}),(0,a.jsx)(h.x,{yAxisId:"right",type:"monotone",dataKey:"cpl",stroke:"#3b82f6",name:"Cost per Lead ($)"}),(0,a.jsx)(h.x,{yAxisId:"right",type:"monotone",dataKey:"conversionRate",stroke:"#f59e0b",name:"Conversion Rate %"})]})})})},{})})]}),(0,a.jsx)("div",{className:"space-y-6",children:e.map((e,s)=>(0,a.jsx)(j,{channel:e,index:s},s))})]})},g=t(76678),b=()=>(0,a.jsx)(g.Z,{title:"Channel Mix",subtitle:"Select and configure your marketing channels",aiInsights:["Your target audience shows high engagement with content marketing and events","Digital advertising could complement your organic reach strategy","Consider expanding social presence based on industry benchmarks"],isWalkthrough:!1,children:(0,a.jsx)(j,{})})}},function(e){e.O(0,[160,2888,9774,179],function(){return e(e.s=61111)}),_N_E=e.O()}]);