${bioLink.name}

${bioLink.bio}

${bioLink.links.map( (link) => `

${link}

` ).join("")}

`; }); } }, []); return /* @__PURE__ */ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-indigo-500 to-pink-500 flex items-center justify-center p-4" }, /* @__PURE__ */ React.createElement("div", { className: "bg-white rounded-2xl shadow-2xl p-8 max-w-lg w-full" }, /* @__PURE__ */ React.createElement("h1", { className: "text-4xl font-bold text-center mb-8 bg-gradient-to-r from-indigo-500 to-purple-600 text-transparent bg-clip-text" }, "\u2728 Bio Link Builder \u2728"), error && /* @__PURE__ */ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4" }, error), success && /* @__PURE__ */ React.createElement("div", { className: "bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4" }, success), /* @__PURE__ */ React.createElement("form", { onSubmit: generateBioLink, className: "space-y-4" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement( "input", { id: "name", type: "text", placeholder: "Your Name", className: "w-full px-4 py-2 rounded-lg border border-gray-300 focus:ring-2 focus:ring-indigo-500 focus:border-transparent" } )), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement( "textarea", { id: "bio", placeholder: "Short Bio", className: "w-full px-4 py-2 rounded-lg border border-gray-300 focus:ring-2 focus:ring-indigo-500 focus:border-transparent", rows: "3" } )), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement( "input", { id: "photo", type: "url", placeholder: "Photo URL (optional)", className: "w-full px-4 py-2 rounded-lg border border-gray-300 focus:ring-2 focus:ring-indigo-500 focus:border-transparent" } )), /* @__PURE__ */ React.createElement("div", { className: "flex gap-2" }, /* @__PURE__ */ React.createElement( "input", { id: "url", type: "url", placeholder: "Website / Social Link", className: "flex-1 px-4 py-2 rounded-lg border border-gray-300 focus:ring-2 focus:ring-indigo-500 focus:border-transparent" } ), /* @__PURE__ */ React.createElement( "button", { type: "button", onClick: addLink, className: "px-4 py-2 bg-indigo-500 text-white rounded-lg hover:bg-indigo-600 transition" }, "Add Link" )), /* @__PURE__ */ React.createElement("div", { className: "space-y-2" }, links.map((link, i) => /* @__PURE__ */ React.createElement( "div", { key: i, className: "flex items-center justify-between bg-gray-50 p-2 rounded-lg" }, /* @__PURE__ */ React.createElement("span", { className: "truncate flex-1 px-2" }, link), /* @__PURE__ */ React.createElement( "button", { type: "button", onClick: () => removeLink(i), className: "text-red-500 hover:text-red-700 px-2" }, "\u2715" ) ))), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement( "input", { id: "custom", type: "text", placeholder: "Custom Alias (optional)", className: "w-full px-4 py-2 rounded-lg border border-gray-300 focus:ring-2 focus:ring-indigo-500 focus:border-transparent" } )), /* @__PURE__ */ React.createElement( "button", { type: "submit", disabled: loading, className: "w-full py-3 bg-gradient-to-r from-indigo-500 to-purple-600 text-white rounded-xl \n hover:from-indigo-600 hover:to-purple-700 transition transform hover:scale-105 disabled:opacity-50" }, loading ? "Generating..." : "Generate Bio Link" ), /* @__PURE__ */ React.createElement( "button", { type: "button", onClick: loadExistingBio, className: "w-full py-3 bg-gray-100 text-gray-700 rounded-xl hover:bg-gray-200 transition" }, "Edit Previous Bio" ))), /* @__PURE__ */ React.createElement("style", { jsx: true, global: true }, ` @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .fade-in { animation: fadeIn 0.5s ease-out; } `)); } var page_default = MainComponent; return __toCommonJS(page_exports); })();

✨ Bio Link Builder ✨