https://ai.kissmetrics.io/_next/static/chunks/6926.01c05d1179b25251.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6926],{2739:(e,s,t)=>{t.d(s,{A:()=>i});var r=t(95155),n=t(98500),a=t.n(n),o=t(2648);let l=[{key:"visitor",label:"One visitor",token:"--ink"},{key:"web",label:"Website",token:"--seq-1"},{key:"app",label:"App",token:"--seq-2"},{key:"docs",label:"Docs",token:"--seq-3"},{key:"conversion",label:"Conversion",token:"--signal"},{key:"land",label:"Terrain",token:"--ghost"}];function i(){let e=(0,o.j7)(),s="var(--faint)";return(0,r.jsxs)("div",{className:"pt-1 border-t",style:{borderColor:"var(--line)"},children:[(0,r.jsx)("div",{className:"text-[10px] uppercase tracking-wider mb-2 mt-1",style:{color:s},children:"Scene colours"}),(0,r.jsx)("div",{className:"space-y-1.5 mb-2.5",children:l.map(t=>(0,r.jsxs)("div",{className:"flex items-center justify-between text-[11.5px]",style:{color:"var(--dim)"},children:[(0,r.jsx)("span",{children:t.label}),(0,r.jsxs)("span",{className:"flex items-center gap-2",children:[(0,r.jsx)("span",{className:"font-mono2 text-[10px]",style:{color:s},children:t.token}),(0,r.jsx)("span",{className:"w-6 h-4 rounded-sm border",style:{background:e.colors[t.key],borderColor:(0,o.fu)(e.colors[t.key],.55)}})]})]},t.key))}),(0,r.jsx)("p",{className:"text-[10.5px] leading-relaxed mb-2",style:{color:s},children:"These are the roles this scene draws with. They follow this view’s palette when it has one, and the app’s skin when it does not — set either from Scene in the left rail."}),(0,r.jsx)(a(),{href:"/settings?tab=branding",className:"inline-block text-[11px] font-medium underline underline-offset-2",style:{color:e.colors.web},children:"Settings > Branding"})]})}},18956:(e,s,t)=>{t.d(s,{A:()=>m});var r=t(95155),n=t(98500),a=t.n(n),o=t(32474),l=t(9266);let i={background:"var(--line-soft)",borderColor:"var(--line)"};function c({value:e,onChange:s}){let t=[...(0,l.K)().events];return e&&!t.includes(e)&&t.push(e),(0,r.jsx)("select",{value:e,onChange:e=>s(e.target.value),className:"mt-0.5 w-full rounded-md border px-2 py-1 text-[12px] km-hud-ink cursor-pointer focus:outline-none",style:i,children:t.map(e=>(0,r.jsx)("option",{value:e,children:e},e))})}var d=t(12115),h=t(40856);function m(){let e=(0,o.A_)(),[s,t]=(0,d.useState)(!1);return(0,r.jsxs)("div",{className:"pt-1 border-t space-y-2",style:{borderColor:"var(--line)"},children:[(0,r.jsx)("div",{className:"text-[10px] uppercase tracking-wider km-hud-faint mt-1",children:"Definitions \xb7 global"}),(0,r.jsxs)("label",{className:"block text-[10.5px] km-hud-dim",children:["Goal event",(0,r.jsx)(c,{value:e.goalEvent,onChange:e=>(0,o.Pk)({goalEvent:e})})]}),(0,r.jsxs)("div",{className:"rounded-md border p-2.5",style:{borderColor:"var(--line)",background:"var(--line-soft)"},children:[(0,r.jsx)("div",{className:"text-[10.5px] km-hud-dim",children:"Stages come from your event roles"}),(0,r.jsx)("p",{className:"mt-1 text-[10px] leading-snug km-hud-faint",children:"Reach, Intent and Conversion are whichever events you have classified under those roles, so Live and your reports read the same journey."}),(0,r.jsx)(a(),{href:"/schema",className:"mt-1.5 inline-block text-[10.5px] font-medium underline underline-offset-2",style:{color:"var(--acc)"},children:"Classify events →"})]}),(0,r.jsxs)("div",{className:"block text-[10.5px] km-hud-dim",children:[(0,r.jsxs)("div",{className:"flex items-center justify-between",children:[(0,r.jsx)("span",{children:"Win alerts → webhook"}),(0,r.jsx)("button",{onClick:()=>(0,o.Pk)({alerts:{...e.alerts,enabled:!e.alerts.enabled}}),className:`px-2 py-0.5 rounded-md text-[10px] font-semibold cursor-pointer border ${e.alerts.enabled?"text-card border-transparent":"km-hud-dim km-hud-line"}`,style:e.alerts.enabled?{background:"var(--ok)"}:void 0,children:e.alerts.enabled?"on":"off"})]}),(0,r.jsx)("input",{value:e.alerts.webhookUrl,onChange:s=>(0,o.Pk)({alerts:{...e.alerts,webhookUrl:s.target.value.trim()}}),placeholder:"https://hooks.slack.com/services/… (or Discord)",className:"mt-1 w-full rounded-md border px-2 py-1 text-[11px] km-hud-ink focus:outline-none font-mono2",style:{background:"var(--line-soft)",borderColor:"var(--line)"}}),(0,r.jsxs)("div",{className:"flex flex-wrap gap-x-3 gap-y-1 mt-1.5",children:[[["purchase","\uD83D\uDCB0 purchases"],["signup","✦ conversions"],["milestone","\uD83C\uDFC6 milestones"],["new-country","\uD83C\uDF0D new countries"],["spike","\uD83D\uDCC8 spikes"]].map(([s,t])=>(0,r.jsxs)("label",{className:"flex items-center gap-1 text-[10.5px] km-hud-dim cursor-pointer",children:[(0,r.jsx)("input",{type:"checkbox",checked:!!e.alerts.kinds[s],onChange:t=>(0,o.Pk)({alerts:{...e.alerts,kinds:{...e.alerts.kinds,[s]:t.target.checked}}})}),t]},s)),(0,r.jsxs)("label",{className:"flex items-center gap-1 text-[10.5px] km-hud-faint cursor-pointer",title:"Normally only real (live) data posts",children:[(0,r.jsx)("input",{type:"checkbox",checked:e.alerts.allowSim,onChange:s=>(0,o.Pk)({alerts:{...e.alerts,allowSim:s.target.checked}})}),"include sim data"]})]}),(0,r.jsx)("button",{onClick:async()=>{e.alerts.webhookUrl&&(await (0,h.lj)("\uD83D\uDC4B KM Live test alert: your webhook is wired up.",e.alerts.webhookUrl).cat

