### Install MIDL.js Core Packages

Source: https://js.midl.xyz/core/getting-started

Installs the core MIDL.js library along with React and connector packages using different package managers. Ensure you have Node.js and your preferred package manager (pnpm, npm, or yarn) installed.

```bash
pnpm add @midl/core @midl/react @midl/connectors
```

```bash
npm install @midl/core @midl/react @midl/connectors
```

```bash
yarn add @midl/core @midl/react @midl/connectors
```

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

### Install MIDL.js Executor Packages

Source: https://js.midl.xyz/getting-started

Install the necessary MIDL.js executor packages for your JavaScript or React application using your preferred package manager. These packages enable interaction with and deployment of contracts on the MIDL Protocol.

```bash
pnpm add @midl/executor @midl/executor-react @midl/connectors @midl/core @midl/react
```

```bash
npm install @midl/executor @midl/executor-react @midl/connectors @midl/core @midl/react
```

```bash
yarn add @midl/executor @midl/executor-react @midl/connectors @midl/core @midl/react
```

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

### Configure MIDL.js and Integrate with React App

Source: https://js.midl.xyz/core/getting-started

Sets up the MIDL.js configuration, including network and connector definitions, and integrates it into a React application using the MidlProvider. This requires the @midl/core and @midl/react packages, and @tanstack/react-query for state management.

```typescript
import { createConfig, regtest } from "@midl/core";
import { xverseConnector } from "@midl/connectors";

export const midlConfig = createConfig({
  networks: [regtest],
  connectors: [xverseConnector()],
  persist: true,
});
```

```tsx
import { MidlProvider } from "@midl/react";
import { QueryClientProvider } from "@tanstack/react-query";
import { queryClient } from "./query-client";
import { midlConfig } from "./midl.config";

function App() {
  return (
    <MidlProvider config={midlConfig}>
      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
    </MidlProvider>
  );
}
```

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

### Install SatoshiKit with Package Managers

Source: https://js.midl.xyz/satoshi-kit

Install the SatoshiKit package using your preferred package manager (pnpm, npm, or yarn). This command adds the necessary library to your project dependencies.

```bash
pnpm add @midl/satoshi-kit
```

```bash
npm install @midl/satoshi-kit
```

```bash
yarn add @midl/satoshi-kit
```

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

### Integrate WagmiMidlProvider in React App

Source: https://js.midl.xyz/getting-started

Set up the `WagmiMidlProvider` to provide the necessary context for the MIDL.js executor to function within your React application. This involves wrapping your application components with `MidlProvider`, `QueryClientProvider`, and `WagmiMidlProvider`.

```tsx
import {
    MidlProvider
} from '@midl/react';
import {
    WagmiMidlProvider
} from "@midl/executor-react";
import {
    QueryClient,
    QueryClientProvider
} from '@tanstack/react-query';

import { midlConfig } from "./midlConfig";

const queryClient = new QueryClient();

function App({ children }: { children: React.ReactNode }) {
    return (
        <MidlProvider config={midlConfig}>
          <QueryClientProvider client={queryClient}>
            <WagmiMidlProvider>
              {children}
            </WagmiMidlProvider>
          </QueryClientProvider>
        </MidlProvider>
    );
}

```

```ts
import {
    createConfig,
    regtest,
} from "@midl/core";
import { xverseConnector } from "@midl/connectors";

export const midlConfig = createConfig({
    networks: [regtest],
    connectors: [xverseConnector()],
    persist: true,
});

```

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

### Install Playwright Browsers

Source: https://js.midl.xyz/toolstestinge2e

Downloads and installs the browser binaries required by Playwright to run tests. This is a prerequisite for executing Playwright tests.

```bash
pnpm playwright install
```

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

### Use MIDL.js Hooks for Blockchain Interaction in React

Source: https://js.midl.xyz/core/getting-started

Demonstrates how to use MIDL.js hooks like `useConnect` and `useAccounts` within a React component to manage wallet connections and display account information. This snippet assumes the MIDL.js context and query client are already set up.

