create-stylus 0.0.5

package/templates/base/packages/nextjs/hooks/scaffold-eth/useWatchBalance.ts

@@ -0,0 +1,21 @@
+import { useEffect } from "react";
+import { useTargetNetwork } from "./useTargetNetwork";
+import { useQueryClient } from "@tanstack/react-query";
+import { UseBalanceParameters, useBalance, useBlockNumber } from "wagmi";
+
+/**
+ * Wrapper around wagmi's useBalance hook. Updates data on every block change.
+ */
+export const useWatchBalance = (useBalanceParameters: UseBalanceParameters) => {
+  const { targetNetwork } = useTargetNetwork();
+  const queryClient = useQueryClient();
+  const { data: blockNumber } = useBlockNumber({ watch: true, chainId: targetNetwork.id });
+  const { queryKey, ...restUseBalanceReturn } = useBalance(useBalanceParameters);
+
+  useEffect(() => {
+    queryClient.invalidateQueries({ queryKey });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [blockNumber]);
+
+  return restUseBalanceReturn;
+};

package/templates/base/packages/nextjs/icons/CompassIcon.tsx

@@ -0,0 +1,39 @@
+import React from "react";
+
+const CompassIcon = ({ width = 28, height = 28, className = "" }) => {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={width}
+      height={height}
+      viewBox="0 0 24 24"
+      fill="none"
+      className={className}
+    >
+      <g clipPath="url(#clip0_2148_341)">
+        <path
+          d="M12 0C5.373 0 0 5.373 0 12C0 18.627 5.373 24 12 24C18.627 24 24 18.6278 24 12C24 5.373 18.627 0 12 0ZM15.405 12.0007C15.405 13.8097 13.9897 15.276 12.2078 15.3855L8.08875 18.9412L7.5525 18.6307L8.9175 13.4272C8.70654 12.9812 8.59618 12.4942 8.59425 12.0007C8.59425 10.1917 10.0095 8.7255 11.7907 8.616L15.9113 5.06025L16.4475 5.36925L15.0825 10.5743C15.285 11.0092 15.4058 11.49 15.4058 12.0015L15.405 12.0007ZM10.452 12C10.452 12.4106 10.6151 12.8043 10.9054 13.0946C11.1957 13.3849 11.5894 13.548 12 13.548C12.4106 13.548 12.8043 13.3849 13.0946 13.0946C13.3849 12.8043 13.548 12.4106 13.548 12C13.548 11.5894 13.3849 11.1957 13.0946 10.9054C12.8043 10.6151 12.4106 10.452 12 10.452C11.5894 10.452 11.1957 10.6151 10.9054 10.9054C10.6151 11.1957 10.452 11.5894 10.452 12Z"
+          fill="url(#paint0_linear_2148_341)"
+        />
+      </g>
+      <defs>
+        <linearGradient
+          id="paint0_linear_2148_341"
+          x1="24"
+          y1="12"
+          x2="-2.07194"
+          y2="12"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#E3066E" />
+          <stop offset="1" stopColor="white" />
+        </linearGradient>
+        <clipPath id="clip0_2148_341">
+          <rect width="24" height="24" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+};
+
+export default CompassIcon;

package/templates/base/packages/nextjs/icons/DarkBugAntIcon.tsx

@@ -0,0 +1,30 @@
+import React from "react";
+
+const DarkBugAntIcon = ({ width = 26, height = 30, className = "" }) => {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={width}
+      height={height}
+      viewBox="0 0 26 30"
+      fill="none"
+      className={className}
+    >
+      <path
+        d="M13.0007 16.0776C14.6792 16.0776 16.3313 16.1925 17.9469 16.4179C19.4631 16.6275 20.6752 17.8049 20.6752 19.3082C20.6752 24.6609 17.2393 29 12.9993 29C8.75924 29 5.32482 24.6609 5.32482 19.3082C5.32482 17.8063 6.53835 16.6275 8.05306 16.4179C9.69215 16.1909 11.3454 16.0772 13.0007 16.0776ZM13.0007 16.0776C17.2159 16.0776 21.2571 16.807 25 18.1452C24.8235 21.1048 24.2573 24.0295 23.3157 26.8463M13.0007 16.0776C8.78556 16.0776 4.74438 16.807 1 18.1452C1.18276 21.1661 1.76028 24.0837 2.68578 26.8463M13.0007 16.0776C13.4456 16.0777 13.8858 15.9891 14.2949 15.8174C14.7039 15.6456 15.0732 15.3941 15.3804 15.0782C15.6877 14.7622 15.9264 14.3884 16.0824 13.9792C16.2383 13.57 16.308 13.1341 16.2875 12.6977M13.0007 16.0776C12.5559 16.0777 12.1156 15.9891 11.7066 15.8174C11.2976 15.6456 10.9283 15.3941 10.621 15.0782C10.3138 14.7622 10.075 14.3884 9.91911 13.9792C9.7632 13.57 9.69342 13.1341 9.71398 12.6977M16.2875 12.6977C16.2484 11.8675 15.885 11.0841 15.2729 10.5102C14.6607 9.93635 13.847 9.61623 13.0007 9.61638M16.2875 12.6977C18.884 12.4615 21.447 11.9404 23.9254 11.1441C23.845 9.52592 23.652 7.93646 23.3522 6.38578M9.71398 12.6977C9.7531 11.8675 10.1165 11.0841 10.7286 10.5102C11.3407 9.93635 12.1545 9.61623 13.0007 9.61638M9.71398 12.6977C7.07201 12.4564 4.5163 11.9281 2.07755 11.1441C2.15617 9.54687 2.34767 7.95693 2.65069 6.38578M13.0007 9.61638C14.4555 9.61638 15.8825 9.50151 17.2729 9.27752C17.8621 9.18276 18.3549 8.7635 18.4353 8.18343C18.5851 7.07324 18.3813 5.94474 17.8519 4.95282M13.0007 9.61638C11.546 9.61638 10.1204 9.50151 8.72854 9.27752C8.14079 9.18276 7.6466 8.7635 7.56619 8.18343C7.4116 7.07159 7.61615 5.94014 8.15102 4.94852M8.15102 4.94852C7.52825 4.54124 6.9608 4.05923 6.46232 3.51126C6.56467 2.60669 6.85708 1.75668 7.30155 1.00287M8.15102 4.94852C8.61646 4.08119 9.31421 3.35657 10.169 2.85008C11.0238 2.3436 12.0031 2.07592 13.0015 2.07592C13.9998 2.07592 14.9792 2.3436 15.8339 2.85008C16.6887 3.35657 17.3865 4.08263 17.8519 4.94995C18.4762 4.54361 19.0435 4.05974 19.5406 3.51556C19.4414 2.62879 19.1551 1.77205 18.6999 1"
+        stroke="url(#paint0_linear_2148_38)"
+        strokeWidth="1.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <defs>
+        <linearGradient id="paint0_linear_2148_38" x1="25" y1="15" x2="-1.07194" y2="15" gradientUnits="userSpaceOnUse">
+          <stop stopColor="#E3066E" />
+          <stop offset="1" stopColor="white" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+};
+
+export default DarkBugAntIcon;

package/templates/base/packages/nextjs/icons/LightBugAntIcon.tsx

@@ -0,0 +1,52 @@
+import React from "react";
+
+const LightBugAntIcon = ({ width = 26, height = 30, className = "" }) => {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={width}
+      height={height}
+      viewBox="0 0 26 30"
+      fill="none"
+      className={className}
+    >
+      <path
+        d="M13.0007 16.0776C14.6792 16.0776 16.3313 16.1925 17.9469 16.4179C19.4631 16.6275 20.6752 17.8049 20.6752 19.3082C20.6752 24.6609 17.2393 29 12.9993 29C8.75924 29 5.32482 24.6609 5.32482 19.3082C5.32482 17.8063 6.53835 16.6275 8.05306 16.4179C9.69215 16.1909 11.3454 16.0772 13.0007 16.0776ZM13.0007 16.0776C17.2159 16.0776 21.2571 16.807 25 18.1452C24.8235 21.1048 24.2573 24.0295 23.3157 26.8463M13.0007 16.0776C8.78556 16.0776 4.74438 16.807 1 18.1452C1.18276 21.1661 1.76028 24.0837 2.68578 26.8463M13.0007 16.0776C13.4456 16.0777 13.8858 15.9891 14.2949 15.8174C14.7039 15.6456 15.0732 15.3941 15.3804 15.0782C15.6877 14.7622 15.9264 14.3884 16.0824 13.9792C16.2383 13.57 16.308 13.1341 16.2875 12.6977M13.0007 16.0776C12.5559 16.0777 12.1156 15.9891 11.7066 15.8174C11.2976 15.6456 10.9283 15.3941 10.621 15.0782C10.3138 14.7622 10.075 14.3884 9.91911 13.9792C9.7632 13.57 9.69342 13.1341 9.71398 12.6977M13.0007 9.61638C14.4555 9.61638 15.8825 9.50151 17.2729 9.27752C17.8621 9.18276 18.3549 8.7635 18.4353 8.18343C18.5851 7.07324 18.3813 5.94474 17.8519 4.95282M13.0007 9.61638C11.546 9.61638 10.1204 9.50151 8.72854 9.27752C8.14079 9.18276 7.6466 8.7635 7.56619 8.18343C7.4116 7.07159 7.61615 5.94014 8.15102 4.94852M13.0007 9.61638C12.1545 9.61623 11.3407 9.93635 10.7286 10.5102C10.1165 11.0841 9.7531 11.8675 9.71398 12.6977M13.0007 9.61638C13.847 9.61623 14.6607 9.93635 15.2729 10.5102C15.885 11.0841 16.2484 11.8675 16.2875 12.6977M8.15102 4.94852C7.52825 4.54124 6.9608 4.05923 6.46232 3.51126C6.56467 2.60669 6.85708 1.75668 7.30155 1.00287M8.15102 4.94852C8.61646 4.08119 9.31421 3.35657 10.169 2.85008C11.0238 2.3436 12.0031 2.07592 13.0015 2.07592C13.9998 2.07592 14.9792 2.3436 15.8339 2.85008C16.6887 3.35657 17.3865 4.08263 17.8519 4.94995M17.8519 4.94995C18.4762 4.54361 19.0435 4.05974 19.5406 3.51556C19.4414 2.62879 19.1551 1.77205 18.6999 1M2.65069 6.38578C2.34767 7.95693 2.15617 9.54687 2.07755 11.1441C4.5163 11.9281 7.07201 12.4564 9.71398 12.6977M23.3522 6.38578C23.652 7.93646 23.845 9.52592 23.9254 11.1441C21.447 11.9404 18.884 12.4615 16.2875 12.6977"
+        fill="url(#paint0_linear_2148_348)"
+      />
+      <path
+        d="M13.0007 16.0776C14.6792 16.0776 16.3313 16.1925 17.9469 16.4179C19.4631 16.6275 20.6752 17.8049 20.6752 19.3082C20.6752 24.6609 17.2393 29 12.9993 29C8.75924 29 5.32482 24.6609 5.32482 19.3082C5.32482 17.8063 6.53835 16.6275 8.05306 16.4179C9.69215 16.1909 11.3454 16.0772 13.0007 16.0776ZM13.0007 16.0776C17.2159 16.0776 21.2571 16.807 25 18.1452C24.8235 21.1048 24.2573 24.0295 23.3157 26.8463M13.0007 16.0776C8.78556 16.0776 4.74438 16.807 1 18.1452C1.18276 21.1661 1.76028 24.0837 2.68578 26.8463M13.0007 16.0776C13.4456 16.0777 13.8858 15.9891 14.2949 15.8174C14.7039 15.6456 15.0732 15.3941 15.3804 15.0782C15.6877 14.7622 15.9264 14.3884 16.0824 13.9792C16.2383 13.57 16.308 13.1341 16.2875 12.6977M13.0007 16.0776C12.5559 16.0777 12.1156 15.9891 11.7066 15.8174C11.2976 15.6456 10.9283 15.3941 10.621 15.0782C10.3138 14.7622 10.075 14.3884 9.91911 13.9792C9.7632 13.57 9.69342 13.1341 9.71398 12.6977M16.2875 12.6977C16.2484 11.8675 15.885 11.0841 15.2729 10.5102C14.6607 9.93635 13.847 9.61623 13.0007 9.61638M16.2875 12.6977C18.884 12.4615 21.447 11.9404 23.9254 11.1441C23.845 9.52592 23.652 7.93646 23.3522 6.38578M9.71398 12.6977C9.7531 11.8675 10.1165 11.0841 10.7286 10.5102C11.3407 9.93635 12.1545 9.61623 13.0007 9.61638M9.71398 12.6977C7.07201 12.4564 4.5163 11.9281 2.07755 11.1441C2.15617 9.54687 2.34767 7.95693 2.65069 6.38578M13.0007 9.61638C14.4555 9.61638 15.8825 9.50151 17.2729 9.27752C17.8621 9.18276 18.3549 8.7635 18.4353 8.18343C18.5851 7.07324 18.3813 5.94474 17.8519 4.95282M13.0007 9.61638C11.546 9.61638 10.1204 9.50151 8.72854 9.27752C8.14079 9.18276 7.6466 8.7635 7.56619 8.18343C7.4116 7.07159 7.61615 5.94014 8.15102 4.94852M8.15102 4.94852C7.52825 4.54124 6.9608 4.05923 6.46232 3.51126C6.56467 2.60669 6.85708 1.75668 7.30155 1.00287M8.15102 4.94852C8.61646 4.08119 9.31421 3.35657 10.169 2.85008C11.0238 2.3436 12.0031 2.07592 13.0015 2.07592C13.9998 2.07592 14.9792 2.3436 15.8339 2.85008C16.6887 3.35657 17.3865 4.08263 17.8519 4.94995C18.4762 4.54361 19.0435 4.05974 19.5406 3.51556C19.4414 2.62879 19.1551 1.77205 18.6999 1"
+        stroke="url(#paint1_linear_2148_348)"
+        stroke-width="1.5"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+      />
+      <defs>
+        <linearGradient
+          id="paint0_linear_2148_348"
+          x1="25"
+          y1="15"
+          x2="-1.07194"
+          y2="15"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="#E3066E" />
+          <stop offset="1" stop-color="#203147" />
+        </linearGradient>
+        <linearGradient
+          id="paint1_linear_2148_348"
+          x1="25"
+          y1="15"
+          x2="-1.07194"
+          y2="15"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="#E3066E" />
+          <stop offset="1" stop-color="#203147" />
+        </linearGradient>
+      </defs>
+    </svg>
+  );
+};
+
+export default LightBugAntIcon;

