function MainComponent({ messages, onSendMessage, onClearMessages, onArchiveMessages, memoContent, onUpdateMemo, chatSummary }) { const handleMemoChange = (event)=>{ onUpdateMemo(event.target.value); }; return /*#__PURE__*/ React.createElement("div", { className: "flex h-full bg-[#121212]", __source: { fileName: "", lineNumber: 7, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col w-1/3 p-4 border-r border-[#424242]", __source: { fileName: "", lineNumber: 8, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold text-[#007ACC] mb-4", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, "メモ"), /*#__PURE__*/ React.createElement("textarea", { className: "w-full h-56 p-2 bg-[#1A1A1A] border border-[#424242] text-white", placeholder: "RPGの敵キャラクターのアイデア...", value: memoContent, onChange: handleMemoChange, __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex-grow", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold text-[#007ACC] mb-4", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, "要約"), /*#__PURE__*/ React.createElement("div", { className: "bg-[#1A1A1A] border border-[#424242] text-white p-2 h-full", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, chatSummary))), /*#__PURE__*/ React.createElement("div", { className: "w-2/3 p-4", __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-full", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-grow overflow-y-auto", __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this }, messages.map((message, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `p-2 my-2 rounded-lg ${message.role === 'user' ? 'bg-[#007ACC]' : 'bg-[#333333]'}`, __source: { fileName: "", lineNumber: 29, columnNumber: 15 }, __self: this }, message.content))), /*#__PURE__*/ React.createElement("div", { className: "mt-4 flex justify-between", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", className: "w-full p-2 bg-[#1A1A1A] border border-[#424242] text-white mr-2", placeholder: "メッセージを入力...", onKeyDown: (e)=>e.key === 'Enter' && e.target.value.trim() && onSendMessage({ role: "user", content: e.target.value.trim() }), __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: onClearMessages, className: "px-4 bg-[#333333] text-white rounded", __source: { fileName: "", lineNumber: 41, columnNumber: 13 }, __self: this }, "削除"), /*#__PURE__*/ React.createElement("button", { onClick: onArchiveMessages, className: "px-4 bg-[#007ACC] text-white rounded ml-2", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, "アーカイブ"))))); } function StoryComponent() { const [messages, setMessages] = React.useState([]); const [memoContent, setMemoContent] = React.useState(""); const [chatSummary, setChatSummary] = React.useState(""); const onSendMessage = (newMessage)=>{ setMessages([ ...messages, newMessage ]); setChatSummary("ここに{integration:CHAT_GPT}の要約が表示されます。"); }; const onClearMessages = ()=>{ setMessages([]); }; const onArchiveMessages = ()=>{ console.log("メッセージをアーカイブしました"); }; const onUpdateMemo = (newContent)=>{ setMemoContent(newContent); }; return /*#__PURE__*/ React.createElement("div", { className: "h-screen font-roboto bg-[#0F0F0F]", __source: { fileName: "", lineNumber: 73, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { messages: messages, onSendMessage: onSendMessage, onClearMessages: onClearMessages, onArchiveMessages: onArchiveMessages, memoContent: memoContent, onUpdateMemo: onUpdateMemo, chatSummary: chatSummary, __source: { fileName: "", lineNumber: 74, columnNumber: 7 }, __self: this })); }