1import{j as A,r as p,c as m,l as T,x as N,d as o,o as l,e,t as d,g as f,_ as B,n as z,F as _,f as b,p as v,G as I,q as V}from"#entry";import{_ as Y}from"./MFadBstC.js";const $={class:"relative py-16 bg-gray-50 dark:bg-gray-900"},G={class:"container mx-auto px-4"},H={class:"text-center max-w-3xl mx-auto mb-12"},O={class:"text-2xl sm:text-3xl font-semibold mb-3 tracking-tight text-gray-900 dark:text-white"},W={class:"text-base font-normal text-gray-500 dark:text-gray-400"},X={class:"hidden md:block relative group"},D={class:"max-w-5xl mx-auto relative"},M={class:"overflow-hidden mx-2"},J={key:0,class:"absolute top-2 right-2 rounded px-1.5 py-0.5 text-[10px] font-bold uppercase leading-none bg-purple-500 text-white"},K={key:1,class:"absolute bottom-0 left-0 right-0 px-3 py-2 bg-gradient-to-t from-black/70 to-transparent"},Q={class:"text-sm font-medium text-white"},U={class:"md:hidden relative px-12"},Z={class:"max-w-sm mx-auto relative"},ee={class:"overflow-hidden"},te={class:"relative w-56 h-72 rounded-2xl overflow-hidden shadow-lg"},ae={key:0,class:"absolute top-2 right-2 rounded px-1.5 py-0.5 text-[10px] font-bold uppercase leading-none bg-purple-500 text-white"},se={key:1,class:"absolute bottom-0 left-0 right-0 px-3 py-2 bg-gradient-to-t from-black/70 to-transparent"},ne={class:"text-sm font-medium text-white"},oe={class:"flex justify-center mt-6 gap-2"},le=["onClick"],re=A({__name:"YLandingFeature_16",props:{title:{default:"Get Inspired by Our Endless Funny Talking Avatars"},description:{default:"Turn anything into your own fun and unique talking photo."},images:{default:()=>[{url:"https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=300&h=300&fit=crop&crop=face",alt:"1"},{url:"https://images.unsplash.com/photo-1494790108755-2616b612b786?w=300&h=300&fit=crop&crop=face",alt:"2"},{url:"https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=300&h=300&fit=crop&crop=face",alt:"3"},{url:"https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=300&h=300&fit=crop&crop=face",alt:"4"},{url:"https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=300&h=300&fit=crop&crop=face",alt:"5"}]},imgProps:{default:()=>({loading:"lazy",format:"webp",quality:80})}},setup(L){const t=L,r=p(0),i=p(!1),h=p(),g=p(),x=m(()=>[...t.images,...t.images,...t.images]),q=m(()=>t.images.length);T(()=>{r.value=q.value});const y=p(196);T(()=>{N(()=>{const a=h.value?.children[0];a&&(y.value=a.offsetWidth+16)})});const E=m(()=>`translateX(-${r.value*y.value}px)`),P=m(()=>`translateX(-${r.value*100}%)`);function w(a){return new Promise(c=>{const n=()=>{a.removeEventListener("transitionend",n),c()};a.addEventListener("transitionend",n,{once:!0}),setTimeout(()=>{a.removeEventListener("transitionend",n),c()},600)})}function k(a){const c=h.value,n=g.value;!c||!n||(c.style.transition="none",n.style.transition="none",r.value=a,c.offsetHeight,n.offsetHeight,requestAnimationFrame(()=>{c.style.transition="",n.style.transition=""}))}async function C(){if(i.value)return;i.value=!0,r.value++;const a=h.value||g.value;if(!a){i.value=!1;return}await w(a),r.value>=t.images.length*2&&requestAnimationFrame(()=>{k(t.images.length)}),i.value=!1}async function j(){if(i.value)return;i.value=!0,r.value--;const a=h.value||g.value;if(!a){i.value=!1;return}await w(a),r.value<t.images.length&&requestAnimationFrame(()=>{k(t.images.length*2-1)}),i.value=!1}const R=m(()=>((r.value-t.images.length)%t.images.length+t.images.length)%t.images.length);function S(a){i.value||(r.value=t.images.length+a)}return(a,c)=>{const n=B,F=Y;return l(),o("section",$,[e("div",G,[e("div",H,[e("h2",O,d(t.title),1),e("p",W,d(t.description),1)]),e("div",X,[e("div",D,[e("button",{onClick:j,class:"absolute left-2 top-1/2 -translate-y-1/2 z-20 w-10 h-10 bg-white/90 backdrop-blur-sm rounded-full shadow-lg flex items-center justify-center hover:bg-white transition-all cursor-pointer opacity-0 group-hover:opacity-100"},[f(n,{name:"bi:chevron-left",class:"w-5 h-5"})]),e("div",M,[e("div",{ref_key:"desktopContainerRef",ref:h,class:"flex gap-4 transition-transform duration-500 ease-in-out",style:z({transform:E.value})},[(l(!0),o(_,null,b(x.value,(s,u)=>(l(),o("div",{key:u,class:"relative flex-shrink-0 w-44 h-56 rounded-2xl overflow-hidden shadow-lg"},[f(F,I({src:s.url,alt:s.alt},{ref_for:!0},t.imgProps,{class:"w-full h-full object-cover"}),null,16,["src","alt"]),s.badge?(l(),o("span",J,d(s.badge),1)):v("",!0),s.caption?(l(),o("div",K,[e("span",Q,d(s.caption),1)])):v("",!0)]))),128))],4)]),e("button",{onClick:C,class:"absolute right-2 top-1/2 -translate-y-1/2 z-20 w-10 h-10 bg-white/90 backdrop-blur-sm rounded-full shadow-lg flex items-center justify-center hover:bg-white transition-all cursor-pointer opacity-0 group-hover:opacity-100"},[f(n,{name:"bi:chevron-right",class:"w-5 h-5"})])])]),e("div",U,[e("div",Z,[e("button",{onClick:j,class:"absolute left-0 top-1/2 -translate-y-1/2 -translate-x-full z-20 w-10 h-10 bg-white rounded-full shadow-lg flex items-center justify-center hover:bg-gray-50 transition-colors active:scale-95"},[f(n,{name:"bi:chevron-left",class:"w-5 h-5"})]),e("div",ee,[e("div",{ref_key:"mobileContainerRef",ref:g,class:"flex transition-transform duration-500 ease-in-out",style:z({transform:P.value})},[(l(!0),o(_,null,b(x.value,(s,u)=>(l(),o("div",{key:u,class:"flex-shrink-0 w-full flex justify-center"},[e("div",te,[f(F,I({src:s.url,alt:s.alt},{ref_for:!0},t.imgProps,{class:"w-full h-full object-cover"}),null,16,["src","alt"]),s.badge?(l(),o("span",ae,d(s.badge),1)):v("",!0),s.caption?(l(),o("div",se,[e("span",ne,d(s.caption),1)])):v("",!0)])]))),128))],4)]),e("button",{onClick:C,class:"absolute right-0 top-1/2 -translate-y-1/2 translate-x-full z-20 w-10 h-10 bg-white rounded-full shadow-lg flex items-center justify-center hover:bg-gray-50 transition-colors active:scale-95"},[f(n,{name:"bi:chevron-right",class:"w-5 h-5"})])]),e("div",oe,[(l(!0),o(_,null,b(t.images,(s,u)=>(l(),o("button",{key:u,onClick:ie=>S(u),class:V(["w-2 h-2 rounded-full transition-colors",u===R.value?"bg-blue-600":"bg-gray-300"])},null,10,le))),128))])])])])}}}),de=Object.assign(re,{__name:"YLandingFeature16"});export{de as default};
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.