function MessageInputField({ name, placeholder }) { return /*#__PURE__*/ React.createElement("input", { type: "text", name: name, placeholder: placeholder, className: "w-full p-3 rounded-lg border border-gray-300", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }); } function MessageInputFieldStory() { return /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 14, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MessageInputField, { name: "message", placeholder: "Write a message...", __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MessageInputField, { name: "message-ja", placeholder: "メッセージを書く...", __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this })); } function MainComponent() { return /*#__PURE__*/ React.createElement("div", { className: "w-full h-full bg-white flex flex-col font-sans", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-grow overflow-y-auto p-4", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col space-y-4", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "self-start flex items-center space-x-2", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "seraphi_angel.png", alt: "Seraphi in angel form", className: "w-[80px] h-[80px] object-cover rounded-full border-2 border-gray-300", __source: { fileName: "", lineNumber: 7, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 text-black p-3 rounded-lg", __source: { fileName: "", lineNumber: 12, columnNumber: 13 }, __self: this }, "こんにちは！今日は何を手伝いしますか？")), /*#__PURE__*/ React.createElement("div", { className: "self-end flex items-center space-x-2", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-blue-500 text-white p-3 rounded-lg", __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }, "新しいアドベンチャーに行きたいです！"), /*#__PURE__*/ React.createElement("img", { src: "seraphi_bunny.png", alt: "Seraphi in bunny costume", className: "w-[80px] h-[80px] object-cover rounded-full border-2 border-gray-300", __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-gray-100", __source: { fileName: "", lineNumber: 28, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement(MessageInputField, { name: "message", placeholder: "メッセージを書く...", __source: { fileName: "", lineNumber: 29, columnNumber: 9 }, __self: this }))); }