function MainComponent() { const [videoUrl, setVideoUrl] = React.useState(''); const handleTextToVideo = async (e)=>{ e.preventDefault(); const text = e.target.inputText.value; const fetchedVideoUrl = await fetchVideoUrlFromAPI(text); // Mock function to simulate fetching URL from an API setVideoUrl(fetchedVideoUrl); }; return /*#__PURE__*/ React.createElement("div", { className: "p-4 max-w-lg w-full mx-auto bg-[#f7f7f7] rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 13, columnNumber: 13 }, __self: this }, "Text to Video Generator"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleTextToVideo, __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "inputText", className: "block mb-2 text-sm font-roboto", __source: { fileName: "", lineNumber: 15, columnNumber: 17 }, __self: this }, "Text:"), /*#__PURE__*/ React.createElement("textarea", { name: "inputText", id: "inputText", rows: "4", className: "w-full p-2 border rounded-lg", placeholder: "Enter text here...", __source: { fileName: "", lineNumber: 16, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "mt-4 bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded", __source: { fileName: "", lineNumber: 17, columnNumber: 17 }, __self: this }, "Generate Video")), videoUrl && /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 20, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("video", { src: videoUrl, controls: true, className: "w-full", __source: { fileName: "", lineNumber: 21, columnNumber: 21 }, __self: this }))); } function StoryComponent() { return /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-screen bg-[#eeeeee]", __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this })); } async function fetchVideoUrlFromAPI(text) { // Simulate fetching a video URL based on input text const videoUrls = [ 'https://example.com/video1.mp4', 'https://example.com/video2.mp4', 'https://example.com/video3.mp4' ]; // Simulating fetching process return new Promise((resolve)=>{ setTimeout(()=>{ const randomIndex = Math.floor(Math.random() * videoUrls.length); resolve(videoUrls[randomIndex]); }, 2000); }); }