@sei-js/create-sei 0.0.2 → 0.0.4

package/templates/next-cosmos-template/src/app/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(3, 1fr);
-  }
-  .grid.docs {
-    grid-template-columns: repeat(3, 1fr);
-  }
-}
-
-@media (min-width: 1024px) {
-  .container {
-    max-width: 80rem;
-  }
-}

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

@@ -1,110 +0,0 @@
-'use client';
-
-import './Homepage.css'
-import Examples from './Examples';
-import { selectedChain } from '../../constants';
-import { WalletConnectButton } from '..';
-
-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: 'CosmosKit',
-		description: "Learn about CosmosKit and it's hooks for chain interaction.",
-		link: 'https://docs.cosmology.zone/cosmos-kit/get-started'
-	},
-	{
-		title: 'sei-js',
-		description: 'Interact with Sei using @sei-js/cosmjs.',
-		link: 'https://sei-protocol.github.io/sei-js/modules/cosmjs.html'
-	}
-];
-
-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>
-  );
-
-export 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>
-				<WalletConnectButton/>
-			</div>
-			<Examples chainId={selectedChain.chain_id}/>
-			<div className="get-started">
-				Get started by editing <code>src/app/page.tsx</code>
-			</div>
-			<div className="grid docs">
-				{
-					helpItems.map((item, _) => (
-						<div key={item.title}>
-							{renderHelpItem(item)}
-						</div>
-					))
-				}
-			</div>
-		</div>
-	);
-}
-
-export default Homepage;

package/templates/next-cosmos-template/src/app/components/WalletConnectButton/WalletConnectButton.tsx

@@ -1,26 +0,0 @@
-import { useChain } from "@cosmos-kit/react";
-
-import "@interchain-ui/react/styles";
-
-import { truncateSeiAddress } from "@sei-js/cosmjs";
-import { selectedChain } from "../../constants";
-
-export function WalletConnectButton() {
-  const {
-    isWalletConnected,
-    address,
-    connect,
-    openView,
-  } = useChain(selectedChain.chain_name);
-
-  const truncatedSeiAddr = address ? truncateSeiAddress(address) : ""
-
-  return (
-    <button
-      className="primary"
-      onClick={isWalletConnected ? openView : connect}
-    >
-      {isWalletConnected ? truncateSeiAddress(truncatedSeiAddr) : "Connect"}
-    </button>
-  );
-}

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

@@ -1,39 +0,0 @@
-'use client';
-
-import { ReactNode } from 'react';
-
-import { ChainProvider } from '@cosmos-kit/react';
-import { COSMOS_KIT_ASSET_LIST } from '@sei-js/cosmjs';
-import { wallets as finWallets } from '@cosmos-kit/fin'
-import { wallets as keplrWallets } from '@cosmos-kit/keplr'
-import {
-  CompassExtensionWallet,
-  compassExtensionInfo,
-} from '@cosmos-kit/compass-extension'
-import { selectedChain } from '../constants';
-
-interface Web3ProviderProps {
-	children: ReactNode;
-}
-
-const compassWallet = new CompassExtensionWallet({
-  ...compassExtensionInfo,
-  mobileDisabled: false,
-})
-
-function Web3Provider({ children }: Web3ProviderProps) {
-
-  // Define your supported wallets here
-  const wallets = [compassWallet, ...finWallets, ...keplrWallets];
-
-  // Define the list of sei chain you would like to connect to here.
-  const chains = [selectedChain]
-
-	return (
-      <ChainProvider chains={chains} assetLists={[COSMOS_KIT_ASSET_LIST]} wallets={wallets}>
-        {children}
-      </ChainProvider>
-	);
-}
-
-export default Web3Provider;

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

@@ -1,3 +0,0 @@
-export * from './Homepage/Homepage'
-export * from './WalletConnectButton/WalletConnectButton'
-export * from './Web3Provider'

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

@@ -1,16 +0,0 @@
-import { ARCTIC_1_SEI_COSMOS_KIT_CHAIN, ATLANTIC_2_SEI_COSMOS_KIT_CHAIN, PACIFIC_1_SEI_COSMOS_KIT_CHAIN } from '@sei-js/cosmjs';
-
-export type Urls = {
-    rpc: string,
-    rest: string,
-}
-
-export const defaultUrls: {[chainName: string]: Urls} = {
-    [PACIFIC_1_SEI_COSMOS_KIT_CHAIN.chain_id]: {rpc: "https://rpc.sei-apis.com", rest: 'https://rest-arctic-1.sei-apis.com'},
-    [ATLANTIC_2_SEI_COSMOS_KIT_CHAIN.chain_id]: {rpc: "https://rpc-testnet.sei-apis.com", rest: "https://rest-testnet.sei-apis.com"},
-    [ARCTIC_1_SEI_COSMOS_KIT_CHAIN.chain_id]: {rpc: "https://rpc-arctic-1.sei-apis.com", rest: "https://rest-arctic-1.sei-apis.com"}
-}
-
-// Set your selected chain here
-// To point to mainnet, use PACIFIC_1_SEI_COSMOS_KIT_CHAIN
-export const selectedChain = ARCTIC_1_SEI_COSMOS_KIT_CHAIN

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

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

package/templates/next-cosmos-template/src/app/index.css