package/templates/base/packages/nextjs/next-env.d.ts

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

package/templates/base/packages/nextjs/next.config.js

@@ -0,0 +1,19 @@
+// @ts-check
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+  typescript: {
+    ignoreBuildErrors: process.env.NEXT_PUBLIC_IGNORE_BUILD_ERROR === "true",
+  },
+  eslint: {
+    ignoreDuringBuilds: process.env.NEXT_PUBLIC_IGNORE_BUILD_ERROR === "true",
+  },
+  webpack: config => {
+    config.resolve.fallback = { fs: false, net: false, tls: false };
+    config.externals.push("pino-pretty", "lokijs", "encoding");
+    return config;
+  },
+};
+
+module.exports = nextConfig;

package/templates/base/packages/nextjs/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@ss/nextjs",
+  "private": true,
+  "version": "0.1.0",
+  "scripts": {
+    "dev": "next dev",
+    "start": "next dev",
+    "build": "next build",
+    "serve": "next start",
+    "lint": "next lint",
+    "format": "prettier --write . '!(node_modules|.next|contracts)/**/*'",
+    "check-types": "tsc --noEmit --incremental",
+    "vercel": "vercel",
+    "vercel:yolo": "vercel --build-env NEXT_PUBLIC_IGNORE_BUILD_ERROR=true"
+  },
+  "dependencies": {
+    "@ethersproject/providers": "^5.7.2",
+    "@heroicons/react": "^2.1.5",
+    "@rainbow-me/rainbowkit": "2.2.7",
+    "@tanstack/react-query": "^5.59.15",
+    "@uniswap/sdk-core": "^5.8.2",
+    "@uniswap/v2-sdk": "^4.6.1",
+    "blo": "^1.2.0",
+    "burner-connector": "0.0.16",
+    "daisyui": "4.5.0",
+    "kubo-rpc-client": "^5.0.2",
+    "next": "^15.2.3",
+    "next-nprogress-bar": "^2.3.13",
+    "next-themes": "^0.3.0",
+    "qrcode.react": "^4.0.1",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-hot-toast": "^2.4.0",
+    "usehooks-ts": "^3.1.0",
+    "viem": "2.31.1",
+    "wagmi": "2.15.6",
+    "zustand": "^5.0.0"
+  },
+  "devDependencies": {
+    "@tailwindcss/postcss": "latest",
+    "@trivago/prettier-plugin-sort-imports": "^4.3.0",
+    "@types/node": "^18.19.50",
+    "@types/react": "^19.0.7",
+    "abitype": "1.0.6",
+    "autoprefixer": "^10.4.12",
+    "bgipfs": "^0.0.12",
+    "eslint": "^9.23.0",
+    "eslint-config-next": "^15.2.3",
+    "eslint-config-prettier": "^10.1.1",
+    "eslint-plugin-prettier": "^5.2.4",
+    "postcss": "^8.4.45",
+    "prettier": "^3.5.3",
+    "tailwindcss": "^3.3.3",
+    "type-fest": "^4.26.1",
+    "typescript": "^5.8.2",
+    "vercel": "^39.1.3"
+  }
+}

