@sei-js/create-sei 0.0.3 → 1.0.0

package/dist/templates/next-wagmi-template/next-env.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="next" />
-/// <reference types="next/image-types/global" />
-
-// NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.

package/dist/templates/next-wagmi-template/package.json

@@ -1,30 +0,0 @@
-{
-	"name": "template-next-wagmi-sei-app",
-	"version": "0.1.0",
-	"private": true,
-	"scripts": {
-		"dev": "next dev",
-		"build": "next build",
-		"start": "next start",
-		"lint": "next lint"
-	},
-	"dependencies": {
-		"@rainbow-me/rainbowkit": "^2.1.2",
-		"@sei-js/evm": "^1.2.0",
-		"@tanstack/react-query": "^5.45.1",
-		"encoding": "^0.1.13",
-		"next": "14.2.4",
-		"pino-pretty": "^11.2.1",
-		"react": "^18",
-		"react-dom": "^18",
-		"viem": "^2.15.1",
-		"wagmi": "^2.10.2"
-	},
-	"devDependencies": {
-		"@types/node": "^20",
-		"@types/react": "^18",
-		"@types/react-dom": "^18",
-		"eslint-config-next": "14.2.4",
-		"typescript": "^5"
-	}
-}

package/dist/templates/next-wagmi-template/public/sei-logotype.svg

@@ -1,15 +0,0 @@
-<svg width="86" height="32" viewBox="0 0 86 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="sei-logotype" clip-path="url(#clip0_1_53)">
-<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)"/>
-<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"/>
-</g>
-<defs>
-<linearGradient id="paint0_linear_1_53" x1="15.8958" y1="2.37374e-07" x2="22.1762" y2="31.8667" gradientUnits="userSpaceOnUse">
-<stop stop-color="#780000"/>
-<stop offset="1" stop-color="#C1121F"/>
-</linearGradient>
-<clipPath id="clip0_1_53">
-<rect width="85.5172" height="32" fill="white"/>
-</clipPath>
-</defs>
-</svg>

package/dist/templates/next-wagmi-template/src/app/components/Homepage/Examples.tsx

