https://khanuul.mn/assets/Reels-QvPyb3bq.js

1import{c as f,q as u,r,j as e,m as n,F as b,C as g,E as w,i as j}from"./index-wYRL2VEK.js";import{S as y}from"./SEO-BCYnhRcM.js";import{T as v}from"./trending-up-BWMY6f0-.js";import{C as N}from"./clock-CSnqGmCz.js";import{A as k}from"./index-BKyeRz1R.js";/**
2 * @license lucide-react v0.553.0 - ISC
3 *
4 * This source code is licensed under the ISC license.
5 * See the LICENSE file in the root directory of this source tree.
6 */const F=[["path",{d:"M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z",key:"10ikf1"}]],E=f("play",F);/**
7 * @license lucide-react v0.553.0 - ISC
8 *
9 * This source code is licensed under the ISC license.
10 * See the LICENSE file in the root directory of this source tree.
11 */const R=[["path",{d:"m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5",key:"ftymec"}],["rect",{x:"2",y:"6",width:"14",height:"12",rx:"2",key:"158x01"}]],L=f("video",R),S="/reels",B=()=>u.get(S),m="https://www.facebook.com/khanuuldist";let h=!1;function _({url:i}){const a=r.useRef(null),[c,d]=r.useState(null),[l,s]=r.useState(!0);return r.useEffect(()=>{const o=async()=>{try{const t=await u.get("/reels/embed",{params:{url:i,width:500}});t.data?.html?d(t.data.html):x()}catch(t){console.error("Facebook embed error:",t),x()}finally{s(!1)}},x=()=>{window.FB&&a.current&&window.FB.XFBML.parse(a.current)};if(window.FB)setTimeout(x,100);else if(!h){h=!0,window.fbAsyncInit=function(){window.FB.init({xfbml:!0,version:"v18.0"}),a.current&&window.FB.XFBML.parse(a.current)};const t=document.createElement("script");t.src="https://connect.facebook.net/en_US/sdk.js",t.async=!0,t.defer=!0,t.id="facebook-jssdk";const p=document.getElementById("facebook-jssdk");p&&p.remove(),document.body.appendChild(t)}o()},[i]),e.jsxs("div",{className:"relative w-full aspect-[9/16] bg-slate-900 rounded-3xl overflow-hidden shadow-2xl group",children:[l&&e.jsxs("div",{className:"absolute inset-0 flex flex-col items-center justify-center bg-slate-900 z-10",children:[e.jsx(j,{className:"w-8 h-8 text-primary animate-spin mb-4"}),e.jsx("p",{className:"text-slate-500 text-[10px] font-black uppercase tracking-widest",children:"Ачааллаж байна"})]}),e.jsx("div",{ref:a,className:"w-full h-full flex items-center justify-center overflow-hidden",children:c?e.jsx("div",{className:"w-full h-full flex items-center justify-center fb-video-container",dangerouslySetInnerHTML:{__html:c}}):e.jsx("div",{className:"fb-video","data-href":i,"data-width":"500","data-allowfullscreen":"true","data-show-text":"false","data-lazy":"true","data-autoplay":"false"})}),e.jsx("div",{className:"absolute inset-0 bg-gradient-to-t from-black/60 via-trans

11parent to-transparent opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none p-6 flex flex-col justify-end",children:e.jsxs("div",{className:"flex items-center gap-2 text-white",children:[e.jsx(E,{className:"w-5 h-5 fill-current"}),e.jsx("span",{className:"font-bold text-sm",children:"Үзэх"})]})})]})}function K(){const[i,a]=r.useState([]),[c,d]=r.useState(!0);return r.useEffect(()=>{(async()=>{try{d(!0);const s=await B(),o=s.data?.data||s.data||[];a(Array.isArray(o)?o:[])}catch(s){console.error("Error fetching reels:",s),a([])}finally{d(!1)}})()},[]),e.jsxs(e.Fragment,{children:[e.jsx(y,{title:"Reels тойм мэдээ | Хан-Уул дүүрэг",description:"Хан-Уул дүүргийн үйл ажиллагааны богино хэмжээний дүрс бичлэг, reels тойм мэдээллүүд."}),e.jsxs("div",{className:"min-h-screen bg-slate-50/50 pb-20",children:[e.jsxs("div",{className:"relative bg-slate-950 pt-32 pb-24 overflow-hidden",children:[e.jsx("div",{className:"absolute top-0 right-0 w-[800px] h-[800px] bg-primary/20 rounded-full blur-[120px] -translate-y-1/2 translate-x-1/4 animate-pulse"}),e.jsx("div",{className:"absolute bottom-0 left-0 w-[600px] h-[600px] bg-blue-600/10 rounded-full blur-[100px] translate-y-1/2 -translate-x-1/4"}),e.jsx("div",{className:"container-wide relative z-10",children:e.jsxs("div",{className:"max-w-4xl mx-auto text-center space-y-8",children:[e.jsxs(n.div,{initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1},className:"inline-flex items-center gap-3 px-6 py-2 rounded-full bg-white/5 border border-white/10 backdrop-blur-xl text-white/90 text-xs font-black uppercase tracking-[0.3em]",children:[e.jsx("div",{className:"w-2 h-2 rounded-full bg-primary animate-ping"}),"Live Feed"]}),e.jsxs(n.h1,{initial:{opacity:0,y:20},animate:{opacity:1,y:0},className:"text-5xl md:text-7xl lg:text-8xl font-black text-white tracking-tighter leading-none",children:["Reels ",e.jsx("span",{className:"text-primary italic",children:"Story"})]}),e.jsx(n.p,{initial:{opacity:0,y:20},animate:{opacity:1,y:0},transition:{delay:.1},className:"text-lg md:text-xl text-slate-400 max-w-2xl mx-auto font-medium",children:"Дүүргийн бүтээн байгуулалт, онцлох үйл явдлуудыг богино хэмжээний Reels дүрс бичлэгээр хүлээн авч үзээрэй."}),e.jsxs(n.div,{initial:{opacity:0,y:20},animate:{opacity:1,y:0},transition:{delay:.2},className:"flex flex-wrap items-center justify-center gap-4",children:[e.jsxs("a",{href:m,target:"_blank",rel:"noopener noreferrer",className:"flex items-center gap-3 px-8 py-4 bg-white text-slate-950 rounded-2xl font-black text-sm hover:bg-primary hover:text-white transition-all duration-500 shadow-xl shadow-white/5",children:[e.jsx(b,{className:"w-5 h-5 fill-current"}),"FACEBOOK ДАГАХ"]}),e.jsxs("div",{className:"flex items-center gap-4 text-white/40 text-[10px] font-black uppercase tracking-widest px-6 border-l border-white/10",children:[e.jsx("div",{className:"flex -space-x-2",children:[1,2,3].map(l=>e.jsx("div",{className:"w-8 h-8 rounded-full border-2 border-slate-950 bg-slate-800"},l))}),e.jsx("span",{children:"10.5K+ Followers"})]})]})]})})]}),e.jsx("div",{className:"container-wide -mt-10 relative z-20",children:e.jsxs("div",{className:"bg-white/80 backdrop-blur-2xl border border-white p-4 rounded-[2.5rem] shadow-premium flex flex-col md:flex-row items-center justify-between gap-6 px-8",children:[e.jsxs("div",{className:"flex items-center gap-8",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"w-10 h-10 rounded-xl bg-primary/10 flex items-center justify-center text-primary",children:e.jsx(v,{className:"w-5 h-5"})}),e.jsxs("div",{children:[e.jsx("div",{className:"text-[10px] font-black text-slate-400 uppercase tracking-widest",children:"Trending"}),e.jsx("div",{className:"text-sm font-bold text-slate-900",children:"Сүүлийн үеийн"})]})]}),e.jsxs("div",{className:"hidden sm:flex items-center gap-3 border-l border-slate-100 pl-8",children:[e.jsx("div",{className:"w-10 h-10 rounded-xl bg-blue-50 flex items-center justify-center text-blue-600",children:e.jsx(N,{className:"w-5 h-5"})}),e.jsxs("div",{children:[e.jsx("div",{className:"text-[10px] font-black text-slate-400 uppercase tracking-widest",children:"Update"}),e.jsx("div",{className:"text-sm font-bold text-slate-900",children:"Өдөр бүр"})]})]})]}),e.jsxs("div",{className:"flex items-center gap-2 p-1.5 bg-slate-100/50 rounded-2xl",children:[e.jsx("button",{className:"px-6 py-2 bg-white text-primary rounded-xl text-xs font-black shadow-sm ring-1 ring-slate-200/50",children:"Бүгд"}),e.jsx("button",{className:"px-6 py-2 text-slate-500 hover:text-slate-900 rounded-xl text-xs font-bold transition-colors",children:"Бүтээн байгуулалт"}),e.jsx("button",{className:"px-6 py-2 text-slate-500 hover:text-slate-900 rounded-xl text-xs font-bold transition-colors",children:"Соёл, урлаг"})]})]})}),e.jsxs("div",{className:"container-wide mt-20",children:[c?e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8",children:[1,2,3,4].map(l=>e.jsxs("div",{className:"aspect-[9/16] bg-slate-200 rounded-3xl animate-pulse flex flex-col items-center justify-center p-12 text-center",children:[e.jsx("div",{className:"w-12 h-12 bg-slate-300 rounded-2xl mb-4"}),e.jsx("div",{className:"h-4 w-24 bg-slate-300 rounded-full mb-2"}),e.jsx("div",{className:"h-3 w-16 bg-slate-300 rounded-full"})]},l))}):i.length===0?e.jsxs("div",{className:"bg-white rounded-[3rem] border border-dashed border-slate-200 p-20 text-center",children:[e.jsx("div",{className:"w-24 h-24 bg-slate-50 rounded-full flex items-center justify-center mx-auto mb-8",children:e.jsx(L,{className:"w-12 h-12 text-slate-200"})}),e.jsx("h3",{className:"text-2xl font-black text-slate-900 mb-4",children:"Reels одоогоор байхгүй байна"}),e.jsx("p",{className:"text-slate-500 mb-8 max-w-md mx-auto font-medium",children:"Та манай Facebook хуудсаар зочилж сүүлийн үеийн мэдээллүүдийг цаг алдалгүй аваарай."}),e.jsxs("a",{href:m,target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center gap-3 px-8 py-4 bg-primary text-white rounded-2xl font-black text-sm hover:bg-primary/90 transition-all shadow-xl shadow-primary/20",children:["FACEBOOK ХУУДАС",e.jsx(g,{className:"w-5 h-5"})]})]}):e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8",children:e.jsx(k,{mode:"popLayout",children:i.map((l,s)=>e.jsx(n.div,{initial:{opacity:0,y:30},whileInView:{opacity:1,y:0},viewport:{once:!0},transition:{delay:s*.1},children:e.jsx(_,{url:l})},s))})}),e.jsxs(n.div,{initial:{opacity:0}

11,whileInView:{opacity:1},className:"mt-32 p-12 rounded-[4rem] bg-gradient-to-br from-slate-900 to-slate-950 text-white relative overflow-hidden",children:[e.jsx("div",{className:"absolute top-0 right-0 w-[400px] h-[400px] bg-primary/10 rounded-full blur-[100px]"}),e.jsxs("div",{className:"relative z-10 flex flex-col lg:flex-row items-center justify-between gap-12",children:[e.jsxs("div",{className:"space-y-6 max-w-xl text-center lg:text-left",children:[e.jsxs("h2",{className:"text-4xl md:text-5xl font-black tracking-tighter leading-none",children:["Дүүргийнхээ өнгө төрхийг ",e.jsx("br",{}),e.jsx("span",{className:"text-primary italic",children:"дижитал"})," хэлбэрээр"]}),e.jsx("p",{className:"text-slate-400 font-medium",children:"Бид иргэддээ мэдээллийг илүү хүртээмжтэй, сонирхолтой хэлбэрээр хүргэхийн тулд нийгмийн сүлжээний бүхий л сувгуудыг ашиглан ажиллаж байна."})]}),e.jsxs("div",{className:"flex flex-col sm:flex-row gap-4",children:[e.jsxs("a",{href:m,target:"_blank",rel:"noopener noreferrer",className:"flex items-center justify-center gap-3 px-10 py-5 bg-primary text-white rounded-[2rem] font-black text-sm hover:scale-105 transition-all shadow-2xl shadow-primary/40",children:["ШУУД ҮЗЭХ",e.jsx(w,{className:"w-5 h-5"})]}),e.jsxs("div",{className:"bg-white/5 border border-white/10 backdrop-blur-xl rounded-[2rem] px-8 py-5 flex items-center gap-4",children:[e.jsx("div",{className:"w-2 h-2 rounded-full bg-green-500 animate-pulse"}),e.jsx("span",{className:"text-xs font-black uppercase tracking-[0.2em] text-white/60",children:"Updated 5m ago"})]})]})]})]})]})]})]})}export{K as default};