package/templates/base/packages/nextjs/postcss.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};

package/templates/base/packages/nextjs/public/logo.svg

@@ -0,0 +1,8 @@
+<svg width="46" height="47" viewBox="0 0 46 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17.824 28.0332L22.4381 29.4512L20.3516 31.5377L20.1619 31.7275L16.9891 30.7552C13.9751 29.8302 11.7228 27.4522 10.9617 24.3934C10.2005 21.3347 11.0756 18.1787 13.3046 15.9498L25.7411 3.50818C25.7793 3.52497 25.8169 3.54379 25.8525 3.56516C25.8907 3.58398 25.9283 3.60535 25.9639 3.62469C26.028 3.65776 26.0896 3.69592 26.1537 3.73153C26.2153 3.76714 26.2768 3.80479 26.3389 3.8455C26.3888 3.87653 26.4361 3.90706 26.4834 3.94013C26.5307 3.97116 26.578 4.00423 26.6259 4.03985C26.6711 4.07088 26.7134 4.10395 26.7561 4.13702C26.7943 4.16297 26.8319 4.19401 26.8675 4.22453C26.9006 4.24845 26.9316 4.27439 26.9622 4.30289C26.9667 4.30543 26.9718 4.30746 26.9764 4.31255C27.1189 4.4311 27.2537 4.55422 27.3865 4.68701L27.9889 5.2894L15.3153 17.961C13.8001 19.4787 13.2048 21.6242 13.7218 23.7061C14.2387 25.788 15.7726 27.4049 17.824 28.0332Z" fill="#1A1A1A"/>
+<path d="M19.1825 23.8648L26.1583 25.731L23.8347 28.0546L18.4473 26.6127C16.9133 26.2047 15.7538 25.0452 15.3412 23.5112C14.9311 21.9773 15.3554 20.3929 16.4768 19.2716L29.2242 6.5242L31.2374 8.53743L18.49 21.2823C18.3333 21.441 18.2148 21.6211 18.1369 21.8206C18.0209 22.1243 18.0041 22.4535 18.0896 22.776C18.1064 22.8402 18.1278 22.9017 18.1537 22.9612C18.3364 23.4069 18.7088 23.7392 19.183 23.8648H19.1825Z" fill="#1A1A1A"/>
+<path d="M32.6961 31.0493L20.257 43.4909L18.5144 45.2334C17.9477 44.8875 17.419 44.4698 16.9377 43.9885L16.3353 43.3861L18.0118 41.7097L30.6854 29.0381C32.2031 27.5204 32.7983 25.3723 32.2789 23.293C31.7594 21.2111 30.228 19.5942 28.1766 18.9658L23.5645 17.5504L23.7543 17.3606L25.8408 15.2741L29.0135 16.2464C32.027 17.1714 34.2799 19.5494 35.041 22.6082C35.7996 25.6669 34.925 28.8229 32.6961 31.0493Z" fill="white"/>
+<path d="M29.5233 27.73L16.7785 40.4774L15.1021 42.1538L13.0888 40.1406L14.7653 38.4642L27.5126 25.7193C27.6714 25.558 27.7899 25.3779 27.8637 25.1785C27.9797 24.8748 27.9965 24.5456 27.911 24.225C27.8942 24.1609 27.8729 24.0994 27.8495 24.0399C27.6693 23.5942 27.2944 23.2619 26.8182 23.1342L19.8444 21.2706L20.0387 21.0762L21.9736 19.1414L22.168 18.947L27.5528 20.3838C29.0868 20.7964 30.2463 21.9559 30.6589 23.4878C31.069 25.0218 30.6447 26.6082 29.5233 27.73Z" fill="white"/>
+<path d="M43.6291 23.4995C43.6291 25.1571 42.984 26.715 41.8128 27.8862L27.3864 42.3125C26.2152 43.4837 24.6573 44.1289 22.9998 44.1289C22.9026 44.1289 22.8054 44.1263 22.7103 44.1218H22.6818C22.606 44.1172 22.5322 44.1121 22.4589 44.105C22.433 44.1024 22.4091 44.1004 22.3831 44.0978C22.3098 44.0907 22.2386 44.0836 22.1648 44.0719C22.1531 44.0719 22.1409 44.0693 22.1292 44.0673C22.0982 44.0648 22.0651 44.0602 22.0321 44.0556C21.9491 44.0414 21.8682 44.0271 21.7878 44.0129C21.7761 44.0083 21.7639 44.0058 21.7548 44.0058C21.6815 43.989 21.6077 43.9727 21.5365 43.9559C21.4678 43.9391 21.3991 43.9228 21.3305 43.9015C21.2831 43.8898 21.2379 43.8755 21.1931 43.8633C21.1127 43.8394 21.0318 43.8134 20.9535 43.7849C20.9295 43.7753 20.9061 43.7682 20.8822 43.759C20.8751 43.7565 20.8705 43.7544 20.8634 43.7519C20.7947 43.728 20.7281 43.702 20.6619 43.6735C20.6334 43.6639 20.6049 43.6496 20.5764 43.6379C20.4793 43.5952 20.3821 43.5524 20.2849 43.5051C20.2753 43.5005 20.2661 43.4955 20.2564 43.4909L32.6955 31.0493C34.9245 28.8228 35.7995 25.6669 35.0405 22.6081C34.2793 19.5494 32.0265 17.1709 29.013 16.2464L25.8403 15.2741L23.7538 17.3606L23.564 17.5504L28.176 18.9658C30.2269 19.5942 31.7588 21.211 32.2783 23.293C32.7978 25.3723 32.2025 27.5209 30.6848 29.0381L18.0112 41.7096L16.3348 43.3861L15.102 42.1533L16.7784 40.4769L29.5233 27.7295C30.6446 26.6081 31.0695 25.0218 30.6589 23.4873C30.2463 21.9554 29.0868 20.7959 27.5528 20.3833L22.1679 18.9465L21.9735 19.1408L20.0387 21.0757L19.8443 21.2701L26.8181 23.1337C27.2948 23.2619 27.6693 23.5936 27.8494 24.0393C27.8733 24.0989 27.8947 24.1604 27.911 24.2245C27.9964 24.5445 27.9797 24.8742 27.8637 25.178C27.7904 25.3769 27.6713 25.5575 27.5126 25.7188L14.7652 38.4637L4.18723 27.8857C3.01603 26.7145 2.3709 25.1566 2.3709 23.499C2.3709 21.8414 3.01603 20.2835 4.18723 19.1123L18.6136 4.68701C19.7848 3.5158 21.3427 2.87067 23.0003 2.87067C23.0974 2.87067 23.1946 2.87322 23.2898 2.8778H23.3182C23.418 2.88238 23.5172 2.89204 23.6169 2.90171C23.6973 2.90883 23.7782 2.9185 23.8565 2.9302C23.8708 2.9302 23.8825 2.93274 23.8947 2.93478C23.9257 2.93732 23.9542 2.9419 23.9822 2.94648C24.058 2.95818 24.1318 2.97243 24.205 2.98668C24.2193 2.98922 24.231 2.99125 24.2452 2.9938C24.3185 3.01059 24.3897 3.02687 24.4635 3.04366C24.5322 3.06045 24.6009 3.07673 24.6696 3.0981C24.7052 3.10776 24.7428 3.11692 24.7784 3.12913C24.8329 3.14592 24.8873 3.1622 24.9423 3.18154C25.0491 3.21715 25.158 3.2548 25.2623 3.29754C25.3167 3.31433 25.3691 3.3357 25.421 3.36164C25.4755 3.38301 25.5299 3.40692 25.5823 3.43287C25.6367 3.45678 25.6891 3.48273 25.741 3.50868L13.3045 15.9503C11.0756 18.1792 10.2005 21.3352 10.9616 24.3939C11.7227 27.4527 13.9751 29.8312 16.9891 30.7557L20.1618 31.728L20.3516 31.5382L22.4381 29.4517L17.824 28.0337C15.7731 27.4054 14.2386 25.788 13.7217 23.7066C13.2048 21.6247 13.8001 19.4787 15.3152 17.9615L27.9888 5.28991L29.2241 6.52521L16.4767 19.2726C15.3554 20.394 14.9306 21.9783 15.3411 23.5122C15.7538 25.0462 16.9133 26.2057 18.4472 26.6137L23.8347 28.0556L26.1582 25.732L19.1824 23.8658C18.7082 23.7402 18.3358 23.4084 18.1531 22.9623C18.1272 22.9027 18.1058 22.8412 18.089 22.7771C18.0036 22.4545 18.0204 22.1248 18.1364 21.8216C18.2147 21.6226 18.3333 21.442 18.4894 21.2833L31.2368 8.53844L41.8123 19.1139C42.9835 20.2851 43.6286 21.8429 43.6286 23.5005L43.6291 23.4995Z" fill="#213147"/>
+<path d="M43.4892 17.4344L32.9138 6.85897L30.9005 4.84574L29.0654 3.01059C28.5841 2.52929 28.0529 2.11209 27.4861 1.76561C26.1511 0.940377 24.61 0.499268 22.9997 0.499268C20.7092 0.499268 18.5561 1.39064 16.9367 3.01008L2.51081 17.4344C0.891376 19.0564 0 21.2095 0 23.5C0 25.7905 0.891376 27.9437 2.51081 29.5657L13.0888 40.1411L14.7652 38.4647L4.18723 27.8867C3.01603 26.7155 2.3709 25.1576 2.3709 23.5C2.3709 21.8424 3.01603 20.2846 4.18723 19.1134L18.6136 4.68701C19.7848 3.5158 21.3427 2.87067 23.0003 2.87067C23.0974 2.87067 23.1946 2.87322 23.2897 2.8778H23.3182C23.418 2.88238 23.5172 2.89204 23.6169 2.90171C23.6973 2.90883 23.7782 2.9185 23.8565 2.9302C23.8708 2.9302 23.8825 2.93275 23.8947 2.93478C23.9257 2.93732 23.9542 2.9419 23.9822 2.94648C24.058 2.95818 24.1318 2.97243 24.205 2.98668C24.2193 2.98922 24.231 2.99125 24.2452 2.9938C24.3185 3.01059 24.3897 3.02687 24.4635 3.04366C24.5322 3.06045 24.6009 3.07673 24.6695 3.0981C24.7052 3.10776 24.7428 3.11692 24.7784 3.12913C24.8329 3.14592 24.8873 3.1622 24.9423 3.18154C25.0491 3.21715 25.158 3.2548 25.2623 3.29754C25.3167 3.31433 25.3691 3.3357 25.421 3.36164C25.4755 3.38301 25.5299 3.40692 25.5823 3.43287C25.6367 3.45679 25.6891 3.48273 25.741 3.50868L13.3045 15.9503C11.0756 18.1792 10.2005 21.3352 10.9616 24.394C11.7227 27.4527 13.9751 29.8312 16.9891 30.7557L20.1618 31.728L20.3516 31.5382L22.4381 29.4517L17.824 28.0337C15.7731 27.4054 14.2386 25.788 13.7217 23.7066C13.2048 21.6247 13.8001 19.4787 15.3152 17.9615L27.9888 5.28991L27.972 5.27312L29.2241 6.52522L16.4767 19.2726C15.3554 20.394 14.9306 21.9783 15.3411 23.5122C15.7538 25.0462 16.9133 26.2057 18.4472 26.6137L23.8346 28.0556L26.1582 25.732L19.1824 23.8658C18.7082 23.7402 18.3358 23.4085 18.1531 22.9623C18.1272 22.9027 18.1058 22.8412 18.089 22.7771C18.0036 22.4545 18.0204 22.1248 18.1364 21.8216C18.2147 21.6226 18.3332 21.442 18.4894 21.2833L31.2368 8.53844L41.8123 19.1139C42.9835 20.2851 43.6286 21.8429 43.6286 23.5005C43.6286 25.1581 42.9835 26.716 41.8123 27.8872L27.3859 42.3136C26.2147 43.4848 24.6568 44.1299 22.9992 44.1299C22.9021 44.1299 22.8049 44.1274 22.7097 44.1228H22.6813C22.6054 44.1182 22.5317 44.1131 22.4584 44.106C22.4325 44.1034 22.4085 44.1014 22.3826 44.0989C22.3093 44.0917 22.2381 44.0846 22.1643 44.0729C22.1526 44.0729 22.1404 44.0704 22.1287 44.0683C22.0977 44.0658 22.0646 44.0612 22.0315 44.0566C21.9486 44.0424 21.8677 44.0281 21.7873 44.0139C21.7756 44.0093 21.7634 44.0068 21.7543 44.0068C21.681 43.99 21.6072 43.9737 21.536 43.9569C21.4673 43.9401 21.3986 43.9238 21.3299 43.9025C21.2826 43.8908 21.2373 43.8765 21.1926 43.8643C21.1122 43.8404 21.0313 43.8145 20.9529 43.786C20.929 43.7763 20.9056 43.7692 20.8817 43.76C20.8746 43.7575 20.87 43.7554 20.8629 43.7529C20.7942 43.729 20.7276 43.703 20.6614 43.6745C20.6329 43.6649 20.6044 43.6506 20.5759 43.6389C20.4788 43.5962 20.3816 43.5535 20.2844 43.5061C20.2747 43.5016 20.2656 43.4965 20.2559 43.4919L18.5134 45.2345C19.8484 46.0597 21.3895 46.5008 22.9997 46.5008C25.2903 46.5008 27.4434 45.6094 29.0654 43.99L43.4892 29.5662C45.1086 27.9442 46 25.7911 46 23.5005C46 21.21 45.1086 19.0569 43.4892 17.4349V17.4344Z" fill="#E3066E"/>
+</svg>

