@sei-js/create-sei 0.0.0 → 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (93) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/README.md +7 -11
  3. package/package.json +18 -26
  4. package/.eslintignore +0 -2
  5. package/dist/main.js +0 -161
  6. package/dist/templates/next-cosmos-template/.eslintrc.json +0 -3
  7. package/dist/templates/next-cosmos-template/README.md +0 -60
  8. package/dist/templates/next-cosmos-template/next-env.d.ts +0 -5
  9. package/dist/templates/next-cosmos-template/next.config.mjs +0 -14
  10. package/dist/templates/next-cosmos-template/package.json +0 -31
  11. package/dist/templates/next-cosmos-template/public/next.svg +0 -1
  12. package/dist/templates/next-cosmos-template/public/sei-logotype.svg +0 -15
  13. package/dist/templates/next-cosmos-template/public/vercel.svg +0 -1
  14. package/dist/templates/next-cosmos-template/src/app/components/Homepage/Examples.tsx +0 -177
  15. package/dist/templates/next-cosmos-template/src/app/components/Homepage/Homepage.css +0 -156
  16. package/dist/templates/next-cosmos-template/src/app/components/Homepage/Homepage.tsx +0 -110
  17. package/dist/templates/next-cosmos-template/src/app/components/WalletConnectButton/WalletConnectButton.tsx +0 -26
  18. package/dist/templates/next-cosmos-template/src/app/components/Web3Provider.tsx +0 -39
  19. package/dist/templates/next-cosmos-template/src/app/components/index.ts +0 -3
  20. package/dist/templates/next-cosmos-template/src/app/constants/chain.ts +0 -16
  21. package/dist/templates/next-cosmos-template/src/app/constants/index.ts +0 -1
  22. package/dist/templates/next-cosmos-template/src/app/favicon.ico +0 -0
  23. package/dist/templates/next-cosmos-template/src/app/index.css +0 -171
  24. package/dist/templates/next-cosmos-template/src/app/layout.tsx +0 -21
  25. package/dist/templates/next-cosmos-template/src/app/page.tsx +0 -17
  26. package/dist/templates/next-cosmos-template/tsconfig.json +0 -26
  27. package/dist/templates/next-cosmos-template/yarn.lock +0 -9814
  28. package/dist/templates/next-wagmi-template/.eslintrc.json +0 -3
  29. package/dist/templates/next-wagmi-template/README.md +0 -58
  30. package/dist/templates/next-wagmi-template/next-env.d.ts +0 -5
  31. package/dist/templates/next-wagmi-template/next.config.mjs +0 -4
  32. package/dist/templates/next-wagmi-template/package.json +0 -30
  33. package/dist/templates/next-wagmi-template/public/sei-logotype.svg +0 -15
  34. package/dist/templates/next-wagmi-template/src/app/components/Homepage/Examples.tsx +0 -271
  35. package/dist/templates/next-wagmi-template/src/app/components/Homepage/Homepage.css +0 -156
  36. package/dist/templates/next-wagmi-template/src/app/components/Homepage/Homepage.tsx +0 -113
  37. package/dist/templates/next-wagmi-template/src/app/components/Web3Provider.tsx +0 -73
  38. package/dist/templates/next-wagmi-template/src/app/components/index.ts +0 -2
  39. package/dist/templates/next-wagmi-template/src/app/constants/chain.ts +0 -7
  40. package/dist/templates/next-wagmi-template/src/app/constants/index.ts +0 -1
  41. package/dist/templates/next-wagmi-template/src/app/favicon.ico +0 -0
  42. package/dist/templates/next-wagmi-template/src/app/index.css +0 -171
  43. package/dist/templates/next-wagmi-template/src/app/layout.tsx +0 -21
  44. package/dist/templates/next-wagmi-template/src/app/page.tsx +0 -21
  45. package/dist/templates/next-wagmi-template/tsconfig.json +0 -26
  46. package/dist/templates/next-wagmi-template/yarn.lock +0 -4809
  47. package/dist/templates/vite-cosmos-template/.eslintrc.cjs +0 -18
  48. package/dist/templates/vite-cosmos-template/README.md +0 -72
  49. package/dist/templates/vite-cosmos-template/favicon.ico +0 -0
  50. package/dist/templates/vite-cosmos-template/index.html +0 -16
  51. package/dist/templates/vite-cosmos-template/package.json +0 -35
  52. package/dist/templates/vite-cosmos-template/public/sei-logotype.svg +0 -15
  53. package/dist/templates/vite-cosmos-template/src/App.tsx +0 -16
  54. package/dist/templates/vite-cosmos-template/src/assets/react.svg +0 -1
  55. package/dist/templates/vite-cosmos-template/src/components/Homepage/Examples.tsx +0 -177
  56. package/dist/templates/vite-cosmos-template/src/components/Homepage/Homepage.css +0 -156
  57. package/dist/templates/vite-cosmos-template/src/components/Homepage/Homepage.tsx +0 -102
  58. package/dist/templates/vite-cosmos-template/src/components/WalletConnectButton/WalletConnectButton.tsx +0 -26
  59. package/dist/templates/vite-cosmos-template/src/components/Web3Provider.tsx +0 -45
  60. package/dist/templates/vite-cosmos-template/src/components/index.ts +0 -4
  61. package/dist/templates/vite-cosmos-template/src/constants/chain.ts +0 -16
  62. package/dist/templates/vite-cosmos-template/src/constants/index.ts +0 -1
  63. package/dist/templates/vite-cosmos-template/src/index.css +0 -171
  64. package/dist/templates/vite-cosmos-template/src/main.tsx +0 -12
  65. package/dist/templates/vite-cosmos-template/src/vite-env.d.ts +0 -1
  66. package/dist/templates/vite-cosmos-template/tsconfig.app.json +0 -27
  67. package/dist/templates/vite-cosmos-template/tsconfig.json +0 -11
  68. package/dist/templates/vite-cosmos-template/tsconfig.node.json +0 -14
  69. package/dist/templates/vite-cosmos-template/vite.config.ts +0 -7
  70. package/dist/templates/vite-cosmos-template/yarn.lock +0 -9323
  71. package/dist/templates/vite-wagmi-template/.eslintrc.cjs +0 -18
  72. package/dist/templates/vite-wagmi-template/README.md +0 -72
  73. package/dist/templates/vite-wagmi-template/favicon.ico +0 -0
  74. package/dist/templates/vite-wagmi-template/index.html +0 -12
  75. package/dist/templates/vite-wagmi-template/package.json +0 -33
  76. package/dist/templates/vite-wagmi-template/public/sei-logotype.svg +0 -15
  77. package/dist/templates/vite-wagmi-template/src/App.tsx +0 -22
  78. package/dist/templates/vite-wagmi-template/src/assets/react.svg +0 -1
  79. package/dist/templates/vite-wagmi-template/src/components/Homepage/Examples.tsx +0 -269
  80. package/dist/templates/vite-wagmi-template/src/components/Homepage/Homepage.css +0 -156
  81. package/dist/templates/vite-wagmi-template/src/components/Homepage/Homepage.tsx +0 -106
  82. package/dist/templates/vite-wagmi-template/src/components/Web3Provider.tsx +0 -71
  83. package/dist/templates/vite-wagmi-template/src/constants/chain.ts +0 -6
  84. package/dist/templates/vite-wagmi-template/src/constants/index.ts +0 -1
  85. package/dist/templates/vite-wagmi-template/src/index.css +0 -170
  86. package/dist/templates/vite-wagmi-template/src/main.tsx +0 -12
  87. package/dist/templates/vite-wagmi-template/src/vite-env.d.ts +0 -1
  88. package/dist/templates/vite-wagmi-template/tsconfig.app.json +0 -27
  89. package/dist/templates/vite-wagmi-template/tsconfig.json +0 -11
  90. package/dist/templates/vite-wagmi-template/tsconfig.node.json +0 -14
  91. package/dist/templates/vite-wagmi-template/vite.config.ts +0 -10
  92. package/dist/templates/vite-wagmi-template/yarn.lock +0 -4603
  93. package/eslintrc.json +0 -3