```tsx
import { useConnect, useAccounts } from "@midl/react";

function Page() {
  const { connect, connectors } = useConnect();
  const { accounts, isConnected } = useAccounts();

  return (
    <div>
      {connectors.map(connector => (
        <button
          key={connector.name}
          onClick={() =>
            connect({
              id: connector.id,
            })
          }
        >
          {connector.name}
        </button>
      ))}

      {isConnected && (
        <div>
          <h2>Accounts</h2>
          <ul>
            {accounts.map(account => (
              <li key={account}>{account}</li>
            ))}
          </ul>
        </div>
      )}
    </div>
  );
}
```

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

### Install Dependencies for Playwright E2E Testing

Source: https://js.midl.xyz/toolstestinge2e

Installs the necessary Playwright testing libraries and the @midl/playwright adapter. This command is essential for setting up the testing environment.

```bash
pnpm add -D @playwright/test @midl/playwright
```

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

### Create SatoshiKit Configuration with Custom Connectors

Source: https://js.midl.xyz/satoshi-kit/configuration

Demonstrates how to create a SatoshiKit configuration with a specific set of connectors using `createMidlConfig`. This example explicitly includes the `xverseConnector` while still utilizing the `regtest` network and enabling persistence.

```typescript
import { createMidlConfig } from "@midl/satoshi-kit";
import { regtest } from "@midl/core";
import { xverseConnector } from "@midl/connectors";

export const midlConfig = createMidlConfig({
  networks: [regtest],
  persist: true,
  connectors: [xverseConnector()],
}) as Config;
```

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

### Initialize SatoshiKitProvider in a React App

Source: https://js.midl.xyz/satoshi-kit/configuration

Shows how to wrap your React application with `SatoshiKitProvider` to enable SatoshiKit functionality. This example configures the provider with a custom `midlConfig` and specifies the `AddressPurpose.Payment` for address generation.

```tsx
import { SatoshiKitProvider } from "@midl/satoshi-kit";
import { AddressPurpose } from "@midl/core";
import { midlConfig } from "./config";

export const App = () => {
    return (
        <SatoshiKitProvider config={midlConfig} purposes={[AddressPurpose.Payment]}>
            {/* Your app components */}
        </SatoshiKitProvider>
    );
};
```

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

### Install MIDL Hardhat Dependencies (Bash)

Source: https://js.midl.xyz/guidesdeploy-contract

Installs necessary Hardhat and MIDL-specific packages for smart contract deployment. Includes hardhat, @midl/hardhat-deploy, hardhat-deploy, and @midl/executor.

```bash
pnpm add -D hardhat @midl/hardhat-deploy hardhat-deploy @midl/executor
```

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

### Implement SatoshiKit Authentication with React Example

Source: https://js.midl.xyz/satoshi-kit/authentication

Demonstrates how to set up SatoshiKit authentication within a React application. It shows the creation of a `midlConfig`, a custom `authenticationAdapter`, and the integration of `SatoshiKitProvider` within the application's component tree.

```tsx
import { SatoshiKitProvider, createMidlConfig, createAuthenticationAdapter } from "@midl/satoshi-kit";
import { regtest } from "@midl/core";

const midlConfig = createMidlConfig({
    networks: [regtest],
    persist: true,
});


const authenticationAdapter = createAuthenticationAdapter({
    async verify({ message, signature, account, network }) {
        // Implement your verification logic here
        return true; // or false based on verification
    },
    async createMessage(account, network) {
        const message = `Sign in to SatoshiKit with account ${account.address}`;
        return { message };
    },
    async signOut() {
        // Implement your sign out logic here
    },
});


export const App = () => {
    return (
        <MidlProvider config={midlConfig}>
            <SatoshiKitProvider authenticationAdapter={authenticationAdapter}>
                {/* Your app components */}
            </SatoshiKitProvider>
        </MidlProvider>
    );
};

```

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

### Update Start Script to Disable Turbopack

Source: https://js.midl.xyz/troubleshooting

This JSON snippet demonstrates how to modify the `start` script in `package.json` to disable Turbopack for Next.js applications. This is an alternative method to resolve conflicts.

```json
{
  "scripts": {
    "start": "next start"
  }
}
```

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

### Set up SatoshiKitProvider in React App

Source: https://js.midl.xyz/satoshi-kit

Integrate SatoshiKit into your React application by wrapping your app with `SatoshiKitProvider`. This setup requires importing necessary components and configuring midl using `createMidlConfig` from `@midl/satoshi-kit`.

