Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion .github/ISSUE_TEMPLATE/BUG.yml
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ assignees:
- taylorjdawson
- aaronbarnardsound
- Adamj1232
- mahmud-bn
body:
- type: markdown
attributes:
Expand Down
1 change: 1 addition & 0 deletions .github/ISSUE_TEMPLATE/FEATURE.yml
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ labels: [feature]
assignees:
- taylorjdawson
- aaronbarnardsound
- Adamj1232
body:
- type: markdown
attributes:
Expand Down
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,5 @@ dist/
package-lock.json
.rpt2_cache
.vscode
yarn-error.log
yarn-error.log
.env
13 changes: 13 additions & 0 deletions examples/with-sveltekit/.eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example

# Ignore files for PNPM, NPM and YARN
pnpm-lock.yaml
package-lock.json
yarn.lock
20 changes: 20 additions & 0 deletions examples/with-sveltekit/.eslintrc.cjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
module.exports = {
root: true,
parser: '@typescript-eslint/parser',
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'],
plugins: ['svelte3', '@typescript-eslint'],
ignorePatterns: ['*.cjs'],
overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
settings: {
'svelte3/typescript': () => require('typescript')
},
parserOptions: {
sourceType: 'module',
ecmaVersion: 2020
},
env: {
browser: true,
es2017: true,
node: true
}
};
8 changes: 8 additions & 0 deletions examples/with-sveltekit/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example
1 change: 1 addition & 0 deletions examples/with-sveltekit/.npmrc
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
engine-strict=true
13 changes: 13 additions & 0 deletions examples/with-sveltekit/.prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example

# Ignore files for PNPM, NPM and YARN
pnpm-lock.yaml
package-lock.json
yarn.lock
10 changes: 10 additions & 0 deletions examples/with-sveltekit/.prettierrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
{
"useTabs": false,
"tabWidth": 2,
"semi": false,
"singleQuote": true,
"trailingComma": "none",
"printWidth": 100,
"pluginSearchDirs": ["."],
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
}
38 changes: 38 additions & 0 deletions examples/with-sveltekit/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
# create-svelte

Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).

## Creating a project

If you're seeing this, you've probably already done this step. Congrats!

```bash
# create a new project in the current directory
npm create svelte@latest

# create a new project in my-app
npm create svelte@latest my-app
```

## Developing

Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:

```bash
npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open
```

## Building

To create a production version of your app:

```bash
npm run build
```

You can preview the production build with `npm run preview`.

> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.
38 changes: 38 additions & 0 deletions examples/with-sveltekit/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
{
"name": "with-sveltekit",
"version": "0.0.1",
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"lint": "prettier --check . && eslint .",
"format": "prettier --write ."
},
"devDependencies": {
"@esbuild-plugins/node-globals-polyfill": "^0.1.1",
"@sveltejs/adapter-auto": "next",
"@sveltejs/kit": "next",
"@types/cookie": "^0.5.1",
"@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0",
"eslint": "^8.16.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-svelte3": "^4.0.0",
"prettier": "^2.6.2",
"prettier-plugin-svelte": "^2.7.0",
"svelte": "^3.46.0",
"svelte-check": "^2.7.1",
"svelte-preprocess": "^4.10.6",
"tslib": "^2.3.1",
"typescript": "^4.7.4",
"vite": "^3.1.0"
},
"type": "module",
"dependencies": {
"@fontsource/fira-mono": "^4.5.0",
"@web3-onboard/walletconnect": "^2.1.2",
"buffer": "^6.0.3"
}
}
9 changes: 9 additions & 0 deletions examples/with-sveltekit/src/app.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
// and what to do when importing types
declare namespace App {
// interface Locals {}
// interface PageData {}
// interface PageError {}
// interface Platform {}
}
12 changes: 12 additions & 0 deletions examples/with-sveltekit/src/app.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width" />
%sveltekit.head%
</head>
<body>
<div>%sveltekit.body%</div>
</body>
</html>
48 changes: 48 additions & 0 deletions examples/with-sveltekit/src/lib/web3-onboard.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
import Onboard from '@web3-onboard/core'
import type { OnboardAPI } from '@web3-onboard/core'
import injectedWalletsModule from '@web3-onboard/injected-wallets'
import walletConnectModule from '@web3-onboard/walletconnect'

const injected = injectedWalletsModule()
const walletConnect = walletConnectModule()

const wallets = [injected, walletConnect]

const INFURA_ID = ''

const chains = [
{
id: 1,
token: 'ETH',
label: 'Ethereum Mainnet',
rpcUrl: `https://mainnet.infura.io/v3/${INFURA_ID}`
},
{
id: 137,
token: 'MATIC',
label: 'Matic Mainnet',
rpcUrl: 'https://matic-mainnet.chainstacklabs.com'
}
]

const appMetadata = {
name: 'Web3-Onboard Svelte Demo',
icon: '<svg />',
logo: '<svg />',
description: 'Demo using Onboard',
recommendedInjectedWallets: [
{ name: 'Coinbase', url: 'https://wallet.coinbase.com/' },
{ name: 'MetaMask', url: 'https://metamask.io' }
]
}
let onboard

if (!onboard) {
onboard = Onboard({
wallets,
chains,
appMetadata
})
}

export default onboard as OnboardAPI
49 changes: 49 additions & 0 deletions examples/with-sveltekit/src/routes/+page.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
<script lang="ts">
import onboard from '$lib/web3-onboard'

// Subscribe to wallet updates
const wallets$ = onboard.state.select('wallets')

// The first wallet in the array of connected wallets
$: connectedAccount = $wallets$?.[0]?.accounts?.[0]

const connect = async () => {
await onboard.connectWallet()
}

const disconnect = () => {
onboard.disconnectWallet({ label: $wallets$?.[0]?.label })
}

const trunc = (address: string) =>
address ? address.slice(0, 6) + '...' + address.slice(-6) : null
</script>

<main class="main">
<h1>Welcome to this demo of Web3-Onboard + SvelteKit!</h1>
<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>
{#if connectedAccount}
<div class="wallet">
<div>
<div>0x518a...7c9017</div>
<div>Connected Wallet: Metamask</div>
</div>
<button on:click={disconnect}>Disconnect</button>
</div>
{:else}
<div>
<button on:click={connect}>Connect</button>
</div>
{/if}
</main>

<style>
.main {
display: flex;
flex-flow: column;
align-items: center;
justify-items: center;
text-align: center;
height: 100vh;
}
</style>
Binary file added examples/with-sveltekit/static/favicon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
15 changes: 15 additions & 0 deletions examples/with-sveltekit/svelte.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import adapter from '@sveltejs/adapter-auto';
import preprocess from 'svelte-preprocess';

/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://github.com/sveltejs/svelte-preprocess
// for more information about preprocessors
preprocess: preprocess(),

kit: {
adapter: adapter()
}
};

export default config;
17 changes: 17 additions & 0 deletions examples/with-sveltekit/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true
}
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}
23 changes: 23 additions & 0 deletions examples/with-sveltekit/vite.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import { sveltekit } from '@sveltejs/kit/vite'
import { NodeGlobalsPolyfillPlugin } from '@esbuild-plugins/node-globals-polyfill'
import type { UserConfig } from 'vite'

const config: UserConfig = {
plugins: [sveltekit()],
optimizeDeps: {
esbuildOptions: {
// Node.js global to browser globalThis
define: {
global: 'globalThis'
},
// Enable esbuild polyfill plugins
plugins: [
NodeGlobalsPolyfillPlugin({
buffer: true
})
]
}
}
}

export default config
Loading