@sei-js/create-sei 0.0.2 → 0.0.4

package/dist/templates/vite-wagmi-template/.eslintrc.cjs

@@ -1,18 +0,0 @@
-module.exports = {
-  root: true,
-  env: { browser: true, es2020: true },
-  extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:react-hooks/recommended',
-  ],
-  ignorePatterns: ['dist', '.eslintrc.cjs'],
-  parser: '@typescript-eslint/parser',
-  plugins: ['react-refresh'],
-  rules: {
-    'react-refresh/only-export-components': [
-      'warn',
-      { allowConstantExport: true },
-    ],
-  },
-}

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

@@ -1,33 +0,0 @@
-{
-  "name": "template-vite-wagmi-sei-app",
-  "private": true,
-  "version": "0.0.0",
-  "type": "module",
-  "scripts": {
-    "dev": "vite",
-    "build": "tsc -b && vite build",
-    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
-    "preview": "vite preview"
-  },
-  "dependencies": {
-    "@rainbow-me/rainbowkit": "^2.1.2",
-    "@sei-js/evm": "^1.2.0",
-    "@tanstack/react-query": "^5.45.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "viem": "^2.15.1",
-    "wagmi": "^2.10.2"
-  },
-  "devDependencies": {
-    "@types/react": "^18.3.3",
-    "@types/react-dom": "^18.3.0",
-    "@typescript-eslint/eslint-plugin": "^7.13.1",
-    "@typescript-eslint/parser": "^7.13.1",
-    "@vitejs/plugin-react": "^4.3.1",
-    "eslint": "^8.57.0",
-    "eslint-plugin-react-hooks": "^4.6.2",
-    "eslint-plugin-react-refresh": "^0.4.7",
-    "typescript": "^5.2.2",
-    "vite": "^5.3.1"
-  }
-}

package/dist/templates/vite-wagmi-template/src/App.tsx

@@ -1,22 +0,0 @@
-import './index.css'
-import { ConnectButton } from '@rainbow-me/rainbowkit';
-import Homepage from './components/Homepage/Homepage';
-
-function App() {
-
-	return (
-    <>
-      <div className="header">
-        <ConnectButton 
-            showBalance={{
-            smallScreen: false,
-            largeScreen: true,
-            }}
-          />
-      </div>
-      <Homepage/>
-    </>
-	);
-}
-
-export default App;

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

@@ -1,269 +0,0 @@
-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> :
-                            <a> --- </a>
-                        }
-
-                        <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/vite-wagmi-template/src/components/Homepage/Homepage.css

@@ -1,156 +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/vite-wagmi-template/src/components/Homepage/Homepage.tsx

@@ -1,106 +0,0 @@
-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.tsx</code>
-        </div>
-		<div className="grid docs">
-			{helpItems.map((item, _) => (renderHelpItem(item)))}
-		</div>
-      </div>
-	);
-}
-
-export default Homepage;

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

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