```tsx
import { MidlProvider } from "@midl/react";
import { SatoshiKitProvider, ConnectButton } from "@midl/satoshi-kit";
import { QueryClientProvider } from "@tanstack/react-query";
import { useMemo, type ReactNode } from "react";
import "@midl/satoshi-kit/styles.css";
import { midlConfig, queryClient } from "./config";

export const App = ({ children }: { children: ReactNode }) => {
	const client = useMemo(() => queryClient, []);

	return (
	  <MidlProvider config={midlConfig}>
			<QueryClientProvider client={client}>
				<SatoshiKitProvider>
					<ConnectButton />
				</SatoshiKitProvider>
			</QueryClientProvider>
		</MidlProvider>
	);
};

```

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

### Install @midl/node Package

Source: https://js.midl.xyz/core/node

Installs the @midl/node package using pnpm. This package provides Node.js utilities and connectors.

```bash
pnpm add @midl/node
```

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

### Initialize Configuration with Connectors - TypeScript

Source: https://js.midl.xyz/core/connectors

Demonstrates how to create a configuration object using @midl/core's createConfig function, incorporating imported wallet connectors. This setup enables the application to interact with specified wallets.

```typescript
import { createConfig, regtest } from "@midl/core";
import { xverseConnector, leatherConnector } from "@midl/connectors";

export const config = createConfig({
  networks: [regtest],
  connectors: [xverseConnector(), leatherConnector()],
  persist: true,
});
```

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

### Use useBTCFeeRate Hook Example (TypeScript)

Source: https://js.midl.xyz/hooksuseBTCFeeRate

Provides a basic example of how to call the useBTCFeeRate hook within a React component. It shows how to destructure the fee rate data from the hook's return value.

```typescript
const { data: feeRate } = useBTCFeeRate();
```

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

### Create Midl Configuration for SatoshiKit

Source: https://js.midl.xyz/satoshi-kit

Generate the midl configuration using `createMidlConfig` from `@midl/satoshi-kit`. This function sets up the necessary connectors and allows for persistence. It also includes the setup for `@tanstack/react-query`'s `QueryClient`.

```ts
import { type Config, regtest } from "@midl/core";
import { createMidlConfig } from "@midl/satoshi-kit";
import { QueryClient } from "@tanstack/react-query";

export const midlConfig = createMidlConfig({
  networks: [regtest],
  persist: true,
});

export const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      experimental_prefetchInRender: true,
    },
  },
});

```

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

### Example Usage of signIntentions

Source: https://js.midl.xyz/actionssignIntentions

Demonstrates how to use the signIntentions function with configuration, client, intentions, and signing options. It returns a Promise that resolves to an array of SignedTransaction objects.

```typescript
const signed = await signIntentions(config, client, intentions, { txId });
```

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

### Example Usage of signIntention

Source: https://js.midl.xyz/actionssignIntention

Demonstrates how to use the signIntention function with provided configuration, client, intention, intentions, and options including a transaction ID. It returns a Promise that resolves to the signed transaction.

```typescript
const signed = await signIntention(config, client, intention, intentions, { txId });
```

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

### Example Usage of finalizeBTCTransaction

Source: https://js.midl.xyz/actionsfinalizeBTCTransaction

Demonstrates how to use the finalizeBTCTransaction function with configuration, intentions, and client objects. It shows an example of setting a custom fee rate.

```typescript
import { finalizeBTCTransaction } from "@midl/executor";

const btcTx = await finalizeBTCTransaction(config, intentions, client, { feeRate: 10 });
```

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

### Get Bitcoin and EVM Addresses (Bash)

Source: https://js.midl.xyz/guidesdeploy-contract

This command retrieves the Bitcoin and EVM addresses associated with your project. The output provides the necessary addresses for interacting with both networks, essential for funding and deployment.

```bash
pnpm hardhat midl:address
```

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

### Display AccountDialog (TypeScript)

Source: https://js.midl.xyz/satoshi-kit/customization

Provides an example of how to render the AccountDialog component, controlling its visibility with the `open` prop and handling closure events via the `onClose` prop. This is used to show connected accounts and disconnect options.

```tsx
import { AccountDialog } from "@midl/satoshi-kit";

<AccountDialog open={isOpen} onClose={() => setIsOpen(false)} />;

```

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

### Install @midl/hardhat-deploy and hardhat-deploy

Source: https://js.midl.xyz/toolscontractsoverview