package/templates/base/packages/nextjs/public/manifest.json

@@ -0,0 +1,5 @@
+{
+  "name": "Scaffold-Stylus DApp",
+  "description": "A DApp built with Scaffold-Stylus",
+  "iconPath": "logo.svg"
+}

package/templates/base/packages/nextjs/react-copy-to-clipboard.d.ts

@@ -0,0 +1,44 @@
+/**
+ * TypeScript Declaration File for react-copy-to-clipboard
+ *
+ * This file provides TypeScript type definitions for the "react-copy-to-clipboard"
+ * npm package, which is a React component that allows users to copy text to their
+ * clipboard with a single click.
+ *
+ * Purpose:
+ * - Enables TypeScript support for the react-copy-to-clipboard library
+ * - Provides type safety when using the CopyToClipboard component
+ * - Defines the expected props and their types
+ *
+ * Usage in this project:
+ * - Used in components that need clipboard functionality (e.g., copying addresses,
+ *   transaction hashes, or other data to clipboard)
+ * - Common in blockchain/Web3 applications for sharing wallet addresses,
+ *   transaction IDs, or contract addresses
+ *
+ * Key interfaces:
+ * - Options: Configuration for the copy operation (debug mode, success message)
+ * - Props: Component props including text to copy, callback functions, and children
+ *
+ * The component wraps any child elements and makes them clickable to copy the
+ * specified text to the user's clipboard.
+ */
+
+declare module "react-copy-to-clipboard" {
+  import React from "react";
+
+  interface Options {
+    debug: boolean;
+    message: string;
+  }
+
+  interface Props {
+    text: string;
+    onCopy?(a: string, b: boolean): void;
+    options?: Options;
+    children?: ReactNode;
+  }
+
+  class CopyToClipboard extends React.Component<Props, object> {}
+  export default CopyToClipboard;
+}

