Hyperbloom Vault SDK

1. Installation

1.1 Installation for built-in

Install the package:

pnpm install @hyperbloom/vault-sdk

pnpm install viem wagmi

Add component:

"use client";
import { VaultsProvider } from "@hyperbloom/vault-sdk";

import { defineChain } from "viem";
import { http, createConfig } from "wagmi";
import { QueryClient } from "@tanstack/react-query";

export const Home = () => {
  const config = createConfig({
    chains: [
      defineChain({
        id: 999,
        name: "HyperEVM",
        network: "hyperevm",
        nativeCurrency: { name: "HYPE", symbol: "HYPE", decimals: 18 },
        rpcUrls: {
          default: { http: ["https://rpc.hyperliquid.xyz/evm"] },
        },
      }),
    ],
    transports: {
      [999]: http("https://rpc.hyperliquid.xyz/evm"),
    },
    ssr: true,
  });

  return (
    <VaultsProvider config={config}>
      <Vault/>
    </VaultsProvider>
  );
};

2. Usage

"use client";
import { useVaults } from "@hyperbloom/vault-sdk";
import { useVaultStats, useUserStats, useVaultsStats } from "@hyperbloom/vault-sdk";
import { useVaultsDeposit, useVaultsWithdraw } from "@hyperbloom/vault-sdk";

const Vault = () => {
  const {data: vaults } = useVaults();

  const { data: allVaults} = useVaultsStats();
  const { data: curentVault } = useVaultStats("hyperbloom-hybra-hype-lhype");
  const { data: user } = useUserStats("hyperbloom-hybra-hype-lhype", walletAddress);

  const { depositQuote, getDepositQuote, deposit } = useVaultsDeposit({
    vaultId: "hyperbloom-hybra-hype-lhype",
    tokenAmount1: 2, // 1 Hype
    tokenAmount2: 0.5, // 0.5 LHYPE
  });
  const handleDeposit = async () => {
    const quote = await getDepositQuote();
    console.log(depositQuote);
    // set user approve (depositQuote.data.allowances)

    const tx = await deposit();
  }

  const { withdrawQuote, getWithdrawQuote, withdraw } = useVaultsWithdraw({
    vaultId: "hyperbloom-hybra-hype-lhype",
    tokenAmount: 0.00001, // user.balance (useUserStats)
    userAddress: walletAddress,
  });
  const handleDeposit = async () => {
    const quote = await getWithdrawQuote();
    console.log(withdrawQuote);
    // set user approve (withdrawQuote.data.allowances)

    const tx = await withdraw();
  }
};

3. Structure

Structure image