Installs the necessary packages for using @midl/hardhat-deploy with different package managers (pnpm, npm, yarn). These packages are essential for managing smart contract deployments within a Hardhat project.

```bash
pnpm add @midl/hardhat-deploy hardhat-deploy
```

```bash
npm install @midl/hardhat-deploy hardhat-deploy
```

```bash
yarn add @midl/hardhat-deploy hardhat-deploy
```

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

### Polyfill Buffer and BigInt for Vite

Source: https://js.midl.xyz/troubleshooting

This HTML script provides polyfills for `Buffer` and `BigInt` to make them available in environments where they are not natively supported, such as Vite. It ensures compatibility for projects relying on these functionalities.

```html
<script type="module">
  import { Buffer } from "buffer";
  window.Buffer = Buffer;
  window.global = window;
  BigInt.prototype.toJSON = function () {
    return this.toString();
  };
</script>
```

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

### Transpile SatoshiKit Package in Next.js

Source: https://js.midl.xyz/troubleshooting

This JavaScript code configures a Next.js project to transpile the `@midl/satoshi-kit` package. This is a recommended solution for 'Module not found' errors when Turbopack is enabled.

```javascript
module.exports = {
  transpilePackages: ["@midl/satoshi-kit"],
};
```

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

### Example Usage of addTxIntention

Source: https://js.midl.xyz/actionsaddTxIntention

Demonstrates how to use the addTxIntention function to create a transaction intention. It requires configuration and partial intention fields.

```typescript
import { addTxIntention } from "@midl/executor";

const intention = await addTxIntention(config, {
  // ...partial intention fields
});
```

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

### Example Usage of useSignIntention Hook (TypeScript)

Source: https://js.midl.xyz/hooksuseSignIntention

Demonstrates how to use the useSignIntention hook to obtain the signIntention function and subsequently call it with transaction intention and transaction ID. This is a core example of initiating the signing process.

```typescript
const { signIntention } = useSignIntention();
signIntention({ intention, txId });
```

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

### Call getTSSAddress Function

Source: https://js.midl.xyz/actionsgetTSSAddress

This example demonstrates how to call the getTSSAddress function. It takes a configuration object and a Viem client instance as arguments and returns a Promise that resolves to the TSS multisig Bitcoin address.

```typescript
const tssAddress = await getTSSAddress(config, client);
```

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

### Get Public Key using getPublicKey

Source: https://js.midl.xyz/actionsgetPublicKey

Demonstrates how to use the getPublicKey function to retrieve a public key. This function takes an account object and a network type as input and returns the public key as a hex string or null.

```typescript
const pubkey = getPublicKey(account, network);
```

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

### Hardhat MIDL Plugin Configuration Example (TypeScript)

Source: https://js.midl.xyz/toolscontractsconfig

This TypeScript code snippet demonstrates how to configure the MIDL Hardhat plugin in your Hardhat configuration file. It shows the structure for setting the deployment path and defining network configurations, including wallet credentials and blockchain-specific parameters.

```typescript
import { AddressPurpose } from "@midl/core";

export default {
  midl: {
    path: "deployments",
    networks: {
      default: {
        mnemonic: "test test test ...",
        confirmationsRequired: 5,
        btcConfirmationsRequired: 1,
        network: "regtest",
        hardhatNetwork: "regtest",
        defaultPurpose: AddressPurpose.Payment
      },
    },
  },
};
```

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

### Example Usage of useAddCompleteTxIntention (TypeScript)

Source: https://js.midl.xyz/hooksuseAddCompleteTxIntention

Demonstrates how to use the useAddCompleteTxIntention hook to add a complete transaction intention. It shows calling the addCompleteTxIntention function with specific satoshis and runes.

```typescript
const { addCompleteTxIntention } = useAddCompleteTxIntention();
addCompleteTxIntention({ satoshis: 5000, runes: [{ id: "840000:1", amount: 1n }] });
```

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

### Example Usage of addRequestAddAssetIntention

Source: https://js.midl.xyz/actionsaddRequestAddAssetIntention

Demonstrates how to use the `addRequestAddAssetIntention` function to create a transaction intention. It shows the required parameters, including configuration, asset details, and the Rune deposit amount.

```typescript
const intention = await addRequestAddAssetIntention(config, {
  address: "0x0000000000000000000000000000000000000000",
  runeId: "840000:1",
  amount: 1000000n,
});
```

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