@@ -1,257 +0,0 @@
-'use client';
-
-import { BANK_PRECOMPILE_ABI, BANK_PRECOMPILE_ADDRESS, WASM_PRECOMPILE_ABI, WASM_PRECOMPILE_ADDRESS } from '@sei-js/evm';
-import { useState } from 'react';
-import { ReadContractParameters, formatEther, fromHex, parseEther, toHex } from 'viem';
-import { useAccount, usePublicClient, useWriteContract } from 'wagmi';
-
-import './Homepage.css';
-
-function Examples() {
-	const [balance, setBalance] = useState('');
-	const [supply, setSupply] = useState('');
-	const [count, setCount] = useState(0);
-
-	const publicClient = usePublicClient();
-	const { address } = useAccount();
-	const { writeContractAsync } = useWriteContract();
-
-	const formatLargeSeiNumber = (num: string, decimals: number): string => {
-		if (num.length > 10) {
-			return (
-				(Number(num) / 1000000 / 1000000000).toLocaleString(navigator.language, { minimumFractionDigits: decimals, maximumFractionDigits: decimals }) + ' B'
-			);
-		} else {
-			return (Number(num) / 1000000).toLocaleString(navigator.language);
-		}
-	};
-
-	const copyToClipboard = (text: string) => {
-		try {
-			navigator.clipboard.writeText(text);
-		} catch (err) {
-			console.error('Failed to copy text: ', err);
-		} finally {
-			alert('Copied to clipboard!');
-		}
-	};
-
-	const renderAddressExample = () => {
-		return (
-			<div className="card">
-				<div className="card-header">
-					<p className="card__title">Wallet address</p>
-					<small className="card__description">
-						<a href="https://viem.sh/docs/clients/public.html" target="_blank">
-							Viem Public Client
-						</a>{' '}
-						query example
-					</small>
-				</div>
-				<div className="card-body">
-					<div className="content-background space-between">
-						{address ? (
-							<div>
-								<p className="card-footer">{address}</p>
-							</div>
-						) : (
-							<p> --- </p>
-						)}
-
-						<button className="small outline" onClick={() => copyToClipboard(address as string)}>
-							Copy
-						</button>
-					</div>
-				</div>
-				<div className="card-footer"></div>
-			</div>
-		);
-	};
-
-	const getBalanceWagmi = async () => {
-		if (!address || !publicClient) {
-			return undefined;
-		}
-		const weiBalance = await publicClient.getBalance({ address });
-		const seiBalance = formatEther(weiBalance);
-		setBalance(seiBalance);
-	};
-
-	const renderBalanceExample = () => {
-		return (
-			<div className="card">
-				<div className="card-header">
-					<p className="card__title">Wallet balance</p>
-					<small className="card__description">
-						<a href="https://viem.sh/docs/clients/public.html" target="_blank">
-							Viem Public Client
-						</a>{' '}
-						query example
-					</small>
-				</div>
-				<div className="card-body">
-					<div className="content-background space-between">
-						<small>SEI</small>
-						<p>{balance ? balance : '---'} SEI</p>
-					</div>
-				</div>
-				<div className="card-footer">
-					<button onClick={getBalanceWagmi}>Fetch balance</button>
-				</div>
-			</div>
-		);
-	};
-
-	// Example of using precompiles to query native Sei modules.
-	const getBankSupply = async () => {
-		if (!publicClient) {
-			return;
-		}
-
-		const params: ReadContractParameters = {
-			address: BANK_PRECOMPILE_ADDRESS,
-			abi: BANK_PRECOMPILE_ABI,
-			functionName: 'supply',
-			args: ['usei']
-		};
-		try {
-			const response = (await publicClient.readContract(params)) as BigInt;
-			const supply = formatLargeSeiNumber(response.toString(), 1);
-			setSupply(supply);
-		} catch (e) {
-			console.log(e);
-		}
-	};
-
-	const renderBankSupplyExample = () => {
-		return (
-			<div className="card">
-				<div className="card-header">
-					<p className="card__title">Total Sei supply</p>
-					<small className="card__description">
-						<a href="https://www.docs.sei.io/dev-interoperability/precompiles/bank" target="_blank">
-							{' '}
-							Bank precompile
-						</a>{' '}
-						example for querying native Sei modules
-					</small>
-				</div>
-				<div className="card-body">
-					<div className="content-background space-between">
-						<small>SEI</small>
-						<p>{supply}</p>
-					</div>
-				</div>
-				<div className="card-footer">
-					<button onClick={getBankSupply}>Fetch supply</button>
-				</div>
-			</div>
-		);
-	};
-
-	// Fetch count of a CosmWasm Contract using WASM Precompile
-	const fetchCount = async () => {
-		if (!publicClient) {
-			return;
-		}
-
-		const COUNTER_CONTRACT_ADDRESS = 'sei14hj2tavq8fpesdwxxcu44rty3hh90vhujrvcmstl4zr3txmfvw9sh9m79m';
-
-		const queryMsg = toHex(JSON.stringify({ get_count: {} }));
-
-		const params: ReadContractParameters = {
-			address: WASM_PRECOMPILE_ADDRESS,
-			abi: WASM_PRECOMPILE_ABI,
-			functionName: 'query',
-			args: [COUNTER_CONTRACT_ADDRESS, queryMsg]
-		};
-		try {
-			const response = (await publicClient?.readContract(params)) as `0x${string}`;
-			const { count } = JSON.parse(fromHex(response, 'string'));
-			setCount(count);
-		} catch (e) {
-			console.log(e);
-		}
-	};
-
-	// Fetch count of a CosmWasm Contract using WASM Precompile
-	const incrementCounter = async () => {
-		if (!address || !publicClient) {
-			return;
-		}
-
-		const COUNTER_CONTRACT_ADDRESS = 'sei14hj2tavq8fpesdwxxcu44rty3hh90vhujrvcmstl4zr3txmfvw9sh9m79m';
-
-		const execMsg = toHex(JSON.stringify({ increment: {} }));
-		const coins = toHex('[]');
-		const params = {
-			account: address,
-			address: WASM_PRECOMPILE_ADDRESS,
-			abi: WASM_PRECOMPILE_ABI,
-			functionName: 'execute',
-			args: [COUNTER_CONTRACT_ADDRESS, execMsg, coins],
-			value: parseEther('0')
-		};
-
-		try {
-			const estimatedGas = await publicClient.estimateContractGas(params);
-
-			// Call smart contract execute msg
-			await writeContractAsync({ ...params, gas: estimatedGas });
-
-			// Wait for 1 block to confirm transaction
-			setTimeout(() => {}, 400);
-			await fetchCount();
-		} catch (error) {
-			console.log(error);
-		}
-	};
-
-	const renderCounterContractExample = () => {
-		return (
-			<div className="card">
-				<div className="card-header">
-					<p className="card__title">Smart contract interaction</p>
-					<small>
-						<a href="https://www.docs.sei.io/dev-interoperability/precompiles/cosmwasm" target="_blank">
-							WASM Precompile
-						</a>{' '}
-						example of CosmWasm smart contract interaction
-					</small>
-				</div>
-				<div className="card-body">
-					<div className="content-background space-between">
-						<small>Count</small>
-						<p>{count}</p>
-						<button className="small outline" onClick={incrementCounter}>
-							Increase
-						</button>
-					</div>
-				</div>
-				<div className="card-footer">
-					<button onClick={fetchCount}>Fetch count</button>
-				</div>
-			</div>
-		);
-	};
-
-	return (
-		<div className="container">
-			<div className="grid">
-				{/* First card */}
-				{renderAddressExample()}
-
-				{/* Second card */}
-				{renderBalanceExample()}
-
-				{/* Third card */}
-				{renderBankSupplyExample()}
-
-				{/* Fourth card */}
-				{renderCounterContractExample()}
-			</div>
-		</div>
-	);
-}
-
-export default Examples;

