import{r as o,a,b as t,aT as i,t as l,g as r}from"./index-QAlcqU00.js";const d={class:"min-h-screen bg-gray-50 py-8"},c={class:"max-w-4xl mx-auto px-4"},p={class:"bg-white p-6 rounded-lg shadow mb-6"},x={class:"text-gray-600 mb-4"},m={__name:"BasicTest",setup(u){const s=o(0);return console.log("BasicTest component loaded successfully"),console.log("Vue ref working:",s.value),(b,e)=>(r(),a("div",d,[t("div",c,[e[3]||(e[3]=i('<h1 class="text-3xl font-bold text-gray-900 mb-8">Basic Setup Test</h1><div class="bg-white p-6 rounded-lg shadow mb-6"><h2 class="text-xl font-semibold text-gray-800 mb-4">✅ TailwindCSS Test</h2><p class="text-gray-600 mb-4">If you can see this styled content, TailwindCSS is working correctly.</p><div class="grid grid-cols-5 gap-2 mb-4"><div class="h-12 bg-primary-100 rounded flex items-center justify-center text-xs">100</div><div class="h-12 bg-primary-300 rounded flex items-center justify-center text-xs">300</div><div class="h-12 bg-primary-500 rounded flex items-center justify-center text-xs text-white">500</div><div class="h-12 bg-primary-700 rounded flex items-center justify-center text-xs text-white">700</div><div class="h-12 bg-primary-900 rounded flex items-center justify-center text-xs text-white">900</div></div><button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition-colors"> Basic Button </button></div>',2)),t("div",p,[e[2]||(e[2]=t("h2",{class:"text-xl font-semibold text-gray-800 mb-4"},"✅ Vue 3 Reactivity Test",-1)),t("p",x,"Counter: "+l(s.value),1),t("button",{onClick:e[0]||(e[0]=n=>s.value++),class:"bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded mr-2"}," Increment "),t("button",{onClick:e[1]||(e[1]=n=>s.value=0),class:"bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"}," Reset ")]),e[4]||(e[4]=i('<div class="bg-white p-6 rounded-lg shadow mb-6"><h2 class="text-xl font-semibold text-gray-800 mb-4">📦 Import Status</h2><div class="space-y-2 text-sm"><div class="flex justify-between"><span>Vue:</span><span class="text-green-600">✅ Working</span></div><div class="flex justify-between"><span>TailwindCSS:</span><span class="text-green-600">✅ Working</span></div><div class="flex justify-between"><span>Theme Colors:</span><span class="text-green-600">✅ Working</span></div></div></div><div class="bg-blue-50 border border-blue-200 p-6 rounded-lg"><h2 class="text-xl font-semibold text-blue-800 mb-4">🚀 Next Steps</h2><p class="text-blue-600 mb-4"> Basic setup is working! Now we can gradually add Frappe UI components. </p><div class="text-sm text-blue-600"><p>1. ✅ Vue 3 + Vite setup</p><p>2. ✅ TailwindCSS configuration</p><p>3. ✅ Custom color theme</p><p>4. 🔄 Add Frappe UI components (next)</p></div></div>',2))])]))}};export{m as default};