1

必要なライブラリをインストールします

    npm install @0xsequence/wallet-widget @0xsequence/connect @0xsequence/checkout @0xsequence/hooks
    # or
    pnpm install @0xsequence/wallet-widget @0xsequence/connect @0xsequence/checkout @0xsequence/hooks
    # or
    yarn add @0xsequence/wallet-widget @0xsequence/connect @0xsequence/checkout @0xsequence/hooks
2

アプリをProvidersでラップする

続行する前に、アプリがConnectのv5またはv6で設定されていることを確認してください。
[main.tsx]
    import React from "react";
    import ReactDOM from "react-dom/client";
    import "./index.css";
    import { config } from "./config";

    import App from "./App";
    import { SequenceWalletProvider } from "@0xsequence/wallet-widget";
    import { SequenceConnect } from "@0xsequence/connect";

    function Dapp() {
        return (
            <SequenceConnect config={config}>
                <SequenceWalletProvider>
                    <App />
                </SequenceWalletProvider>
            </SequenceConnect>
        );
    }

    ReactDOM.createRoot(document.getElementById("root")!).render(
    <React.StrictMode>
        <Dapp />
    </React.StrictMode>
    );
3

使い始める

useOpenWalletModal フックを使って、ウォレットウィジェットを開くことができます。