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: 1 addition & 0 deletions .github/workflows/templates.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
"mobile/kit-expo-minimal",
"mobile/kit-expo-privy",
"mobile/kit-expo-uniwind",
"mobile/kit-expo-wallet",
"mobile/web3js-expo",
"mobile/web3js-expo-minimal",
"mobile/web3js-expo-paper"
Expand Down
8 changes: 8 additions & 0 deletions TEMPLATES.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,14 @@ Solana Mobile Templates

`expo` `mobile-wallet-adapter` `react-native` `solana-kit` `uniwind` `tailwind`

### [kit-expo-wallet](mobile/kit-expo-wallet)

`gh:solana-mobile/templates/mobile/kit-expo-wallet`

> A Solana mobile app template with Expo, React Native, Solana Kit, Mobile Wallet Adapter actions, and Uniwind.

`expo` `mobile-wallet-adapter` `react-native` `solana-kit` `tailwind` `uniwind` `wallet` `wallet-ui`

### [web3js-expo](mobile/web3js-expo)

`gh:solana-mobile/templates/mobile/web3js-expo`
Expand Down
43 changes: 43 additions & 0 deletions mobile/kit-expo-wallet/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files

# dependencies
node_modules/

# Expo
.expo/
dist/
web-build/
expo-env.d.ts

# Native
*.orig.*
*.jks
*.p8
*.p12
*.key
*.mobileprovision

# Metro
.metro-health-check*

# debug
npm-debug.*
yarn-debug.*
yarn-error.*

# macOS
.DS_Store
*.pem

# local env files
.env*.local
.env

# typescript
*.tsbuildinfo

app-example

# generated native folders
/ios
/android
10 changes: 10 additions & 0 deletions mobile/kit-expo-wallet/.prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
# Add files here to ignore them from prettier formatting
/.expo
/android
/coverage
/dist
/ios
/tmp
pnpm-lock.yaml
.agents
src/uniwind-types.d.ts
7 changes: 7 additions & 0 deletions mobile/kit-expo-wallet/.prettierrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"arrowParens": "always",
"printWidth": 120,
"semi": false,
"singleQuote": true,
"trailingComma": "all"
}
60 changes: 60 additions & 0 deletions mobile/kit-expo-wallet/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
# kit-expo-wallet

