function MainComponent() { return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#008800] flex flex-col items-center justify-center p-4", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-white mb-10", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, "LINEみたいなコミュニケーションツール"), /*#__PURE__*/ React.createElement("div", { className: "bg-white w-full max-w-5xl rounded-lg shadow-xl p-8 flex", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col w-1/4 border-r-4 border-gray-300 pr-6", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "search", placeholder: "検索", className: "w-full p-3 border-4 border-gray-400 rounded-md focus:outline-none", __source: { fileName: "", lineNumber: 8, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "overflow-auto", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center p-3 hover:bg-gray-200 cursor-pointer rounded-md", __source: { fileName: "", lineNumber: 11, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 bg-gray-400 rounded-full mr-4", __source: { fileName: "", lineNumber: 12, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 13, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-semibold", __source: { fileName: "", lineNumber: 14, columnNumber: 17 }, __self: this }, "友達 1"), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-700", __source: { fileName: "", lineNumber: 15, columnNumber: 17 }, __self: this }, "こんにちは！"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center p-3 hover:bg-gray-200 cursor-pointer rounded-md", __source: { fileName: "", lineNumber: 18, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 bg-gray-400 rounded-full mr-4", __source: { fileName: "", lineNumber: 19, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 20, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-semibold", __source: { fileName: "", lineNumber: 21, columnNumber: 17 }, __self: this }, "友達 2"), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-700", __source: { fileName: "", lineNumber: 22, columnNumber: 17 }, __self: this }, "もう寝るね"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center p-3 hover:bg-gray-200 cursor-pointer rounded-md", __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 bg-gray-400 rounded-full mr-4", __source: { fileName: "", lineNumber: 26, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 27, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-semibold", __source: { fileName: "", lineNumber: 28, columnNumber: 17 }, __self: this }, "友達 3"), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-700", __source: { fileName: "", lineNumber: 29, columnNumber: 17 }, __self: this }, "昨日のゲームはすごかったね！"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center p-3 hover:bg-gray-200 cursor-pointer rounded-md", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 bg-gray-400 rounded-full mr-4", __source: { fileName: "", lineNumber: 33, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-semibold", __source: { fileName: "", lineNumber: 35, columnNumber: 17 }, __self: this }, "友達 4"), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-700", __source: { fileName: "", lineNumber: 36, columnNumber: 17 }, __self: this }, "一緒にランチ行かない？"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center p-3 hover:bg-gray-200 cursor-pointer rounded-md", __source: { fileName: "", lineNumber: 39, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 bg-gray-400 rounded-full mr-4", __source: { fileName: "", lineNumber: 40, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 41, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-semibold", __source: { fileName: "", lineNumber: 42, columnNumber: 17 }, __self: this }, "友達 5"), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-700", __source: { fileName: "", lineNumber: 43, columnNumber: 17 }, __self: this }, "新しいプロジェクトについて聞いた？"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center p-3 hover:bg-gray-200 cursor-pointer rounded-md", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 bg-gray-400 rounded-full mr-4", __source: { fileName: "", lineNumber: 47, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 48, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-semibold", __source: { fileName: "", lineNumber: 49, columnNumber: 17 }, __self: this }, "友達 6"), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-700", __source: { fileName: "", lineNumber: 50, columnNumber: 17 }, __self: this }, "週末はどうする？"))))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col w-3/4 pl-6", __source: { fileName: "", lineNumber: 55, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold", __source: { fileName: "", lineNumber: 57, columnNumber: 13 }, __self: this }, "友達 1")), /*#__PURE__*/ React.createElement("div", { className: "flex-1 bg-gray-200 p-6 rounded-lg mb-6 overflow-auto", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-green-400 rounded-full text-white py-3 px-6 inline-block max-w-xs break-words", __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, "こんにちは！")), /*#__PURE__*/ React.createElement("div", { className: "mb-6 text-right", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-blue-400 rounded-full text-white py-3 px-6 inline-block max-w-xs break-words", __source: { fileName: "", lineNumber: 64, columnNumber: 15 }, __self: this }, "こんにちは！どうしてる？"))), /*#__PURE__*/ React.createElement("div", { className: "flex", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "message", placeholder: "メッセージを入力", className: "flex-1 p-3 border-4 border-gray-400 rounded-l-md focus:outline-none", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "bg-green-600 text-white p-3 rounded-r-md", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, "送信"))))); }