package/templates/base/packages/nextjs/scaffold.config.ts

@@ -0,0 +1,56 @@
+// @ts-nocheck
+
+import { arbitrumNitro } from "./utils/scaffold-stylus/chain";
+import * as chains from "viem/chains";
+
+export type ScaffoldConfig = {
+  targetNetworks: readonly chains.Chain[];
+  pollingInterval: number;
+  alchemyApiKey: string;
+  rpcOverrides?: Record<number, string>;
+  walletConnectProjectId: string;
+  onlyLocalBurnerWallet: boolean;
+  walletAutoConnect: boolean;
+};
+
+export const DEFAULT_ALCHEMY_API_KEY = "oKxs-03sij-U_N0iOlrSsZFr29-IqbuF";
+
+const scaffoldConfig = {
+  // The networks on which your DApp is live
+  targetNetworks: [arbitrumNitro],
+
+  // The interval at which your front-end polls the RPC servers for new data
+  // it has no effect if you only target the local network (default is 4000)
+  pollingInterval: 30000,
+
+  // This is ours Alchemy's default API key.
+  // You can get your own at https://dashboard.alchemyapi.io
+  // It's recommended to store it in an env variable:
+  // .env.local for local testing, and in the Vercel/system env config for live apps.
+  alchemyApiKey: process.env.NEXT_PUBLIC_ALCHEMY_API_KEY || DEFAULT_ALCHEMY_API_KEY,
+
+  // If you want to use a different RPC for a specific network, you can add it here.
+  // The key is the chain ID, and the value is the HTTP RPC URL
+  rpcOverrides: {
+    // Example:
+    // [chains.mainnet.id]: "https://mainnet.buidlguidl.com",
+  },
+
+  // This is ours WalletConnect's default project ID.
+  // You can get your own at https://cloud.walletconnect.com
+  // It's recommended to store it in an env variable:
+  // .env.local for local testing, and in the Vercel/system env config for live apps.
+  walletConnectProjectId: process.env.NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID || "3a8170812b534d0ff9d794f19a901d64",
+
+  // Only show the Burner Wallet when running on nitro network
+  onlyLocalBurnerWallet: true,
+
+  /**
+   * Auto connect:
+   * 1. If the user was connected into a wallet before, on page reload reconnect automatically
+   * 2. If user is not connected to any wallet:  On reload, connect to burner wallet if burnerWallet.enabled is true && burnerWallet.onlyLocal is false
+   */
+  walletAutoConnect: true,
+} as const satisfies ScaffoldConfig;
+
+export default scaffoldConfig;