@@ -1,171 +0,0 @@
-/*
-  1. Use a more-intuitive box-sizing model.
-*/
-*, *::before, *::after {
-  box-sizing: border-box;
-}
-/*
-  2. Remove default margin
-*/
-* {
-  margin: 0;
-}
-/*
-  Typographic tweaks!
-  3. Add accessible line-height
-  4. Improve text rendering
-*/
-body {
-  line-height: 1.5;
-  -webkit-font-smoothing: antialiased;
-}
-/*
-  5. Improve media defaults
-*/
-img, picture, video, canvas, svg {
-  display: block;
-  max-width: 100%;
-}
-/*
-  6. Remove built-in form typography styles
-*/
-input, button, textarea, select {
-  font: inherit;
-}
-/*
-  7. Avoid text overflows
-*/
-p, h1, h2, h3, h4, h5, h6 {
-  overflow-wrap: break-word;
-  line-height: 1;
-}
-/*
-  8. Create a root stacking context
-*/
-#root, #__next {
-  isolation: isolate;
-}
-
-
-:root {
-  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
-  line-height: 1.5;
-  font-weight: 400;
-
-  color-scheme: light dark;
-  color:#000;
-  background: var(--background);
-
-  font-synthesis: none;
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-
-  --primary-color: #9F1239;
-  --primary-color-hover: #7F0A2E;
-  --background: linear-gradient(180deg, #F5F5F4 0%, #FFF 100%);
-  --border: #D6D3D1;
-  --card: #FFF;
-  --card-foreground: #242424;
-}
-
-a {
-  font-weight: 500;
-  color: var(--primary-color);
-  text-decoration: inherit;
-}
-a:hover {
-  color: var(--primary-color-hover)
-}
-
-body {
-  margin: 0;
-  padding: 0;
-}
-
-h1 {
-  font-size: 3.2em;
-  line-height: 1;
-}
-code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
-    monospace;
-    display: inline-flex;
-    border-radius: 4px;
-    padding: 0.1rem 0.4rem;
-    background-color: #d7cccc;
-    color: var(--card-foreground);
-}
-
-button {
-  border-radius: 4rem;
-  border: 1px solid transparent;
-  padding: 0.6em 1.2em;
-  font-size: 1em;
-  font-weight: 500;
-  font-family: inherit;
-  background-color: #cec9c1;
-  cursor: pointer;
-  transition: all 0.25s ease;
-  color: black;
-}
-button:hover {
-  background-color: #b5afa7;
-}
-
-button:disabled {
-  filter:grayscale(1) opacity(0.5);
-  color: rgb(56, 55, 55);
-  pointer-events: none;
-}
-
-button.primary {
-  background-color: var(--primary-color);
-  color: #fff;
-}
-button.outline {
-  background-color: transparent;
-  border: 1px solid var(--border);
-}
-
-button.primary:hover {
-  background-color: var(--primary-color-hover);
-}
-
-button.secondary {
-  background-color: #000;
-  color: #fff;
-}
-
-button.secondary:hover {
-  background-color: #2b2b2b;
-}
-
-button:active {
-  transform: translateY(1px);
-}
-
-button.small {
-  padding: 0.4em 0.8em;
-  font-size: 0.8em;
-}
-
-
-button:focus-visible {
-  outline: 4px auto -webkit-focus-ring-color;
-  outline-offset: 4px;
-}
-
-.header {
-  width: 100%;
-  height: 4rem;
-  padding: 0 1%;
-  display: flex;
-  align-items: center;
-  justify-content: right;
-  background-color: transparent;
-  border-bottom: 1px solid var(--border);
-  position: sticky;
-  top: 0;
-  background: #F5F5F4;
-}

package/templates/next-cosmos-template/src/app/layout.tsx

@@ -1,21 +0,0 @@
-import type { Metadata } from "next";
-import { Inter } from "next/font/google";
-
-const inter = Inter({ subsets: ["latin"] });
-
-export const metadata: Metadata = {
-  title: "Sei Next App (Cosmos)",
-  description: "Generated by create sei app",
-};
-
-export default function RootLayout({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
-  return (
-    <html lang="en">
-      <body className={inter.className}>{children}</body>
-    </html>
-  );
-}

package/templates/next-cosmos-template/src/app/page.tsx

@@ -1,17 +0,0 @@
-'use client';
-
-import './index.css'
-import Homepage from "./components/Homepage/Homepage";
-import Web3Provider from "./components/Web3Provider";
-import { WalletConnectButton } from "./components/WalletConnectButton/WalletConnectButton";
-
-export default function Home() {  
-  return (
-    <Web3Provider>
-      <div className="header">
-        <WalletConnectButton/>
-      </div>
-      <Homepage/>
-    </Web3Provider>
-  );
-}

package/templates/next-cosmos-template/tsconfig.json

@@ -1,26 +0,0 @@
-{
-  "compilerOptions": {
-    "lib": ["dom", "dom.iterable", "esnext"],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "strict": true,
-    "noEmit": true,
-    "esModuleInterop": true,
-    "module": "esnext",
-    "moduleResolution": "bundler",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "jsx": "preserve",
-    "incremental": true,
-    "plugins": [
-      {
-        "name": "next"
-      }
-    ],
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
-  "exclude": ["node_modules"]
-}