https://www.fullstory.com/b3b70e8235e8ddf6e32d4d37ed95378a3b6f9514-c9d248888f1e3a6e4768.js

1"use strict";(self.webpackChunkfullstory_com=self.webpackChunkfullstory_com||[]).push([[5923],{50787:function(e,t,n){n.d(t,{A:function(){return b}});var l={};n.r(l),n.d(l,{White:function(){return c},cta:function(){return u},fadeIn:function(){return m},image:function(){return d},review:function(){return p},reviews:function(){return g},visible:function(){return f}});var a=n(96540),r=n(85692),o=n(92378),i=n(22533),s=n(17908),c="Reviews-module--White--37027",u="Reviews-module--cta--dd5b9",m="Reviews-module--fadeIn--83ddd",d="Reviews-module--image--6fb3f",p="Reviews-module--review--70f5c",g="Reviews-module--reviews--bdef3",f="Reviews-module--visible--fbb83",v=n(88207);function b(e){let{content:t,backgroundColor:n,backgroundImage:c,colorTheme:m,slim:b=!0}=e;const{ref:E,inView:h}=(0,r.Wx)({threshold:.25,triggerOnce:!0}),y=(0,o.mo)(null==m?void 0:m.themeName);return a.createElement(i.A,{slim:b,backgroundImage:c,className:[l[n],y].join(" "),"data-analytics-section":"reviews-section"},a.createElement("div",{ref:E,className:[g,h?f:""].join(" ")},t.map((e,t)=>{var n,l;return a.createElement("div",{key:t,className:p,"data-analytics-component":"review","data-analytics-id":e.title},a.createElement("img",{className:d,src:null===(n=e.image)||void 0===n||null===(l=n.file)||void 0===l?void 0:l.url,alt:"5-star rating"}),a.createElement("h3",null,e.title),a.createElement(v.A,{copy:e.body}),e.linkLabel&&e.linkUrl&&a.createElement(s.Y,{className:u,hoverAnimation:!0,label:e.linkLabel,url:e.linkUrl}))})))}},60011:function(e,t,n){n.r(t),n.d(t,{default:function(){return se}});var l={};n.r(l),n.d(l,{columns:function(){return u},desktop:function(){return m},impact:function(){return d},mobile:function(){return p},original:function(){return g},result:function(){return f}});var a=n(96540),r=n(81194),o=n(22533),i=n(88207),s=n(67008),c=n(54284),u="Calculation-module--columns--a5b73",m="Calculation-module--desktop--6da61",d="Calculation-module--impact--95112",p="Calculation-module--mobile--6f19d",g="Calculation-module--original--73a17",f="Calculation-module--result--fb4db",v="TooltipStyles-module--tooltip--0cbd0",b="TooltipStyles-module--tooltip-arrow--8ed74",E="TooltipStyles-module--tooltip-icon--a0af7";function h(e){var t,n;let{revenue:r,tooltips:o,version:m}=e;const p=null==o||null===(t=o.find(e=>"increase"===e.subtitle))||void 0===t?void 0:t.body,h=null==o||null===(n=o.find(e=>"loss"===e.subtitle))||void 0===n?void 0:n.body;return a.createElement("div",{className:[d,l[m]].join(" ")},a.createElement("div",{className:g},a.createElement("span",null,"Starting Revenue"),a.createElement("span",{className:f},r.original)),a.createElement("div",{className:u},a.createElement("div",null,a.createElement("span",{"data-tooltip-id":"tt-increase"},"Increase"," ",p&&a.createElement(c.h,{className:[E,"increase-tooltip-icon"].join(" ")})),p&&a.createElement(s.m_,{id:"tt-increase",anchorSelect:".increase-tooltip-icon",className:v,classNameArrow:b,content:a.createElement(i.A,{copy:p})}),a.createElement("span",{className:f},r.increase)),a.createElement("div",null,a.createElement("span",{"data-tooltip-id":"tt-loss"},"Experience Loss",h&&a.createElement(c.h,{className:[E,"loss-tooltip-icon"].join(" ")})),h&&a.createElement(s.m_,{id:"tt-loss",anchorSelect:".loss-tooltip-icon",className:v,classNameArrow:b,content:a.createElement(i.A,{copy:h})}),a.createElement("span",{className:f},"$0"!==r.loss&&"-",r.loss))))}var y="RoiCalculator-module--calculator--ba67e",w="RoiCalculator-module--calculator-left--0786f",C="RoiCalculator-module--container--f8cc7",N="RoiCalculator-module--conversion-funnel--d876e",I="RoiCalculator-module--digital-experience--41f90",R="RoiCalculator-module--emerald--c22c8",S="RoiCalculator-module--eyebrow--9c680",k="RoiCalculator-module--pink-deep--d3a6b",F="RoiCalculator-module--section--ed0b0",j="RoiCalculator-module--visualization--eefd0";const x={default:{users:{type:"number",original:1e6,multiples:[1,1.25,1.5,1.75,2],label:"User Sessions",color:R},cvr:{type:"percentage",original:"10.0",multiples:[1,1.1,1.2,1.3,1.4],label:"Conversion Rate",color:R},orderValue:{type:"currency",original:"30.00",multiples:[1,1.1,1.2,1.3,1.4],label:"Average Order Value",color:R},affectedUsers:{type:"percentage",original:"8.0",multiples:[.4,.6,.75,.9,1],label:'"Bad" Sessions',color:k},conversionImpact:{type:"percentage",original:"30.0",multiples:[.6,.7,.8,.9,1],label:"Conversion Impact",color:k}},"grow revenue":{monthlySessions:{type:"number",original:1e6,multiples:[1,1.25,1.5,1.75,2],label:"Monthly Sessions",color:R},cvr:{type:"percentage",original:"5.0",multiples:[1,1.1,1.2,1.3,1.4],label:"Conversion Rate",color:R},orderValue:{type:"currency",original:"100.00",multiples:[1,1.1,1.2,1.3,1.4],label:"Average Order Value",color:R},repeatCustomers:{type:"percentage",original:"30.0",multiples:[1,1.1,1.2,1.3,1.4],label:"Repeat Customers",color:R},grossMargin:{type:"percentage",original:"30.0",multiples:[1,1.1,1.2,1.3,1.4],label:"Gross Margin",color:R}}};var A=n(85692);const V=function(e,t){void 0===t&&(t=!1);const n=new Intl.NumberFormat("en-US",{style:"currency",currency:"USD",minimumFractionDigits:t?2:0,maximumFractionDigits:t?2:0}).format(e);return"$NaN"===n?"$0":n},B=e=>{const t=e.split(".");return t[0]=t[0].replace(/\B(?=(\d{3})+(?!\d))/g,","),t.join(".")},O=e=>Object.entries(e).map(e=>{let[t,{original:n,type:l,label:a}]=e;return{name:t,original:n,step:"Conversion Impact"===a||'"Bad" Sessions'===a?4:0,new:"number"===l?n:parseFloat(n)}}),L=e=>{const{monthlySessions:t,cvr:n,orderValue:l,repeatCustomers:a,grossMargin:r}=e,o=e=>.01*parseFloat(e),i=e=>{let i=o(a[e]);return 0===i&&(i=1),s=t[e],parseInt(s,10)*o(n[e])*(e=>e?parseFloat(e):0)(l[e])*i*o(r[e]);var s},s=(e,t)=>(t-e)/e,c=i("original"),u=i("new");return{conversionIncrease:c*s(n.original,n.new),orderValueIncrease:c*s(l.original,l.new),repeatCustomersIncrease:c*s(a.original,a.new),totalIncrease:u-c}};var M="Input-module--changed-label--07795",W="Input-module--changed-value--f718c",$="Input-module--input-container--4026e",z="Input-module--original-label--8b0a4",T="Input-module--original-value--1cb0a",U="Input-module--percentage--afcd3",P="Input-module--slider--3cce4",H="Input-module--slider-container--0a3cc",_="Input-module--slider-group--695ec";function Y(e){var t,n;let{metric:l,properties:r,section:o,handleFocus:u,handleInput:m,handleBlur:d,handleSlider:p,index:g,focused:f}=e;const h=(0,a.useRef)(),{name:y}=l,w=r[y],C=w.type,N="conversionImpact"===y&&"0.0"!==l.original;let I,R,S,k;switch(o.content&&(I=null===(t=o.content.find(e=>e.subtitle===y))||void 0===t?void 0:t.body),o.fieldLabelTooltips&&(I=null===(n=o.fieldLabelTooltips.find(e=>e.subtitle===y))||void 0===n?void 0:n.body),(0,a.useEffect)(()=>{f&&h.current&&h.current.focus()},[f,h]),C){case"number":R=(new Intl.NumberFormat).format(l.original),S=(new Intl.NumberFormat).format(Math.round(l.new)),k="11";break;case"percentage":R=N?"-"+l.original:l.original,S=N?"-"+l.new.toFixed(1)+"%":l.new.toFixed(1)+"%",k=N?"5":"4";break;case"currency":R="$"+B(l.original.toString()),S=V(l.new,!0),k="7"}return a.createElement("div",{className:[_,w.color].join(" "),"data-analytics-component":"roi-calculator-input","data-analytics-id":y},a.createElement("div",{className:z,"data-tooltip-id":"tt-"+g+"-"+y},a.createElement("label",{htmlFor:y+"-original"},w.label),I&&a.createElement(c.h,{className:[E,y+"-tooltip-icon"].join(" ")})),I&&a.createElement(s.m_,{id:"tt-"+g+"-"+y,anchorSelect:"."+y+"-tooltip-icon",className:v,classNameArrow:b,content:a.createElement(i.A,{copy:I})}),a.createElement("div",{className:["percentage"===C?U:"",$].join(" ")},a.createElement("input",{ref:h,type:"text",inputMode:"decimal",id:y+"-original",name:y+"-original",maxLength:k,className:T,value:R,onFocus:u,onChange:e=>m(e,y,C),onBlur:e=>d(e,y,C)})),a.createElement("div",{className:H}

1,a.createElement("input",{type:"range",id:y+"-new",name:y+"-new",className:["calculator-slider",P].join(" "),min:0,max:4,step:"1",value:l.step,onChange:e=>p(e,y)}),a.createElement("span",{style:{left:"calc(0% + 0.58rem)"}}),a.createElement("span",{style:{left:"calc(25% + 0.28rem)"}}),a.createElement("span",{style:{left:"calc(50% - 0.02rem)"}}),a.createElement("span",{style:{left:"calc(75% - 0.35rem)"}}),a.createElement("span",{style:{left:"calc(100% - 0.65rem)"}})),0===g&&a.createElement("span",{className:M},"New Value"),a.createElement("div",{className:W},S))}const D=e=>(new Intl.NumberFormat).format(e).length,q=(e,t,n,l,a,r,o)=>{const i=D(e)-D(t.original)===2,s=parseInt(e.replace(/,/g,""),10),c={original:e,new:s*n[l].multiples[t.step]};return setTimeout(()=>{i?o.setSelectionRange(a+1,r+1):o.setSelectionRange(a,r)},0),c},G=(e,t,n,l)=>{if(/^(\d{1,2}(\.\d?)?)?$/.test(e)){const a="0"===t.original,r=e.startsWith("0."),o=/^0[0-9]/.test(e);return{original:a&&!r||o?e.substring(1):e,new:e*n[l].multiples[t.step]}}return{}},K=(e,t,n,l)=>{e.startsWith(".")&&(e="0"+e),e.startsWith("0")&&e.length>1&&"."!==e[1]&&(e=e.slice(1)),e.split(".").length>2&&(e=e.replace(/\.+$/,""));const a=e.split(".");return a[1]&&a[1].length>2&&(e=a[0]+"."+a[1].slice(0,2)),{original:e,step:"0.00"===e?0:t.step,new:"0.00"===e?0:parseFloat(e)*n[l].multiples[t.step]}};function J(e){let{calculatorValues:t,setCalculatorValues:n,section:l,properties:r}=e;const{ref:o,inView:i}=(0,A.Wx)({threshold:.8,triggerOnce:!0}),s=(0,a.useCallback)((e,t,l)=>{const a=e.target,o=a.selectionStart,i=a.selectionEnd;let s=a.value.replace(/[^0-9.]/g,"");""===s&&(s="0");if(!/^\d*\.?\d*$/.test(s))return null;n(e=>e.map(e=>{if(e.name!==t)return e;let n={};return"number"===l?n=q(s,e,r,t,o,i,a):"percentage"===l?n=G(s,e,r,t):"currency"===l&&(n=K(s,e,r,t)),Object.assign({},e,n)}))},[n,r]),c=(0,a.useCallback)((e,t,l)=>{const a=e.target.value;if(""===a)n(e=>e.map(e=>e));else{if("number"===l&&(a||n(e=>e.map(e=>e.name===t?Object.assign({},e,{original:"0",new:"0"}):e))),"percentage"===l){let e=a.replace(/[-]/g,"");e?e.includes(".")||n(n=>n.map(n=>n.name===t?Object.assign({},n,{original:e+".0"}):n)):n(e=>e.map(e=>e.name===t?Object.assign({},e,{original:"0.0",new:0}):e))}if("currency"===l){let e=a.replace(/[,$]/g,"");if("0"===e||"0."===e)e="0.00";else if(e.includes(".")){const t=e.split(".");1===t[1].length?e+="0":0===t[1].length&&(e+="00")}else e+=".00";n(n=>n.map(n=>n.name===t?Object.assign({},n,{original:e,new:"0.00"===e?"0.00":n.new}):n))}}},[n]),u=(0,a.useCallback)((e,t)=>{const l=parseInt(e.target.value,10);n(e=>e.map(e=>e.name===t?Object.assign({},e,{step:l,new:parseFloat(e.original)*r[t].multiples[l]}):e))},[n,r]),m=e=>{var t;const n=(e.value-e.min)/(e.max-e.min);null===(t=e.style)||void 0===t||t.setProperty("--range-progress",n)};return(0,a.useEffect)(()=>{const e=document.querySelectorAll(".calculator-slider");e&&e.forEach(e=>(m(e),e.addEventListener("input",m),()=>{e.removeEventListener("input",m)}))},[t]),a.createElement("div",{ref:o},t.map((e,t)=>a.createElement(Y,{key:t,metric:e,properties:r,section:l,handleInput:s,handleBlur:c,handleSlider:u,index:t,focused:i&&0===t})))}var Q="ItemizedResults-module--currency--ef90f",X="ItemizedResults-module--divider--ff6ca",Z="ItemizedResults-module--grid--6f9d1",ee="ItemizedResults-module--results--97544",te="ItemizedResults-module--total--39ad3";function ne(e){let{results:t}=e;const{conversionIncrease:n,orderValueIncrease:l,repeatCustomersIncrease:r,totalIncrease:o}=t;return a.createElement("div",{className:ee},a.createElement("h3",null,"Your profit potential with behavioral data"),a.createElement("div",{className:Z},a.createElement("p",null,"Profit increase from ",a.createElement("b",null,"improved conversion rate"),":"),a.createElement("p",{className:Q},V(n))),a.createElement("div",{className:Z},a.createElement("p",null,"Profit increase from ",a.createElement("b",null,"higher average order value"),":"),a.createElement("p",{className:Q},V(l))),a.createElement("div",{className:Z},a.createElement("p",null,"Profit increase from ",a.createElement("b",null,"more repeat customers"),":"),a.createElement("p",{className:Q},V(r))),a.createElement("div",{className:X}),a.createElement("div",{className:[Z,te].join(" ")},a.createElement("p",null,"Total profit increase:"),a.createElement("p",{className:Q},V(o))))}var le=n(2046),ae=n.n(le),re=n.p+"static/logo-on-gradient-960451dbdeaf65a3f4591c911b472188.png";const oe=a.memo(e=>{let{ballCount:t=1}=e;const n=(0,a.useRef)(null),l=(0,a.useRef)([]),r=(0,a.useRef)(["#9E36F1","#FFA12F","#07C799","#FF2059"]).current,o=(0,a.useRef)(null),i=(0,a.useRef)(ae().Engine.create()).current,s=i.world,c=(0,a.useRef)(ae().Composite.create()).current,u=(0,a.useCallback)(()=>{const e=n.current.clientWidth,t=2*Math.random()+6,a=ae().Common.random(e/2+t,e/2-t),r=ae().Common.random(t,0-100*t),o=ae().Bodies.circle(a,r,t,{restitution:.5,render:{fillStyle:"#c4d3d3"}});o.colorChanged=!1,ae().Composite.add(s,o),l.current.push(o)},[s]);(0,a.useEffect)(()=>{const e=ae().Render,t=ae().Runner,a=ae().Bodies,o=ae().Composite,u=ae().Events,m=n.current;let d=m.clientHeight,p=m.clientWidth;const g=e.create({element:m,engine:i,options:{height:m.clientHeight,width:m.clientWidth,wireframes:!1,background:"none"}});e.run(g);const f=t.create();t.run(f,i);const v=245/45;let b=p,E=b/v,h=p/2,y=d-320;const w=a.rectangle(h,y,b,E,{isStatic:!0,isSensor:!0,render:{sprite:{texture:re,xScale:.33,yScale:.33,yOffset:1}}});o.add(c,w),o.add(s,c);const C=a.rectangle(p/2,d-220,p/2,20,{isStatic:!0,render:{visible:!1}}),N=a.rectangle(p/2,d-229,p/2,1,{isStatic:!0,render:{fillStyle:"#c4d3d3"}});o.add(s,[C,N]),u.on(i,"collisionStart",e=>

1{e.pairs.forEach(e=>{const{bodyA:t,bodyB:n}=e;if(t===w||n===w){const e=t===w?n:t;if(l.current.includes(e)&&!e.colorChanged){const t=r[Math.floor(Math.random()*r.length)];e.render.fillStyle=t,e.colorChanged=!0}}})}),u.on(i,"afterUpdate",function(){for(let e=l.current.length-1;e>=0;e--)l.current[e].position.y>d+100&&(ae().Composite.remove(s,l.current[e]),l.current.splice(e,1))});const I=()=>{p=g.canvas.width=m.clientWidth,d=g.canvas.height=m.clientHeight,ae().Body.setPosition(C,ae().Vector.create(p/2,d-220)),ae().Body.setPosition(N,ae().Vector.create(p/2,d-229)),b=p,E=b/v,ae().Body.setPosition(w,ae().Vector.create(p/2,d-320)),g.options.width=p,g.options.height=d,e.lookAt(g,{min:{x:0,y:0},max:{x:p,y:d}})};return window.addEventListener("resize",I),()=>{window.removeEventListener("resize",I),e.stop(g),t.stop(f),o.clear(s,!1),ae().Engine.clear(i),g.canvas.remove()}},[i,s,r,c]);const m=(0,a.useCallback)(()=>{null===o.current&&(o.current=setInterval(()=>{for(let e=0;e<t;e++)u()},100))},[t,u]),d=(0,a.useCallback)(()=>{null!==o.current&&(clearInterval(o.current),o.current=null)},[]);return(0,a.useEffect)(()=>{m();const e=()=>{document.hidden?d():m()};return document.addEventListener("visibilitychange",e),()=>{d(),document.removeEventListener("visibilitychange",e)}},[m,d]),a.createElement("div",{"data-analytics-component":"calculator-visualization",style:{position:"absolute",inset:0},ref:n})},(e,t)=>e.ballCount===t.ballCount);var ie=oe;function se(e){var t;let{section:n}=e;const l="Template Standard"===n.type?"default":n.type,s=x[l],c="default"===l,{0:u,1:m}=(0,a.useState)(O(s)),{0:d,1:p}=(0,a.useState)(c?{increase:"$0",loss:"$0"}:null),g=(0,a.useMemo)(()=>u.reduce((e,t)=>Object.assign({},e,{[t.name]:t}),{}),[u]),{users:f,monthlySessions:v,cvr:b,orderValue:E,affectedUsers:R,repeatCustomers:k,grossMargin:A,conversionImpact:B}=g,M=null===(t=n.content)||void 0===t?void 0:t.filter(e=>"increase"===e.subtitle||"loss"===e.subtitle),W=(e,t,n,l)=>parseInt(e[l],10)*(.01*parseFloat(t[l]))*parseFloat(n[l]),$=(0,a.useCallback)(()=>{if(c){const e=W(f,b,E,"original");let t=W(f,b,E,"new")-e,n=((e,t,n,l,a,r)=>{const o=.01*parseFloat(l[r]),i=.01*parseFloat(a[r]);return W(e,t,n,r)*o*i})(f,b,E,R,B,"new");return n<0&&(t-=n,n=0),{original:V(e),increase:V(t),loss:V(n)}}return L(g)},[f,v,b,E,R,k,A,B]);return(0,a.useEffect)(()=>{p($())},[u,$]),a.createElement(o.A,{wide:!0,className:[F,c?"":w].join(" "),style:c?{paddingBlock:0}:{},innerClassName:C,"data-analytics-section":"roi-calculator-"+l},a.createElement(r.IB,null,a.createElement(r.Kj,null,c&&a.createElement("div",{className:j},a.createElement(ie,{ballCount:f.original<2?0:f.step+1}),a.createElement("div",{className:I},"Your brand's",a.createElement("br",null),"digital experience"),a.createElement("div",{className:N},"Your brand's",a.createElement("br",null),"conversion funnel"),a.createElement(h,{revenue:d,tooltips:M,version:"desktop"})),a.createElement("div",{className:y},(n.title||n.superHeading)&&a.createElement("div",{className:S},n.title||n.superHeading),a.createElement("h2",null,n.heading),a.createElement(i.A,{copy:n.sectionCopy||n.body}),a.createElement(J,{calculatorValues:u,setCalculatorValues:m,section:n,properties:s}),c&&a.createElement(h,{revenue:d,tooltips:M,version:"mobile"})),!c&&a.createElement(ne,{results:d}))))}}}]);
2//# sourceMappingURL=b3b70e8235e8ddf6e32d4d37ed95378a3b6f9514-c9d248888f1e3a6e4768.js.map