> For the complete documentation index, see [llms.txt](https://docs.wepin.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.wepin.io/en/deprecated/web-javascript-sdk/wagmi-connector.md).

# Wagmi Connector

Wepin supports wallet connections using wagmi. You can easily integrate Wepin wallet via the wagmi interface with <mark style="color:blue;">`@wepin/wagmi-connector`</mark>. Detailed information about this can be found on the official wagmi website below.

{% embed url="<https://wagmi.sh/>" %}

* **`appId`**: <*String>*\
  Your App Id assigned during registration
* **`appKey`**: <*String>*\
  Your App Key assigned during registration
* **`defaultChainId`:** *Number*
  * The default Chain ID for connecting the wallet
  * If no value is specified, it automatically connects to the first network registered in the app.
* **`attributes`**: *<*&#x49;Attributes> *(optional)*\
  Wepin connection attribute values declared in [@wepin/types](https://github.com/WepinWallet/wepin-js-sdk-types)
  * **`type`**: *String*\
    If you input the <mark style="color:blue;">`show`</mark> value, you can see the widget screen during the widget initialization process.
  * **`defaultLanguage`**: *String*\
    The default language for the widget. The default value is <mark style="color:blue;">`ko`</mark>. The currently supported languages are <mark style="color:blue;">`en`</mark> and <mark style="color:blue;">`ko`</mark>.
  * **`defaultCurrency`:** *String*\
    The default currency for the widget. The default value is <mark style="color:blue;">`KRW`</mark>. The currently supported currencies are <mark style="color:blue;">`USD`</mark> and <mark style="color:blue;">`KRW`</mark>.

```javascript
const connectorOptions: WepinConnectorOptions = {
  appId: 'YOUR_APP_ID',
  appKey: 'YOUR_APP_KEY',
  defaultChainId: 1, // optional
  attributes: {  // optional
    type: 'show',
    defaultLanguage: 'ko',
    defaultCurrency: 'krw'
  }
}
```

### Add <mark style="color:blue;">`WepinConnector`</mark> to wagmi config

```javascript
const config = createConfig({
  connectors: [
    // ... Other connectors,
    new WepinConnector({
      chains,
      options: connectorOptions,
    }),
  ],
  publicClient,
})
```

### Wrap app with <mark style="color:blue;">`WagmiConfig`</mark>

```javascript
import { WagmiConfig } from 'wagmi'

function App() {
  return (
    <WagmiConfig config={config}>
      <YourRoutes />
    </WagmiConfig>
  )
}
```

## Check Further

Afterwards, please refer to the wagmi guide below for detailed integration methods with <mark style="color:blue;">`wagmi`</mark>.&#x20;

{% embed url="<https://wagmi.sh/react/getting-started>" %}

### Example

An example using <mark style="color:blue;">`wepin-wagmi-connector`</mark> can be found on the GitHub repository below.

{% embed url="<https://github.com/WepinWallet/wepin-wagmi-connector/tree/main/example>" %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.wepin.io/en/deprecated/web-javascript-sdk/wagmi-connector.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.