function BlueprintModule({ title, description }) { return /*#__PURE__*/ React.createElement("div", { className: "border-4 border-blue-500 p-6 font-pixelify-sans bg-white text-black", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, title), /*#__PURE__*/ React.createElement("p", { className: "mt-4", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, description)); } function BlueprintModuleStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4 space-y-4", __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(BlueprintModule, { title: "Blueprint Module", description: "This module provides an essential set of functionalities for developers.", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(BlueprintModule, { title: "Advanced Blueprint", description: "Enhance your existing solutions with our advanced blueprint offerings.", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this })); } function PixelifySansButton({ text, variant = "default", onClick }) { const baseClasses = "group relative font-pixelify-sans px-6 py-3 active:translate-y-[2px] active:translate-x-[-2px]"; const textClasses = variant === "filled" ? "text-white" : "text-[#333] group-hover:text-black"; const bgClasses = variant === "filled" ? "bg-black" : "bg-transparent"; return /*#__PURE__*/ React.createElement("button", { className: `${baseClasses} ${bgClasses}`, onClick: onClick, __source: { fileName: "", lineNumber: 9, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `relative z-10 ${textClasses}`, __source: { fileName: "", lineNumber: 10, columnNumber: 7 }, __self: this }, text), /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0", __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute top-0 left-[4px] right-[4px] h-[2px] bg-black", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-0 left-[4px] right-[4px] h-[2px] bg-black", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-[6px] left-[6px] right-[6px] h-[2px] bg-[#c7c7c7]", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-[4px] left-[6px] right-[6px] h-[2px] bg-[#f1f1f1]", __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute left-0 top-[4px] bottom-[4px] w-[2px] bg-black", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute right-0 top-[4px] bottom-[4px] w-[2px] bg-black", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "group-active:opacity-0 hover:opacity-100 absolute bottom-[-2px] left-[4px] right-[4px] h-[2px] bg-[#c7c7c7]", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "group-active:opacity-0 hover:opacity-100 absolute left-[-2px] top-[4px] bottom-[4px] w-[2px] bg-[#c7c7c7]", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute top-[2px] left-[2px] w-[2px] h-[2px] bg-black", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute top-[2px] right-[2px] w-[2px] h-[2px] bg-black", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-[2px] left-[2px] w-[2px] h-[2px] bg-black", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-[2px] right-[2px] w-[2px] h-[2px] bg-black", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }))); } function PixelifySansButtonStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4 space-x-4", __source: { fileName: "", lineNumber: 32, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(PixelifySansButton, { text: "Default Button", __source: { fileName: "", lineNumber: 33, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(PixelifySansButton, { text: "Filled Button", variant: "filled", __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this })); } function NavigationBar({ links }) { return /*#__PURE__*/ React.createElement("nav", { className: "w-[40%] mx-auto flex justify-between items-center px-4 py-2 bg-[#333333] text-white rounded-[12px] font-pixelify-sans", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex gap-4 w-full justify-between", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, links.map((link, index)=>/*#__PURE__*/ React.createElement("li", { key: index, __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: link.href, className: "hover:underline", __source: { fileName: "", lineNumber: 7, columnNumber: 13 }, __self: this }, link.label))))); } function NavigationBarStory() { const links = [ { href: "/", label: "Home" }, { href: "/blueprints", label: "Blueprints" }, { href: "/mission", label: "Our Mission" }, { href: "/signup", label: "Login / Sign Up" } ]; return /*#__PURE__*/ React.createElement("div", { className: "w-full bg-white p-4", __source: { fileName: "", lineNumber: 26, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(NavigationBar, { links: links, __source: { fileName: "", lineNumber: 27, columnNumber: 7 }, __self: this })); } function BlueprintPage({ title, subtitle, content, footer }) { return /*#__PURE__*/ React.createElement("div", { className: "font-pixelify-sans bg-white text-black px-6 py-8 md:px-12 md:py-16 max-w-screen-lg mx-auto", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "mb-8", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl md:text-5xl font-bold", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, title), /*#__PURE__*/ React.createElement("h2", { className: "text-xl md:text-2xl mt-2", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, subtitle)), /*#__PURE__*/ React.createElement("main", { className: "mb-8", __source: { fileName: "", lineNumber: 8, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, content)), /*#__PURE__*/ React.createElement("footer", { __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, footer))); } function BlueprintPageStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4 space-y-4", __source: { fileName: "", lineNumber: 20, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(BlueprintPage, { title: "Blueprint Title", subtitle: "Subtitle goes here", content: "This is the main content of the blueprint page showing a sample text.", footer: "Footer content © 2023", __source: { fileName: "", lineNumber: 21, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(BlueprintPage, { title: "Another Title", subtitle: "Another subtitle", content: "Different content for the second blueprint page.", footer: "Another footer content © 2023", __source: { fileName: "", lineNumber: 27, columnNumber: 7 }, __self: this })); } function StylishButton({ text, icon, color, onClick }) { const bgColor = { yellow: "bg-[#F8E44F]", purple: "bg-[#C1BFF9]", teal: "bg-[#7EE7D6]" }[color] || "bg-[#F8E44F]"; const roundedClass = icon ? "rounded-full" : "rounded-[6px]"; return /*#__PURE__*/ React.createElement("button", { className: `font-poppins text-black border-2 border-black ${bgColor} ${roundedClass} px-4 py-2`, onClick: onClick, __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center", __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this }, icon && /*#__PURE__*/ React.createElement("i", { className: `fas ${icon} mr-2 text-black`, __source: { fileName: "", lineNumber: 17, columnNumber: 18 }, __self: this }), text)); } function StylishButtonStory() { const handleClick = ()=>{ alert("Button clicked!"); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col space-y-4", __source: { fileName: "", lineNumber: 30, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(StylishButton, { text: "Click me", icon: "fa-star", color: "yellow", onClick: handleClick, __source: { fileName: "", lineNumber: 31, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(StylishButton, { text: "Purple Button", icon: "fa-heart", color: "purple", onClick: handleClick, __source: { fileName: "", lineNumber: 37, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(StylishButton, { text: "Teal No Icon", color: "teal", onClick: handleClick, __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this })); } function BlueprintedLogo() { return /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-poppins text-[64px] text-[#1e3a8a]", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, "BluePrinted"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-drafting-compass text-[64px] text-[#ffffff] ml-2", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this })); } function BlueprintedLogoStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(BlueprintedLogo, { __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this })); } function MainComponent() { const [selectedBlueprint, setSelectedBlueprint] = React.useState(null); const [blueprints, setBlueprints] = React.useState([]); const [filter, setFilter] = React.useState('all'); const [generatedImage, setGeneratedImage] = React.useState(''); React.useEffect(()=>{ fetchBlueprints(); generateImage(); }, []); const fetchBlueprints = async ()=>{ const response = await fetch('/api/db/blueprints', { method: 'POST', body: JSON.stringify({ query: 'SELECT * FROM `blueprints`' }) }); const data = await response.json(); setBlueprints(data); }; const generateImage = async ()=>{ const response = await fetch('/integrations/stable-diffusion-v-3/?prompt=a+human+with+the+right+side+of+their+face+half+made+out+of+a+blueprint+design,+with+white+blueprint+sketches+floating+around,+highly+detailed', { method: 'GET' }); const data = await response.json(); setGeneratedImage(data.data[0]); }; const filterBlueprints = (blueprints)=>{ switch(filter){ case 'popular': return blueprints.sort((a, b)=>b.visits - a.visits); case 'influencers': return blueprints.filter((bp)=>bp.tags.includes('influencers')); case 'recent': return blueprints.sort((a, b)=>new Date(b.updated_at) - new Date(a.updated_at)); default: return blueprints; } }; const links = [ { href: "#", label: "Home" }, { href: "#", label: "About" }, { href: "#", label: "Contact" } ]; const filterLinks = [ { href: "#", label: "Most Popular", onClick: ()=>setFilter('popular') }, { href: "#", label: "All Blueprints", onClick: ()=>setFilter('all') }, { href: "#", label: "Influencers", onClick: ()=>setFilter('influencers') }, { href: "#", label: "Recently Updated", onClick: ()=>setFilter('recent') } ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen font-pixelify-sans bg-gradient-to-tr from-[#1C4E80] to-[#4F81BD] bg-[url('/white-blueprint-pattern.png')] bg-repeat", __source: { fileName: "", lineNumber: 58, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4", __source: { fileName: "", lineNumber: 59, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "flex justify-between items-center py-4", __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(BlueprintedLogo, { __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement(NavigationBar, { links: links, __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("main", { className: "mt-16", __source: { fileName: "", lineNumber: 65, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative text-center mb-16", __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: generatedImage, alt: "AI generated blueprint face", className: "absolute top-0 left-0 w-full h-full object-cover opacity-30", __source: { fileName: "", lineNumber: 67, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("h1", { className: "relative z-10 text-4xl md:text-6xl font-bold text-white mb-4", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }, "The top SaaS strategies blueprinted for your SaaS."), /*#__PURE__*/ React.createElement("p", { className: "relative z-10 text-xl text-gray-300", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, "Browse 100+ proven blueprints and implement them with your ideas.")), /*#__PURE__*/ React.createElement(React.Fragment, null), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mt-16", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, filterBlueprints(blueprints).map((blueprint, index)=>/*#__PURE__*/ React.createElement("div", { key: index, onClick: ()=>setSelectedBlueprint(blueprint), __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement(BlueprintModule, { title: blueprint.title, description: blueprint.description, __source: { fileName: "", lineNumber: 81, columnNumber: 17 }, __self: this }))))), /*#__PURE__*/ React.createElement("footer", { className: "flex justify-between items-center py-8 mt-16 text-white", __source: { fileName: "", lineNumber: 90, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this }, "©2024 ", /*#__PURE__*/ React.createElement("a", { href: "https://educate.io/programs#", className: "hover:underline", __source: { fileName: "", lineNumber: 91, columnNumber: 22 }, __self: this }, "Blueprinted")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 92, columnNumber: 11 }, __self: this }, "Built using the ", /*#__PURE__*/ React.createElement("a", { href: "https://blueprinted.ai/createxyz", className: "hover:underline", __source: { fileName: "", lineNumber: 92, columnNumber: 32 }, __self: this }, "Create.xyz Blueprint")), /*#__PURE__*/ React.createElement("div", { className: "space-x-4", __source: { fileName: "", lineNumber: 93, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://educate-io.typeform.com/to/FsYgXwhD", className: "hover:underline", __source: { fileName: "", lineNumber: 94, columnNumber: 13 }, __self: this }, "Contact"), /*#__PURE__*/ React.createElement("a", { href: "https://educate.io/terms-conditions", className: "hover:underline", __source: { fileName: "", lineNumber: 95, columnNumber: 13 }, __self: this }, "Terms"), /*#__PURE__*/ React.createElement("a", { href: "https://educate.io/privacy-policy", className: "hover:underline", __source: { fileName: "", lineNumber: 96, columnNumber: 13 }, __self: this }, "Privacy")))), selectedBlueprint && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4", __source: { fileName: "", lineNumber: 102, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg max-w-2xl w-full max-h-[90vh] overflow-auto", __source: { fileName: "", lineNumber: 103, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement(BlueprintPage, { title: selectedBlueprint.title, subtitle: selectedBlueprint.subtitle, content: selectedBlueprint.content, footer: selectedBlueprint.footer, __source: { fileName: "", lineNumber: 104, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "mt-4 px-4 py-2 bg-blue-500 text-white rounded", onClick: ()=>setSelectedBlueprint(null), __source: { fileName: "", lineNumber: 110, columnNumber: 13 }, __self: this }, "Close")))); }