function TextInputComponent({ placeholder, value, onChange }) { return /*#__PURE__*/ React.createElement("textarea", { name: "prompt", className: "form-textarea mt-1 block w-full border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md", rows: "5", placeholder: placeholder, value: value, onChange: onChange, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }); } function TextInputComponentStory() { const [prompt, setPrompt] = React.useState(""); const handleChange = (e)=>{ setPrompt(e.target.value); }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(TextInputComponent, { placeholder: "Enter text here...", value: prompt, onChange: handleChange, __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this })); } function BlueSubmissionButton({ children, onClick }) { return /*#__PURE__*/ React.createElement("button", { type: "submit", className: "inline-flex items-center px-4 py-2 bg-blue-500 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-blue-700 active:bg-blue-900 focus:outline-none focus:border-blue-900 focus:ring ring-blue-300", onClick: onClick, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, children); } function BlueSubmissionButtonStory() { const handleSubmit = ()=>alert("Button clicked!"); return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 17, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(BlueSubmissionButton, { onClick: handleSubmit, __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this }, "Submit")); } function MainComponent() { const [prompt, setPrompt] = React.useState(''); const [response, setResponse] = React.useState(''); const [isLoading, setIsLoading] = React.useState(false); const handleSubmit = async (e)=>{ e.preventDefault(); setIsLoading(true); setResponse(''); const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: "user", content: prompt } ], system_prompt: prompt, max_tokens: 2000 }) }); const data = await response.json(); setResponse(data.result); setIsLoading(false); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f7f7f7]", __source: { fileName: "", lineNumber: 34, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("form", { className: "flex flex-col gap-4 bg-white p-8 rounded-lg shadow-md", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement(TextInputComponent, { placeholder: "Enter text here...", value: prompt, onChange: (e)=>setPrompt(e.target.value), __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement(BlueSubmissionButton, { __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, isLoading ? 'Loading...' : 'Submit')), /*#__PURE__*/ React.createElement("div", { className: "mt-5 bg-white p-4 rounded-lg shadow-md w-[60%]", __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-900", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, response || "Your response will appear here..."))); }