1import{s as te,d as ae,k as oe,v as ne,o as g,a as x,f as e,t as i,e as a,x as v,n as h,F as N,r as P,l as j,g as re,m as le,y as c,z as n,p as ie}from"./DJF7C7QK.js";const ce=te("/images/favicon.svg"),ue={class:"flex items-center justify-between border-b border-line bg-surface-2 px-3 py-2.5 sm:px-4"},de={class:"mx-2 flex max-w-sm flex-1 items-center gap-2 rounded-md border border-line bg-surface px-2.5 py-1 font-mono text-[12px] text-ink-3"},pe={class:"truncate text-ink-2"},ve={class:"kws-bar overflow-x-auto"},me={class:"flex min-w-max items-center gap-4 px-3 py-2 sm:gap-5 sm:px-4"},fe={class:"kws-metric"},we={class:"kws-metric"},he={class:"kws-metric"},ge={class:"kws-metric items-end"},xe={class:"flex h-[22px] items-end gap-[2px]"},be={class:"kws-metric"},ke={class:"kws-metric"},ye={class:"kws-metric"},_e={class:"g-page px-4 py-5 sm:px-7 sm:py-6"},Me={class:"flex items-center gap-5"},Le={class:"g-searchbox flex min-w-0 flex-1 items-center gap-3"},Ve={class:"g-t1 min-w-0 flex-1 truncate text-[15px]"},Ce={key:0,class:"g-caret"},Oe={style:{color:"var(--kws-good)"}},$e={style:{color:"var(--kws-warn)"}},Se={class:"flex items-end gap-[1.5px]"},He=ae({__name:"SerpDemo",setup(qe){const m=[{query:"kws everywhere",volume:2900,cpcLow:.01,cpcHigh:.05,competition:3,trend:[30,34,32,38,44,51,60,72,85,100,104,108]},{query:"best running shoes",volume:74e3,cpcLow:.42,cpcHigh:1.15,competition:78,trend:[62,70,84,96,100,92,78,70,66,58,54,50]},{query:"plumber near me",volume:246e3,cpcLow:4.55,cpcHigh:13.2,competition:41,trend:[88,84,90,92,96,100,98,94,90,92,95,97]},{query:"chatgpt prompts",volume:55e4,cpcLow:.05,cpcHigh:.3,competition:12,trend:[30,34,42,50,58,66,74,82,88,94,98,102]}];function U(t){return t===0?{label:"N/A",color:"var(--kws-muted)"}:t<=33?{label:"Low",color:"var(--kws-good)"}:t<=66?{label:"Medium",color:"var(--kws-warn)"}:{label:"High",color:"var(--kws-bad)"}}function G(t){const s=(t[0]+t[1]+t[2])/3,r=(t[t.length-3]+t[t.length-2]+t[t.length-1])/3,o=Math.round((r-s)/s*100),y=o>0?"+":"";return o>=20?{text:`â ${y}${o}%`,color:"var(--kws-good)"}:o<=-20?{text:`â ${o}%`,color:"var(--kws-bad)"}:{text:`â ${y}${o}%`,color:"var(--kws-warn)"}}function K(t,s){const r=Math.min(Math.log10(t+1)/Math.log10(1e6),1),o=Math.max(0,Math.min(100,Math.round(r*(1-s/100)*100)));return{score:o,color:o>=60?"var(--kws-good)":o>=30?"var(--kws-warn)":"var(--kws-bad)"}}function W(t){return Math.round(t.volume*.28*((t.cpcLow+t.cpcHigh)/2))}function J(t){return`$${t.cpcLow.toFixed(2)} - $${t.cpcHigh.toFixed(2)}`}const f=c(!1),S=c(0),H=c(0),_=c(""),M=c(!1),L=c(!1),V=c(!1),C=c(!1),b=c(m[0].volume),Q=n(()=>m[S.value]),u=n(()=>m[H.value]),X=n(()=>f.value&&!M.value),q=n(()=>f.value?_.value:Q.value.query),l=n(()=>!f.value||L.value),A=n(()=>!f.value||V.value),d=n(()=>!f.value||C.value),B=n(()=>{const t=Math.max(...u.value.trend);return u.value.trend.map(s=>s/t)}),D=n(()=>U(u.value.competition)),I=n(()=>G(u.value.trend)),T=n(()=>K(u.value.volume,u.value.competition)),Y=n(()=>W(u.value)),z=n(()=>J(u.value)),O=c(null);let p=!1,E=!1,k=null;const $=[];function w(t){return new Promise(s=>{$.push(setTimeout(s,t))})}function Z(t,s){const r=performance.now();function o(y){if(p)return;const R=Math.min(1,(y-r)/s);b.value=Math.round(t*(1-Math.pow(1-R,3))),R<1&&requestAnimationFrame(o)}requestAnimationFrame(o)}function ee(){_.value="",M.value=!1,L.value=!1,V.value=!1,C.value=!1,b.value=0}async function se(){for(;!p;)for(let t=0;t<m.length;t++){if(p||(S.value=t,ee(),await w(420),p))return;for(const s of m[t].query){if(p)return;_.value+=s,await w(52+Math.random()*42)}if(await w(360),p)return;M.value=!0,await w(220),H.value=t,L.value=!0,Z(m[t].volume,620),await w(360),V.value=!0,await w(520),b.value=m[t].volume,C.value=!0,await w(2600)}}function F(){E||p||(E=!0,k?.disconnect(),se())}return oe(()=>{if(f.value=!0,window.matchMedia("(prefers-reduced-motion: reduce)").matches){f.value=!1;return}typeof IntersectionObserver<"u"&&O.value&&(k=new IntersectionObserver(s=>{s.some(r=>r.isIntersecting)&&F()},{threshold:.25}),k.observe(O.value)),$.push(setTimeout(F,1500))}),ne(()=>{p=!0,k?.disconnect(),$.forEach(clearTimeout)}),(t,s)=>(g(),x("div",{ref_key:"root",ref:O,class:"serp-demo overflow-hidden rounded-xl border border-line shadow-lift",role:"img","aria-label":"Demonstration: as each Google search is typed, the KWS Everywhere extension injects a bar above the search box showing average monthly search volume, CPC range, competition, a 12-month trend, trend direction, an SEO opportunity score and estimated traffic value."},[e("div",ue,[s[1]||(s[1]=e("div",{class:"flex items-center gap-1.5"},[e("span",{class:"h-2.5 w-2.5 rounded-full bg-red-500/80"}),e("span",{class:"h-2.5 w-2.5 rounded-full bg-amber-500/80"}),e("span",{class:"h-2.5 w-2.5 rounded-full bg-emerald-500/80"})],-1)),e("div",de,[s[0]||(s[0]=e("svg",{viewBox:"0 0 20 20",class:"h-3.5 w-3.5 opacity-60",fill:"currentColor","aria-hidden":"true"},[e("path",{"fill-rule":"evenodd",d:"M10 1a4.5 4.5 0 00-4.5 4.5V9H5a2 2 0 00-2 2v6a2 2 0 002 2h10a2 2 0 002-2v-6a2 2 0 00-2-2h-.5V5.5A4.5 4.5 0 0010 1zm3 8V5.5a3 3 0 10-6 0V9h6z","clip-rule":"evenodd"})],-1)),e("span",pe,"google.com/search?q="+i(encodeURIComponent(a(q))),1)]),s[2]||(s[2]=e("div",{class:"flex items-center gap-1.5 rounded-full border border-ok/20 bg-ok-soft px-2 py-0.5 text-[11px] font-semibold text-ok"},[e("span",{class:"h-1.5 w-1.5 animate-pulse rounded-full bg-ok"}),e("span",{class:"hidden sm:inline"},"KWS Extension Live"),e("span",{class:"sm:hidden"},"Active")],-1))]),e("div",ve,[e("div",me,[s[10]||(s[10]=e("span",{class:"kws-mark","aria-hidden":"true"},[e("img",{src:ce,alt:"",width:"18",height:"18"})],-1)),e("div",fe,[s[3]||(s[3]=e("span",{class:"kws-label"},"VOL:",-1)),e("span",{class:h(["kws-value tabular-nums",a(l)?"is-live":""]),style:v({color:a(l)?"var(--kws-good)":"var(--kws-muted)"})}
1,i(a(l)?a(b).toLocaleString():"â"),7)]),e("div",we,[s[4]||(s[4]=e("span",{class:"kws-label"},"CPC:",-1)),e("span",{class:h(["kws-value",a(l)?"is-live":""]),style:v({color:a(l)?"var(--kws-warn)":"var(--kws-muted)"})},i(a(l)?a(z):"â"),7)]),e("div",he,[s[5]||(s[5]=e("span",{class:"kws-label"},"COMP:",-1)),e("span",{class:h(["kws-value uppercase tracking-wide",a(l)?"is-live":""]),style:v({color:a(l)?a(D).color:"var(--kws-muted)"})},i(a(l)?a(D).label:"â"),7)]),e("div",ge,[s[6]||(s[6]=e("span",{class:"kws-label"},"12M VOL:",-1)),e("div",xe,[(g(!0),x(N,null,P(a(B),(r,o)=>(g(),x("span",{key:o,class:"kws-trend-bar",style:v({height:a(A)?`${Math.max(8,r*22)}px`:"2px",transitionDelay:`${o*45}ms`})},null,4))),128))])]),e("div",be,[s[7]||(s[7]=e("span",{class:"kws-label"},"DIR:",-1)),e("span",{class:h(["kws-value",a(d)?"is-live":""]),style:v({color:a(d)?a(I).color:"var(--kws-muted)"})},i(a(d)?a(I).text:"â"),7)]),e("div",ke,[s[8]||(s[8]=e("span",{class:"kws-label"},"SEO:",-1)),e("span",{class:h(["kws-value",a(d)?"is-live":""]),style:v({color:a(d)?a(T).color:"var(--kws-muted)"})},i(a(d)?a(T).score:"â"),7)]),e("div",ye,[s[9]||(s[9]=e("span",{class:"kws-label"},"VAL:",-1)),e("span",{class:h(["kws-value",a(d)?"is-live":""]),style:v({color:a(d)?"var(--kws-good)":"var(--kws-muted)"})},i(a(d)?`$${a(Y).toLocaleString()}`:"â"),7)]),s[11]||(s[11]=j('<div class="ml-auto flex items-center gap-1.5 pl-3" data-v-7a1236be><span class="kws-action" aria-hidden="true" data-v-7a1236be><svg viewBox="0 0 24 24" class="h-3.5 w-3.5" fill="none" stroke="currentColor" stroke-width="2" data-v-7a1236be><circle cx="12" cy="12" r="3" data-v-7a1236be></circle><path d="M19.4 15a1.7 1.7 0 00.3 1.9l.1.1a2 2 0 11-2.8 2.8l-.1-.1a1.7 1.7 0 00-1.9-.3 1.7 1.7 0 00-1 1.5V21a2 2 0 11-4 0v-.1A1.7 1.7 0 008 19.4a1.7 1.7 0 00-1.9.3l-.1.1a2 2 0 11-2.8-2.8l.1-.1a1.7 1.7 0 00.3-1.9 1.7 1.7 0 00-1.5-1H2a2 2 0 110-4h.1A1.7 1.7 0 004.6 8a1.7 1.7 0 00-.3-1.9l-.1-.1a2 2 0 112.8-2.8l.1.1a1.7 1.7 0 001.9.3H9a1.7 1.7 0 001-1.5V2a2 2 0 114 0v.1a1.7 1.7 0 001 1.5 1.7 1.7 0 001.9-.3l.1-.1a2 2 0 112.8 2.8l-.1.1a1.7 1.7 0 00-.3 1.9V9a1.7 1.7 0 001.5 1H22a2 2 0 110 4h-.1a1.7 1.7 0 00-1.5 1z" data-v-7a1236be></path></svg></span></div>',1))])]),e("div",_e,[e("div",Me,[s[16]||(s[16]=j('<span class="g-wordmark select-none" aria-hidden="true" data-v-7a1236be><span style="color:#4285f4;" data-v-7a1236be>G</span><span style="color:#ea4335;" data-v-7a1236be>o</span><span style="color:#fbbc05;" data-v-7a1236be>o</span><span style="color:#4285f4;" data-v-7a1236be>g</span><span style="color:#34a853;" data-v-7a1236be>l</span><span style="color:#ea4335;" data-v-7a1236be>e</span></span>',1)),e("div",Le,[e("span",Ve,[re(i(a(q)),1),a(X)?(g(),x("span",Ce)):le("",!0)]),e("div",{class:h(["hidden items-center gap-3 font-mono text-[10.5px] transition-opacity duration-500 sm:flex",a(l)?"opacity-100":"opacity-0"])},[e("span",null,[s[12]||(s[12]=e("span",{class:"g-t3"},"VOL:",-1)),e("span",Oe,i(a(u).volume.toLocaleString()),1)]),e("span",null,[s[13]||(s[13]=e("span",{class:"g-t3"},"CPC:",-1)),e("span",$e,i(a(z)),1)]),e("span",Se,[s[14]||(s[14]=e("span",{class:"g-t3 mr-1"},"12M VOL:",-1)),(g(!0),x(N,null,P(a(B),(r,o)=>(g(),x("span",{key:o,class:"kws-trend-bar w-[3px]",style:v({height:a(A)?`${Math.max(4,r*13)}px`:"1px",transitionDelay:`${o*45}ms`})},null,4))),128))])],2),s[15]||(s[15]=e("svg",{viewBox:"0 0 24 24",class:"g-t3 h-4 w-4 shrink-0",fill:"none",stroke:"currentColor","stroke-width":"2","aria-hidden":"true"},[e("circle",{cx:"11",cy:"11",r:"7"}),e("path",{d:"M20 20l-3.5-3.5"})],-1))])])])],512))}}),Be=Object.assign(ie(He,[["__scopeId","data-v-7a1236be"]]),{__name:"SerpDemo"});export{Be as _};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.