@sei-js/create-sei 1.0.1 → 2.0.0

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 (68) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +5 -4
  3. package/dist/extensions/precompiles/src/components/default/index.tsx +44 -51
  4. package/dist/main.js +112 -34
  5. package/dist/templates/next-template/.env.example +1 -1
  6. package/dist/templates/next-template/README.md +55 -27
  7. package/dist/templates/next-template/biome.json +3 -4
  8. package/dist/templates/next-template/gitignore +41 -0
  9. package/dist/templates/next-template/next.config.mjs +9 -6
  10. package/dist/templates/next-template/package.json +36 -27
  11. package/dist/templates/next-template/public/brand/powered-by-sei-light.png +0 -0
  12. package/dist/templates/next-template/public/brand/sei-lockup-light.svg +7 -0
  13. package/dist/templates/next-template/public/brand/sei-mark.png +0 -0
  14. package/dist/templates/next-template/src/app/development/page.tsx +29 -30
  15. package/dist/templates/next-template/src/app/favicon.ico/route.ts +3 -0
  16. package/dist/templates/next-template/src/app/globals.css +40 -3
  17. package/dist/templates/next-template/src/app/layout.tsx +14 -13
  18. package/dist/templates/next-template/src/app/page.tsx +3 -3
  19. package/dist/templates/next-template/src/app/resources/page.tsx +34 -51
  20. package/dist/templates/next-template/src/app/resources/resources.ts +19 -32
  21. package/dist/templates/next-template/src/components/default/examples.ts +4 -7
  22. package/dist/templates/next-template/src/components/default/index.tsx +46 -46
  23. package/dist/templates/next-template/src/components/index.ts +3 -3
  24. package/dist/templates/next-template/src/components/landing/index.tsx +19 -97
  25. package/dist/templates/next-template/src/components/providers/index.ts +1 -1
  26. package/dist/templates/next-template/src/components/providers/providers.tsx +19 -25
  27. package/dist/templates/next-template/src/components/shell/index.ts +1 -1
  28. package/dist/templates/next-template/src/components/shell/shell.tsx +14 -7
  29. package/dist/templates/next-template/src/theme.ts +1 -0
  30. package/package.json +20 -9
  31. package/.rsyncignore +0 -11
  32. package/CHANGELOG.md +0 -131
  33. package/biome.json +0 -8
  34. package/dist/extensions/precompiles/package.json +0 -44
  35. package/dist/main.test.js +0 -34
  36. package/dist/templates/next-template/public/favicon.ico +0 -0
  37. package/extensions/precompiles/package.json +0 -44
  38. package/extensions/precompiles/src/components/default/index.tsx +0 -201
  39. package/jest.config.js +0 -14
  40. package/src/main.test.ts +0 -38
  41. package/src/main.ts +0 -159
  42. package/templates/next-template/.env.example +0 -8
  43. package/templates/next-template/.eslintrc.json +0 -1
  44. package/templates/next-template/.nvmrc +0 -1
  45. package/templates/next-template/README.md +0 -54
  46. package/templates/next-template/biome.json +0 -56
  47. package/templates/next-template/next-env.d.ts +0 -5
  48. package/templates/next-template/next.config.mjs +0 -17
  49. package/templates/next-template/package.json +0 -46
  50. package/templates/next-template/postcss.config.mjs +0 -6
  51. package/templates/next-template/public/favicon.ico +0 -0
  52. package/templates/next-template/src/app/development/page.tsx +0 -260
  53. package/templates/next-template/src/app/globals.css +0 -16
  54. package/templates/next-template/src/app/layout.tsx +0 -30
  55. package/templates/next-template/src/app/page.tsx +0 -10
  56. package/templates/next-template/src/app/resources/page.tsx +0 -175
  57. package/templates/next-template/src/app/resources/resources.ts +0 -56
  58. package/templates/next-template/src/components/default/examples.ts +0 -63
  59. package/templates/next-template/src/components/default/index.tsx +0 -402
  60. package/templates/next-template/src/components/index.ts +0 -3
  61. package/templates/next-template/src/components/landing/index.tsx +0 -155
  62. package/templates/next-template/src/components/providers/index.ts +0 -1
  63. package/templates/next-template/src/components/providers/providers.tsx +0 -108
  64. package/templates/next-template/src/components/shell/index.ts +0 -1
  65. package/templates/next-template/src/components/shell/shell.tsx +0 -88
  66. package/templates/next-template/tailwind.config.js +0 -5
  67. package/templates/next-template/tsconfig.json +0 -27
  68. package/tsconfig.json +0 -19
