### Install Aptos Wallet Adapter Core Package (pnpm)

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/quick-start.md

Installs the `@aptos-labs/wallet-adapter-core` package using pnpm. This package is required to integrate the core functionality of the Aptos Wallet Adapter into a custom UI.

```shell
pnpm add @aptos-labs/wallet-adapter-core
```

--------------------------------

### Install Aptos Wallet Adapter pnpm

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/quick-start.md

This command installs the Aptos Wallet Adapter package using pnpm. It is the first step to integrate the adapter into your project, providing the necessary dependencies for connecting to wallets.

```Shell
pnpm add @aptos-labs/wallet-adapter-react
```

--------------------------------

### Configure Aptos Wallet Adapter React

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/quick-start.md

This code demonstrates how to wrap your React application with the `AptosWalletAdapterProvider`. It configures the adapter with dapp information, optional wallets to show, and enables auto-connection, making the wallet context available throughout the app.

```TypeScript
  import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react";
 
  // Show the following wallets as options even when not already installed
  const optInWallets = ["Petra"];
 
  const dappInfo = {
    aptosConnect: {
      dappName: "My awesome dapp"  // defaults to document's title
      dappImageURI: "..."  // defaults to dapp's favicon
    },
  };
 
  <AptosWalletAdapterProvider
    dappInfo={dappInfo}
    autoConnect
    optInWallets={optInWallets}>
      <App/>
  </AptosWalletAdapterProvider>
```

--------------------------------

### Configure Aptos Wallet Adapter with dappId React

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/quick-start.md

This snippet shows how to include the `dappId` within the `aptosConnect` configuration object when initializing the `AptosWalletAdapterProvider`. Providing the `dappId` is required if you need to support pairing with external wallets in addition to Aptos Connect.

```TypeScript
  const dappConfig = {
    aptosConnect: {
      // Pass the dappId here
      dappId: "my-dapp-id"
      // ...,
    }
  };
 
  <AptosWalletAdapterProvider dappConfig={dappConfig} /* ... */>
    <App/>
  </AptosWalletAdapterProvider>
```

--------------------------------

### Retrieving Email from SignIn Output (TypeScript)

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/sign-in-with-aptos.md

Provides code to extract the email address from the `input.resources` array within the `AptosSignInOutput`. It demonstrates iterating through the resources to find the one starting with `aptosconnect.app.email` and parsing the email from the string.

```TypeScript
import type { AptosSignInInput } from '@aptos-labs/wallet-adapter-react';
import { useWallet } from '@aptos-labs/wallet-adapter-react';
 
function SignInButton() {
  const { signIn } = useWallet();
 
  const input = {
    nonce: '...',
    resources: ['aptosconnect.app.email'],
  } satisfies AptosSignInInput;
 
  const handleSignIn = async () => {
    const result = await signIn({ walletName: 'Continue with Google', input });
 
    const email = result.input.resources
      .find((resource) => resource.startsWith('aptosconnect.app.email'))
      ?.split(':')
      ?.at(1);
 
    console.log(email);
  };
 
  return <button onClick={handleSignIn}>Sign in with Aptos</button>;
}
```

--------------------------------

### Remove Identity Connect Plugin pnpm

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/quick-start.md

This command removes the old Identity Connect plugin package using pnpm. It is a necessary step when migrating from Identity Connect to Aptos Connect, as Aptos Connect replaces its functionality.

```Shell
pnpm remove @identity-connect/wallet-adapter-plugin
```

--------------------------------

### Sign and Submit Transaction React

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/quick-start.md

This snippet shows how to use the `useWallet` hook to access wallet functions like `signAndSubmitTransaction`. It constructs a basic transaction payload for transferring APTOS coins and then submits it using the connected wallet, abstracting away the underlying wallet type.

```TypeScript
const { signAndSubmitTransaction } = useWallet();
 
const transaction: InputTransactionData = {
  data: {
    function: '0x1::coin::transfer',
    typeArguments: [APTOS_COIN],
    functionArguments: [account.address, 1],
  },
};
 
const txn = await signAndSubmitTransaction(transaction);
```

--------------------------------

### Update Aptos Wallet Adapter pnpm

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/quick-start.md

Use this command to update the Aptos Wallet Adapter package to the latest version using pnpm. This ensures you have the most recent features and bug fixes, including the bundled Aptos Connect functionality.

```Shell
pnpm update @aptos-labs/wallet-adapter-react
```

--------------------------------

### Using useWallet signIn Method (TypeScript)

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/sign-in-with-aptos.md

Shows how to use the `signIn` method obtained from the `useWallet` hook. It defines an asynchronous handler function that calls `signIn` with a specified wallet name and the prepared `AptosSignInInput`.

```TypeScript
import type { AptosSignInInput } from '@aptos-labs/wallet-adapter-react';
import { useWallet } from '@aptos-labs/wallet-adapter-react';
 
function SignInButton() {
  const { signIn } = useWallet();
 
  const input = {
    nonce: '...',
    resources: ['aptosconnect.app.email'],
  } satisfies AptosSignInInput;
 
  const handleSignIn = async () => {
    const result = await signIn({ walletName: 'Continue with Google', input });
 
    // ...
  };
 
  return <button onClick={handleSignIn}>Sign in with Aptos</button>;
}
```

--------------------------------

### Constructing AptosSignInInput (TypeScript)

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/sign-in-with-aptos.md

Demonstrates how to create an `AptosSignInInput` object, specifying the `nonce` and requested resources like `aptosconnect.app.email`. This input is used for the sign-in process.

```TypeScript
import type { AptosSignInInput } from '@aptos-labs/wallet-adapter-react';
 
function SignInButton() {
  const input = {
    nonce: '...',
    resources: ['aptosconnect.app.email'],
  } satisfies AptosSignInInput;
 
  return <button>Sign in with Aptos</button>;
}
```

--------------------------------

### AptosSignInOutput Structure (JSON)

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/sign-in-with-aptos.md

Illustrates the structure of the `AptosSignInOutput` object returned by the `signIn` method. It highlights the `input.resources` field where requested resources, such as the user’s email, are included upon successful sign-in if requirements are met.

```JSON
{
    account: AccountInfo;
    input: {
        // ...
        resources: [
            'aptosconnect.app.email:example@gmail.com'
        ]
        // ...
    },
    plainText: string;
    signingMessage: Uint8Array;
    signature: Signature;
    type: 'single_key';
};
```

--------------------------------

### Update Aptos Wallet Adapter Package (pnpm)

Source: https://github.com/itziklerner-pag/aptos-connect-doc/blob/main/telegram.md

This command updates the `@aptos-labs/wallet-adapter-react` package to the latest version using the pnpm package manager. This update is necessary to ensure full support for Telegram Mini Apps within your Dapp.

```shell
pnpm update @aptos-labs/wallet-adapter-react
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.