### Basic Playwright Test with Wallet Integration

Source: https://js.midl.xyz/toolstestinge2e

A minimal TypeScript example demonstrating how to create a Playwright test that launches a browser with a wallet extension. It utilizes the `createTest` function from @midl/playwright to provide a wallet helper for interactions.

```typescript
import { createTest } from "@midl/playwright";

const { test, expect } = createTest({
  mnemonic: "test test test test test test test test test test test junk",
  extension: "leather",
});

test("connects wallet", async ({ page, wallet }) => {
  await page.goto("http://localhost:3000");
  await wallet.connect();
  // add your assertions here
});
```

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

### Get EVM Chain Configuration using Bitcoin Network

Source: https://js.midl.xyz/utilitiesgetEVMFromBitcoinNetwork

Demonstrates how to use the `getEVMFromBitcoinNetwork` function with a specific Bitcoin network, such as `regtest`, to obtain its EVM chain configuration. Requires importing the `regtest` constant from `@midl/core`.

```typescript
import { regtest } from "@midl/core";

const evmChain = getEVMFromBitcoinNetwork(regtest);
```

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

### Get Public Key using usePublicKey Hook

Source: https://js.midl.xyz/hooksusePublicKey

Demonstrates how to use the usePublicKey hook to retrieve a public key. The hook takes an optional 'from' parameter specifying the BTC address to derive the key from. The returned value is a hex-encoded public key string.

```typescript
const publicKeyHex = usePublicKey({ from: 'bcrtq...' });
```

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

### Initialize Environment

Source: https://js.midl.xyz/toolscontractsapi

Initializes the environment, setting up the wallet and configuration. This method must be called before other methods that require an account.

```APIDOC
## POST /initialize

### Description
Initializes the environment and sets up the wallet and config. This method is required before using other methods that rely on an account.

### Method
POST

### Endpoint
/initialize

### Parameters
#### Query Parameters
- **accountIndex** (number) - Optional - The index of the account to use for initialization.

### Request Example
```json
{
  "accountIndex": 0
}
```

### Response
#### Success Response (200)
- **config** (object) - The configuration object for the initialized environment.
  - **account** (object) - The initialized account details.
  - **evm.address** (string) - The EVM address of the account.

#### Response Example
```json
{
  "config": {
    "account": {
      "address": "0x..."
    },
    "evm": {
      "address": "0x..."
    }
  }
}
```
```

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

### Override viem Version for MIDL.js Compatibility

Source: https://js.midl.xyz/getting-started

Ensure compatibility with MIDL.js executor by overriding the `viem` version in your `package.json`. The patched `viem` version includes essential functionality for MIDL.js, such as transaction type and fee settings, and the `estimateGasMulti` method.

```json
{
  "pnpm": {
    "overrides": {
      "viem": "npm:@midl/viem"
    }
  }
}
```

```json
{
  "overrides": {
    "viem": "npm:@midl/viem"
  }
}
```

```json
{
  "resolutions": {
    "viem": "npm:@midl/viem"
  }
}
```

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

### Use useERC20Rune Hook to Get ERC20 Address

Source: https://js.midl.xyz/hooksuseERC20Rune

This example demonstrates how to use the useERC20Rune hook with a Rune ID and log the resulting ERC20 address. The hook takes a runeId string as input and returns an object containing the erc20Address.

```typescript
const { erc20Address } = useERC20Rune("1:1");

console.log(erc20Address);
```

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

### Initialize Hardhat Plugin Environment

Source: https://js.midl.xyz/toolscontractsapi

Initializes the Hardhat plugin environment, setting up the wallet and configuration. It optionally accepts an account index. This method must be called before other operations.

```typescript
initialize(accountIndex?: number): Promise<Config>
```

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

### Example Usage of useSignIntentions Hook (TypeScript)

Source: https://js.midl.xyz/hooksuseSignIntentions

Demonstrates how to use the useSignIntentions hook to obtain the signIntentions function and subsequently call it with a transaction ID. This example assumes txId is defined elsewhere.

```typescript
const { signIntentions } = useSignIntentions();
signIntentions({ txId });
```

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

### Import MIDL.js Connectors (TypeScript)

Source: https://js.midl.xyz/core/configuration

