:root {
  /* Colors */
  --gelato-text-primary: #010110;
  --gelato-dark-bg: #010110;
  --gelato-dark-bg-elevated: #22222a;
  --gelato-dark-text-primary: #FFEFE3;
}

.dark #search-bar-entry {
  background-color: var(--gelato-dark-bg-elevated);
}

/* Navbar CTA button */
#topbar-cta-button a span {
  background-color: var(--gelato-text-primary);
}

#topbar-cta-button a:hover * {
  opacity: 1;
}

#topbar-cta-button a svg {
  color: currentColor;
}

.dark #topbar-cta-button a span {
  color: var(--gelato-dark-bg);
  background-color: var(--gelato-dark-text-primary);
}

.dark #topbar-cta-button a {
  color: var(--gelato-dark-bg);
}
#navbar a[href='/migration-guides'] {
  display: none;
}

.mint-absolute {
    position: absolute
}
.mint-relative {
    position: relative
}
.mint-inset-0 {
    inset: 0px
}
.mint-mx-auto {
    margin-left: auto;
    margin-right: auto
}
.mint-mb-1 {
    margin-bottom: 0.25rem
}
.mint-mb-12 {
    margin-bottom: 3rem
}
.mint-mb-16 {
    margin-bottom: 4rem
}
.mint-mb-2 {
    margin-bottom: 0.5rem
}
.mint-mb-24 {
    margin-bottom: 6rem
}
.mint-mb-4 {
    margin-bottom: 1rem
}
.mint-mb-6 {
    margin-bottom: 1.5rem
}
.mint-mb-8 {
    margin-bottom: 2rem
}
.mint-mt-1 {
    margin-top: 0.25rem
}
.mint-mt-12 {
    margin-top: 3rem
}
.mint-mt-24 {
    margin-top: 6rem
}
.mint-mt-4 {
    margin-top: 1rem
}
.mint-inline-block {
    display: inline-block
}
.mint-flex {
    display: flex
}
.mint-inline-flex {
    display: inline-flex
}
.mint-grid {
    display: grid
}
.mint-h-3 {
    height: 0.75rem
}
.mint-h-5 {
    height: 1.25rem
}
.mint-h-full {
    height: 100%
}
.mint-w-3 {
    width: 0.75rem
}
.mint-w-5 {
    width: 1.25rem
}
.mint-w-full {
    width: 100%
}
.mint-max-w-3xl {
    max-width: 48rem
}
.mint-max-w-4xl {
    max-width: 56rem
}
.mint-max-w-7xl {
    max-width: 80rem
}
.mint-transform {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.mint-grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr))
}
.mint-flex-col {
    flex-direction: column
}
.mint-flex-wrap {
    flex-wrap: wrap
}
.mint-items-start {
    align-items: flex-start
}
.mint-items-center {
    align-items: center
}
.mint-justify-center {
    justify-content: center
}
.mint-gap-2 {
    gap: 0.5rem
}
.mint-gap-3 {
    gap: 0.75rem
}
.mint-gap-4 {
    gap: 1rem
}
.mint-gap-6 {
    gap: 1.5rem
}
.mint-gap-8 {
    gap: 2rem
}
.mint-space-y-3 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(0.75rem * var(--tw-space-y-reverse))
}
.mint-overflow-hidden {
    overflow: hidden
}
.mint-rounded-2xl {
    border-radius: 1rem
}
.mint-rounded-3xl {
    border-radius: 1.5rem
}
.mint-rounded-full {
    border-radius: 9999px
}
.mint-rounded-lg {
    border-radius: 0.5rem
}
.mint-rounded-xl {
    border-radius: 0.75rem
}
.mint-border {
    border-width: 1px
}
.mint-border-0 {
    border-width: 0px
}
.mint-border-2 {
    border-width: 2px
}
.mint-border-b {
    border-bottom-width: 1px
}
.mint-border-blue-500 {
    --tw-border-opacity: 1;
    border-color: rgb(59 130 246 / var(--tw-border-opacity))
}
.mint-border-gray-200 {
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235 / var(--tw-border-opacity))
}
.mint-border-gray-200\/50 {
    border-color: rgb(229 231 235 / 0.5)
}
.mint-border-gray-900 {
    --tw-border-opacity: 1;
    border-color: rgb(17 24 39 / var(--tw-border-opacity))
}
.mint-bg-\[\#28C840\] {
    --tw-bg-opacity: 1;
    background-color: rgb(40 200 64 / var(--tw-bg-opacity))
}
.mint-bg-\[\#FF5F57\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 95 87 / var(--tw-bg-opacity))
}
.mint-bg-\[\#FFBD2E\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 189 46 / var(--tw-bg-opacity))
}
.mint-bg-black {
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0 / var(--tw-bg-opacity))
}
.mint-bg-gray-100 {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity))
}
.mint-bg-gray-900 {
    --tw-bg-opacity: 1;
    background-color: rgb(17 24 39 / var(--tw-bg-opacity))
}
.mint-bg-transparent {
    background-color: transparent
}
.mint-bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity))
}
.mint-bg-gradient-to-r {
    background-image: linear-gradient(to right, var(--tw-gradient-stops))
}
.mint-from-gray-900\/5 {
    --tw-gradient-from: rgb(17 24 39 / 0.05) var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(17 24 39 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}
.mint-via-gray-900\/10 {
    --tw-gradient-to: rgb(17 24 39 / 0)  var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), rgb(17 24 39 / 0.1) var(--tw-gradient-via-position), var(--tw-gradient-to)
}
.mint-to-gray-900\/5 {
    --tw-gradient-to: rgb(17 24 39 / 0.05) var(--tw-gradient-to-position)
}
.mint-object-cover {
    object-fit: cover
}
.mint-p-4 {
    padding: 1rem
}
.mint-p-5 {
    padding: 1.25rem
}
.mint-p-6 {
    padding: 1.5rem
}
.mint-p-8 {
    padding: 2rem
}
.mint-px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem
}
.mint-px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem
}
.mint-py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem
}
.mint-text-center {
    text-align: center
}
.mint-text-2xl {
    font-size: 1.5rem;
    line-height: 2rem
}
.mint-text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem
}
.mint-text-6xl {
    font-size: 3.75rem;
    line-height: 1
}
.mint-text-base {
    font-size: 1rem;
    line-height: 1.5rem
}
.mint-text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem
}
.mint-text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem
}
.mint-text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem
}
.mint-font-bold {
    font-weight: 700
}
.mint-font-medium {
    font-weight: 500
}
.mint-font-normal {
    font-weight: 400
}
.mint-font-semibold {
    font-weight: 600
}
.mint-leading-\[1\.1\] {
    line-height: 1.1
}
.mint-leading-relaxed {
    line-height: 1.625
}
.mint-text-\[--text-primary-light\] {
    color: var(--text-primary-light)
}
.mint-text-blue-600 {
    --tw-text-opacity: 1;
    color: rgb(37 99 235 / var(--tw-text-opacity))
}
.mint-text-gray-400 {
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity))
}
.mint-text-gray-600 {
    --tw-text-opacity: 1;
    color: rgb(75 85 99 / var(--tw-text-opacity))
}
.mint-text-gray-900 {
    --tw-text-opacity: 1;
    color: rgb(17 24 39 / var(--tw-text-opacity))
}
.mint-text-white {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity))
}
.mint-placeholder-gray-400::placeholder {
    --tw-placeholder-opacity: 1;
    color: rgb(156 163 175 / var(--tw-placeholder-opacity))
}
.mint-shadow {
    --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}
