function MainComponent() { const [contractAddress, setContractAddress] = React.useState(""); const [tokenId, setTokenId] = React.useState(""); const [nftMetadata, setNftMetadata] = React.useState(null); const fetchMetadata = async ()=>{ const response = await fetch(`https://api.opensea.io/api/v1/asset/${contractAddress}/${tokenId}/`); if (response.ok) { const data = await response.json(); setNftMetadata(data); } else { setNftMetadata(null); } }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f5f5f5]", __source: { fileName: "", lineNumber: 17, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-roboto mb-8", __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this }, "NFTメタデータ表示サイト"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center space-y-4", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "contractAddress", placeholder: "コントラクトアドレス", value: contractAddress, onChange: (e)=>setContractAddress(e.target.value), className: "p-2 border border-gray-400 rounded w-[300px]", __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", name: "tokenId", placeholder: "トークンID", value: tokenId, onChange: (e)=>setTokenId(e.target.value), className: "p-2 border border-gray-400 rounded w-[300px]", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: fetchMetadata, className: "p-4 bg-blue-500 text-white rounded hover:bg-blue-700", __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }, "メタデータを取得")), nftMetadata && /*#__PURE__*/ React.createElement("div", { className: "mt-8 text-lg font-roboto", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, "名前: ", nftMetadata.name), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 46, columnNumber: 11 }, __self: this }, "説明: ", nftMetadata.description), /*#__PURE__*/ React.createElement("img", { src: nftMetadata.image_url, alt: "NFT画像", className: "mt-4 w-[400px] h-[400px] object-contain", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }))); }