Illustrates importing various wallet connectors from the `@midl/connectors` and `@midl/node` packages. Supported connectors include XVerse, Leather, Unisat, Phantom, Bitget, OKX, Magic Eden, and a keyPair connector for Node.js environments.

```typescript
import {
  xverseConnector,
  leatherConnector,
  unisatConnector,
  phantomConnector,
  bitgetConnector,
  okxConnector,
  magicEdenConnector,
 } from "@midl/connectors";

 import {  keyPairConnector } from "@midl/node";
```

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

### Deploy and Interact with Contracts using MIDL.js

Source: https://js.midl.xyz/toolscontractsoverview

Demonstrates how to write deployment scripts using @midl/hardhat-deploy to initialize the MIDL environment, deploy contracts, call contract methods, and execute pending transactions. This script leverages the Hardhat Runtime Environment (hre) provided by Hardhat.

```typescript
import type { HardhatRuntimeEnvironment } from "hardhat/types";

export default async function deploy(hre: HardhatRuntimeEnvironment) {
  await hre.midl.initialize();

  // Deploy a contract
  await hre.midl.deploy('MyContract', ["Hello, MIDL!"]);

  // Call a contract method
  await hre.midl.write('MyContract', 'setGreeting', ["Hi!"]);

  // Execute all intentions (send transactions)
  await hre.midl.execute();
}

```

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

### Create SatoshiKit Configuration with Connector Metadata

Source: https://js.midl.xyz/satoshi-kit/configuration

Illustrates configuring SatoshiKit with custom metadata for a specific connector, `xverseConnector`. The `metadata` option allows you to categorize wallets, such as marking `xverseConnector` as 'popular' for display purposes in the wallet list.

```typescript
import { createMidlConfig } from "@midl/satoshi-kit";
import { regtest } from "@midl/core";
import { xverseConnector } from "@midl/connectors";

export const midlConfig = createMidlConfig({
  networks: [regtest],
  persist: true,
  connectors: [
    xverseConnector({
      metadata: {
        group: "popular",
      },
    }),
  ],
}) as Config;
```

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

### Get Deployment Data

Source: https://js.midl.xyz/toolscontractsapi

Retrieves deployment information for a contract by its name.

```APIDOC
## GET /get

### Description
Retrieves deployment information for a contract by its name.

### Method
GET

### Endpoint
/get

### Parameters
#### Query Parameters
- **name** (string) - Required - The name of the contract.

### Request Example
```
/get?name=MyContract
```

### Response
#### Success Response (200)
- **deploymentData** (object) - The deployment data for the contract.
- **null** - If the contract deployment information is not found.

#### Response Example
```json
{
  "address": "0x123...",
  "abi": [...],
  "txId": "0xabc..."
}
```
```

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

### SimpleStorage Contract Definition

Source: https://js.midl.xyz/guidesinteract-contract

This file defines the address and ABI for the SimpleStorage smart contract. It includes the constructor, a MessageUpdated event, and the getMessage and setMessage functions, outlining the contract's interface for interaction.

```typescript
export const SimpleStorage = {
  address: "0x015bceEFA137a662aFC0347Cb6fc204192960094",
  abi: [
    {
      inputs: [
        {
          internalType: "string",
          name: "initialMessage",
          type: "string",
        },
      ],
      stateMutability: "nonpayable",
      type: "constructor",
    },
    {
      anonymous: false,
      inputs: [
        {
          indexed: false,
          internalType: "string",
          name: "newMessage",
          type: "string",
        },
      ],
      name: "MessageUpdated",
      type: "event",
    },
    {
      inputs: [],
      name: "getMessage",
      outputs: [
        {
          internalType: "string",
          name: "",
          type: "string",
        },
      ],
      stateMutability: "view",
      type: "function",
    },
    {
      inputs: [
        {
          internalType: "string",
          name: "newMessage",
          type: "string",
        },
      ],
      name: "setMessage",
      outputs: [],
      stateMutability: "nonpayable",
      type: "function",
    },
  ],
};

```

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

### Disable Turbopack in Next.js Configuration

Source: https://js.midl.xyz/troubleshooting

This code snippet shows how to disable the Turbopack feature in a Next.js project by modifying the `next.config.js` file. This can resolve 'Module not found' errors when using libraries like SatoshiKit.

