https://rabhan.ai/assets/CodingAI-CeccItD0.js

1import{j as e,m as x,a1 as C,af as f,ag as m,c as F,ah as B}from"./vendor-ui-yUq4lLaR.js";import{r as n}from"./vendor-react-Cj1-pPku.js";import{g as S,s as j}from"./index-BIypEwxg.js";import"./vendor-charts-CKKTw-wt.js";import"./vendor-utils-Cwd5pBxD.js";import"./vendor-pdf-GbLtMStn.js";import"./vendor-ai-CZZ1HbHH.js";const A=async(r,h)=>{const t=`
2        You are the Anima AI Ultra-Premium Web Architect. 
3        Your goal is to create a website that feels like a top-tier SaaS or Digital Agency landing page (e.g., Apple, Stripe, Linear).
4        
5        PROJECT DATA:
6        - Project Name: ${r.projectName||"AI Hive Premium Project"}
7        - Activity: ${r.activityType}
8        - Language: ${r.language} (If Arabic: use 'Cairo' font and ensure perfect RTL layout)
9        - Design Style: ${r.style} (Interpret this as an ultra-modern version)
10        - Typography: ${r.fontStyle}
11        - Colors: Primary(${r.primaryColor}), Secondary(${r.secondaryColor})
12        - Pages: ${r.pageCount}
13        - Sections: ${r.sections.join(", ")}
14        - Blog Integration: ${r.hasBlog}
15        
16        ADDITIONAL CONTEXT: "${h||"Create the most attractive version possible."}"
17        
18        DESIGN DIRECTIVES (MANDATORY):
19        1. **Aesthetics**: Use Glassmorphism (semi-transparent backgrounds with backdrop-blur), soft gradients, and high-end drop shadows.
20        2. **Animations**: Use Framer Motion attributes (initial, animate, whileHover) or Tailwind animate- utilities for subtle entrance effects.
21        3. **Layout**: Don't use standard boxes. Use asymmetric grids, large whitespace (breathing room), and modern bento-style layouts.
22        4. **Typography**: Use 'Inter' for English or 'Cairo' for Arabic. Vary font weights (black vs light) for hierarchy.
23        5. **Micro-interactions**: Every button and card must have a smooth hover/active scale or illumination effect.
24        6. **Imagery**: Use high-quality Unsplash source URLs for backgrounds/icons that match the activity.
25        7. **Navigation**: MUST be functional (anchor links + smooth scroll).
26        
27        REQUIREMENTS:
28        - Use Tailwind CSS 3.4+.
29        - Output ONLY a JSON:
30        {
31            "html": "Fully valid HTML5 with Tailwind CDN, Lucide Icons, and Framer Motion CDN",
32            "css": "Any custom keyframe animations or glassmorphism utilities",
33            "js": "Smooth scrolling logic and Framer Motion initialization if needed"
34        }
35        
36        This website MUST WOW the user and look like it cost $10k to build.
37    `;try{const a=await S(t);if(a.startsWith("حدث خطأ")||a.includes("عذراً")||a.startsWith("خطأ:"))throw new Error(a);let l="";const c=a.match(/```(?:json)?\s*([\s\S]*?)\s*```/);if(c&&c[1])l=c[1];else{const i=a.indexOf("{"),o=a.lastIndexOf("}");i!==-1&&o!==-1&&o>i&&(l=a.substring(i,o+1))}if(l)try{return JSON.parse(l)}catch(i){console.error("Anima JSON Parse Error:",i,`
38Original String:
39`,l)}throw new Error("لم يتمكن الذكاء الاصطناعي من توليد تنسيق الكود الصحيح. يرجى المحاولة مرة أخرى.")}catch(a){return console.error("Anima Engine Critical Failure:",a),{html:`<div class="p-10 text-white bg-red-900/20 border border-red-500 rounded-2xl text-center">
40                    <h2 class="text-2xl font-black mb-4">خطأ في محرك Anima</h2>
41                    <p>${a.message||"عذراً، حدث خطأ أثناء توليد الكود."}</p>
42                   </div>`,css:"",js:""}}},M=({hasBooked:r,onBooking:h})=>{const[t,a]=n.useState({projectName:"",activityType:"business",language:"Arabic",primaryColor:"#3b82f6",secondaryColor:"#1e293b",style:"modern",fontStyle:"sans",pageCount:1,sections:["hero","features","contact"],hasBlog:!1,url:""}),[l,c]=n.useState(""),[i,o]=n.useState("desktop"),[p,b]=n.useState(!1),[d,g]=n.useState(null),[u,y]=n.useState("preview"),w=async()=>{if(!r){h("تصميم متجرك","coding",`الاسم: ${t.projectName} | النشاط: ${t.activityType} | الألوان: ${t.primaryColor}/${t.secondaryColor} | الوصف: ${l}`);return}b(!0),g(null);try{const{data:{user:s}}=await j.auth.getUser(),N=localStorage.getItem("user_phone");await j.from("customers_data").insert([{user_id:s?.id,phone:N,project_type:"تصميم متجرك",message:`الاسم: ${t.projectName} | النشاط: ${t.activityType} | الألوان: ${t.primaryColor}/${t.secondaryColor} | الوصف: ${l}`,status:"جديد"}]);const k=await A(t,l);g(k)}catch(s){console.error("Design Generation Error:",s)}finally{b(!1)}},v=`
43        <!DOCTYPE html>
44        <html>
45        <head>
46            <meta charset="UTF-8">
47            <meta name="viewport" content="width=device-width, initial-scale=1.0">
48            <script src="https://cdn.tailwindcss.com"><\/script>
49            <style>${d?.css}</style>
50        </head>
51        <body class="bg-black text-white">
52            ${d?.html}
53            <script>${d?.js}<\/script>
54        </body>
55        </html>
56    `;return e.jsxs("div",{className:"flex flex-col xl:flex-row h-auto xl:h-[calc(100vh-100px)] gap-6 py-6 overflow-hidden px-4 xl:px-0",children:[e.jsxs(x.div,{initial:{opacity:0,x:40}

56,animate:{opacity:1,x:0},className:"w-full xl:w-[400px] flex flex-col bg-[#020D08] border border-[#05B46F]/50 rounded-[2.5rem] overflow-hidden shadow-[0_0_40px_rgba(5,180,111,0.15)] relative",children:[e.jsxs("div",{className:"p-6 border-b border-[#05B46F]/10 flex items-center justify-between",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"w-10 h-10 rounded-xl bg-[#05B46F]/10 border border-[#05B46F]/20 flex items-center justify-center",children:e.jsx(C,{className:"w-5 h-5 text-hive-accent"})}),e.jsx("div",{children:e.jsx("h3",{className:"text-xl font-black text-white",children:"تصميم متجرك"})})]}),d&&e.jsx("div",{className:"flex gap-2",children:e.jsx("button",{onClick:()=>y(u==="preview"?"code":"preview"),className:"p-2 rounded-lg bg-white/5 border border-white/10 text-hive-accent hover:bg-hive-accent/10 transition-all",children:u==="preview"?e.jsx(f,{className:"w-4 h-4"}):e.jsx(m,{className:"w-4 h-4"})})})]}),e.jsx("div",{className:"flex-1 p-6 overflow-y-auto custom-scrollbar",children:e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-3",children:[e.jsx("label",{className:"text-xs font-black text-white uppercase tracking-widest",children:"أساسيات المشروع"}),e.jsx("input",{type:"text",placeholder:"اسم المشروع",value:t.projectName,onChange:s=>a({...t,projectName:s.target.value}),className:"w-full bg-black border border-[#05B46F]/10 rounded-xl p-3 text-xs text-white outline-none focus:border-[#05B46F]/50 transition-all text-right",dir:"rtl"}),e.jsx("input",{type:"text",placeholder:"رابط المتجر الحالي (إن وجد)",value:t.url,onChange:s=>a({...t,url:s.target.value}),className:"w-full bg-black border border-[#05B46F]/10 rounded-xl p-3 text-xs text-white outline-none focus:border-[#05B46F]/50 transition-all text-right",dir:"rtl"}),e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsxs("select",{value:t.activityType,onChange:s=>a({...t,activityType:s.target.value}),className:"bg-black border border-[#05B46F]/10 rounded-xl p-3 text-xs text-white outline-none focus:border-[#05B46F]/50 transition-all",children:[e.jsx("option",{value:"business",children:"شركة خدمات"}),e.jsx("option",{value:"restaurant",children:"مطعم"}),e.jsx("option",{value:"store",children:"متجر إلكتروني"}),e.jsx("option",{value:"portfolio",children:"بورتفوليو"})]}),e.jsxs("select",{value:t.language,onChange:s=>a({...t,language:s.target.value}),className:"bg-black border border-[#05B46F]/10 rounded-xl p-3 text-xs text-white outline-none focus:border-[#05B46F]/50 transition-all",children:[e.jsx("option",{value:"Arabic",children:"العربية"}),e.jsx("option",{value:"English",children:"English"})]})]})]}),e.jsxs("div",{className:"space-y-3",children:[e.jsx("label",{className:"text-xs font-black text-white uppercase tracking-widest",children:"التصميم"}),e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsxs("div",{className:"space-y-1",children:[e.jsx("span",{className:"text-[10px] text-slate-500",children:"Primary Color"}),e.jsx("input",{type:"color",value:t.primaryColor,onChange:s=>a({...t,primaryColor:s.target.value}),className:"w-full h-10 bg-black border border-[#05B46F]/10 rounded-xl p-1 outline-none cursor-pointer"})]}),e.jsxs("div",{className:"space-y-1",children:[e.jsx("span",{className:"text-[10px] text-slate-500",children:"Secondary Color"}),e.jsx("input",{type:"color",value:t.secondaryColor,onChange:s=>a({...t,secondaryColor:s.target.value}),className:"w-full h-10 bg-black border border-[#05B46F]/10 rounded-xl p-1 outline-none cursor-pointer"})]})]}),e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsxs("select",{value:t.style,onChange:s=>a({...t,style:s.target.value}),className:"bg-black border border-[#05B46F]/10 rounded-xl p-3 text-xs text-white outline-none focus:border-[#05B46F]/50 transition-all",children:[e.jsx("option",{value:"modern",children:"Modern"}),e.jsx("option",{value:"minimal",children:"Minimal"}),e.jsx("option",{value:"luxury",children:"Luxury"}),e.jsx("option",{value:"playful",children:"Playful"})]}),e.jsxs("select",{value:t.fontStyle,onChange:s=>a({...t,fontStyle:s.target.value}),className:"bg-black border border-[#05B46F]/10 rounded-xl p-3 text-xs text-white outline-none focus:border-[#05B46F]/50 transition-all",children:[e.jsx("option",{value:"sans",children:"Sans"}),e.jsx("option",{value:"serif",children:"Serif"})]})]})]}),e.jsxs("div",{className:"space-y-3",children:[e.jsx("label",{className:"text-xs font-black text-white uppercase tracking-widest",children:"المحتوى"}),e.jsxs("div",{className:"space-y-1",children:[e.jsxs("div",{className:"flex justify-between text-[10px] text-slate-500",children:[e.jsx("span",{children:"عدد الصفحات"}),e.jsx("span",{children:t.pageCount})]}),e.jsx("input",{type:"range",min:"1",max:"5",value:t.pageCount,onChange:s=>

56a({...t,pageCount:parseInt(s.target.value)}),className:"w-full accent-hive-accent"})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("input",{type:"checkbox",id:"hasBlog",checked:t.hasBlog,onChange:s=>a({...t,hasBlog:s.target.checked}),className:"w-4 h-4 rounded border-[#05B46F]/20 bg-black text-[#05B46F] focus:ring-[#05B46F]"}),e.jsx("label",{htmlFor:"hasBlog",className:"text-xs text-slate-300",children:"إضافة Blog للموقع"})]})]}),e.jsxs("div",{className:"space-y-3",children:[e.jsx("label",{className:"text-xs font-black text-white uppercase tracking-widest",children:"وصف إضافي (اختياري)"}),e.jsx("div",{className:"relative bg-black border border-[#05B46F]/10 rounded-2xl p-2 focus-within:border-[#05B46F]/50 transition-all",children:e.jsx("textarea",{value:l,onChange:s=>c(s.target.value),placeholder:"أضف تفاصيل أخرى تريدها في التصميم...",className:"w-full bg-transparent p-3 text-xs text-white outline-none resize-none h-24"})})]})]})}),e.jsx("div",{className:"p-6 border-t border-hive-border bg-black/20",children:e.jsxs("button",{onClick:w,disabled:p,className:"group w-full text-white font-bold py-4 rounded-2xl hover:scale-[1.02] active:scale-[0.98] transition-all shadow-lg shadow-[#05B46F]/30 disabled:opacity-50 flex items-center justify-center gap-3 border border-[#05B46F]/20",style:{background:"linear-gradient(to right, #05B46F 0%, #07533A 100%)"},children:[e.jsx("span",{children:"إنشاء التصميم الآن"}),e.jsx(x.div,{animate:{x:[0,-4,0]},transition:{repeat:1/0,duration:1.5,ease:"easeInOut"},children:e.jsx(F,{className:"w-5 h-5"})})]})})]}),e.jsxs(x.div,{initial:{opacity:0,x:-40},animate:{opacity:1,x:0},className:"flex-1 min-h-[500px] xl:min-h-0 flex flex-col bg-[#020D08] border border-[#05B46F]/50 rounded-[2.5rem] overflow-hidden shadow-[0_0_40px_rgba(5,180,111,0.15)] relative",children:[e.jsxs("div",{className:"p-5 border-b border-hive-border flex justify-between items-center bg-black/40",children:[e.jsx("div",{className:"flex gap-2",children:e.jsx("button",{className:"flex items-center gap-2 px-4 py-1.5 bg-white/5 border border-hive-border rounded-lg text-[10px] font-bold text-white",children:"معاينة التصميم"})}),e.jsxs("div",{className:"flex items-center gap-2 bg-black/60 p-1 rounded-xl border border-hive-border",children:[e.jsx("button",{onClick:()=>o("mobile"),className:`p-2 rounded-lg transition-all ${i==="mobile"?"bg-[#05B46F]/10 border border-[#05B46F] text-white shadow-[0_0_15px_rgba(5,180,111,0.2)]":"text-slate-500 border border-transparent hover:text-white"}`,children:e.jsx(B,{className:"w-4 h-4"})}),e.jsx("button",{onClick:()=>o("desktop"),className:`p-2 rounded-lg transition-all ${i==="desktop"?"bg-[#05B46F]/10 border border-[#05B46F] text-white shadow-[0_0_15px_rgba(5,180,111,0.2)]":"text-slate-500 border border-transparent hover:text-white"}`,children:e.jsx(m,{className:"w-4 h-4"})})]})]}),e.jsxs("div",{className:"flex-1 flex flex-col items-center justify-center relative overflow-hidden bg-[#050505]",children:[p&&e.jsxs("div",{className:"absolute inset-0 z-50 flex flex-col items-center justify-center space-y-6 bg-black/80 backdrop-blur-md",children:[e.jsxs("div",{className:"relative",children:[e.jsx(f,{className:"w-20 h-20 text-hive-accent animate-pulse"}),e.jsx("div",{className:"absolute -inset-4 border-2 border-hive-accent/20 border-t-hive-accent rounded-full animate-spin"})]}),e.jsxs("div",{className:"text-center",children:[e.jsx("p",{className:"text-2xl font-black text-white",children:"جاري إنشاء المتجر..."}),e.jsx("p",{className:"text-hive-accent/60 text-sm animate-pulse",children:"يتم الآن تحويل الوصف إلى كود برمجي متكامل"})]})]}),!d&&!p?e.jsxs("div",{className:"flex flex-col items-center justify-center space-y-8 opacity-20",children:[e.jsxs("div",{className:"relative",children:[e.jsx("div",{className:"w-32 h-32 bg-[#05B46F]/5 border border-[#05B46F]/20 rounded-full flex items-center justify-center",children:e.jsx(m,{className:"w-16 h-16 text-[#05B46F] drop-shadow-[0_0_15px_rgba(5,180,111,0.5)]"})}),e.jsx(x.div,{animate:{scale:[1,1.2,1],opacity:[.5,1,.5]},transition:{repeat:1/0,duration:2},className:"absolute -top-2 -right-2 w-8 h-8 bg-[#05B46F] rounded-full flex items-center justify-center text-black font-black text-xs shadow-[0_0_15px_rgba(5,180,111,0.4)]",children:"?"})]}),e.jsxs("div",{className:"text-center space-y-2",children:[e.jsx("p",{className:"text-2xl font-black text-white tracking-widest uppercase",children:"بانتظار البيانات..."}),e.jsx("p",{className:"text-[10px] text-slate-500 font-mono tracking-[0.4em] uppercase",children:"READY TO TRANSFORM YOUR VISION INTO CODE"})]})]}):e.jsx("div",{className:`w-full h-full transition-all duration-700 flex items-center justify-center ${i==="mobile"?"max-w-[375px]":"max-w-full"}`,children:u==="preview"?e.jsx("iframe",{srcDoc:v,className:"w-full h-full border-none bg-white rounded-t-xl md:rounded-none",title:"Anima Preview"}):e.jsx("div",{className:"w-full h-full p-6 overflow-auto font-mono text-xs text-slate-300 bg-[#0a0a0a]",children:e.jsx("pre",{children:v})})})]})]})]})};export{M as default};