package/templates/base/packages/nextjs/services/store/store.ts

@@ -0,0 +1,39 @@
+import { create } from "zustand";
+import scaffoldConfig from "~~/scaffold.config";
+import { ChainWithAttributes, NETWORKS_EXTRA_DATA } from "~~/utils/scaffold-stylus";
+
+/**
+ * Zustand Store
+ *
+ * You can add global state to the app using this useGlobalState, to get & set
+ * values from anywhere in the app.
+ *
+ * Think about it as a global useState.
+ */
+
+type GlobalState = {
+  nativeCurrency: {
+    price: number;
+    isFetching: boolean;
+  };
+  setNativeCurrencyPrice: (newNativeCurrencyPriceState: number) => void;
+  setIsNativeCurrencyFetching: (newIsNativeCurrencyFetching: boolean) => void;
+  targetNetwork: ChainWithAttributes;
+  setTargetNetwork: (newTargetNetwork: ChainWithAttributes) => void;
+};
+
+export const useGlobalState = create<GlobalState>(set => ({
+  nativeCurrency: {
+    price: 0,
+    isFetching: true,
+  },
+  setNativeCurrencyPrice: (newValue: number): void =>
+    set(state => ({ nativeCurrency: { ...state.nativeCurrency, price: newValue } })),
+  setIsNativeCurrencyFetching: (newValue: boolean): void =>
+    set(state => ({ nativeCurrency: { ...state.nativeCurrency, isFetching: newValue } })),
+  targetNetwork: {
+    ...scaffoldConfig.targetNetworks[0],
+    ...NETWORKS_EXTRA_DATA[scaffoldConfig.targetNetworks[0].id],
+  },
+  setTargetNetwork: (newTargetNetwork: ChainWithAttributes) => set(() => ({ targetNetwork: newTargetNetwork })),
+}));