package/dist/templates/next-wagmi-template/src/app/components/Homepage/Homepage.css

@@ -1,154 +0,0 @@
-#root {
-	display: flex;
-	flex-direction: column;
-	min-height: 100vh;
-}
-.app {
-	width: 100%;
-	height: 100%;
-}
-
-.logo {
-	width: 20%;
-	align-self: center;
-}
-
-.container {
-	margin: 0 auto;
-	display: flex;
-	flex-direction: column;
-	gap: 3rem;
-	width: 100%;
-	padding: 1rem;
-	height: -webkit-fill-available;
-	flex-grow: 1;
-	justify-content: center;
-}
-
-.grid {
-	width: 100%;
-	display: grid;
-	grid-template-columns: repeat(1, 1fr);
-	gap: 1rem;
-}
-.grid.docs {
-	grid-template-columns: repeat(1, 1fr);
-}
-
-.card {
-	width: 100%;
-	padding: 1.5em;
-	border-radius: 1rem;
-	background: var(--card);
-	color: var(--card-foreground);
-	box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.09);
-}
-
-.card.secondary {
-	background: transparent;
-	border: 1px solid var(--border);
-	box-shadow: none;
-}
-.card.intro {
-	display: flex;
-	flex-direction: column;
-	gap: 1rem;
-	justify-content: space-between;
-	align-items: flex-start;
-}
-.card-header {
-	display: flex;
-	flex-direction: column;
-	justify-content: space-between;
-	gap: 0.25rem;
-}
-.card-body {
-	display: flex;
-	flex-direction: column;
-	justify-content: space-between;
-	margin: 1.5rem 0;
-}
-
-.card-footer {
-	display: flex;
-	flex-direction: row;
-	gap: 0.5rem;
-}
-
-.card__title {
-	font-size: 1.15rem;
-	font-weight: 600;
-}
-.content-background {
-	overflow: hidden;
-	background: #fafaf9;
-	border-radius: 4rem;
-	padding: 0 1rem;
-	height: 3.5rem;
-	display: flex;
-	align-items: center;
-}
-
-.wallet-address {
-	text-wrap: anywhere;
-	line-break: anywhere;
-}
-
-.space-between {
-	justify-content: space-between;
-	gap: 1rem;
-}
-
-.hide-on-mobile {
-	display: none;
-}
-
-.hide-on-desktop {
-	display: block;
-}
-
-.external-link {
-	display: inline-flex;
-	gap: 0.25rem;
-}
-
-.get-started {
-	text-align: center;
-}
-
-.wallet-connect {
-	display: flex;
-	gap: 1rem;
-	align-items: center;
-}
-
-@media (min-width: 768px) {
-	.card.intro {
-		grid-column: span 2;
-		flex-direction: row;
-		align-items: center;
-	}
-	.hide-on-mobile {
-		display: block;
-	}
-	.hide-on-desktop {
-		display: none;
-	}
-
-	.container {
-		max-width: 96rem;
-		padding: 2rem;
-	}
-	.grid {
-		grid-template-columns: repeat(2, 1fr);
-	}
-	.grid.docs {
-		grid-template-columns: repeat(2, 1fr);
-	}
-}
-
-@media (min-width: 1024px) {
-	.container {
-		max-width: 80rem;
-	}
-}