1ch(()=>{}),t(!0),setTimeout(()=>t(!1),1800))},disabled:!e.alerts.webhookUrl,className:`mt-1.5 px-2 py-1 rounded-md text-[10.5px] font-semibold border cursor-pointer ${e.alerts.webhookUrl?"km-hud-ink km-hud-line hover:km-hud-ink":"km-hud-faint km-hud-line"}`,children:s?"✓ sent":"send test alert"})]}),(0,r.jsxs)("label",{className:"block text-[10.5px] km-hud-dim",children:["Engaged after N Reach events",(0,r.jsx)("input",{type:"number",min:2,max:20,value:e.engagedThreshold,onChange:e=>(0,o.Pk)({engagedThreshold:Math.max(2,parseInt(e.target.value)||4)}),className:"mt-0.5 w-20 rounded-md border px-2 py-1 text-[12px] km-hud-ink focus:outline-none",style:{background:"var(--line-soft)",borderColor:"var(--line)"}})]})]})}},58783:(e,s,t)=>{t.d(s,{T:()=>a});var r=t(95155),n=t(38159);function a({contributors:e,railValue:s,railLabel:t,railNote:o,unmeasured:l=!1}){return(0,n.LB)("rail",20,(0,r.jsxs)(n.aU,{title:t,children:[(0,r.jsx)(n.$5,{value:s,note:o,unmeasured:l}),e.length>0&&(0,r.jsx)("div",{className:"mt-4",children:(0,r.jsx)(n.A9,{rows:e.map(e=>({key:e.label,label:e.label,value:e.value,sub:e.note,color:e.color}))})})]})),null}},76926:(e,s,t)=>{t.r(s),t.d(s,{default:()=>N});var r=t(95155),n=t(12115),a=t(90287),o=t(86275),l=t(49667),i=t(57575),c=t(97650),d=t(7765),h=t(67188),m=t(2648),u=t(2739),x=t(18956),p=t(58783),g=t(38159),f=t(3333),b=t(57485);let v={autoOrbit:!1,showLabels:!0,showFeed:!0,debugProps:!1};function j({tier:e,accent:s,gold:t}){let o=(0,m.i4)(),i=o.slab,c=o.slabRaised,d=o.bodyShade,h=(0,n.useRef)(null);(0,a.D)(({clock:e})=>{h.current&&(h.current.material.emissiveIntensity=.5+.15*Math.sin(2*e.getElapsedTime()))});let u=[s,c];return(0,r.jsxs)("group",{children:[(0,r.jsxs)("mesh",{position:[0,1.5,0],children:[(0,r.jsx)("boxGeometry",{args:[7,3,4]}),(0,r.jsx)("meshStandardMaterial",{color:i,emissive:i,emissiveIntensity:.22,roughness:.85,flatShading:!0})]}),(0,r.jsxs)("mesh",{position:[0,3.15,0],children:[(0,r.jsx)("boxGeometry",{args:[7.4,.3,4.4]}),(0,r.jsx)("meshStandardMaterial",{color:c,roughness:.8,flatShading:!0})]}),e>=3&&(0,r.jsxs)("group",{position:[0,4,0],children:[(0,r.jsxs)("mesh",{children:[(0,r.jsx)("boxGeometry",{args:[5,1.7,3.2]}),(0,r.jsx)("meshStandardMaterial",{color:i,roughness:.85,flatShading:!0})]}),(0,r.jsxs)("mesh",{position:[0,1,0],children:[(0,r.jsx)("boxGeometry",{args:[5.4,.25,3.6]}),(0,r.jsx)("meshStandardMaterial",{color:t,emissive:t,emissiveIntensity:.35,flatShading:!0})]})]}),Array.from({length:7},(e,s)=>(0,r.jsxs)("mesh",{position:[-3+s,2.35,2.25],rotation:[.5,0,0],children:[(0,r.jsx)("boxGeometry",{args:[1,.08,1.1]}),(0,r.jsx)("meshStandardMaterial",{color:u[s%2],emissive:u[s%2],emissiveIntensity:.55,flatShading:!0})]},s)),(0,r.jsxs)("mesh",{ref:h,position:[0,.95,2.02],children:[(0,r.jsx)("boxGeometry",{args:[1.3,1.9,.1]}),(0,r.jsx)("meshStandardMaterial",{color:d,emissive:s,emissiveIntensity:.5})]}),[-2.2,2.2].map(e=>(0,r.jsxs)("mesh",{position:[e,1.5,2.02],children:[(0,r.jsx)("boxGeometry",{args:[1.6,1.1,.08]}),(0,r.jsx)("meshStandardMaterial",{color:d,emissive:t,emissiveIntensity:1})]},e)),e>=1&&Array.from({length:9},(e,s)=>(0,r.jsx)(y,{x:-3.2+.8*s,idx:s,gold:t},s)),e>=2&&[-4.2,4.2].map(e=>(0,r.jsxs)("group",{position:[e,0,1.6],children:[(0,r.jsxs)("mesh",{position:[0,.3,0],children:[(0,r.jsx)("boxGeometry",{args:[.7,.6,.7]}),(0,r.jsx)("meshStandardMaterial",{color:c,flatShading:!0})]}),(0,r.jsxs)("mesh",{position:[0,.95,0],children:[(0,r.jsx)("coneGeometry",{args:[.45,.9,6]}),(0,r.jsx)("meshStandardMaterial",{color:o.ok,emissive:o.ok,emissiveIntensity:.25,flatShading:!0})]})]},e)),(0,r.jsx)(l.E,{position:[0,3.7+1.6*(e>=3),0],center:!0,occlude:!1,children:(0,r.jsx)("div",{style:{fontFamily:"var(--font-mono), monospace",fontSize:13,fontWeight:700,letterSpacing:"0.3em",color:t,textShadow:`0 0 18px ${t}aa`,pointerEvents:"none",whiteSpace:"nowrap"},children:"▮ KM STORE ▮"})})]})}function y({x:e,idx:s,gold:t}){let o=(0,n.useRef)(null);return(0,a.D)(({clock:e})=>{o.current&&(o.current.material.emissiveIntensity=.9+.6*Math.sin(3*e.getElapsedTime()+1.4*s))}),(0,r.jsxs)("mesh",{ref:o,position:[e,2.95,2.3],children:[(0,r.jsx)("sphereGeometry",{args:[.09,6,6]}),(0,r.jsx)("meshStandardMaterial",{color:t,emissive:t,emissiveIntensity:1})]})}function k({count:e,gold:s}){let t=Math.min(e,36);return(0,r.jsxs)("group",{position:[5.6,0,1],children:[Array.from({length:t},(e,t)=>{let n=Math.floor(t/9),a=t%9,o=.78*Math.floor(a/3);return(0,r.jsxs)("mesh",{position:[a%3*.78,.36+.72*n,o],rotation:[0,.37*t%.3,0],children:[(0,r.jsx)("boxGeometry",{args:[.66,.66,.66]}),(0,r.jsx)("meshStandardMaterial",{color:(0,m.Qw)(s,.55),emissive:s,emissiveIntensity:.12,roughness:.8,flatShading:!0})]},t)}),e>36&&(0,r.jsx)(l.E,{position:[.8,3.4,.8],center:!0,occlude:!1,children:(0,r.jsxs)("div",{style:{fontFamily:"var(--font-mono), monospace",fontSize:11,color:s,pointerEvents:"none"},children:["\xd7",e]})})]})}function w({buyersRef:e,coinsRef:s,accent:t,gold:o}){let l=(0,n.useRef)(null),i=(0,n.useRef)(null);return(0,a.D)(()=>{let t=performance.now(),r=l.current;if(r){let s=e.current;for(let e=0;e<r.children.length;e++){let n=r.children[e],a=s[e];if(!a){n.visible=!1;continue}let o=(t-a.start)/a.walkDur;if(o<0){n.visible=!1;continue}if(o>=1.15){s[e]=s[s.length-1],s.pop(),n.visible=!1;continue}n.visible=!0;let l=Math.min(1,o);n.position.set(c.cj9.lerp(-11,0,l),.09*Math.abs(Math.sin(l*Math.PI*9)),c.cj9.lerp(4.5,2.4,l));let i=o>1?1-(o-1)/.15:1;

1n.children.forEach(e=>{e.material.opacity=i})}}let n=i.current;if(n){let e=s.current;for(;e.length&&t-e[0].start>1600;)e.shift();for(let s=0;s<n.children.length;s++){let r=n.children[s],a=e[s];if(!a||t<a.start){r.visible=!1;continue}let o=(t-a.start)/1600;r.visible=!0,r.position.set(0,2.6+2.4*o,2.2),r.rotation.y+=.18,r.material.opacity=1-o}}}),(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("group",{ref:l,children:Array.from({length:8},(e,s)=>(0,r.jsxs)("group",{visible:!1,children:[(0,r.jsxs)("mesh",{position:[0,.3,0],children:[(0,r.jsx)("boxGeometry",{args:[.26,.5,.2]}),(0,r.jsx)("meshStandardMaterial",{color:t,emissive:t,emissiveIntensity:.6,transparent:!0,flatShading:!0})]}),(0,r.jsxs)("mesh",{position:[0,.68,0],children:[(0,r.jsx)("boxGeometry",{args:[.22,.22,.22]}),(0,r.jsx)("meshStandardMaterial",{color:(0,m.Qw)(t,1.35),emissive:(0,m.Qw)(t,1.35),emissiveIntensity:.4,transparent:!0,flatShading:!0})]})]},s))}),(0,r.jsx)("group",{ref:i,children:Array.from({length:10},(e,s)=>(0,r.jsxs)("mesh",{visible:!1,rotation:[Math.PI/2,0,0],children:[(0,r.jsx)("cylinderGeometry",{args:[.3,.3,.08,12]}),(0,r.jsx)("meshStandardMaterial",{color:o,emissive:o,emissiveIntensity:1.4,transparent:!0})]},s))})]})}function S({autoOrbit:e}){let s=(0,n.useRef)(null),t=(0,n.useRef)(0);return(0,a.D)(()=>{let r=s.current;r&&(r.autoRotate=e&&(0,h.OT)()&&Date.now()-t.current>4e3,r.update())}),(0,r.jsx)(i.N,{ref:s,target:[0,1.6,0],enablePan:!1,enableZoom:!0,minZoom:22,maxZoom:100,minPolarAngle:.7,maxPolarAngle:1.3,autoRotateSpeed:.35,enableDamping:!0,dampingFactor:.08,onStart:()=>{t.current=Date.now()}})}function N({hud:e=!0}={}){let s=(0,m.i4)();(0,d.M_)();

1let t=(0,m.Ge)(),[a,l]=(0,n.useState)(v),[i,c]=(0,n.useState)(!1);(0,n.useEffect)(()=>{try{let e=localStorage.getItem("km-live-revenue-opts");e&&l({...v,...JSON.parse(e)})}catch{}},[]);let{sales:h,buyersRef:p,coinsRef:g}=function(){let[e,s]=(0,n.useState)([]),t=(0,n.useRef)([]),r=(0,n.useRef)([]);return(0,n.useEffect)(()=>{let e=null;return d.Ux.subscribe(()=>{let n=d.Ux.getSnapshot(),a=[];for(let s of n.events){if(s.id===e)break;a.push(s)}n.events[0]&&(e=n.events[0].id);let o=a.reverse().filter(e=>2===e.conversion);if(!o.length)return;let l=o.map(e=>({id:e.id,person:e.person??"anonymous",plan:e.props.plan??"",amount:function(e){if(!e)return 0;let s=e.match(/\$(\d+)/);return s?parseInt(s[1],10):0}(e.props.plan),campaign:e.campaign??"organic",ts:e.ts}));for(let e of(s(e=>[...e,...l]),l))t.current.length<8&&t.current.push({start:performance.now()+400*Math.random(),walkDur:2600,sale:e}),r.current.push({start:performance.now()+2400})})},[]),{sales:e,buyersRef:t,coinsRef:r}}(),y=h.reduce((e,s)=>e+s.amount,0),C=h.length>=20?3:h.length>=10?2:+(h.length>=5);h[h.length-1];let I=h.length?Math.round(y/h.length):0;return(0,r.jsxs)("div",{className:"relative h-full deep-space",children:[e&&(0,r.jsx)(b.A,{}),C>=2&&(0,r.jsx)("div",{className:"absolute inset-0 pointer-events-none",style:{background:"radial-gradient(ellipse 80% 60% at 50% 25%, var(--line) 0%, transparent 60%)"}}),(0,r.jsxs)(o.Hl,{dpr:e?[1,2]:1,resize:{offsetSize:!0},gl:{antialias:!0,alpha:!0,preserveDrawingBuffer:!0},orthographic:!0,camera:{position:[3,5.5,26],zoom:55,near:.1,far:160},children:[(0,r.jsx)("ambientLight",{intensity:.85}),(0,r.jsx)("directionalLight",{position:[6,12,14],intensity:1.35,color:s.keyLight}),(0,r.jsx)("directionalLight",{position:[-10,6,-8],intensity:.3,color:s.fillLight}),(0,r.jsxs)("mesh",{rotation:[-Math.PI/2,0,0],position:[0,-.02,.6],children:[(0,r.jsx)("circleGeometry",{args:[7.5+1.4*C,64]}),(0,r.jsx)("meshBasicMaterial",{color:s.lot})]}),(0,r.jsxs)("mesh",{rotation:[-Math.PI/2,0,0],position:[0,-.01,3.6],children:[(0,r.jsx)("planeGeometry",{args:[6.5,3.4]}),(0,r.jsx)("meshStandardMaterial",{color:s.slab,roughness:.9})]}),(0,r.jsx)(j,{tier:C,accent:t.web,gold:t.conversion}),(0,r.jsx)(k,{count:h.length,gold:t.conversion}),(0,r.jsx)(w,{buyersRef:p,coinsRef:g,accent:t.visitor,gold:t.conversion}),(0,r.jsx)(S,{autoOrbit:a.autoOrbit}),(0,r.jsx)("fog",{attach:"fog",args:[s.fog,42,80]})]}),e&&(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(M,{total:y,sales:h,aov:I}),(0,r.jsx)(f.Wc,{id:"revenue",showOptions:i,setShowOptions:c,children:i&&(0,r.jsxs)("div",{className:"absolute right-0 bottom-10 z-30 w-[256px] rounded-xl border p-3.5 space-y-3 max-h-[70vh] overflow-y-auto thin-scroll",style:{background:"var(--card)",borderColor:"var(--line)",backdropFilter:"blur(14px)"},children:[[["autoOrbit","Auto-orbit camera"],["showLabels","Labels"],["debugProps","Debug: show properties"]].map(([e,s])=>(0,r.jsxs)("label",{className:"flex items-center justify-between text-[12px] km-hud-ink cursor-pointer",children:[s,(0,r.jsx)("input",{type:"checkbox",checked:a[e],onChange:s=>{var t;return t={[e]:s.target.checked},void l(e=>{let s={...e,...t};try{localStorage.setItem("km-live-revenue-opts",JSON.stringify(s))}catch{}return s})},className:"accent-[var(--acc)]"})]},e)),(0,r.jsx)(x.A,{}),(0,r.jsx)(u.A,{})]})})]})]})}function M({total:e,sales:s,aov:t}){return(0,g.LB)("revenue-log",30,(0,r.jsx)(g.aU,{title:"Sales log",children:(0,r.jsx)(g.A9,{rows:[...s].reverse().slice(0,12).map(e=>({key:e.id,label:e.plan||"Purchase",sub:`${e.person} \xb7 via ${e.campaign}`,value:`$${e.amount}`,color:"var(--signal)"}))})})),(0,r.jsx)(p.T,{contributors:[{value:String(s.length),label:"sales"},{value:`$${t}`,label:"average"}],railValue:`$${e.toLocaleString()}`,railLabel:"This session"})}}}]);