function FlashcardFetcher({ onClick, children }) { return /*#__PURE__*/ React.createElement("button", { className: "w-full bg-blue-500 text-white p-2 rounded font-semibold", onClick: onClick, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, children); } function FlashcardFetcherStory() { const handleGetFlashcards = ()=>{ console.log("Fetching flashcards..."); }; return /*#__PURE__*/ React.createElement("div", { className: "space-y-4 p-4", __source: { fileName: "", lineNumber: 18, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(FlashcardFetcher, { onClick: handleGetFlashcards, __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, "Get Flashcards & Examples"), /*#__PURE__*/ React.createElement(FlashcardFetcher, { onClick: handleGetFlashcards, __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, "Fetch More Flashcards")); } function MainComponent() { const handleGetFlashcards = (e)=>{ e.preventDefault(); console.log("Fetching flashcards..."); }; return /*#__PURE__*/ React.createElement("div", { className: "p-6 space-y-8 max-w-md mx-auto", __source: { fileName: "", lineNumber: 8, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-center font-roboto text-[#333]", __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, "AI Learning Coach"), /*#__PURE__*/ React.createElement("form", { className: "space-y-4", onSubmit: handleGetFlashcards, __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-lg font-roboto mb-2", __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }, "Course Title"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "courseTitle", className: "w-full p-2 border border-gray-300 rounded", placeholder: "Enter the course title", __source: { fileName: "", lineNumber: 15, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-lg font-roboto mb-2", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, "Chapter"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "chapter", className: "w-full p-2 border border-gray-300 rounded", placeholder: "Enter the chapter or topic", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement(FlashcardFetcher, { onClick: handleGetFlashcards, __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }, "Get Flashcards & Examples"))); }