package/dist/templates/next-wagmi-template/src/app/components/Homepage/Homepage.tsx

@@ -1,87 +0,0 @@
-'use client';
-
-import { ConnectButton } from '@rainbow-me/rainbowkit';
-import Examples from './Examples';
-import './Homepage.css';
-
-type HelpItem = {
-	title: string;
-	description: string;
-	link: string;
-};
-
-const renderHelpItem = ({ title, description, link }: HelpItem) => (
-	<div className="card secondary">
-		<div className="card-header">
-			<p className="card__title">
-				<a href={link} target="_blank" rel="noopener noreferrer" className="external-link">
-					{title} {externalIcon}
-				</a>
-			</p>
-			<small className="card__description">{description}</small>
-		</div>
-	</div>
-);
-
-const helpItems: HelpItem[] = [
-	{
-		title: 'Sei Docs',
-		description: 'Find in-depth information about Sei.',
-		link: 'https://docs.sei.io/'
-	},
-	{
-		title: 'Wagmi',
-		description: "Learn about Wagmi and it's hooks for chain interaction.",
-		link: 'https://wagmi.sh/'
-	},
-	{
-		title: 'Viem',
-		description: 'Interact with Sei using Viem modules + Wagmi.',
-		link: 'https://viem.sh/'
-	},
-	{
-		title: 'EVM JSON-RPC API',
-		description: 'Learn about the EVM api available on Sei.',
-		link: 'https://ethereum.org/en/developers/docs/apis/json-rpc/'
-	}
-];
-
-const externalIcon = (
-	<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-		<path
-			d="M12 8.66667V12.6667C12 13.0203 11.8595 13.3594 11.6095 13.6095C11.3594 13.8595 11.0203 14 10.6667 14H3.33333C2.97971 14 2.64057 13.8595 2.39052 13.6095C2.14048 13.3594 2 13.0203 2 12.6667V5.33333C2 4.97971 2.14048 4.64057 2.39052 4.39052C2.64057 4.14048 2.97971 4 3.33333 4H7.33333"
-			stroke="#9F1239"
-			strokeWidth="1.33333"
-			strokeLinecap="round"
-			strokeLinejoin="round"
-		/>
-		<path d="M10 2H14V6" stroke="#9F1239" strokeWidth="1.33333" strokeLinecap="round" strokeLinejoin="round" />
-		<path d="M6.66663 9.33333L14 2" stroke="#9F1239" strokeWidth="1.33333" strokeLinecap="round" strokeLinejoin="round" />
-	</svg>
-);
-
-function Homepage() {
-	return (
-		<div className="container">
-			<img src="sei-logotype.svg" className="logo" alt="SEI logotype" />
-			<div className="card intro">
-				<div className="card-header">
-					<p className="card__title">Wallet address</p>
-					<small className="card__description">Connect wallet to see your address and balance</small>
-				</div>
-				<ConnectButton />
-			</div>
-			<Examples />
-			<div className="get-started">
-				Get started by editing <code>src/app/page.tsx</code>
-			</div>
-			<div className="grid docs">
-				{helpItems.map((item, index) => (
-					<div key={item.title}>{renderHelpItem(item)}</div>
-				))}
-			</div>
-		</div>
-	);
-}
-
-export default Homepage;

