function MainComponent({ profilePic, name, location, catPic, catName, tripDates }) { return /*#__PURE__*/ React.createElement("div", { className: "bg-[#f3f4f6] min-h-screen flex flex-col items-center font-crimson-text p-4", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[400px] bg-white shadow-lg rounded-lg p-4 mb-4", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-4", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: profilePic, alt: "Profile Picture of Home Owner", className: "w-[60px] h-[60px] rounded-full mr-4", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold", __source: { fileName: "", lineNumber: 8, columnNumber: 13 }, __self: this }, name), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 9, columnNumber: 13 }, __self: this }, location))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-4", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: catPic, alt: `Picture of ${catName} the cat`, className: "w-[60px] h-[60px] rounded-full mr-4", __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold", __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, catName), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 16, columnNumber: 13 }, __self: this }, "Trip Dates: ", tripDates))), /*#__PURE__*/ React.createElement("button", { name: "message", className: "w-full bg-blue-500 text-white py-2 px-4 rounded", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, "Message"))); } function HomePage() { return /*#__PURE__*/ React.createElement("div", { className: "bg-[#f3f4f6] min-h-screen flex flex-col items-center font-crimson-text p-4", __source: { fileName: "", lineNumber: 27, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-8", __source: { fileName: "", lineNumber: 28, columnNumber: 7 }, __self: this }, "Welcome to Meowzers"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[400px] bg-white shadow-lg rounded-lg p-4 mb-4", __source: { fileName: "", lineNumber: 29, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4", __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, "Sign Up"), /*#__PURE__*/ React.createElement("form", { className: "flex flex-col", __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", placeholder: "Name", className: "mb-4 p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 32, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", placeholder: "Email", className: "mb-4 p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "password", name: "password", placeholder: "Password", className: "mb-4 p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "mb-4 bg-blue-500 text-white py-2 px-4 rounded", __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, "Sign Up"))), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[400px] bg-white shadow-lg rounded-lg p-4", __source: { fileName: "", lineNumber: 38, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4", __source: { fileName: "", lineNumber: 39, columnNumber: 9 }, __self: this }, "Log In"), /*#__PURE__*/ React.createElement("form", { className: "flex flex-col", __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", placeholder: "Email", className: "mb-4 p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "password", name: "password", placeholder: "Password", className: "mb-4 p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "mb-4 bg-blue-500 text-white py-2 px-4 rounded", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, "Log In")))); } function StoryComponent() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 52, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(HomePage, { __source: { fileName: "", lineNumber: 53, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { profilePic: "path/to/profile-pic.jpg", name: "John Doe", location: "New York, NY", catPic: "path/to/cat-pic.jpg", catName: "Whiskers", tripDates: "12th Dec - 20th Dec", __source: { fileName: "", lineNumber: 54, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { profilePic: "path/to/profile-pic2.jpg", name: "Jane Smith", location: "Los Angeles, CA", catPic: "path/to/cat-pic2.jpg", catName: "Snowball", tripDates: "5th Jan - 15th Jan", __source: { fileName: "", lineNumber: 62, columnNumber: 7 }, __self: this })); }