package/templates/base/packages/nextjs/services/web3/wagmiConfig.tsx

@@ -0,0 +1,44 @@
+import { wagmiConnectors } from "./wagmiConnectors";
+import { Chain, createClient, fallback, http } from "viem";
+import { mainnet } from "viem/chains";
+import { createConfig } from "wagmi";
+import scaffoldConfig, { DEFAULT_ALCHEMY_API_KEY, ScaffoldConfig } from "~~/scaffold.config";
+import { arbitrumNitro, getAlchemyHttpUrl } from "~~/utils/scaffold-stylus";
+
+const { targetNetworks } = scaffoldConfig;
+
+// We always want to have mainnet enabled (ENS resolution, ETH price, etc). But only once.
+export const enabledChains = targetNetworks.find((network: Chain) => network.id === 1)
+  ? targetNetworks
+  : ([...targetNetworks, mainnet] as const);
+
+export const wagmiConfig = createConfig({
+  chains: enabledChains,
+  connectors: wagmiConnectors,
+  ssr: true,
+  client({ chain }) {
+    let rpcFallbacks = [http()];
+
+    const rpcOverrideUrl = (scaffoldConfig.rpcOverrides as ScaffoldConfig["rpcOverrides"])?.[chain.id];
+    if (rpcOverrideUrl) {
+      rpcFallbacks = [http(rpcOverrideUrl), http()];
+    } else {
+      const alchemyHttpUrl = getAlchemyHttpUrl(chain.id);
+      if (alchemyHttpUrl) {
+        const isUsingDefaultKey = scaffoldConfig.alchemyApiKey === DEFAULT_ALCHEMY_API_KEY;
+        // If using default Scaffold-ETH 2 API key, we prioritize the default RPC
+        rpcFallbacks = isUsingDefaultKey ? [http(), http(alchemyHttpUrl)] : [http(alchemyHttpUrl), http()];
+      }
+    }
+
+    return createClient({
+      chain,
+      transport: fallback(rpcFallbacks),
+      ...(chain.id !== (arbitrumNitro as Chain).id
+        ? {
+            pollingInterval: scaffoldConfig.pollingInterval,
+          }
+        : {}),
+    });
+  },
+});