```javascript
module.exports = {
  experimental: {
    turbo: false,
  },
};
```

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

### Create Default SatoshiKit Configuration

Source: https://js.midl.xyz/satoshi-kit/configuration

Generates a default SatoshiKit configuration using `createMidlConfig` from `@midl/satoshi-kit`. This function automatically sets up essential connectors for various networks like `regtest`. The `persist` option is set to `true` to enable persistence.

```typescript
import { createMidlConfig } from "@midl/satoshi-kit";
import { regtest } from "@midl/core";


export const midlConfig = createMidlConfig({
  networks: [regtest],
  persist: true,
}) as Config;
```

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

### Import MIDL.js Networks (TypeScript)

Source: https://js.midl.xyz/core/configuration

Shows how to import various supported Bitcoin networks from the `@midl/core` package. These networks include `mainnet`, `testnet`, `testnet4`, `signet`, and `regtest`.

```typescript
import { mainnet, testnet, regtest, testnet4, signet } from "@midl/core";
```

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

### Customize ConnectButton with Props and Render Function (TypeScript)

Source: https://js.midl.xyz/satoshi-kit/customization

Demonstrates customizing the ConnectButton by hiding balance, avatar, and address, and using a render function to control the button's content and behavior. The `beforeConnect` prop allows pre-connection logic.

```tsx
import { ConnectButton } from "@midl/satoshi-kit";

export const CustomConnectButton = () => {
    return (
        <ConnectButton
            hideBalance={true}
            hideAvatar={true}
            hideAddress={true}
            beforeConnect={async (connectorId) => {
                console.log("before connect", connectorId);
            }}
        >
            {({ openConnectDialog, openAccountDialog, isConnected, isConnecting }) => (
                <button onClick={openConnectDialog}>
                    {isConnected ? "Connected" : "Connect"}
                </button>
            )}
        </ConnectButton>
    );
};

```

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

### SimpleStorage Contract (Solidity)

Source: https://js.midl.xyz/guidesdeploy-contract

A basic Solidity smart contract named SimpleStorage. It allows storing and retrieving a string message. Includes a constructor to initialize the message and an event emitted when the message is updated.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;

contract SimpleStorage {
    string private message;

    event MessageUpdated(string newMessage);

    constructor(string memory initialMessage) {
        message = initialMessage;
    }

    function setMessage(string memory newMessage) public {
        message = newMessage;
        emit MessageUpdated(newMessage);
    }

    function getMessage() public view returns (string memory) {
        return message;
    }
}
```

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

### Invoke CompleteTx with hardhat-deploy

Source: https://js.midl.xyz/toolscontractsadvanced-usage

Demonstrates how to invoke CompleteTx to withdraw assets back to Bitcoin L1. This can be used to withdraw native BTC and Runes on request, or automatically withdraw only native BTC when `execute({ withdraw: true })` is called.

```typescript
await hre.midl.execute({ withdraw: {
  runes: [{ id: runeId, value: amount, address: runeAddress }],
}});
```

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

### Use useAddRuneERC20Intention Hook and Add Rune

Source: https://js.midl.xyz/hooksuseAddRuneERC20Intention

Demonstrates how to use the useAddRuneERC20Intention hook to get the addRuneERC20 function and then call it with the necessary variables. The addRuneERC20 function initiates the process of adding a Rune to the Midl network.

```typescript
const { addRuneERC20 } = useAddRuneERC20Intention();

addRuneERC20({ runeId: "840000:1", reset: true });
```

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

### Verify Contract Source Code (Bash)

Source: https://js.midl.xyz/guidesdeploy-contract

This command verifies the source code of a deployed contract on the block explorer. Replace 'REPLACE_WITH_CONTRACT_ADDRESS' with the actual contract address and specify the network. Successful verification provides a link to the contract on the block explorer.

```bash
pnpm hardhat verify REPLACE_WITH_CONTRACT_ADDRESS "Hello from MIDL" --network default
```

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

### Get EVM Address with useEVMAddress Hook

Source: https://js.midl.xyz/hooksuseEVMAddress

Demonstrates how to use the useEVMAddress hook to retrieve an EVM address. The 'from' parameter can optionally specify the BTC address of the account to derive the EVM address from. If not provided, it defaults to the connected account.

```typescript
const evmAddress = useEVMAddress({ from: 'bcrt...' });
```