package/dist/templates/next-wagmi-template/src/app/components/Web3Provider.tsx

@@ -1,74 +0,0 @@
-'use client';
-
-import { RainbowKitProvider, connectorsForWallets, lightTheme } from '@rainbow-me/rainbowkit';
-import { metaMaskWallet } from '@rainbow-me/rainbowkit/wallets';
-import { Buffer } from 'buffer';
-import { ReactNode, useMemo } from 'react';
-import { WagmiProvider, createConfig, http } from 'wagmi';
-
-import '@rainbow-me/rainbowkit/styles.css';
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { selectedChain } from '../constants';
-
-const queryClient = new QueryClient();
-
-interface Web3ProviderProps {
-	children: ReactNode;
-}
-
-const connectors = connectorsForWallets(
-	[
-		{
-			groupName: 'Recommended',
-			wallets: [metaMaskWallet]
-		}
-	],
-	{
-		appName: '<YOUR_APPNAME_HERE>',
-		projectId: '<YOUR_ID_HERE>'
-	}
-);
-
-function Web3Provider({ children }: Web3ProviderProps) {
-	// Buffer polyfill
-	if (typeof window !== 'undefined') {
-		window.Buffer = window.Buffer ?? Buffer;
-	}
-	const chainConfig = selectedChain;
-	const config = useMemo(
-		() =>
-			createConfig({
-				chains: [chainConfig],
-				connectors,
-				transports: {
-					[chainConfig.id]: http()
-				}
-			}),
-		[chainConfig]
-	);
-
-	return (
-		<WagmiProvider config={config}>
-			<QueryClientProvider client={queryClient}>
-				<RainbowKitProvider
-					theme={lightTheme({
-						accentColor: '#7e1914',
-						accentColorForeground: 'white',
-						borderRadius: 'medium',
-						fontStack: 'system'
-					})}
-					appInfo={{
-						appName: '<APP-NAME-HERE>',
-						learnMoreUrl: 'https://www.docs.sei.io/user-guides/wallet-setup'
-					}}
-					modalSize="compact"
-					initialChain={chainConfig.id}
-				>
-					{children}
-				</RainbowKitProvider>
-			</QueryClientProvider>
-		</WagmiProvider>
-	);
-}
-
-export default Web3Provider;

package/dist/templates/next-wagmi-template/src/app/components/index.ts

@@ -1,2 +0,0 @@
-export * from './Homepage/Homepage';
-export * from './Web3Provider';

package/dist/templates/next-wagmi-template/src/app/constants/chain.ts

@@ -1,7 +0,0 @@
-// Set your selected chain here
-import { seiDevnet } from 'viem/chains';
-
-// Set your selected chain here
-// To point to mainnet, use sei.
-// To point to testnet, use seiTestnet.
-export const selectedChain = seiDevnet;

package/dist/templates/next-wagmi-template/src/app/constants/index.ts

@@ -1 +0,0 @@
-export * from './chain';