package/templates/base/packages/nextjs/services/web3/wagmiConnectors.tsx

@@ -0,0 +1,51 @@
+import { connectorsForWallets } from "@rainbow-me/rainbowkit";
+import {
+  braveWallet,
+  coinbaseWallet,
+  ledgerWallet,
+  metaMaskWallet,
+  rainbowWallet,
+  safeWallet,
+  walletConnectWallet,
+} from "@rainbow-me/rainbowkit/wallets";
+import { rainbowkitBurnerWallet } from "burner-connector";
+import * as chains from "viem/chains";
+import { arbitrumNitro } from "~~/utils/scaffold-stylus/chain";
+
+import scaffoldConfig from "~~/scaffold.config";
+
+const { onlyLocalBurnerWallet, targetNetworks } = scaffoldConfig;
+
+rainbowkitBurnerWallet.rpcUrls = {
+  [arbitrumNitro.id]: arbitrumNitro.rpcUrls.default.http[0],
+};
+
+const wallets = [
+  ...(!targetNetworks.some(network => network.id !== (arbitrumNitro as chains.Chain).id) || !onlyLocalBurnerWallet
+    ? [rainbowkitBurnerWallet]
+    : []),
+  braveWallet,
+  metaMaskWallet,
+  walletConnectWallet,
+  ledgerWallet,
+  coinbaseWallet,
+  rainbowWallet,
+  safeWallet,
+];
+
+/**
+ * wagmi connectors for the wagmi context
+ */
+export const wagmiConnectors = connectorsForWallets(
+  [
+    {
+      groupName: "Supported Wallets",
+      wallets,
+    },
+  ],
+
+  {
+    appName: "scaffold-stylus",
+    projectId: scaffoldConfig.walletConnectProjectId,
+  },
+);

package/templates/base/packages/nextjs/styles/globals.css

@@ -0,0 +1,80 @@
+@import "tailwindcss/base";
+@import "tailwindcss/components";
+@import "tailwindcss/utilities";
+
+:root,
+[data-theme] {
+  background: oklch(var(--b1));
+}
+
+body {
+  min-height: 100vh;
+}
+
+h1,
+h2,
+h3,
+h4 {
+  margin-bottom: 0.5rem;
+  line-height: 1;
+}
+
+p {
+  margin: 1rem 0;
+}
+
+.btn {
+  @apply shadow-md;
+}
+
+.btn.btn-ghost {
+  @apply shadow-none;
+}
+
+.bg-secondary {
+  background-image: linear-gradient(90deg, #203147 0%, #e3066e 100%) !important;
+  color: #fff;
+}
+
+.bg-secondary:hover,
+.hover\:bg-secondary:hover {
+  background-image: linear-gradient(90deg, #425b8c 0%, #ff4fa3 100%) !important;
+  color: #fff;
+}
+
+.border-round-color {
+  border-color: var(--round-color);
+}
+
+.gradient-border {
+  border: 1px solid transparent;
+  background:
+    linear-gradient(var(--bg-border), var(--bg-border)) padding-box,
+    linear-gradient(90deg, var(--gradient-start) 0%, var(--gradient-end) 100%) border-box;
+}
+
+.gradient-border-light {
+  border: 1px solid transparent;
+  background:
+    linear-gradient(white, white) padding-box,
+    linear-gradient(90deg, var(--gradient-start) 0%, var(--gradient-end) 100%) border-box;
+}
+
+.gradient-border-red {
+  border: 1px solid transparent;
+  background:
+    linear-gradient(180deg, #911048 0.23%, rgba(63, 2, 30, 0.46) 99.77%) padding-box,
+    linear-gradient(180deg, #e9257b 0%, #4a172e 100%) border-box;
+}
+
+.gradient-border-light-hover {
+  border: 1px solid transparent;
+  background:
+    linear-gradient(white, white) padding-box,
+    linear-gradient(90deg, var(--gradient-start) 0%, var(--gradient-end) 100%) border-box;
+}
+.gradient-border-light-hover:hover {
+  background:
+    linear-gradient(270deg, #e3066e 0%, #203147 108.63%) padding-box,
+    linear-gradient(90deg, var(--gradient-start) 0%, var(--gradient-end) 100%) border-box;
+}