Skip to main content

Getting started

Installation

npm i -S @connect2ic/core @connect2ic/svelte

Wrap your app with the Provider

Optionally pass in canister definitions as well (as generated by dfx)

<script>
import { createClient } from "@connect2ic/core"
import { defaultProviders } from "@connect2ic/core/providers"
import { Connect2ICProvider } from "@connect2ic/svelte"
import "@connect2ic/core/style.css"
import * as counter from "canisters/counter"

const client = createClient({
canisters: {
counter,
},
providers: defaultProviders,
})
</script>

<Connect2ICProvider client={client}>
<App />
</Connect2ICProvider>

Place the components inside your app

<script>
import { ConnectButton, ConnectDialog, useConnect } from "@connect2ic/svelte"

const { isConnected, principal, activeProvider } = useConnect({
onConnect: () => {
// Signed in
},
onDisconnect: () => {
// Signed out
}
})
</script>

<div class="my-app">
<ConnectButton />
<ConnectDialog />
</div>

Done

Explore the remaining sections for further customization & features.