.mint-outline-none {
    outline: 2px solid transparent;
    outline-offset: 2px
}
.mint-blur-xl {
    --tw-blur: blur(24px);
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}
.mint-backdrop-blur-sm {
    --tw-backdrop-blur: blur(4px);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)
}
.mint-transition-all {
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms
}
.mint-transition-colors {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms
}
.\[--text-primary-dark\:\#FFEFE3\] {
    --text-primary-dark: #FFEFE3
}
.\[--text-primary-light\:\#1A1A1A\] {
    --text-primary-light: #1A1A1A
}
.\[font-feature-settings\:\'calt_off\'\] {
    font-feature-settings: 'calt off'
}
.hover\:mint--translate-y-0:hover {
    --tw-translate-y: -0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.hover\:mint--translate-y-0\.5:hover {
    --tw-translate-y: -0.125rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.hover\:mint--translate-y-1:hover {
    --tw-translate-y: -0.25rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.hover\:mint-gap-3:hover {
    gap: 0.75rem
}
.hover\:mint-bg-gray-800:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(31 41 55 / var(--tw-bg-opacity))
}
.hover\:mint-bg-gray-900\/10:hover {
    background-color: rgb(17 24 39 / 0.1)
}
.hover\:mint-text-gray-900:hover {
    --tw-text-opacity: 1;
    color: rgb(17 24 39 / var(--tw-text-opacity))
}
.hover\:mint-shadow-lg:hover {
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}
.mint-group:hover .group-hover\:mint-gap-3 {
    gap: 0.75rem
}
.dark\:mint-border-\[--text-primary-dark\]:is(.dark *) {
    border-color: var(--text-primary-dark)
}
.dark\:mint-border-gray-800:is(.dark *) {
    --tw-border-opacity: 1;
    border-color: rgb(31 41 55 / var(--tw-border-opacity))
}
.dark\:mint-border-gray-800\/50:is(.dark *) {
    border-color: rgb(31 41 55 / 0.5)
}
.dark\:mint-bg-\[\#28C840\]:is(.dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(40 200 64 / var(--tw-bg-opacity))
}
.dark\:mint-bg-\[\#FF5F57\]:is(.dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(255 95 87 / var(--tw-bg-opacity))
}
.dark\:mint-bg-\[\#FFBD2E\]:is(.dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(255 189 46 / var(--tw-bg-opacity))
}
.dark\:mint-bg-\[--text-primary-dark\]:is(.dark *) {
    background-color: var(--text-primary-dark)
}
.dark\:mint-bg-black\/40:is(.dark *) {
    background-color: rgb(0 0 0 / 0.4)
}
.dark\:mint-bg-black\/60:is(.dark *) {
    background-color: rgb(0 0 0 / 0.6)
}
.dark\:mint-from-white\/5:is(.dark *) {
    --tw-gradient-from: rgb(255 255 255 / 0.05) var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}
.dark\:mint-via-white\/10:is(.dark *) {
    --tw-gradient-to: rgb(255 255 255 / 0)  var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), rgb(255 255 255 / 0.1) var(--tw-gradient-via-position), var(--tw-gradient-to)
}
.dark\:mint-to-white\/5:is(.dark *) {
    --tw-gradient-to: rgb(255 255 255 / 0.05) var(--tw-gradient-to-position)
}
.dark\:mint-text-\[--text-primary-dark\]:is(.dark *) {
    color: var(--text-primary-dark)
}
.dark\:mint-text-blue-400:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(96 165 250 / var(--tw-text-opacity))
}
.dark\:mint-text-gray-300:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(209 213 219 / var(--tw-text-opacity))
}
.dark\:mint-text-gray-400:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity))
}
.dark\:mint-text-gray-900:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(17 24 39 / var(--tw-text-opacity))
}
.dark\:mint-text-white:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity))
}
.dark\:hover\:mint-bg-\[\#FFE4D1\]:hover:is(.dark *) {
    --tw-bg-opacity: 1;
    background-color: rgb(255 228 209 / var(--tw-bg-opacity))
}
.dark\:hover\:mint-text-white:hover:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity))
}
@media (min-width: 640px) {
    .sm\:mint-h-48 {
        height: 12rem
    }
}
@media (min-width: 768px) {
    .md\:mint-h-56 {
        height: 14rem
    }
    .md\:mint-grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
    .md\:mint-grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

const { generatePrivateKey, privateKeyToAccount } = require("viem/accounts");

export default async function handler(req, res) {
  // Set CORS headers
  res.setHeader('Access-Control-Allow-Credentials', true);
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Methods', 'GET,OPTIONS,PATCH,DELETE,POST,PUT');
  res.setHeader(
    'Access-Control-Allow-Headers',
    'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version'
  );

  // Handle preflight request
  if (req.method === 'OPTIONS') {
    res.status(200).end();
    return;
  }

  if (req.method !== "POST")
    return res.status(405).json({ error: "Only POST allowed" });

  try {
    const privateKey = generatePrivateKey();
    const account = privateKeyToAccount(privateKey);
    res.status(200).json({ privateKey, address: account.address });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
}


const { createPublicClient, http } = require("viem");
const { privateKeyToAccount } = require("viem/accounts");
const { baseSepolia } = require("viem/chains");
const { gelato } = require("@gelatonetwork/smartwallet/accounts");

const usdcContract = {
  address: "0x036CbD53842c5426634e7929541eC2318f3dCF7e",
  abi: [
    {
      name: "balanceOf",
      type: "function",
      stateMutability: "view",
      inputs: [{ name: "account", type: "address" }],
      outputs: [{ name: "", type: "uint256" }],
    },
  ],
};

export default async function handler(req, res) {
  // Set CORS headers
  res.setHeader('Access-Control-Allow-Credentials', true);
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Methods', 'GET,OPTIONS,PATCH,DELETE,POST,PUT');
  res.setHeader(
    'Access-Control-Allow-Headers',
    'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version'
  );

  // Handle preflight request
  if (req.method === 'OPTIONS') {
    res.status(200).end();
    return;
  }

  if (req.method !== "POST")
    return res.status(405).json({ error: "Only POST allowed" });

  try {
    const privateKey = req.body.privateKey;
    const signer = privateKeyToAccount(privateKey);

    const publicClient = createPublicClient({
      chain: baseSepolia,
      transport: http(),
    });

    const account = await gelato({
      owner: signer,
      client: publicClient,
    });


    const balance = await publicClient.readContract({
      address: usdcContract.address,
      abi: usdcContract.abi,
      functionName: "balanceOf",
      args: [account.address],
    });

    res.status(200).json({ balance: Number(balance) / 1e6 });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
}


const { createPublicClient, http, formatEther } = require("viem");
const { privateKeyToAccount } = require("viem/accounts");
const { baseSepolia } = require("viem/chains");

export default async function handler(req, res) {
  // Set CORS headers
  res.setHeader('Access-Control-Allow-Credentials', true);
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Methods', 'GET,OPTIONS,PATCH,DELETE,POST,PUT');
  res.setHeader(
    'Access-Control-Allow-Headers',
    'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version'
  );

  // Handle preflight request
  if (req.method === 'OPTIONS') {
    res.status(200).end();
    return;
  }

  if (req.method !== "POST")
    return res.status(405).json({ error: "Only POST allowed" });

  try {
    const privateKey = req.body.privateKey;
    const account = privateKeyToAccount(privateKey);

    const publicClient = createPublicClient({
      chain: baseSepolia,
      transport: http(),
    });

    const balance = await publicClient.getBalance({ address: account.address });
    res.status(200).json({ balance: formatEther(balance) });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
}


const { createWalletClient, createPublicClient, http, zeroAddress } = require("viem");
const { privateKeyToAccount } = require("viem/accounts");
const { baseSepolia } = require("viem/chains");
const {
  createGelatoSmartWalletClient,
  erc20,
} = require("@gelatonetwork/smartwallet");
const { gelato } = require("@gelatonetwork/smartwallet/accounts");

export default async function handler(req, res) {
  // Set CORS headers
  res.setHeader('Access-Control-Allow-Credentials', true);
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Methods', 'GET,OPTIONS,PATCH,DELETE,POST,PUT');
  res.setHeader(
    'Access-Control-Allow-Headers',
    'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version'
  );

  // Handle preflight request
  if (req.method === 'OPTIONS') {
    res.status(200).end();
    return;
  }

  if (req.method !== "POST")
    return res.status(405).json({ error: "Only POST allowed" });

  try {
    const privateKey = req.body.privateKey;
    const sponsorApiKey = process.env.SPONSOR_API_KEY;

    const signer = privateKeyToAccount(privateKey);
    const publicClient = createPublicClient({
      chain: baseSepolia,
      transport: http(),
    });
    const account = await gelato({
      owner: signer,
      client: publicClient,
    })
    const client = createWalletClient({
      account,
      chain: baseSepolia,
      transport: http(),
    });

    const tokenAddress = "0x036CbD53842c5426634e7929541eC2318f3dCF7e";

    const smartWalletClient = await createGelatoSmartWalletClient(client, {
      apiKey: sponsorApiKey,
    });

    const response = await smartWalletClient.execute({
      payment: erc20(tokenAddress),
      calls: [{ to: zeroAddress, data: "0x", value: 0n }],
    });

    const txHash = await response.wait();

    res.status(200).json({ gelatoId: response.id, txHash });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
}


const { createWalletClient, createPublicClient, http, zeroAddress } = require("viem");
const { privateKeyToAccount } = require("viem/accounts");
const { baseSepolia } = require("viem/chains");
const {
  createGelatoSmartWalletClient,
  native,
} = require("@gelatonetwork/smartwallet");
const { gelato } = require("@gelatonetwork/smartwallet/accounts");

export default async function handler(req, res) {
  // Set CORS headers
  res.setHeader('Access-Control-Allow-Credentials', true);
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Methods', 'GET,OPTIONS,PATCH,DELETE,POST,PUT');
  res.setHeader(
    'Access-Control-Allow-Headers',
    'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version'
  );

  // Handle preflight request
  if (req.method === 'OPTIONS') {
    res.status(200).end();
    return;
  }

  if (req.method !== "POST")
    return res.status(405).json({ error: "Only POST allowed" });

  try {
    const privateKey = req.body.privateKey;
    const sponsorApiKey = process.env.SPONSOR_API_KEY;

    const signer = privateKeyToAccount(privateKey);
    const publicClient = createPublicClient({
      chain: baseSepolia,
      transport: http(),
    });

    const account = await gelato({
      owner: signer,
      client: publicClient,
    });

    const client = createWalletClient({
      account,
      chain: baseSepolia,
      transport: http(),
    });

    const smartWalletClient = await createGelatoSmartWalletClient(client, {
      apiKey: sponsorApiKey,
    });

    const response = await smartWalletClient.execute({
      payment: native(),
      calls: [{ to: zeroAddress, data: "0x", value: 0n }],
    });

    const txHash = await response.wait();

    res.status(200).json({ gelatoId: response.id, txHash });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
}


const { createWalletClient, createPublicClient, http, zeroAddress } = require("viem");
const { privateKeyToAccount } = require("viem/accounts");
const { baseSepolia } = require("viem/chains");
const {
  createGelatoSmartWalletClient,
  sponsored,
} = require("@gelatonetwork/smartwallet");
const { gelato } = require("@gelatonetwork/smartwallet/accounts");

export default async function handler(req, res) {
  // Set CORS headers
  res.setHeader('Access-Control-Allow-Credentials', true);
  res.setHeader('Access-Control-Allow-Origin', '*');
  res.setHeader('Access-Control-Allow-Methods', 'GET,OPTIONS,PATCH,DELETE,POST,PUT');
  res.setHeader(
    'Access-Control-Allow-Headers',
    'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version'
  );

  // Handle preflight request
  if (req.method === 'OPTIONS') {
    res.status(200).end();
    return;
  }

  if (req.method !== "POST")
    return res.status(405).json({ error: "Only POST allowed" });

  try {
    const privateKey = req.body.privateKey;
    const sponsorApiKey = process.env.SPONSOR_API_KEY;

    const signer = privateKeyToAccount(privateKey);
    const publicClient = createPublicClient({
      chain: baseSepolia,
      transport: http(),
    });

    const account = await gelato({
      owner: signer,
      client: publicClient,
    });

    const client = createWalletClient({
      account,
      chain: baseSepolia,
      transport: http(),
    });

    const smartWalletClient = await createGelatoSmartWalletClient(client, {
      apiKey: sponsorApiKey,
    });

    const response = await smartWalletClient.execute({
      payment: sponsored(sponsorApiKey),
      calls: [{ to: zeroAddress, data: "0x", value: 0n }],
    });

    const txHash = await response.wait();

    res.status(200).json({ gelatoId: response.id, txHash });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
}


Explore our API & SDK references, demos, and guides for building onchain apps.

Gelato Developer Docs

Gelato

Migration Guides

Overview

Understanding EIP-7702

Understanding ERC-4337

EIP-7702 vs ERC-4337

Learn how to create and manage a Sponsor API Key for gas sponsorship

Create a Sponsor API Key

Sponsor Gas for your users

Pay Gas with ERC-20 Tokens

Pay Gas with Native Tokens

Learn how to estimate gas costs for transactions using the Smart Wallet SDK

Estimate Gas Costs

Applied Use Cases: Morpho Demo

Learn how to create and manage a Dynamic Environment ID for wallet providers

Create Dynamic's Environment ID

Learn how to integrate Dynamic or Privy as wallet providers with the Gelato Smart Wallets React SDK

Use Dynamic or Privy Signers

Introduction to Gelato Bundler

Quick Start

Track your UserOp Request

Retrieves wallet capabilities and supported configurations for specified chain IDs.

wallet_getCapabilities

Prepares calls for smart wallet execution with specified capabilities.

wallet_prepareCalls

Sends prepared calls for smart wallet execution with signature and context.

wallet_sendPreparedCalls

Returns the `chainId` of the network the bundler is serving.

eth_chainId

Sends a `UserOperation` to the specified network.

eth_sendUserOperation

Returns estimated gas values for a `UserOperation`.

eth_estimateUserOperationGas

Returns a `UserOperation` given a `userOpHash`.

eth_getUserOperationByHash

Returns a `UserOperationReceipt` given a `userOpHash`.

eth_getUserOperationReceipt

Returns an estimated priority fee per gas.

eth_maxPriorityFeePerGas

Returns an array of `EntryPoint` addresses supported by the bundler.

eth_supportedEntryPoints

Returns an estimated gas price for a `UserOperation`.

eth_getUserOperationGasPrice

Demo

Gelato Smart Wallet SDK is currently supported on the following networks

Supported Networks

Introduction

ABC Stack

Arbitrum Orbit

OP Stack

Deploy your own rollup

Learn how to run an Arbitrum Orbit node on your local machine

Run a Full Orbit Node

Learn how to build and run an op-node from source

Run OP Node

Run a Verifier Node

Celestia

Avail

EigenDA

Custom Gas Token

Public Testnet

Verifier Node Package

Gelato Services

Data Indexers

Block Explorers

Oracles

Bridges

Account Abstraction

On & Off-ramp

Community

Identity & KYC

Others

Get a Private RPC

Calculate Compute Units

Pricing & Plans

Trigger Types

Typescript Functions

Solidity Functions

Automated Transactions

Dedicated msg.sender

Test & Deploy Typescript Functions

Write Solidity Functions

Test & Deploy Solidity Functions

Initiate an Automated Transaction

Templates & Use Cases

Analytics & Monitoring

Subscriptions & Payments

What is Relaying?

Essential reading to safeguard your contracts

Make sure your contracts are not affected by the recently disclosed vulnerability

Gelato Developer Docs

Featured Products

Smart Wallet SDK

Rollup as a Service

Powerful Features

Smart Contract Automation

Gasless Transactions

Custom Rollups

Verifiable Randomness

Enterprise RPC Nodes

Price Feeds & Oracles

How-Tos Videos

Quick Start Guides

Smart Wallets

Rollup as a Service

Web3 Functions