This is an [Expo](https://expo.dev) development-client app template for Solana Mobile wallets. It uses
[@solana/kit](https://www.solanakit.com/) and [@wallet-ui/react-native-kit](https://wallet-ui.dev/) to connect to a
mobile wallet, read account state, and run example wallet actions.

## Technologies

- [@solana/kit](https://www.solanakit.com/)
- [@wallet-ui/react-native-kit](https://wallet-ui.dev/)
- [Expo](https://expo.dev)
- [HeroUI Native](https://github.com/heroui-inc/heroui-native)
- [Uniwind](https://uniwind.dev/) (Tailwind CSS for React Native)

## Included wallet flows

- Connect and disconnect a mobile wallet.
- Read the connected account balance and recent activity for the selected cluster.
- Sign a message with the connected account.
- Sign a memo transaction.
- Sign a Solana Sign-In payload.
- Sign and submit a memo transaction after checking the connected account can pay the transaction fee.

## Get started

1. Install dependencies.

```bash
npm install
```

2. Build and run the Android development client.

```bash
npm run android
```

This template depends on native modules and `expo-dev-client`, so use a development build instead of Expo Go.

You can start developing by editing the files inside the `src` directory. Expo Router routes live in `src/app`, and
feature code lives in `src/features`.

## Wallet and network notes

- Devnet and Testnet have default RPC URLs. Localhost and Mainnet are disabled until you add an RPC URL in
Settings > Cluster.
- The app asks the selected mobile wallet to approve connection, message signing, sign-in, transaction signing, and
transaction submission requests.
- The sign-and-send demo creates a Memo Program transaction with the text entered in the app. It checks the wallet
balance for the estimated fee before submitting.

## Learn more

To learn more about developing your project with Expo, look at the following resources:

- [Expo documentation](https://docs.expo.dev/): Learn fundamentals, or go into advanced topics with our [guides](https://docs.expo.dev/guides).
- [Solana documentation](https://solana.com/docs): Learn how to build on Solana.
- [Solana Kit documentation](https://www.solanakit.com/): Learn how to use the JavaScript SDK for Solana.
- [Uniwind documentation](https://uniwind.dev/): Learn how to style your app with Tailwind CSS.
- [Wallet UI documentation](https://wallet-ui.dev/): Learn how to build wallet-enabled Solana apps on web and mobile.
45 changes: 45 additions & 0 deletions mobile/kit-expo-wallet/app.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
{
"expo": {
"android": {
"adaptiveIcon": {
"backgroundColor": "#E6F4FE",
"backgroundImage": "./assets/images/android-icon-background.png",
"foregroundImage": "./assets/images/android-icon-foreground.png",
"monochromeImage": "./assets/images/android-icon-monochrome.png"
},
"package": "com.anonymous.kit_expo_wallet",
"predictiveBackGestureEnabled": false
},
"experiments": {
"reactCompiler": true,
"typedRoutes": true
},
"icon": "./assets/images/icon.png",
"ios": {
"icon": "./assets/expo.icon"
},
"name": "Kit Expo Wallet",
"orientation": "portrait",
"plugins": [
"expo-router",
[
"expo-splash-screen",
{
"android": {
"image": "./assets/images/splash-icon.png",
"imageWidth": 76
},
"backgroundColor": "#208AEF"
}
],
"expo-status-bar"
],
"scheme": "kit-expo-wallet",
"slug": "kit-expo-wallet",
"userInterfaceStyle": "automatic",
"web": {
"favicon": "./assets/images/favicon.png",
"output": "static"
}
}
}
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
35 changes: 35 additions & 0 deletions mobile/kit-expo-wallet/assets/expo.icon/icon.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
{
"fill": {
"automatic-gradient": "extended-srgb:0.00000,0.47843,1.00000,1.00000"
},
"groups": [
{
"layers": [
{
"image-name": "expo-symbol.svg",
"name": "expo-symbol",
"position": {
"scale": 1,
"translation-in-points": [1.1008400065293245e-5, -16.046875]
}
},
{
"image-name": "grid.png",
"name": "grid"
}
],
"shadow": {
"kind": "neutral",
"opacity": 0.5
},
"translucency": {
"enabled": true,
"value": 0.5
}
}
],
"supported-platforms": {
"circles": ["watchOS"],
"squares": "shared"
}
}
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added mobile/kit-expo-wallet/assets/images/favicon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added mobile/kit-expo-wallet/assets/images/icon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 10 additions & 0 deletions mobile/kit-expo-wallet/eslint.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
// https://docs.expo.dev/guides/using-eslint/
const { defineConfig } = require('eslint/config')
const expoConfig = require('eslint-config-expo/flat')

module.exports = defineConfig([
expoConfig,
{
ignores: ['dist/*'],
},
])
3 changes: 3 additions & 0 deletions mobile/kit-expo-wallet/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
// index.js
import './polyfill'
import 'expo-router/entry'
15 changes: 15 additions & 0 deletions mobile/kit-expo-wallet/metro.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
const { getDefaultConfig } = require('expo/metro-config')
const { withUniwindConfig } = require('uniwind/metro') // make sure this import exists

/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname)

// Apply uniwind modifications before exporting
const uniwindConfig = withUniwindConfig(config, {
// relative path to your global.css file
cssEntryFile: './src/global.css',
// optional: path to typings
dtsFile: './src/uniwind-types.d.ts',
})

module.exports = uniwindConfig
Binary file added mobile/kit-expo-wallet/og-image.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
86 changes: 86 additions & 0 deletions mobile/kit-expo-wallet/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
{
"name": "kit-expo-wallet",
"scripts": {
"android": "expo run:android",
"android:build": "expo prebuild -p android",
"build": "tsc --noEmit && npm run android:build",
"ci": "tsc --noEmit && npm run lint:check && npm run format:check && npm run android:build",
"dev": "expo start --clear --dev-client --reset-cache",
"doctor": "npx -y expo-doctor@latest",
"format": "prettier --write .",
"format:check": "prettier --check .",
"ios": "expo run:ios",
"lint": "expo lint --fix",
"lint:check": "expo lint",
"start": "expo start",
"web": "expo start --web"
},
"displayName": "Kit Expo Wallet example",
"description": "A Solana mobile app template with Expo, React Native, Solana Kit, Mobile Wallet Adapter actions, and Uniwind.",
"usecase": "Mobile",
"keywords": [
"expo",
"mobile-wallet-adapter",
"react-native",
"solana-kit",
"tailwind",
"uniwind",
"wallet",
"wallet-ui"
],
"create-solana-dapp": {
"instructions": [
"Build the Android app locally:",
"+{pm} run android"
],
"versions:": {
"adb": "33.0.0"
}
},
"main": "./index.js",
"version": "0.0.0",
"dependencies": {
"@expo/metro-runtime": "~56.0.12",
"@expo/vector-icons": "^15.0.2",
"@nanostores/react": "^1.1.0",
"@solana-program/memo": "^0.11.0",
"@solana/kit": "^6.1.0",
"@solana/kit-plugin-rpc": "^0.11.1",
"@tanstack/react-query": "^5.100.14",
"@wallet-ui/react-native-kit": "^4.0.1",
"expo": "56",
"expo-constants": "~56.0.15",
"expo-dev-client": "~56.0.15",
"expo-linking": "~56.0.11",
"expo-router": "~56.2.6",
"expo-splash-screen": "~56.0.10",
"expo-status-bar": "~56.0.4",
"expo-system-ui": "~56.0.5",
"heroui-native": "^1.0.3",
"nanostores": "^1.2.0",
"react": "19.2.3",
"react-dom": "19.2.3",
"react-native": "0.85.3",
"react-native-gesture-handler": "^2.28.0",
"react-native-mmkv": "^4.3.1",
"react-native-nitro-modules": "^0.35.7",
"react-native-quick-crypto": "^1.0.7",
"react-native-reanimated": "4.3.1",
"react-native-safe-area-context": "~5.7.0",
"react-native-screens": "4.25.2",
"react-native-svg": "15.15.4",
"react-native-worklets": "0.8.3",
"tailwind-merge": "^3.4.0",
"tailwind-variants": "^3.2.2",
"tailwindcss": "~4.1.16",
"uniwind": "^1.7.0"
},
"devDependencies": {
"@types/react": "~19.2.14",
"eslint": "^9.25.0",
"eslint-config-expo": "~56.0.4",
"prettier": "^3.8.1",
"typescript": "~6.0.3"
},
"private": true
}
4 changes: 4 additions & 0 deletions mobile/kit-expo-wallet/polyfill.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
// polyfill.js
import { install } from 'react-native-quick-crypto'

install()
Loading
Loading