1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[7703],{7703:function(e,a,n){n.r(a),n.d(a,{default:function(){return c}});var r=n(7437),t=n(2265);let s={warmGold:"var(--warm-gold)",sand100:"var(--sand-100)"},i=[{name:"Sarah Chen",email:"[email protected]",ssn:"284-19-7653",phone:"+1 415-892-3041",avatar:"SC"},{name:"Marcus Webb",email:"[email protected]",ssn:"531-77-0294",phone:"+1 212-555-8817",avatar:"MW"},{name:"Elena Ruiz",email:"[email protected]",ssn:"719-42-8106",phone:"+44 20-7946-0958",avatar:"ER"},{name:"James Okafor",email:"[email protected]",ssn:"603-88-1542",phone:"+1 650-331-7720",avatar:"JO"}],o=["name","email","ssn","phone"],l={name:"[PERSON]",email:"[EMAIL]",ssn:"[SSN]",phone:"[PHONE]"},d={name:"PII detected",email:"Email pattern",ssn:"Gov. ID detected",phone:"Phone number"},g="SELECT name, email, ssn, phone FROM customers LIMIT 4;";function c(){let[e,a]=(0,t.useState)("idle"),[n,c]=(0,t.useState)(0),[h,u]=(0,t.useState)(i.map(()=>"hidden")),[b,x]=(0,t.useState)(new Set),[y,v]=(0,t.useState)(new Set),[w,k]=(0,t.useState)(i.map(()=>-1)),[j,I]=(0,t.useState)(!1),S=(0,t.useRef)([]),z=(0,t.useRef)([]),F=(0,t.useCallback)(()=>{S.current.forEach(clearTimeout),z.current.forEach(clearInterval),S.current=[],z.current=[]},[]),E=(0,t.useCallback)((e,a)=>{let n=setTimeout(e,a);return S.current.push(n),n},[]);(0,t.useEffect)(()=>{let e=!1,n=()=>{e||(a("idle"),c(0),u(i.map(()=>"hidden")),x(new Set),v(new Set),k(i.map(()=>-1)),I(!1),E(()=>{if(e)return;a("typing");let n=0,r=setInterval(()=>{if(e){clearInterval(r);return}c(++n),n>=g.length&&clearInterval(r)},2e3/g.length);z.current.push(r)},600),E(()=>{e||a("executing")},2800),E(()=>{if(e)return;a("streaming"),i.forEach((a,n)=>{let r=900*n;E(()=>{e||u(e=>{let a=[...e];return a[n]="raw",a})},r),E(()=>{if(e)return;u(e=>{let a=[...e];return a[n]="scanning",a});let a=0,r=setInterval(()=>{if(e){clearInterval(r);return}let t=Math.min(++a/30,1);k(e=>{let a=[...e];return a[n]=t,a}),a>=30&&clearInterval(r)},700/30);z.current.push(r)},r+400),o.forEach((a,t)=>{let s=r+500+120*t;E(()=>{e||x(e=>{let r=new Set(e);return r.add("".concat(n,"-").concat(a)),r})},s),E(()=>{if(e)return;let r="".concat(n,"-").concat(a);v(e=>{let a=new Set(e);return a.add(r),a}),E(()=>{e||v(e=>{let a=new Set(e);return a.delete(r),a})},900)},s+80)}),E(()=>{e||(u(e=>{let a=[...e];return a[n]="masked",a}),k(e=>{let a=[...e];return a[n]=-1,a}))},r+500+120*o.length+200)});let r=(i.length-1)*900+500+120*o.length+500;E(()=>{e||(a("done"),I(!0))},r),E(()=>{e||n()},r+3e3)},3800))};return n(),()=>{e=!0,F()}},[E,F]);let M=a=>{let n=["idle","typing","executing","streaming","done"];return n.indexOf(e)>=n.indexOf(a)};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("link",{rel:"stylesheet",href:"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap"}),(0,r.jsx)("style",{children:"\n @keyframes cursorBlink {\n 0%, 100% { opacity: 1; } 50% { opacity: 0; }\n }\n @keyframes dotPulse {\n 0%, 80%, 100% { opacity: 0.2; transform: scale(0.8); }\n 40% { opacity: 1; transform: scale(1); }\n }\n @keyframes maskFlip {\n 0% { opacity: 0; transform: scaleX(0.7); filter: blur(3px); }\n 60% { opacity: 1; transform: scaleX(1.03); filter: blur(0); }\n 100% { opacity: 1; transform: scaleX(1); filter: blur(0); }\n }\n @keyframes detectionFloat {\n 0% { opacity: 0; transform: translateY(4px) scale(0.9); }\n 20% { opacity: 1; transform: translateY(-2px) scale(1); }\n 80% { opacity: 1; transform: translateY(-2px) scale(1); }\n 100% { opacity: 0; transform: translateY(-8px) scale(0.95); }\n }\n @keyframes shieldIn {\n 0% { opacity: 0; transform: scale(0.6); }\n 60% { opacity: 1; transform: scale(1.08); }\n 100% { opacity: 1; transform: scale(1); }\n }\n @keyframes statusPulse {\n 0%, 100% { opacity: 0.5; } 50% { opacity: 1; }\n }\n @keyframes glowPulse {\n 0%, 100% { box-shadow: 0 0 0 0 rgba(var(--warm-gold-rgb),0); }\n 50% { box-shadow: 0 0 16px 2px rgba(var(--warm-gold-rgb),0.12); }\n }\n "}),(0,r.jsxs)("div",{style:{background:"linear-gradient(135deg, var(--gradient-dark-start) 0%, var(--gradient-dark-mid) 35%, var(--gradient-dark-end) 70%, var(--bronze) 100%)",borderRadius:14,padding:"32px 36px 28px",fontFamily:"'Inter', system-ui, sans-serif",position:"relative",overflow:"hidden",maxWidth:720,margin:"0 auto",height:520},children:[(0,r.jsx)("div",{style:{position:"absolute",top:"-30%",right:"-10%",width:"60%",height:"160%",background:"radial-gradient(ellipse at center, rgba(var(--warm-gold-rgb),0.12) 0%, transparent 70%)",pointerEvents:"none"}}),(0,r.jsxs)("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:18,position:"relative",zIndex:1},children:[(0,r.jsxs)("div",{style:{display:"flex",alignItems:"center",gap:10},children:[(0,r.jsx)(m,{done:j,active:M("streaming")}),(0,r.jsx)("span",{style:{fontFamily:"'Inter', sans-serif",fontSize:14,fontWeight:600,color:s.sand100,letterSpacing:"-0.01em"},children:"Data Masking"}),(0,r.jsx)(f,{phase:e})]}),(0,r.jsx)("div",{style:{display:"flex",gap:6},children:[0,1,2].map(e=>(0,r.jsx)("div",{style:{width:8,height:8,borderRadius:"50%",background:"rgba(var(--sand-100-rgb),0.10)"}},e))})]}),(0,r.jsxs)("div",{style:{background:"rgba(var(--sand-100-rgb),0.03)",border:"1px solid rgba(var(--sand-100-rgb),0.06)",borderRadius:8,padding:"13px 16px",marginBottom:14,position:"relative",zIndex:1,minHeight:42,display:"flex",alignItems:"center"},children:[(0,r.jsx)("span",{style:{fontFamily:"'JetBrains Mono', monospace",fontSize:13,color:"rgba(var(--sand-100-rgb),0.25)",marginRight:10,userSelect:"none"},children:">"}),(0,r.jsxs)("span",{style:{fontFamily:"'JetBrains Mono', monospace",fontSize:13,lineHeight:1.5},children:[M("typing")?(0,r.jsx)(p,{text:g,chars:"typing"===e?n:g.length}):(0,r.jsx)("span",{style:{color:"rgba(var(--sand-100-rgb),0.15)"},children:"Enter a query..."}),("typing"===e||"idle"===e)&&(0,r.jsx)("span",{style:{display:"inline-block",width:2,height:14,background:s.warmGold,marginLeft:1,verticalAlign:"text-bottom",animation:"cursorBlink 1s infinite"}})]}),"executing"===e&&(0,r.jsx)("span",{style:{marginLeft:"auto",display:"flex",gap:4,alignItems:"center"},children:[0,1,2].map(e=>(0,r.jsx)("span",{style:{width:5,height:5,borderRadius:"50%",background:s.warmGold,animation:"dotPulse 1.2s ".concat(.2*e,"s infinite")}},e))})]}),(0,r.jsxs)("div",{style:{background:M("streaming")?"rgba(var(--sand-100-rgb),0.04)":"transparent",border:M("streaming")?"1px solid rgba(var(--sand-100-rgb),0.08)":"1px solid transparent",borderRadius:10,overflow:"hidden",position:"relative",zIndex:1,opacity:M("streaming")?1:0,transition:"opacity 0.4s ease, background 0.4s ease, border-color 0.4s ease",animation:j?"glowPulse 2s ease-in-out":void 0},children:[(0,r.jsxs)("div",{style:{display:"grid",gridTemplateColumns:"32px 1.2fr 1.4fr 1fr 1.1fr",padding:"9px 14px",borderBottom:"1px solid rgba(var(--sand-100-rgb),0.06)",background:"rgba(var(--sand-100-rgb),0.02)"},children:[(0,r.jsx)("span",{}),o.map(e=>(0,r.jsx)("span",{style:{fontFamily:"'JetBrains Mono', monospace",fontSize:10,fontWeight:500,color:"rgba(var(--sand-100-rgb),0.20)",textTransform:"uppercase",letterSpacing:"0.08em"},children:e},e))]}),i.map((e,a)=>{let n=h[a],t="hidden"!==n,g="scanning"===n,c=w[a];return(0,r.jsxs)("div",{style:{display:"grid",gridTemplateColumns:"32px 1.2fr 1.4fr 1fr 1.1fr",padding:"10px 14px",borderBottom:a<i.length-1?"1px solid rgba(var(--sand-100-rgb),0.04)":"none",opacity:t?1:0,transform:t?"translateX(0)":"translateX(-6px)",transition:"opacity 0.3s ease, transform 0.3s ease",position:"relative",background:g?"rgba(var(--warm-gold-rgb),0.04)":"transparent"},children:[g&&c>=0&&(0,r.jsx)("div",{style:{position:"absolute",top:0,left:"".concat(100*c,"%"),width:2,height:"100%",background:s.warmGold,boxShadow:"0 0 12px 3px rgba(var(--warm-gold-rgb),0.3), -20px 0 30px 8px rgba(var(--warm-gold-rgb),0.08)",zIndex:3,transition:"left 23ms linear"}}),g&&c>=0&&(0,r.jsx)("div",{style:{position:"absolute",top:0,left:0,width:"".concat(100*c,"%"),height:"100%",background:"linear-gradient(90deg, transparent 60%, rgba(var(--warm-gold-rgb),0.05) 100%)",zIndex:2,pointerEvents:"none"}}),(0,r.jsx)("div",{style:{width:22,height:22,borderRadius:"50%",background:"rgba(var(--sand-100-rgb),0.06)",display:"flex",alignItems:"center",justifyContent:"center",fontFamily:"'Inter', sans-serif",fontSize:8,fontWeight:600,color:"rgba(var(--sand-100-rgb),0.30)",zIndex:4},children:e.avatar}),o.map(t=>{let i="".concat(a,"-").concat(t),o=b.has(i),g=y.has(i);return(0,r.jsxs)("div",{style:{display:"flex",alignItems:"center",minHeight:22,overflow:"visible",position:"relative",zIndex:4},children:[o?(0,r.jsx)("span",{style:{fontFamily:"'JetBrains Mono', monospace",fontSize:11.5,fontWeight:600,color:s.warmGold,animation:"maskFlip 0.35s ease-out forwards",display:"inline-block",whiteSpace:"nowrap"},children:l[t]}):(0,r.jsx)("span",{style:{fontFamily:"'JetBrains Mono', monospace",fontSize:11.5,fontWeight:400,color:"raw"===n?"rgba(var(--sand-100-rgb),0.35)":"rgba(var(--sand-100-rgb),0.55)",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",transition:"color 0.2s ease"},children:e[t]}),g&&(0,r.jsx)("span",{style:{position:"absolute",top:-18,left:0,fontFamily:"'Inter', sans-serif",fontSize:9,fontWeight:600,color:s.warmGold,background:"rgba(var(--espresso-rgb),0.92)",border:"1px solid rgba(var(--warm-gold-rgb),0.25)",padding:"1px 7px",borderRadius:4,whiteSpace:"nowrap",animation:"detectionFloat ".concat(900,"ms ease-out forwards"),zIndex:10,pointerEvents:"none",letterSpacing:"0.02em"},children:d[t]})]},t)})]},a)}),(0,r.jsxs)("div",{style:{padding:"9px 14px",borderTop:"1px solid rgba(var(--sand-100-rgb),0.06)",display:"flex",alignItems:"center",justifyContent:"space-between",minHeight:32},children:[(0,r.jsx)("span",{style:{fontFamily:"'Inter', sans-serif",fontSize:11,color:"rgba(var(--sand-100-rgb),0.20)"},children:j?"4 rows returned, 16 fields masked":"streaming"===e?"Intercepting results...":"\xa0"}),"streaming"===e&&!j&&(0,r.jsx)("span",{style:{fontFamily:"'JetBrains Mono', monospace",fontSize:10,
1color:s.warmGold,animation:"statusPulse 1s infinite"},children:"In-transit masking"}),j&&(0,r.jsxs)("span",{style:{fontFamily:"'JetBrains Mono', monospace",fontSize:10,fontWeight:500,color:s.warmGold,display:"flex",alignItems:"center",gap:5},children:[(0,r.jsx)("svg",{width:"10",height:"10",viewBox:"0 0 16 16",fill:"none",children:(0,r.jsx)("path",{d:"M3 8.5L6.5 12L13 4",stroke:s.warmGold,strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),"Zero-config protection"]})]})]}),(0,r.jsx)("div",{style:{display:"flex",gap:8,marginTop:12,position:"relative",zIndex:1,opacity:j?1:0,transform:j?"translateY(0)":"translateY(4px)",transition:"opacity 0.5s ease, transform 0.5s ease",height:20},children:["No schema required","GDPR","HIPAA","PCI DSS"].map(e=>(0,r.jsx)("span",{style:{fontFamily:"'Inter', sans-serif",fontSize:10,fontWeight:600,textTransform:"uppercase",color:"rgba(var(--sand-100-rgb),0.25)",background:"rgba(var(--sand-100-rgb),0.04)",padding:"2px 8px",borderRadius:99,letterSpacing:"0.04em"},children:e},e))})]})]})}function p(e){let a,{text:n,chars:t}=e,s=n.slice(0,t),i=/\b(SELECT|FROM|LIMIT)\b/g,o=[],l=0;for(;null!==(a=i.exec(s));)a.index>l&&o.push({t:s.slice(l,a.index),kw:!1}),o.push({t:a[0],kw:!0}),l=i.lastIndex;return l<s.length&&o.push({t:s.slice(l),kw:!1}),(0,r.jsx)(r.Fragment,{children:o.map((e,a)=>(0,r.jsx)("span",{style:{color:e.kw?"rgba(var(--sand-100-rgb),0.12)":"var(--sand-300)"},children:e.t},a))})}function m(e){let{active:a,done:n}=e;return(0,r.jsxs)("svg",{width:"18",height:"18",viewBox:"0 0 20 20",fill:"none",style:{animation:n?"shieldIn 0.5s ease-out":void 0,opacity:a?1:.3,transition:"opacity 0.4s ease"},children:[(0,r.jsx)("path",{d:"M10 2L3 5.5V10C3 14.5 6 17.5 10 19C14 17.5 17 14.5 17 10V5.5L10 2Z",fill:n?"rgba(var(--warm-gold-rgb),0.15)":"rgba(var(--sand-100-rgb),0.05)",stroke:n?"var(--warm-gold)":"rgba(var(--sand-100-rgb),0.15)",strokeWidth:"1.2"}),n&&(0,r.jsx)("path",{d:"M7 10.5L9 12.5L13 8",stroke:"var(--warm-gold)",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}function f(e){let{phase:a}=e,n={idle:{label:"Ready",gold:!1},typing:{label:"Composing",gold:!1}
1,executing:{label:"Querying",gold:!1},streaming:{label:"Intercepting",gold:!0},done:{label:"Protected",gold:!0}},t=n[a]||n.idle;return(0,r.jsx)("span",{style:{fontFamily:"'Inter', sans-serif",fontSize:10,fontWeight:600,textTransform:"uppercase",letterSpacing:"0.06em",color:t.gold?s.warmGold:"rgba(var(--sand-100-rgb),0.18)",background:t.gold?"rgba(var(--warm-gold-rgb),0.10)":"rgba(var(--sand-100-rgb),0.04)",padding:"2px 8px",borderRadius:99,transition:"all 0.3s ease"},children:t.label})}}}]);
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.