@@ -26,22 +26,19 @@ const weiBalance = await publicClient.getBalance({ address });
26
26
  const seiBalance = formatEther(weiBalance);`;
27
27
 
28
28
  export const precompileCodeExample = `// Import Sei precompiles
29
- import { VIEM_BANK_PRECOMPILE_ABI, BANK_PRECOMPILE_ADDRESS } from '@sei-js/precompiles';
29
+ import { BANK_PRECOMPILE_ABI, BANK_PRECOMPILE_ADDRESS } from '@sei-js/precompiles';
30
30
  import { usePublicClient } from 'wagmi';
31
- import { type ReadContractParameters } from 'viem';
32
31
 
33
32
  // Use the hook
34
33
  const publicClient = usePublicClient();
35
34
 
36
35
  // Call precompile
37
- const readContractParams: ReadContractParameters = {
38
- abi: VIEM_BANK_PRECOMPILE_ABI,
36
+ const result = await publicClient.readContract({
37
+ abi: BANK_PRECOMPILE_ABI,
39
38
  address: BANK_PRECOMPILE_ADDRESS,
40
39
  functionName: 'supply',
41
40
  args: ['usei']
42
- };
43
-
44
- const result = await publicClient.readContract(readContractParams);`;
41
+ });`;
45
42
 
46
43
  export const transactionCodeExample = `// Import transaction hooks
47
44
  import { useSendTransaction, useWaitForTransactionReceipt } from 'wagmi';
@@ -1,6 +1,6 @@
1
- 'use client';
1
+ "use client";
2
2
 
3
- import { CodeHighlight } from '@mantine/code-highlight';
3
+ import { CodeHighlight } from "@mantine/code-highlight";
4
4
  import {
5
5
  ActionIcon,
6
6
  Alert,
@@ -19,18 +19,18 @@ import {
19
19
  TextInput,
20
20
  ThemeIcon,
21
21
  Title,
22
- } from '@mantine/core';
23
- import { notifications } from '@mantine/notifications';
24
- import { IconBulb, IconChevronDown, IconChevronUp, IconCoins, IconCopy, IconLogout, IconSend, IconWallet } from '@tabler/icons-react';
25
- import { useState } from 'react';
26
- import { formatEther, parseEther } from 'viem';
27
- import { useAccount, useDisconnect, usePublicClient, useSendTransaction, useWaitForTransactionReceipt } from 'wagmi';
28
- import { balanceCodeExample, transactionCodeExample, walletCodeExample } from './examples';
22
+ } from "@mantine/core";
23
+ import { notifications } from "@mantine/notifications";
24
+ import { IconBulb, IconChevronDown, IconChevronUp, IconCoins, IconCopy, IconLogout, IconSend, IconWallet } from "@tabler/icons-react";
25
+ import { useState } from "react";
26
+ import { formatEther, parseEther } from "viem";
27
+ import { useAccount, useDisconnect, usePublicClient, useSendTransaction, useWaitForTransactionReceipt } from "wagmi";
28
+ import { balanceCodeExample, transactionCodeExample, walletCodeExample } from "./examples";
29
29
 
30
30
  function Examples() {
31
- const [balance, setBalance] = useState('');
32
- const [recipient, setRecipient] = useState('');
33
- const [amount, setAmount] = useState('');
31
+ const [balance, setBalance] = useState("");
32
+ const [recipient, setRecipient] = useState("");
33
+ const [amount, setAmount] = useState("");
34
34
 
35
35
  // Code visibility toggles
36
36
  const [showWalletCode, setShowWalletCode] = useState(false);
@@ -51,17 +51,17 @@ function Examples() {
51
51
  try {
52
52
  navigator.clipboard.writeText(text).then(() => {
53
53
  notifications.show({
54
- title: 'Copied!',
55
- message: 'Code copied to clipboard',
56
- color: 'green',
54
+ title: "Copied!",
55
+ message: "Code copied to clipboard",
56
+ color: "green",
57
57
  });
58
58
  });
59
59
  } catch (err) {
60
- console.error('Failed to copy text: ', err);
60
+ console.error("Failed to copy text: ", err);
61
61
  notifications.show({
62
- title: 'Error',
63
- message: 'Failed to copy to clipboard',
64
- color: 'red',
62
+ title: "Error",
63
+ message: "Failed to copy to clipboard",
64
+ color: "red",
65
65
  });
66
66
  }
67
67
  };
@@ -78,9 +78,9 @@ function Examples() {
78
78
  const sendSei = async () => {
79
79
  if (!recipient || !amount) {
80
80
  notifications.show({
81
- title: 'Missing Information',
82
- message: 'Please enter recipient address and amount',
83
- color: 'orange',
81
+ title: "Missing Information",
82
+ message: "Please enter recipient address and amount",
83
+ color: "yellow",
84
84
  });
85
85
  return;
86
86
  }
@@ -91,11 +91,11 @@ function Examples() {
91
91
  value: parseEther(amount),
92
92
  });
93
93
  } catch (error) {
94
- console.error('Transaction error:', error);
94
+ console.error("Transaction error:", error);
95
95
  notifications.show({
96
- title: 'Transaction Error',
97
- message: 'Failed to send transaction',
98
- color: 'red',
96
+ title: "Transaction Error",
97
+ message: "Failed to send transaction",
98
+ color: "red",
99
99
  });
100
100
  }
101
101
  };
@@ -106,11 +106,11 @@ function Examples() {
106
106
  {/* Header */}
107
107
  <div>
108
108
  <Group gap="md" align="center" mb="lg">
109
- <ThemeIcon size={48} radius="md" c="blue" variant="light">
109
+ <ThemeIcon size={48} radius="md" variant="outline" color="seiMaroon">
110
110
  <IconBulb size={24} />
111
111
  </ThemeIcon>
112
112
  <div>
113
- <Title order={1} fw={700} c="gray.9">
113
+ <Title order={1} fw={700} c="seiMaroon.9" className="sei-heading">
114
114
  Interactive Examples
115
115
  </Title>
116
116
  <Text size="lg" c="gray.6" mt={4}>
@@ -126,7 +126,7 @@ function Examples() {
126
126
  <Flex justify="space-between" align="flex-start">
127
127
  <Stack gap="xs">
128
128
  <Group gap="md">
129
- <ThemeIcon size={40} radius="md" color="blue" variant="light">
129
+ <ThemeIcon size={40} radius="md" variant="outline" color="seiMaroon">
130
130
  <IconWallet size={20} />
131
131
  </ThemeIcon>
132
132
  <Title order={4} fw={600} c="gray.9">
@@ -137,7 +137,7 @@ function Examples() {
137
137
  Access wallet information using Wagmi's useAccount hook
138
138
  </Text>
139
139
  </Stack>
140
- <Badge color="blue" variant="light" size="md" radius="md">
140
+ <Badge variant="outline" color="gray" size="md" radius="md">
141
141
  address
142
142
  </Badge>
143
143
  </Flex>
@@ -147,11 +147,11 @@ function Examples() {
147
147
  </Text>
148
148
  <Flex justify="space-between" align="center">
149
149
  <Code bg="white" p="xs">
150
- {address || 'No wallet connected'}
150
+ {address || "No wallet connected"}
151
151
  </Code>
152
152
  {isConnected && address && (
153
153
  <Group gap="xs">
154
- <ActionIcon variant="light" color="blue" size="sm" radius="md" onClick={() => copyToClipboard(address)} aria-label="Copy address">
154
+ <ActionIcon variant="outline" color="dark" size="sm" radius="md" onClick={() => copyToClipboard(address)} aria-label="Copy address">
155
155
  <IconCopy size={14} />
156
156
  </ActionIcon>
157
157
  <ActionIcon variant="light" color="red" size="sm" radius="md" onClick={() => disconnect()} aria-label="Disconnect wallet">
@@ -171,7 +171,7 @@ function Examples() {
171
171
  leftSection={showWalletCode ? <IconChevronUp size={14} /> : <IconChevronDown size={14} />}
172
172
  onClick={() => setShowWalletCode(!showWalletCode)}
173
173
  >
174
- {showWalletCode ? 'Hide' : 'View'} Implementation
174
+ {showWalletCode ? "Hide" : "View"} Implementation
175
175
  </Button>
176
176
  {showWalletCode && (
177
177
  <ActionIcon variant="subtle" color="gray" size="sm" radius="md" onClick={() => copyToClipboard(walletCodeExample)}>
@@ -195,7 +195,7 @@ function Examples() {
195
195
  <Flex justify="space-between" align="flex-start">
196
196
  <Stack gap="xs">
197
197
  <Flex align="center" gap="md">
198
- <ThemeIcon size={40} radius="md" color="green" variant="light">
198
+ <ThemeIcon size={40} radius="md" variant="outline" color="seiGold">
199
199
  <IconCoins size={20} />
200
200
  </ThemeIcon>
201
201
  <Title order={3} size="h3" fw={600}>
@@ -206,7 +206,7 @@ function Examples() {
206
206
  Query your wallet's SEI balance using Wagmi's usePublicClient hook
207
207
  </Text>
208
208
  </Stack>
209
- <Badge color="green" variant="light" size="md" radius="md">
209
+ <Badge variant="outline" color="gray" size="md" radius="md">
210
210
  balance
211
211
  </Badge>
212
212
  </Flex>
@@ -218,7 +218,7 @@ function Examples() {
218
218
  <Flex align="baseline" gap="xs">
219
219
  {balance ? (
220
220
  <>
221
- <Text fw={700} size="xl" c="gray.9" ff="monospace">
221
+ <Text fw={700} size="xl" c="seiGold.9" ff="var(--sei-font-mono)">
222
222
  {Number.parseFloat(balance).toFixed(4)}
223
223
  </Text>
224
224
  <Text size="sm" c="gray.6" fw={500}>
@@ -243,11 +243,11 @@ function Examples() {
243
243
  disabled={!address}
244
244
  size="sm"
245
245
  radius="md"
246
- variant="light"
247
- color="green"
246
+ variant="filled"
247
+ color="seiMaroon"
248
248
  leftSection={<IconCoins size={14} />}
249
249
  >
250
- {balance ? 'Refresh' : 'Check Balance'}
250
+ {balance ? "Refresh" : "Check Balance"}
251
251
  </Button>
252
252
  </Flex>
253
253
  </Paper>
@@ -261,7 +261,7 @@ function Examples() {
261
261
  leftSection={showBalanceCode ? <IconChevronUp size={14} /> : <IconChevronDown size={14} />}
262
262
  onClick={() => setShowBalanceCode(!showBalanceCode)}
263
263
  >
264
- {showBalanceCode ? 'Hide' : 'View'} Implementation
264
+ {showBalanceCode ? "Hide" : "View"} Implementation
265
265
  </Button>
266
266
  {showBalanceCode && (
267
267
  <ActionIcon variant="subtle" color="gray" size="sm" radius="md" onClick={() => copyToClipboard(balanceCodeExample)}>
@@ -284,7 +284,7 @@ function Examples() {
284
284
  <Flex direction="row" justify="space-between" align="flex-start">
285
285
  <Stack gap="xs">
286
286
  <Flex direction="row" align="center" gap="md" mb="md">
287
- <ThemeIcon size={40} radius="md" color="blue" variant="light">
287
+ <ThemeIcon size={40} radius="md" variant="outline" color="seiMaroon">
288
288
  <IconSend size={20} />
289
289
  </ThemeIcon>
290
290
  <Title order={3} size="h3" fw={600} c="gray.9">
@@ -295,7 +295,7 @@ function Examples() {
295
295
  Send SEI tokens using Wagmi's transaction hooks with real-time status
296
296
  </Text>
297
297
  </Stack>
298
- <Badge color="blue" variant="light" size="md" radius="md">
298
+ <Badge variant="outline" color="gray" size="md" radius="md">
299
299
  transfer
300
300
  </Badge>
301
301
  </Flex>
@@ -329,8 +329,8 @@ function Examples() {
329
329
  disabled={isPending || !address || !recipient || !amount}
330
330
  size="md"
331
331
  radius="md"
332
- variant="light"
333
- color="blue"
332
+ variant="filled"
333
+ color="seiMaroon"
334
334
  px="sm"
335
335
  >
336
336
  {isPending ? <Loader size={16} /> : <IconSend size={16} />}
@@ -339,7 +339,7 @@ function Examples() {
339
339
  </Paper>
340
340
 
341
341
  {hash && (
342
- <Alert color="blue" variant="light" radius="md" py={4}>
342
+ <Alert color="gray" variant="light" radius="md" py={4}>
343
343
  <Stack gap={4}>
344
344
  <Text size="xs" fw={600}>
345
345
  Transaction Hash
@@ -377,7 +377,7 @@ function Examples() {
377
377
  leftSection={showTransactionCode ? <IconChevronUp size={14} /> : <IconChevronDown size={14} />}
378
378
  onClick={() => setShowTransactionCode(!showTransactionCode)}
379
379
  >
380
- {showTransactionCode ? 'Hide' : 'View'} Implementation
380
+ {showTransactionCode ? "Hide" : "View"} Implementation
381
381
  </Button>
382
382
  {showTransactionCode && (
383
383
  <ActionIcon variant="subtle" color="gray" size="sm" radius="xl" onClick={() => copyToClipboard(transactionCodeExample)}>
@@ -1,3 +1,3 @@
1
- export { default as Default } from './default';
2
- export { default as Landing } from './landing';
3
- export { default as Shell } from './shell';
1
+ export { default as Default } from "./default";
2
+ export { default as Landing } from "./landing";
3
+ export { default as Shell } from "./shell";
@@ -1,9 +1,11 @@
1
- 'use client';
1
+ "use client";
2
2
 
3
- import { Badge, Button, Card, Code, Container, Group, Stack, Text, ThemeIcon, Title } from '@mantine/core';
4
- import { ConnectButton } from '@rainbow-me/rainbowkit';
5
- import { IconBook, IconCode, IconRocket } from '@tabler/icons-react';
6
- import Link from 'next/link';
3
+ import { Badge, Button, Card, Code, Container, Group, Stack, Text, ThemeIcon, Title } from "@mantine/core";
4
+ import { ConnectButton } from "@rainbow-me/rainbowkit";
5
+ import { IconBook, IconCode, IconRocket } from "@tabler/icons-react";
6
+ import Link from "next/link";
7
+
8
+ const technologyLabels = ["Next.js 15.5", "Mantine UI", "Tailwind CSS", "Biome", "RainbowKit", "Wagmi + Viem"];
7
9
 
8
10
  export default function Landing() {
9
11
  return (
@@ -11,112 +13,32 @@ export default function Landing() {
11
13
  <Stack gap="xl" align="center">
12
14
  {/* Hero Section */}
13
15
  <Stack gap="md" align="center" ta="center">
14
- <Title order={1} size="h1" fw={700} c="gray.9">
16
+ <Title order={1} size="h1" fw={700} c="seiMaroon.9" className="sei-heading">
15
17
  Welcome to Your Sei dApp
16
18
  </Title>
17
19
  <Text size="lg" c="dimmed" maw={600}>
18
- A production-ready starter template built with Next.js, Mantine UI, RainbowKit, Tailwind CSS, and Wagmi with easy deployment to Vercel. Everything
19
- you need to build and run production-grade dApps on Sei.
20
+ A production-ready starter template built with Next.js, Mantine UI, RainbowKit, Tailwind CSS, and Wagmi. Everything you need to build and run
21
+ production-grade dApps on Sei.
20
22
  </Text>
21
23
 
22
24
  {/* Tech Stack Badges */}
23
25
  <Group gap="xs" mt="sm">
24
- <Badge
25
- variant="light"
26
- color="blue"
27
- style={{
28
- backgroundColor: 'rgb(239 246 255)',
29
- color: 'rgb(29 78 216)',
30
- border: '1px solid rgb(191 219 254)',
31
- }}
32
- >
33
- Next.js 14
34
- </Badge>
35
- <Badge
36
- variant="light"
37
- color="violet"
38
- style={{
39
- backgroundColor: 'rgb(250 245 255)',
40
- color: 'rgb(109 40 217)',
41
- border: '1px solid rgb(196 181 253)',
42
- }}
43
- >
44
- Mantine UI
45
- </Badge>
46
- <Badge
47
- variant="light"
48
- color="cyan"
49
- style={{
50
- backgroundColor: 'rgb(236 254 255)',
51
- color: 'rgb(14 116 144)',
52
- border: '1px solid rgb(165 243 252)',
53
- }}
54
- >
55
- Tailwind CSS
56
- </Badge>
57
- <Badge
58
- variant="light"
59
- color="yellow"
60
- style={{
61
- backgroundColor: 'rgb(254 249 195)',
62
- color: 'rgb(161 98 7)',
63
- border: '1px solid rgb(254 240 138)',
64
- }}
65
- >
66
- Biome
67
- </Badge>
68
- <Badge
69
- variant="light"
70
- color="orange"
71
- style={{
72
- backgroundColor: 'rgb(255 247 237)',
73
- color: 'rgb(194 65 12)',
74
- border: '1px solid rgb(254 215 170)',
75
- }}
76
- >
77
- RainbowKit
78
- </Badge>
79
- <Badge
80
- variant="light"
81
- color="teal"
82
- style={{
83
- backgroundColor: 'rgb(240 253 250)',
84
- color: 'rgb(15 118 110)',
85
- border: '1px solid rgb(153 246 228)',
86
- }}
87
- >
88
- Wagmi + Viem
89
- </Badge>
90
- <Badge
91
- variant="light"
92
- color="dark"
93
- style={{
94
- backgroundColor: 'rgb(249 250 251)',
95
- color: 'rgb(17 24 39)',
96
- border: '1px solid rgb(209 213 219)',
97
- }}
98
- >
99
- Vercel
100
- </Badge>
26
+ {technologyLabels.map((label) => (
27
+ <Badge key={label} variant="outline" color="gray">
28
+ {label}
29
+ </Badge>
30
+ ))}
101
31
  </Group>
102
32
  </Stack>
103
33
 
104
34
  {/* Primary Call to Action - Connect Wallet */}
105
- <Card
106
- withBorder
107
- radius="xl"
108
- p="xl"
109
- bg="gradient-to-r from-blue-50 to-purple-50"
110
- w="100%"
111
- maw={600}
112
- style={{ border: '2px solid var(--mantine-color-blue-2)' }}
113
- >
35
+ <Card withBorder radius="xl" p="xl" w="100%" maw={600} bg="white" style={{ border: "2px solid var(--sei-maroon)" }}>
114
36
  <Stack gap="lg" align="center" ta="center">
115
- <ThemeIcon size={64} radius="xl" color="blue" variant="light">
37
+ <ThemeIcon size={64} radius="xl" variant="outline" color="seiMaroon">
116
38
  <IconRocket size={32} />
117
39
  </ThemeIcon>
118
40
  <Stack gap="sm" align="center">
119
- <Text fw={700} size="xl" c="blue.8">
41
+ <Text fw={700} size="xl" c="seiMaroon.9" className="sei-heading">
120
42
  Connect Your Wallet to Get Started
121
43
  </Text>
122
44
  <Text size="md" c="dimmed" maw={400}>
@@ -130,7 +52,7 @@ export default function Landing() {
130
52
  {/* Development Tip */}
131
53
  <Card withBorder radius="md" p="md" bg="gray.0" maw={600}>
132
54
  <Text size="xs" c="dimmed" ta="center">
133
- 💡 <strong>Development Tip:</strong> Start by exploring the examples in the connected app, then customize{' '}
55
+ 💡 <strong>Development Tip:</strong> Start by exploring the examples in the connected app, then customize{" "}
134
56
  <Code>src/components/default/index.tsx</Code> to build your unique dApp features.
135
57
  </Text>
136
58
  </Card>
@@ -1 +1 @@
1
- export { default as Providers } from './providers';
1
+ export { default as Providers } from "./providers";
@@ -1,42 +1,39 @@
1
1
  "use client";
2
2
 
3
- import { MantineProvider } from "@mantine/core";
3
+ import { createTheme, MantineProvider } from "@mantine/core";
4
4
  import { Notifications } from "@mantine/notifications";
5
5
  import { connectorsForWallets, lightTheme, RainbowKitProvider } from "@rainbow-me/rainbowkit";
6
- import { metaMaskWallet } from "@rainbow-me/rainbowkit/wallets";
6
+ import { injectedWallet } from "@rainbow-me/rainbowkit/wallets";
7
7
  import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
8
8
  import { type ReactNode, useMemo } from "react";
9
9
  import { createConfig, http, WagmiProvider } from "wagmi";
10
+ import { SEI_NEUTRAL_RAMP } from "@/theme";
10
11
 
11
12
  import "@rainbow-me/rainbowkit/styles.css";
12
- import { defineChain } from "viem";
13
13
  import { sei, seiTestnet } from "viem/chains";
14
14
 
15
- const seiDevnet = defineChain({
16
- id: 713715,
17
- name: "Sei Devnet",
18
- nativeCurrency: { name: "Sei", symbol: "SEI", decimals: 18 },
19
- rpcUrls: {
20
- default: {
21
- http: ["https://evm-rpc-arctic-1.sei-apis.com"],
22
- },
15
+ const queryClient = new QueryClient();
16
+ const theme = createTheme({
17
+ autoContrast: true,
18
+ colors: {
19
+ gray: SEI_NEUTRAL_RAMP,
20
+ seiGold: ["#966f22", "#966f22", "#966f22", "#966f22", "#966f22", "#966f22", "#966f22", "#966f22", "#966f22", "#966f22"],
21
+ seiMaroon: ["#600014", "#600014", "#600014", "#600014", "#600014", "#600014", "#600014", "#600014", "#600014", "#600014"],
23
22
  },
24
- blockExplorers: {
25
- default: {
26
- name: "Seitrace",
27
- url: "https://seitrace.com",
28
- },
23
+ fontFamily: "var(--sei-font-body)",
24
+ fontFamilyMonospace: "var(--sei-font-mono)",
25
+ headings: {
26
+ fontFamily: "var(--sei-font-display)",
29
27
  },
30
- testnet: true,
28
+ primaryColor: "seiMaroon",
29
+ primaryShade: 9,
31
30
  });
32
31
 
33
- const queryClient = new QueryClient();
34
-
35
32
  const connectors = connectorsForWallets(
36
33
  [
37
34
  {
38
35
  groupName: "Recommended",
39
- wallets: [metaMaskWallet],
36
+ wallets: [injectedWallet],
40
37
  },
41
38
  ],
42
39
  {
@@ -56,8 +53,6 @@ export default function Providers({ children }: ProvidersProps) {
56
53
  switch (chainName.toLowerCase()) {
57
54
  case "testnet":
58
55
  return seiTestnet;
59
- case "devnet":
60
- return seiDevnet;
61
56
  default:
62
57
  return sei;
63
58
  }
@@ -73,7 +68,6 @@ export default function Providers({ children }: ProvidersProps) {
73
68
  transports: {
74
69
  [sei.id]: http(),
75
70
  [seiTestnet.id]: http(),
76
- [seiDevnet.id]: http(),
77
71
  },
78
72
  ssr: true,
79
73
  }),
@@ -83,11 +77,11 @@ export default function Providers({ children }: ProvidersProps) {
83
77
  return (
84
78
  <WagmiProvider config={config}>
85
79
  <QueryClientProvider client={queryClient}>
86
- <MantineProvider defaultColorScheme="light">
80
+ <MantineProvider defaultColorScheme="light" theme={theme}>
87
81
  <Notifications />
88
82
  <RainbowKitProvider
89
83
  theme={lightTheme({
90
- accentColor: "#9E1F19",
84
+ accentColor: "var(--sei-maroon)",
91
85
  accentColorForeground: "white",
92
86
  borderRadius: "medium",
93
87
  fontStack: "system",
@@ -1 +1 @@
1
- export { default } from './shell';
1
+ export { default } from "./shell";
@@ -13,19 +13,19 @@ export default function Shell({ children }: PropsWithChildren) {
13
13
  const { disconnect } = useDisconnect();
14
14
 
15
15
  return (
16
- <AppShell header={{ height: 64 }} padding="md">
17
- <AppShell.Header>
16
+ <AppShell header={{ height: 72 }} footer={{ height: 56 }} padding="md">
17
+ <AppShell.Header bg="white" style={{ borderColor: "var(--sei-neutral-50)" }}>
18
18
  <Container size="xl" h="100%">
19
19
  <Group justify="space-between" align="center" h="100%">
20
- <Link href="/" aria-label="Sei">
21
- <Image src="https://cdn.sei.io/assets/sei-icon.svg" alt="Sei" width={28} height={28} style={{ display: "block" }} />
20
+ <Link href="/" aria-label="Sei home" className="sei-brand-link">
21
+ <Image src="/brand/sei-lockup-light.svg" alt="Sei" width={104} height={40} priority style={{ display: "block" }} />
22
22
  </Link>
23
23
  <Group align="center" gap="md">
24
24
  <ActionIcon
25
25
  component={Link}
26
26
  href="/resources"
27
27
  variant="light"
28
- c="gray"
28
+ color="gray"
29
29
  size="lg"
30
30
  radius="md"
31
31
  aria-label="View Resources"
@@ -43,7 +43,7 @@ export default function Shell({ children }: PropsWithChildren) {
43
43
  component={Link}
44
44
  href="/development"
45
45
  variant="light"
46
- c="gray"
46
+ color="gray"
47
47
  size="lg"
48
48
  radius="md"
49
49
  aria-label="View Development Guide"
@@ -60,7 +60,7 @@ export default function Shell({ children }: PropsWithChildren) {
60
60
  {isConnected && address ? (
61
61
  <ActionIcon
62
62
  variant="light"
63
- c="red"
63
+ color="red"
64
64
  size="lg"
65
65
  radius="md"
66
66
  onClick={() => disconnect()}
@@ -83,6 +83,13 @@ export default function Shell({ children }: PropsWithChildren) {
83
83
  </Container>
84
84
  </AppShell.Header>
85
85
  <AppShell.Main>{children}</AppShell.Main>
86
+ <AppShell.Footer bg="white" style={{ borderColor: "var(--sei-neutral-50)" }}>
87
+ <Container size="xl" h="100%">
88
+ <Group justify="center" align="center" h="100%">
89
+ <Image src="/brand/powered-by-sei-light.png" alt="Powered by Sei" width={192} height={28} style={{ display: "block" }} />
90
+ </Group>
91
+ </Container>
92
+ </AppShell.Footer>
86
93
  </AppShell>
87
94
  );
88
95
  }
@@ -0,0 +1 @@
1
+ export const SEI_NEUTRAL_RAMP = ["#f5f5f7", "#f5f5f7", "#cccccc", "#999999", "#666666", "#666666", "#333333", "#333333", "#131313", "#000000"] as const;
package/package.json CHANGED
@@ -1,18 +1,34 @@
1
1
  {
2
2
  "name": "@sei-js/create-sei",
3
- "version": "1.0.1",
3
+ "version": "2.0.0",
4
+ "description": "Scaffold new Sei applications with pre-configured templates and tooling",
5
+ "homepage": "https://github.com/sei-protocol/sei-js/tree/main/packages/create-sei#readme",
4
6
  "repository": {
5
7
  "type": "git",
6
8
  "url": "https://github.com/sei-protocol/sei-js.git",
7
9
  "directory": "packages/create-sei"
8
10
  },
11
+ "license": "MIT",
9
12
  "module": "dist/main.js",
10
13
  "type": "module",
11
14
  "bin": "./dist/main.js",
15
+ "files": [
16
+ "dist"
17
+ ],
18
+ "publishConfig": {
19
+ "access": "public"
20
+ },
21
+ "exports": {
22
+ ".": {
23
+ "import": "./dist/main.js",
24
+ "default": "./dist/main.js"
25
+ }
26
+ },
12
27
  "scripts": {
13
- "build": "rm -rf dist && tsc && chmod +x dist/main.js && rsync -av --exclude-from=.rsyncignore ./templates/ ./dist/templates/ && rsync -av --exclude-from=.rsyncignore ./extensions/ ./dist/extensions/",
14
- "dev": "node --loader ts-node/esm src/main.ts",
15
- "test": "jest"
28
+ "build": "rm -rf dist && tsc --project ./tsconfig.json && chmod +x dist/main.js && rsync -av --exclude-from=.rsyncignore ./templates/ ./dist/templates/ && rsync -av --exclude-from=.rsyncignore ./extensions/ ./dist/extensions/",
29
+ "dev": "bun src/main.ts",
30
+ "test": "bun test --isolate src",
31
+ "test:release": "bun scripts/smoke-generated-app.ts"
16
32
  },
17
33
  "dependencies": {
18
34
  "boxen": "^7.1.1",
@@ -20,12 +36,7 @@
20
36
  "inquirer": "^9.2.15"
21
37
  },
22
38
  "devDependencies": {
23
- "@jest/globals": "^29.7.0",
24
- "@types/jest": "^29.5.12",
25
39
  "@types/node": "^20.14.10",
26
- "jest": "^29.7.0",
27
- "ts-jest": "^29.1.2",
28
- "ts-node": "^10.9.2",
29
40
  "typescript": "^5.5.3"
30
41
  }
31
42
  }
package/.rsyncignore DELETED
@@ -1,11 +0,0 @@
1
- node_modules/
2
- .next/
3
- dist/
4
- build/
5
- package-lock.json
6
- .git/
7
- .DS_Store
8
- *.log
9
- coverage/
10
- .nyc_output/
11
- .cache/