1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[2897],{2897:(e,t,i)=>{i.r(t),i.d(t,{default:()=>p});var a=i(5155),r=i(2115),s=i(6766),l=i(7780),n=i(802),o=i(9088);n.Ay.registerPlugin(o.u);let c="Customer reported severe dissatisfaction with product. Texture issues causing dryness and allergic reaction. Requires quality review and return processing.",d=[{label:"Order Number",value:"SH-00493403"},{label:"Concern",value:"Product unsatisfactory"},{label:"Customer Mood",value:"Frustrated"},{label:"Query Class",value:"Product quality complaint"}];function p(){let{onCycleComplete:e}=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=(0,r.useRef)(null),i=(0,r.useRef)(null),p=(0,r.useRef)(null),u=(0,r.useRef)(null),x=(0,r.useRef)(null),f=(0,r.useRef)(null),h=(0,r.useRef)(null),y=(0,r.useRef)(null),m=(0,r.useRef)(null),b=(0,r.useRef)(null),v=(0,r.useRef)(null),g=(0,r.useRef)({shimmer:[],container:[],gradientText:[],normalText:[],dot:[]}),w=(0,r.useRef)(null);(0,l.U)("AutoFilledTicketFields",w,t);let[j,N]=(0,r.useState)(!1),A=(0,r.useRef)(null);return(0,r.useEffect)(()=>{let e=t.current,a=i.current;if(!e||!a)return;let r=()=>{let{width:t,height:i}=e.getBoundingClientRect(),r=Math.min(t/760,i/600),s=Math.min(t<768?1.5*r:r,1);a.style.transform="translate(-50%, -50%) scale(".concat(s,")")},s=new ResizeObserver(r);return s.observe(e),r(),()=>s.disconnect()},[]),(0,r.useEffect)(()=>{let e,t=2*Math.PI*16,i=()=>{if(w.current&&A.current){let e=w.current,i=e.progress()*t;A.current.style.strokeDasharray="".concat(i," ").concat(t);let a=!e.paused();a!==j&&N(a)}e=requestAnimationFrame(i)};return e=requestAnimationFrame(i),()=>cancelAnimationFrame(e)},[j]),(0,r.useLayoutEffect)(()=>{let i=n.Ay.matchMedia();return i.add("all",()=>{let{shimmer:i,container:a,gradientText:r,normalText:s,dot:l}=g.current,j=u.current,N=x.current,A=f.current;n.Ay.set([N,A],{position:"absolute",top:0,left:0}),n.Ay.set([N,A],{opacity:1}),n.Ay.set(A,{visibility:"hidden"}),n.Ay.set(N,{position:"relative",visibility:"visible"});let k=j.offsetWidth;n.Ay.set(N,{position:"absolute",visibility:"hidden"}),n.Ay.set(A,{position:"relative",visibility:"visible"});let C=j.offsetWidth;n.Ay.set(N,{position:"relative",visibility:"visible",opacity:1}),n.Ay.set(A,{position:"absolute",visibility:"visible",opacity:0}),n.Ay.set(j,{width:k});let R=y.current,_=m.current,W=b.current;n.Ay.set([_,W],{position:"absolute",top:0,left:0}),n.Ay.set([_,W],{opacity:1}),n.Ay.set(W,{visibility:"hidden"}),n.Ay.set(_,{position:"relative",visibility:"visible"});let z=R.offsetWidth;n.Ay.set(_,{position:"absolute",visibility:"hidden"}),n.Ay.set(W,{position:"relative",visibility:"visible"});let I=R.offsetWidth;n.Ay.set(_,{position:"relative",visibility:"visible",opacity:1}),n.Ay.set(W,{position:"absolute",visibility:"visible",opacity:0}),n.Ay.set(R,{width:z}),n.Ay.set(p.current,{opacity:1,top:224,filter:"blur(0px)"}),n.Ay.set(u.current,{opacity:0}),n.Ay.set(h.current,{opacity:0,scale:0,transformOrigin:"bottom right"}),v.current&&(v.current.textContent="");for(let e=0;e<4;e++)n.Ay.set(i[e],{opacity:1}),n.Ay.set(r[e],{opacity:0}),n.Ay.set(s[e],{opacity:0}),n.Ay.set(l[e],{opacity:0}),n.Ay.set(a[e],{borderColor:"transparent"}),r[e]&&(r[e].textContent="");let M=n.Ay.timeline({defaults:{ease:"power2.out"},repeat:-1,repeatDelay:1,paused:!0,onRepeat:e});w.current=M,o.u.create({trigger:t.current,start:"top 80%",end:"bottom 20%",onEnter:()=>M.play(),onLeave:()=>M.pause(),onEnterBack:()=>M.play(),onLeaveBack:()=>M.pause()}),M.to({},{duration:.3}),M.to(p.current,{top:188,duration:.5}),M.to(u.current,{opacity:1,duration:.4},"-=0.2"),M.to({},{duration:1}),M.to(p.current,{top:77,filter:"blur(4px)",duration:.5}),M.to(u.current,{opacity:0,duration:.3},"<"),M.to(h.current,{opacity:1,scale:1,duration:.5,ease:"back.out(1.7)"},"<+=0.1");let T=c.split(" ");M.to({wordIdx:0},{wordIdx:T.length,duration:1.5,ease:"none",onUpdate:function(){let e=Math.round(this.targets()[0].wordIdx);v.current&&(v.current.textContent=T.slice(0,e).join(" "))}},"+=0.2"),M.to({},{duration:.3});let F=function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:.6;M.to(i[e],{opacity:0,duration:.2}),M.to(a[e],{borderColor:"#ff7133",duration:.2},"<"),M.to(r[e],{opacity:1,duration:.1},"<");let s=d[e].value;M.to({val:0},{val:s.length,duration:t,ease:"none",onUpdate:function(){let t=Math.round(this.targets()[0].val);r[e]&&(r[e].textContent=s.substring(0,t))}})},B=e=>{M.to(a[e],{borderColor:"transparent",duration:.2}),M.to(r[e],{opacity:0,duration:.15},"<"),M.to(s[e],{opacity:1,duration:.15}
1,"<"),M.to(l[e],{opacity:1,duration:.2},"<")};F(0),M.to({},{duration:.3}),B(0),F(1),M.to({},{duration:.3}),B(1),F(2),M.to({},{duration:.3}),B(2),F(3,.4),M.to(_,{opacity:0,duration:.3}),M.to(W,{opacity:1,duration:.3},"<"),M.to(R,{width:I,duration:.4,ease:"power2.inOut"},"<"),M.to({},{duration:.5}),B(3),M.to({},{duration:.5}),M.to(h.current,{opacity:0,scale:0,duration:.5,ease:"power2.in"}),M.to(p.current,{top:188,filter:"blur(0px)",duration:.5},"<"),M.set(N,{opacity:0}),M.set(A,{opacity:1}),M.set(j,{width:C}),M.to(u.current,{opacity:1,duration:.4},"<+=0.2"),M.to({},{duration:1.5}),M.to([p.current,u.current],{opacity:0,duration:.6,ease:"power2.in"}),M.set(p.current,{top:224,filter:"blur(0px)",opacity:1}),M.set(u.current,{opacity:0}),M.set(N,{opacity:1}),M.set(A,{opacity:0}),M.set(j,{width:k}),M.set(h.current,{opacity:0,scale:0}),M.call(()=>{v.current&&(v.current.textContent="")}),M.set(_,{opacity:1}),M.set(W,{opacity:0}),M.set(R,{width:z});for(let e=0;e<4;e++)M.set(i[e],{opacity:1}),M.set(r[e],{opacity:0}),M.set(s[e],{opacity:0}),M.set(l[e],{opacity:0}),M.set(a[e],{borderColor:"transparent"});M.call(()=>{for(let e=0;e<4;e++)r[e]&&(r[e].textContent="")}),M.to({},{duration:.3})},t),()=>i.revert()},[]),(0,a.jsxs)("div",{ref:t,className:"relative h-full w-full overflow-hidden rounded-2xl bg-linear-to-b from-[#eaeefe] to-[#fef8f1] md:rounded-3xl","data-name":"Auto filled ticket fields",children:[(0,a.jsx)("style",{children:"\n @keyframes badgeShimmer {\n 0% { transform: translateX(-200%); }\n 100% { transform: translateX(200%); }\n }\n "}),(0,a.jsxs)("div",{ref:i,className:"absolute top-1/2 left-1/2",style:{width:760,height:600,transformOrigin:"center center"},children:[(0,a.jsxs)("div",{ref:p,className:"absolute flex w-[328px] items-start gap-[16px] overflow-hidden rounded-[20px] bg-[rgba(255,255,255,0.8)] p-[16px] shadow-[0px_1px_0px_1px_rgba(131,128,147,0.04),0px_20px_24px_0px_rgba(0,0,0,0.02)]",style:{left:216,top:224},"data-ui":"shadow-card",children:[(0,a.jsx)("div",{className:"relative size-[40px] shrink-0 overflow-hidden rounded-[20px]",children:(0,a.jsx)(s.default,{alt:"User",className:"rounded-[20px] object-cover",src:"/natasha.webp",width:40,height:40})}),(0,a.jsxs)("div",{className:"flex min-h-px min-w-px grow flex-col gap-[4px]",children:[(0,a.jsx)("p",{className:"w-full text-[15px] leading-[1.36] font-normal text-[#3f3d4d]",children:"Hello, I'm very disappointed with this product. The texture is completely off and it's causing severe dryness and an allergic reaction!"}),(0,a.jsx)("div",{className:"flex w-full items-start",children:(0,a.jsxs)("div",{className:"flex min-h-px min-w-px grow items-center gap-[5px]",children:[(0,a.jsx)("p",{className:"text-[12px] leading-[1.36] font-normal whitespace-nowrap text-[#838093]",children:"11.14 AM on Whatsapp"}),(0,a.jsx)("img",{src:"/icons/logo-whatsapp-2.svg",alt:"WhatsApp",width:"12",height:"12",className:"size-3"})]})})]})]}),(0,a.jsxs)("div",{ref:u,className:"absolute left-1/2 flex -translate-x-1/2 items-center gap-[8px] overflow-hidden rounded-[8px] bg-linear-to-r from-[#ff7133] via-[#faa3ff] via-50% to-[#99caff] py-[3px] pr-[12px] pl-[8px]",style:{top:364},"data-ui":"ai-thinking-badge",children:[(0,a.jsx)("img",{src:"/white-icon.svg",alt:"AI",className:"shrink-0",style:{width:12,height:12}}),(0,a.jsxs)("div",{className:"relative",children:[(0,a.jsx)("p",{ref:x,className:"text-[13px] leading-[1.36] font-medium whitespace-nowrap text-white",children:"Getting ticket details..."}),(0,a.jsx)("p",{ref:f,className:"absolute top-0 left-0 text-[13px] leading-[1.36] font-medium whitespace-nowrap text-white",style:{opacity:0},children:"Updated ticket #31290 for escalation"})]})]}),(0,a.jsxs)("div",{ref:h,className:"absolute overflow-hidden rounded-[20px] border border-[#ff7133] p-[24px]",style:{left:196,top:58,width:368,opacity:0,backdropFilter:"blur(16px)",backgroundColor:"rgba(255,255,255,0.75)",boxShadow:"0px 8px 32px 0px rgba(34,58,54,0.12)",transformOrigin:"bottom right"},"data-ui":"main-card",children:[(0,a.jsxs)("div",{className:"mb-[16px] flex items-center justify-between","data-ui":"title-row",children:[(0,a.jsx)("p",{className:"text-[16px] font-semibold text-[#3f3d4d]",children:"Ticket #31290"}),(0,a.jsxs)("div",{ref:y,className:"relative flex items-center gap-[6px] overflow-hidden rounded-[6px] bg-linear-to-r from-[#ff7133] via-[#faa3ff] via-50% to-[#99caff] py-[2px] pr-[10px] pl-[6px]",children:[(0,a.jsx)("div",{className:"pointer-events-none absolute inset-0",style:{background:"linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.35) 50%, transparent 100%)",animation:"badgeShimmer 2s ease-in-out infinite"}}),(0,a.jsx)("img",{src:"/white-icon.svg",alt:"AI",className:"relative shrink-0",style:{width:10,height:10}}),(0,a.jsxs)("div",{className:"relative",children:[(0,a.jsx)("p",{ref:m,className:"text-[11px] leading-[1.36] font-medium whitespace-nowrap text-white",children:"Updating ticket..."}),(0,a.jsx)("p",{ref:b,className:"absolute top-0 left-0 text-[11px] leading-[1.36] font-medium whitespace-nowrap text-white",style:{opacity:0}
1,children:"Updated"})]})]})]}),(0,a.jsxs)("div",{className:"mb-[20px]",children:[(0,a.jsx)("p",{className:"mb-[8px] text-[12px] font-medium text-[#838093]",children:"Summary"}),(0,a.jsxs)("div",{className:"relative text-[13px] leading-[1.5] text-[#3f3d4d]",children:[(0,a.jsx)("span",{style:{opacity:.3},children:c}),(0,a.jsx)("span",{ref:v,className:"absolute inset-0"})]})]}),(0,a.jsx)("div",{className:"flex flex-col gap-[16px]",children:d.map((e,t)=>(0,a.jsxs)("div",{className:"flex flex-col gap-[6px]",children:[(0,a.jsx)("p",{className:"text-[12px] font-medium text-[#838093]",children:e.label}),(0,a.jsxs)("div",{ref:e=>{g.current.container[t]=e},className:"relative h-[40px] overflow-hidden rounded-[8px] bg-white",style:{boxShadow:"0px 1px 2px 0px rgba(0,0,0,0.06), 0px 1px 3px 0px rgba(0,0,0,0.10)",border:"1.5px solid transparent"},"data-ui":"autofill-field-".concat(t+1),children:[(0,a.jsx)("div",{ref:e=>{g.current.shimmer[t]=e},className:"absolute top-1/2 left-1/2 h-[16px] w-[calc(100%-24px)] -translate-x-1/2 -translate-y-1/2 rounded-[6px] bg-linear-to-r from-[#f1f0f5] to-white","data-ui":"field-shimmer-".concat(t+1)}),(0,a.jsx)("span",{ref:e=>{g.current.gradientText[t]=e},className:"absolute top-1/2 left-[12px] -translate-y-1/2 text-[14px] font-medium whitespace-nowrap",style:{opacity:0,backgroundImage:"linear-gradient(90deg, #ff7133, #e912f6 50%, #99caff)",WebkitBackgroundClip:"text",WebkitTextFillColor:"transparent",backgroundClip:"text"}}),(0,a.jsx)("span",{ref:e=>{g.current.normalText[t]=e},className:"absolute top-1/2 left-[12px] -translate-y-1/2 text-[14px] font-medium whitespace-nowrap text-[#3f3d4d]",style:{opacity:0},children:e.value}),(0,a.jsx)("div",{ref:e=>{g.current.dot[t]=e},className:"absolute top-1/2 right-[12px] size-[10px] -translate-y-1/2 rounded-full",style:{opacity:0,backgroundImage:"radial-gradient(circle at 50% 100%, #ff7133 0%, #fe774d 6.25%, #fe7e66 12.5%, #fc8a99 25%, #fb97cc 37.5%, #faa3ff 50%, #c9b7ff 75%, #99caff 100%)"}})]})]},e.label))})]}),(0,a.jsxs)("button",{onClick:()=>{w.current&&(w.current.paused()?w.current.play():w.current.pause())},className:"absolute bottom-4 left-4 z-10 hidden size-10 cursor-pointer items-center justify-center rounded-full bg-slate-300 transition-colors hover:bg-slate-400 md:flex","aria-label":j?"Pause animation":"Play animation",children:[(0,a.jsxs)("svg",{className:"absolute inset-0 size-10 -rotate-90",viewBox:"0 0 40 40",children:[(0,a.jsx)("circle",{cx:"20",cy:"20",r:"16",fill:"none",stroke:"rgba(255,255,255,0.3)",strokeWidth:"2.5"}),(0,a.jsx)("circle",{ref:A,cx:"20",cy:"20",r:"16",fill:"none",stroke:"white",strokeWidth:"2.5",strokeLinecap:"round",strokeDasharray:"0 100.5"})]}),j?(0,a.jsxs)("svg",{width:"10",height:"10",viewBox:"0 0 12 12",fill:"none",className:"relative z-10",children:[(0,a.jsx)("rect",{x:"1.5",y:"1",width:"3",height:"10",rx:"0.8",fill:"white"}),(0,a.jsx)("rect",{x:"7.5",y:"1",width:"3",height:"10",rx:"0.8",fill:"white"})]}):(0,a.jsx)("svg",{width:"10",height:"10",viewBox:"0 0 12 12",fill:"none",className:"relative z-10 ml-0.5",children:(0,a.jsx)("path",{d:"M1.5 1V11L10.5 6L1.5 1Z",fill:"white"})})]})]})]})}}}]);
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.