(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[516],{4094:(e,s,t)=>{"use strict";t.r(s),t.d(s,{default:()=>x});var l=t(7876);t(4232);var n=t(7328),r=t.n(n),a=t(8230),i=t.n(a);function c(e){let{children:s,title:t="Next.js App"}=e;return(0,l.jsxs)("div",{className:"min-h-screen bg-gray-100 flex flex-col",children:[(0,l.jsxs)(r(),{children:[(0,l.jsx)("title",{children:t}),(0,l.jsx)("meta",{name:"description",content:"Next.js with Tailwind CSS"}),(0,l.jsx)("link",{rel:"icon",href:"/favicon.ico"})]}),(0,l.jsx)("header",{className:"bg-white shadow-sm",children:(0,l.jsx)("div",{className:"container mx-auto px-4 py-4",children:(0,l.jsxs)("div",{className:"flex justify-between items-center",children:[(0,l.jsx)("h1",{className:"text-2xl font-bold text-gray-800",children:"Next.js Application"}),(0,l.jsx)("nav",{children:(0,l.jsxs)("ul",{className:"flex space-x-6",children:[(0,l.jsx)("li",{children:(0,l.jsx)(i(),{href:"/",className:"text-gray-600 hover:text-blue-500 transition-colors",children:"Home"})}),(0,l.jsx)("li",{children:(0,l.jsx)(i(),{href:"/components",className:"text-gray-600 hover:text-blue-500 transition-colors",children:"Components"})}),(0,l.jsx)("li",{children:(0,l.jsx)(i(),{href:"/api/hello",className:"text-gray-600 hover:text-blue-500 transition-colors",children:"API"})})]})})]})})}),(0,l.jsx)("main",{className:"container mx-auto px-4 py-8 flex-grow",children:s}),(0,l.jsx)("footer",{className:"bg-white shadow-sm mt-auto",children:(0,l.jsxs)("div",{className:"container mx-auto px-4 py-4 text-center text-gray-500",children:["\xa9 ",new Date().getFullYear()," Next.js Application"]})})]})}var o=t(8300);function x(){return(0,l.jsx)(c,{title:"Components | Next.js App",children:(0,l.jsxs)("div",{className:"max-w-4xl mx-auto",children:[(0,l.jsx)("h1",{className:"text-3xl font-bold mb-8",children:"Component Showcase"}),(0,l.jsxs)("section",{className:"mb-12",children:[(0,l.jsx)("h2",{className:"text-2xl font-semibold mb-4",children:"Buttons"}),(0,l.jsxs)("div",{className:"flex flex-wrap gap-4",children:[(0,l.jsx)(o.A,{variant:"primary",children:"Primary Button"}),(0,l.jsx)(o.A,{variant:"secondary",children:"Secondary Button"}),(0,l.jsx)(o.A,{variant:"outline",children:"Outline Button"})]}),(0,l.jsxs)("div",{className:"mt-6 flex flex-wrap gap-4",children:[(0,l.jsx)(o.A,{size:"sm",children:"Small Button"}),(0,l.jsx)(o.A,{size:"md",children:"Medium Button"}),(0,l.jsx)(o.A,{size:"lg",children:"Large Button"})]})]}),(0,l.jsxs)("section",{className:"mb-12",children:[(0,l.jsx)("h2",{className:"text-2xl font-semibold mb-4",children:"Cards"}),(0,l.jsx)("div",{className:"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6",children:[1,2,3].map(e=>(0,l.jsxs)("div",{className:"bg-white p-6 rounded-lg shadow-md",children:[(0,l.jsxs)("h3",{className:"text-xl font-semibold mb-2",children:["Card ",e]}),(0,l.jsx)("p",{className:"text-gray-600 mb-4",children:"This is a sample card component built with Tailwind CSS."}),(0,l.jsx)(o.A,{variant:"outline",size:"sm",children:"Learn More"})]},e))})]})]})})}},7328:(e,s,t)=>{e.exports=t(9836)},8300:(e,s,t)=>{"use strict";t.d(s,{A:()=>n});var l=t(7876);function n(e){let{children:s,variant:t="primary",size:n="md",className:r="",isLoading:a=!1,leftIcon:i,rightIcon:c,as:o="button",...x}=e,d=x.disabled,h=d||a?"opacity-70 cursor-not-allowed":"",m=`inline-flex items-center justify-center font-semibold rounded-lg transition-all focus:outline-none focus:ring-2 focus:ring-offset-2 ${{primary:"bg-blue-500 hover:bg-blue-600 text-white focus:ring-blue-500",secondary:"bg-gray-700 hover:bg-gray-800 text-white focus:ring-gray-500",outline:"bg-transparent border-2 border-blue-500 text-blue-500 hover:bg-blue-500/10 focus:ring-blue-500",ghost:"bg-transparent hover:bg-white/10 text-white focus:ring-white"}[t]} ${{sm:"py-1.5 px-3 text-sm",md:"py-2.5 px-5 text-base",lg:"py-3 px-8 text-lg"}[n]} ${h} ${r}`,u={...x,className:m,disabled:d||a},p=(0,l.jsxs)(l.Fragment,{children:[a&&(0,l.jsxs)("svg",{className:"animate-spin -ml-1 mr-2 h-4 w-4",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[(0,l.jsx)("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),(0,l.jsx)("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),!a&&i&&(0,l.jsx)("span",{className:"mr-2",children:i}),s,!a&&c&&(0,l.jsx)("span",{className:"ml-2",children:c})]});return"a"===o?(0,l.jsx)("a",{...u,children:p}):(0,l.jsx)("button",{...u,children:p})}t(4232)},8652:(e,s,t)=>{(window.__NEXT_P=window.__NEXT_P||[]).push(["/components",function(){return t(4094)}])}},e=>{var s=s=>e(e.s=s);e.O(0,[230,636,593,792],()=>s(8652)),_N_E=e.O()}]);