@@ -1,18 +0,0 @@
1
- module.exports = {
2
- root: true,
3
- env: { browser: true, es2020: true },
4
- extends: [
5
- 'eslint:recommended',
6
- 'plugin:@typescript-eslint/recommended',
7
- 'plugin:react-hooks/recommended',
8
- ],
9
- ignorePatterns: ['dist', '.eslintrc.cjs'],
10
- parser: '@typescript-eslint/parser',
11
- plugins: ['react-refresh'],
12
- rules: {
13
- 'react-refresh/only-export-components': [
14
- 'warn',
15
- { allowConstantExport: true },
16
- ],
17
- },
18
- }
@@ -1,72 +0,0 @@
1
- # Vite-Wagmi Sei App Template
2
-
3
- This repo provides a basic framework for an application that interacts with Sei via EVM endpoints.
4
-
5
- It is based on the React Typescript Vite template.
6
-
7
- Currently, two official plugins are available:
8
-
9
- - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
10
- - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
11
-
12
- ## Getting Started
13
-
14
- Install dependencies by running
15
- ```bash
16
- npm install
17
- #or
18
- yarn
19
- ```
20
-
21
- Then, run the development server:
22
-
23
- ```bash
24
- npm run dev
25
- # or
26
- yarn dev
27
- ```
28
-
29
- Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
30
-
31
- You can start editing the page by modifying `src/App.tsx`. The page auto-updates as you edit the file.
32
-
33
- ## Repository Basics
34
- This repository includes basic features that allow you to connect to a wallet and use the wallet to interact with the chain.
35
-
36
- Additionally, basic examples and links to documentation are provided on the example homepage in `src/components/Homepage`.
37
-
38
- This repository uses helper methods from [@sei-js/evm/viem](https://github.com/sei-protocol/sei-js/tree/main/packages/evm/src/viem)
39
-
40
- ### Web3 Provider
41
- This component is a Sei specific wrapper around a Wagmi Provider that should wrap the application. Wrapping the application in this provider will enable it to access hooks in Wagmi. These hooks are enable connection to a wallet and interaction with the chain.
42
-
43
- In addition, this app uses [RainbowKit](https://www.rainbowkit.com/docs/wallet-button) which provides wallet connect functionality out of the box.
44
-
45
- To change the list of supported wallets, as well as connection configurations you can modify the `src/components/Web3Provider.tsx` component.
46
-
47
- ### Changing the Chain
48
- This application connects to the arctic-1 devnet by default, using chain configurations uploaded to viem.
49
-
50
- To change the chain the app connects to, edit the `selectedChain` variable in the `chain.ts` file in `src/app/constants`
51
-
52
- ## Expanding the ESLint configuration
53
-
54
- If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
55
-
56
- - Configure the top-level `parserOptions` property like this:
57
-
58
- ```js
59
- export default {
60
- // other rules...
61
- parserOptions: {
62
- ecmaVersion: 'latest',
63
- sourceType: 'module',
64
- project: ['./tsconfig.json', './tsconfig.node.json'],
65
- tsconfigRootDir: __dirname,
66
- },
67
- }
68
- ```
69
-
70
- - Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
71
- - Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
72
- - Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
@@ -1,12 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
- <title>Sei Vite App (Wagmi)</title>
7
- </head>
8
- <body>
9
- <div id="root"></div>
10
- <script type="module" src="/src/main.tsx"></script>
11
- </body>
12
- </html>
@@ -1,33 +0,0 @@
1
- {
2
- "name": "template-vite-wagmi-sei-app",
3
- "private": true,
4
- "version": "0.0.0",
5
- "type": "module",
6
- "scripts": {
7
- "dev": "vite",
8
- "build": "tsc -b && vite build",
9
- "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
10
- "preview": "vite preview"
11
- },
12
- "dependencies": {
13
- "@rainbow-me/rainbowkit": "^2.1.2",
14
- "@sei-js/evm": "^1.2.0",
15
- "@tanstack/react-query": "^5.45.1",
16
- "react": "^18.3.1",
17
- "react-dom": "^18.3.1",
18
- "viem": "^2.15.1",
19
- "wagmi": "^2.10.2"
20
- },
21
- "devDependencies": {
22
- "@types/react": "^18.3.3",
23
- "@types/react-dom": "^18.3.0",
24
- "@typescript-eslint/eslint-plugin": "^7.13.1",
25
- "@typescript-eslint/parser": "^7.13.1",
26
- "@vitejs/plugin-react": "^4.3.1",
27
- "eslint": "^8.57.0",
28
- "eslint-plugin-react-hooks": "^4.6.2",
29
- "eslint-plugin-react-refresh": "^0.4.7",
30
- "typescript": "^5.2.2",
31
- "vite": "^5.3.1"
32
- }
33
- }
@@ -1,15 +0,0 @@
1
- <svg width="86" height="32" viewBox="0 0 86 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <g id="sei-logotype" clip-path="url(#clip0_1_53)">
3
- <path id="Vector" fill-rule="evenodd" clip-rule="evenodd" d="M15.8553 31.8727C20.5775 31.8727 24.8201 29.8188 27.7383 26.5556C26.3808 25.3758 24.3351 25.3041 22.8899 26.4702L22.6138 26.693C19.9677 28.8281 16.1121 28.5128 13.8481 25.9762C12.6133 24.5927 10.4986 24.4514 9.09076 25.6584L5.90753 28.3874C8.63393 30.5685 12.0923 31.8727 15.8553 31.8727ZM21.0223 24.1558C23.5427 22.1221 27.0852 22.195 29.5092 24.1592C30.9581 21.7586 31.7917 18.9448 31.7917 15.9363C31.7917 12.5934 30.7624 9.49098 29.0035 6.9285C27.8696 6.68701 26.6405 6.96905 25.7075 7.79581L25.442 8.03112C22.8973 10.2861 19.0312 10.1491 16.6526 7.71961C15.3553 6.39459 13.2362 6.35106 11.8856 7.62174L8.1813 11.1067L6.1435 8.94069L9.84784 5.45571C12.3779 3.07544 16.3473 3.15694 18.7775 5.63906C20.0473 6.936 22.1112 7.00916 23.4696 5.80535L23.7351 5.57004C24.5597 4.83932 25.5138 4.3467 26.5127 4.08762C23.6893 1.54648 19.9529 0 15.8553 0C7.76541 0 1.08344 6.02803 0.0559658 13.8374C2.51319 12.6583 5.54417 13.112 7.5477 15.1637C8.81252 16.4589 10.8491 16.5956 12.2757 15.4811L14.3469 13.863C16.9498 11.8295 20.6294 11.9279 23.1199 14.0978L27.1522 17.6109L25.1986 19.8531L21.1663 16.34C19.7502 15.1062 17.6579 15.0502 16.1777 16.2066L14.1066 17.8246C11.4855 19.8723 7.74378 19.6211 5.41997 17.2414C4.06868 15.8577 1.85863 15.8094 0.448196 17.1329L0 17.5534C0.335417 20.8819 1.69509 23.9081 3.75904 26.3121L7.15509 23.4006C9.79233 21.1396 13.7538 21.4042 16.0669 23.9959C17.2755 25.3501 19.3337 25.5184 20.7463 24.3786L21.0223 24.1558Z" fill="url(#paint0_linear_1_53)"/>
4
- <path id="Union" fill-rule="evenodd" clip-rule="evenodd" d="M85.5173 2.22307C85.5173 3.44217 84.5132 4.44614 83.2944 4.44614C82.0751 4.44614 81.071 3.44217 81.071 2.22307C81.071 0.968111 82.0751 0 83.2944 0C84.5132 0 85.5173 0.968111 85.5173 2.22307ZM85.0152 26.139H81.6448V8.60541H85.0152V26.139ZM43.2705 21.0474C43.2705 24.382 45.888 26.5692 50.0114 26.5692C54.1707 26.5692 57.039 24.4537 57.039 21.1191C57.039 18.5016 55.5692 17.1391 52.593 16.422L49.5095 15.669C47.7884 15.2388 46.9278 14.4499 46.9278 13.2667C46.9278 11.6532 48.1111 10.7209 50.2266 10.7209C52.2703 10.7209 53.4536 11.8324 53.5253 13.5894H56.7526C56.6809 10.2548 54.1707 8.10343 50.3341 8.10343C46.4617 8.10343 43.7367 10.1472 43.7367 13.3742C43.7367 15.9558 45.2067 17.4977 48.3262 18.2506L51.4098 18.9678C53.2385 19.4339 53.8122 20.151 53.8122 21.3343C53.8122 22.9478 52.4497 23.9159 50.0831 23.9159C47.8601 23.9159 46.4975 22.8402 46.4975 21.0474H43.2705ZM69.0593 26.5692C73.3981 26.5692 76.3382 24.4537 77.1989 20.6889H74.0436C73.4698 22.6968 71.749 23.7725 69.1311 23.7725C65.7965 23.7725 63.8605 21.7286 63.6094 18.0355L77.1631 17.9997V16.7447C77.1631 11.5456 73.9002 8.10343 68.9165 8.10343C63.8246 8.10343 60.3465 11.9042 60.3465 17.3901C60.3465 22.8402 63.8963 26.5692 69.0593 26.5692ZM68.9165 10.936C71.8925 10.936 73.7926 12.8723 73.7926 15.7766H63.6811C64.1115 12.693 65.9758 10.936 68.9165 10.936Z" fill="black"/>
5
- </g>
6
- <defs>
7
- <linearGradient id="paint0_linear_1_53" x1="15.8958" y1="2.37374e-07" x2="22.1762" y2="31.8667" gradientUnits="userSpaceOnUse">
8
- <stop stop-color="#780000"/>
9
- <stop offset="1" stop-color="#C1121F"/>
10
- </linearGradient>
11
- <clipPath id="clip0_1_53">
12
- <rect width="85.5172" height="32" fill="white"/>
13
- </clipPath>
14
- </defs>
15
- </svg>
@@ -1,22 +0,0 @@
1
- import './index.css'
2
- import { ConnectButton } from '@rainbow-me/rainbowkit';
3
- import Homepage from './components/Homepage/Homepage';
4
-
5
- function App() {
6
-
7
- return (
8
- <>
9
- <div className="header">
10
- <ConnectButton
11
- showBalance={{
12
- smallScreen: false,
13
- largeScreen: true,
14
- }}
15
- />
16
- </div>
17
- <Homepage/>
18
- </>
19
- );
20
- }
21
-
22
- export default App;
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>
@@ -1,269 +0,0 @@
1
- import { BANK_PRECOMPILE_ABI, BANK_PRECOMPILE_ADDRESS, WASM_PRECOMPILE_ABI, WASM_PRECOMPILE_ADDRESS } from "@sei-js/evm";
2
- import { useState } from "react";
3
- import { ReadContractParameters, formatEther, fromHex, parseEther, toHex } from "viem";
4
- import { useAccount, usePublicClient, useWriteContract } from "wagmi";
5
-
6
- import "./Homepage.css";
7
-
8
- function Examples() {
9
- const [balance, setBalance] = useState('')
10
- const [supply, setSupply] = useState('');
11
- const [count, setCount] = useState(0)
12
-
13
- const publicClient = usePublicClient();
14
- const { address } = useAccount();
15
- const { writeContractAsync } = useWriteContract();
16
-
17
- const formatLargeSeiNumber = (num: string, decimals: number): string => {
18
- if (num.length > 10) {
19
- return (Number(num) / 1000000 / 1000000000).toLocaleString(navigator.language, { minimumFractionDigits: decimals, maximumFractionDigits: decimals}) + ' B';
20
- } else {
21
- return (Number(num) / 1000000).toLocaleString(navigator.language);
22
- }
23
- };
24
-
25
- const copyToClipboard = (text: string) => {
26
- try {
27
- navigator.clipboard.writeText(text);
28
- } catch (err) {
29
- console.error("Failed to copy text: ", err);
30
- } finally {
31
- alert("Copied to clipboard!");
32
- }
33
- }
34
-
35
- const renderAddressExample = () => {
36
- return (
37
- <div className="card">
38
- <div className="card-header">
39
- <p className="card__title">Wallet address</p>
40
- <small className="card__description">
41
- <a
42
- href="https://viem.sh/docs/clients/public.html"
43
- target="_blank">Viem Public Client</a> query example
44
- </small>
45
- </div>
46
- <div className="card-body">
47
- <div className="content-background space-between">
48
- {
49
- address ?
50
- <div>
51
- <p className="card-footer">
52
- {address}
53
- </p>
54
- </div> :
55
- <a> --- </a>
56
- }
57
-
58
- <button
59
- className="small outline"
60
- onClick={() =>
61
- copyToClipboard(
62
- address as string
63
- )
64
- }
65
- >
66
- Copy
67
- </button>
68
- </div>
69
- </div>
70
- <div className="card-footer">
71
- </div>
72
- </div>
73
- )
74
- }
75
-
76
- const getBalanceWagmi = async () => {
77
- if (!address || !publicClient) {
78
- return undefined
79
- }
80
- const weiBalance = await publicClient.getBalance({address});
81
- const seiBalance = formatEther(weiBalance)
82
- setBalance(seiBalance);
83
- }
84
-
85
- const renderBalanceExample = () => {
86
- return (
87
- <div className="card">
88
- <div className="card-header">
89
- <p className="card__title">Wallet balance</p>
90
- <small className="card__description">
91
- <a
92
- href="https://viem.sh/docs/clients/public.html"
93
- target="_blank">Viem Public Client</a> query example
94
- </small>
95
- </div>
96
- <div className="card-body">
97
- <div className="content-background space-between">
98
- <small>SEI</small>
99
- <p>{balance ? balance : '---' } SEI</p>
100
- </div>
101
- </div>
102
- <div className="card-footer">
103
- <button onClick={getBalanceWagmi}>Fetch balance</button>
104
- </div>
105
- </div>
106
- )
107
- }
108
-
109
- // Example of using precompiles to query native Sei modules.
110
- const getBankSupply = async () => {
111
- if (!publicClient) {
112
- return;
113
- }
114
-
115
- const params: ReadContractParameters = {
116
- address: BANK_PRECOMPILE_ADDRESS,
117
- abi: BANK_PRECOMPILE_ABI,
118
- functionName: 'supply',
119
- args: ['usei']
120
- }
121
- try {
122
- const response = await publicClient.readContract(params) as BigInt;
123
- const supply = formatLargeSeiNumber(response.toString(), 1)
124
- setSupply(supply);
125
- } catch (e) {
126
- console.log(e);
127
- }
128
- }
129
-
130
- const renderBankSupplyExample = () => {
131
- return (
132
- <div className="card">
133
- <div className="card-header">
134
- <p className="card__title">Total Sei supply</p>
135
- <small className="card__description">
136
- <a
137
- href="https://www.docs.sei.io/dev-interoperability/precompiles/bank"
138
- target="_blank"> Bank precompile
139
- </a> example for querying native Sei
140
- modules
141
- </small>
142
- </div>
143
- <div className="card-body">
144
- <div className="content-background space-between">
145
- <small>SEI</small>
146
- <p>{supply}</p>
147
- </div>
148
- </div>
149
- <div className="card-footer">
150
- <button onClick={getBankSupply}>Fetch supply</button>
151
- </div>
152
- </div>
153
- )
154
- }
155
-
156
- // Fetch count of a CosmWasm Contract using WASM Precompile
157
- const fetchCount = async () => {
158
- if (!publicClient) {
159
- return;
160
- }
161
-
162
- const COUNTER_CONTRACT_ADDRESS =
163
- "sei14hj2tavq8fpesdwxxcu44rty3hh90vhujrvcmstl4zr3txmfvw9sh9m79m";
164
-
165
- const queryMsg = toHex(JSON.stringify({ get_count: {} }));
166
-
167
- const params: ReadContractParameters = {
168
- address: WASM_PRECOMPILE_ADDRESS,
169
- abi: WASM_PRECOMPILE_ABI,
170
- functionName: 'query',
171
- args: [COUNTER_CONTRACT_ADDRESS, queryMsg]
172
- }
173
- try {
174
- const response = await publicClient?.readContract(params) as `0x${string}`;
175
- const { count } = JSON.parse(fromHex(response, 'string'));
176
- setCount(count);
177
- } catch (e) {
178
- console.log(e);
179
- }
180
- }
181
-
182
- // Fetch count of a CosmWasm Contract using WASM Precompile
183
- const incrementCounter = async () => {
184
- if (!address || !publicClient) {
185
- return;
186
- }
187
-
188
- const COUNTER_CONTRACT_ADDRESS =
189
- "sei14hj2tavq8fpesdwxxcu44rty3hh90vhujrvcmstl4zr3txmfvw9sh9m79m";
190
-
191
- const execMsg = toHex(JSON.stringify({ increment: {} }));
192
- const coins = toHex('[]')
193
- const params = {
194
- account: address,
195
- address: WASM_PRECOMPILE_ADDRESS,
196
- abi: WASM_PRECOMPILE_ABI,
197
- functionName: 'execute',
198
- args: [COUNTER_CONTRACT_ADDRESS, execMsg, coins],
199
- value: parseEther('0')
200
- }
201
-
202
- try {
203
- const estimatedGas = await publicClient.estimateContractGas(params);
204
-
205
- // Call smart contract execute msg
206
- await writeContractAsync({ ...params, gas: estimatedGas});
207
-
208
- // Wait for 1 block to confirm transaction
209
- setTimeout(() => {}, 400);
210
- await fetchCount();
211
-
212
- } catch (error) {
213
- console.log(error)
214
- }
215
- };
216
-
217
- const renderCounterContractExample = () => {
218
- return (
219
- <div className="card">
220
- <div className="card-header">
221
- <p className="card__title">Smart contract interaction</p>
222
- <small>
223
- <a
224
- href="https://www.docs.sei.io/dev-interoperability/precompiles/cosmwasm"
225
- target="_blank">
226
- WASM Precompile
227
- </a> example of CosmWasm smart
228
- contract interaction
229
- </small>
230
- </div>
231
- <div className="card-body">
232
- <div className="content-background space-between">
233
- <small>Count</small>
234
- <p>{count}</p>
235
- <button
236
- className="small outline"
237
- onClick={incrementCounter}
238
- >
239
- Increase
240
- </button>
241
- </div>
242
- </div>
243
- <div className="card-footer">
244
- <button onClick={fetchCount}>Fetch count</button>
245
- </div>
246
- </div>
247
- )
248
- }
249
-
250
- return (
251
- <div className="container">
252
- <div className="grid">
253
- {/* First card */}
254
- {renderAddressExample()}
255
-
256
- {/* Second card */}
257
- {renderBalanceExample()}
258
-
259
- {/* Third card */}
260
- {renderBankSupplyExample()}
261
-
262
- {/* Fourth card */}
263
- {renderCounterContractExample()}
264
- </div>
265
- </div>
266
- )
267
- }
268
-
269
- export default Examples;
@@ -1,156 +0,0 @@
1
- #root {
2
- display: flex;
3
- flex-direction: column;
4
- min-height: 100vh;
5
- }
6
- .app {
7
- width: 100%;
8
- height: 100%;
9
- }
10
-
11
- .logo {
12
- width: 20%;
13
- align-self: center;
14
- }
15
-
16
- .container {
17
- margin: 0 auto;
18
- display: flex;
19
- flex-direction: column;
20
- gap: 3rem;
21
- width: 100%;
22
- padding: 1rem;
23
- height: -webkit-fill-available;
24
- flex-grow: 1;
25
- justify-content: center;
26
- }
27
-
28
- .grid {
29
- width: 100%;
30
- display: grid;
31
- grid-template-columns: repeat(1, 1fr);
32
- gap: 1rem;
33
- }
34
- .grid.docs {
35
- grid-template-columns: repeat(1, 1fr);
36
- }
37
-
38
- .card {
39
- width: 100%;
40
- padding: 1.5em;
41
- border-radius: 1rem;
42
- background: var(--card);
43
- color: var(--card-foreground);
44
- box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.09);
45
- }
46
-
47
- .card.secondary {
48
- background: transparent;
49
- border: 1px solid var(--border);
50
- box-shadow: none;
51
- }
52
- .card.intro {
53
- display: flex;
54
- flex-direction: column;
55
- gap: 1rem;
56
- justify-content: space-between;
57
- align-items: flex-start;
58
- }
59
- .card-header {
60
- display: flex;
61
- flex-direction: column;
62
- justify-content: space-between;
63
- gap: 0.25rem;
64
- }
65
- .card-body {
66
- display: flex;
67
- flex-direction: column;
68
- justify-content: space-between;
69
- margin: 1.5rem 0;
70
- }
71
-
72
- .card-footer {
73
- display: flex;
74
- flex-direction: row;
75
- gap: 0.5rem;
76
- }
77
-
78
- .card__title {
79
- font-size: 1.15rem;
80
- font-weight: 600;
81
- }
82
- .content-background {
83
- overflow: hidden;
84
- background: #fafaf9;
85
- border-radius: 4rem;
86
- padding: 0 1rem;
87
- height: 3.5rem;
88
- display: flex;
89
- align-items: center;
90
- }
91
-
92
- .wallet-address {
93
- text-wrap: anywhere;
94
- line-break: anywhere;
95
- }
96
-
97
- .space-between {
98
- justify-content: space-between;
99
- gap: 1rem;
100
- }
101
-
102
- .hide-on-mobile {
103
- display: none;
104
- }
105
-
106
- .hide-on-desktop {
107
- display: block;
108
- }
109
-
110
- .external-link {
111
- display: inline-flex;
112
- gap: 0.25rem;
113
- }
114
-
115
- .get-started {
116
- text-align: center;
117
- }
118
-
119
- .wallet-connect {
120
- display: flex;
121
- gap: 1rem;
122
- align-items: center;
123
- }
124
-
125
-
126
- @media (min-width: 768px) {
127
-
128
- .card.intro {
129
- grid-column: span 2;
130
- flex-direction: row;
131
- align-items: center;
132
- }
133
- .hide-on-mobile {
134
- display: block;
135
- }
136
- .hide-on-desktop {
137
- display: none;
138
- }
139
-
140
- .container {
141
- max-width: 96rem;
142
- padding: 2rem;
143
- }
144
- .grid {
145
- grid-template-columns: repeat(2, 1fr);
146
- }
147
- .grid.docs {
148
- grid-template-columns: repeat(2, 1fr);
149
- }
150
- }
151
-
152
- @media (min-width: 1024px) {
153
- .container {
154
- max-width: 80rem;
155
- }
156
- }