@growae/reactive-react 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025-present Growae
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@growae/reactive-react",
+  "version": "0.0.1",
+  "type": "module",
+  "main": "dist/esm/exports/index.js",
+  "types": "dist/types/exports/index.d.ts",
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "types": "./dist/types/exports/index.d.ts",
+      "default": "./dist/esm/exports/index.js"
+    },
+    "./query": {
+      "types": "./dist/types/exports/query.d.ts",
+      "default": "./dist/esm/exports/query.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "dependencies": {
+    "use-sync-external-store": "^1.4.0",
+    "@growae/reactive": "0.0.1"
+  },
+  "peerDependencies": {
+    "@tanstack/react-query": ">=5.0.0",
+    "react": ">=18.0.0",
+    "typescript": ">=5.7.0"
+  },
+  "peerDependenciesMeta": {
+    "typescript": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@tanstack/react-query": "^5.95.2",
+    "@testing-library/react": "^16.3.2",
+    "@types/react": "^19.2.14",
+    "jsdom": "^29.0.1",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4"
+  },
+  "scripts": {
+    "build": "tsc --project tsconfig.build.json --outDir ./dist/esm --declaration --declarationMap --declarationDir ./dist/types",
+    "clean": "rm -rf dist",
+    "check:types": "tsc --noEmit",
+    "dev": "tsc --project tsconfig.build.json --outDir ./dist/esm --declaration --declarationMap --declarationDir ./dist/types --watch"
+  }
+}

package/src/context.test.ts

@@ -0,0 +1,52 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi } from 'vitest'
+
+vi.mock('@aeternity/aepp-sdk', () => ({
+  Node: vi.fn().mockImplementation(() => ({})),
+}))
+
+import { createElement, useContext } from 'react'
+import { render, renderHook } from '@testing-library/react'
+import { ReactiveProvider, ReactiveContext } from './context.js'
+import { createConfig } from '@growae/reactive'
+import { testnet } from '@growae/reactive'
+import { mock } from '@growae/reactive'
+
+const TEST_ACCOUNTS = [
+  'ak_2swhLkgBPeeADxVTABy7tt6d2HgBQFnGJELkBUMY4FUa8RVLM',
+] as const
+
+function createTestConfig() {
+  return createConfig({
+    networks: [testnet],
+    connectors: [mock({ accounts: [...TEST_ACCOUNTS] })],
+    storage: null,
+  })
+}
+
+describe('ReactiveProvider', () => {
+  it('should render children', () => {
+    const config = createTestConfig()
+    const { container } = render(
+      createElement(
+        ReactiveProvider,
+        { config, reconnectOnMount: false },
+        createElement('div', null, 'Hello'),
+      ),
+    )
+    expect(container.textContent).toBe('Hello')
+  })
+
+  it('should provide config via context', () => {
+    const config = createTestConfig()
+    const { result } = renderHook(() => useContext(ReactiveContext), {
+      wrapper: ({ children }) =>
+        createElement(
+          ReactiveProvider,
+          { config, reconnectOnMount: false },
+          children,
+        ),
+    })
+    expect(result.current).toBe(config)
+  })
+})

package/src/context.ts

@@ -0,0 +1,25 @@
+'use client'
+
+import type { Config, State } from '@growae/reactive'
+import { createContext, createElement, type ReactNode } from 'react'
+import { Hydrate } from './hydrate.js'
+
+export const ReactiveContext = createContext<Config | undefined>(undefined)
+
+export type ReactiveProviderProps = {
+  config: Config
+  initialState?: State | undefined
+  reconnectOnMount?: boolean | undefined
+}
+
+export function ReactiveProvider(
+  parameters: React.PropsWithChildren<ReactiveProviderProps>,
+) {
+  const { children, config } = parameters
+  const props = { value: config }
+  return createElement(
+    Hydrate,
+    parameters,
+    createElement(ReactiveContext.Provider, props, children),
+  )
+}

package/src/errors/base.ts

@@ -0,0 +1,8 @@
+'use client'
+
+import { BaseError as CoreError } from '@growae/reactive'
+
+export type BaseErrorType = BaseError & { name: 'ReactiveError' }
+export class BaseError extends CoreError {
+  override name = 'ReactiveError'
+}

package/src/errors/context.ts

@@ -0,0 +1,12 @@
+import { BaseError } from './base.js'
+
+export type ReactiveProviderNotFoundErrorType =
+  ReactiveProviderNotFoundError & {
+    name: 'ReactiveProviderNotFoundError'
+  }
+export class ReactiveProviderNotFoundError extends BaseError {
+  override name = 'ReactiveProviderNotFoundError'
+  constructor() {
+    super('`useConfig` must be used within `ReactiveProvider`.')
+  }
+}

package/src/errors/index.ts

@@ -0,0 +1,5 @@
+export { BaseError, type BaseErrorType } from './base.js'
+export {
+  ReactiveProviderNotFoundError,
+  type ReactiveProviderNotFoundErrorType,
+} from './context.js'

package/src/exports/index.ts

@@ -0,0 +1,230 @@
+////////////////////////////////////////////////////////////////////////////////
+// Context
+////////////////////////////////////////////////////////////////////////////////
+
+export {
+  ReactiveContext,
+  ReactiveProvider,
+  type ReactiveProviderProps,
+} from '../context.js'
+
+////////////////////////////////////////////////////////////////////////////////
+// Errors
+////////////////////////////////////////////////////////////////////////////////
+
+export { BaseError, type BaseErrorType } from '../errors/base.js'
+export {
+  ReactiveProviderNotFoundError,
+  type ReactiveProviderNotFoundErrorType,
+} from '../errors/context.js'
+
+////////////////////////////////////////////////////////////////////////////////
+// Hydrate
+////////////////////////////////////////////////////////////////////////////////
+
+export {
+  Hydrate,
+  type HydrateProps,
+} from '../hydrate.js'
+
+////////////////////////////////////////////////////////////////////////////////
+// Hooks
+////////////////////////////////////////////////////////////////////////////////
+
+export {
+  // Connection
+  useConfig,
+  type UseConfigParameters,
+  type UseConfigReturnType,
+  useConnect,
+  type UseConnectParameters,
+  type UseConnectReturnType,
+  useDisconnect,
+  type UseDisconnectParameters,
+  type UseDisconnectReturnType,
+  useReconnect,
+  type UseReconnectParameters,
+  type UseReconnectReturnType,
+  useConnection,
+  type UseConnectionParameters,
+  type UseConnectionReturnType,
+  useConnections,
+  type UseConnectionsParameters,
+  type UseConnectionsReturnType,
+  useConnectors,
+  type UseConnectorsParameters,
+  type UseConnectorsReturnType,
+  useNetworkId,
+  type UseNetworkIdParameters,
+  type UseNetworkIdReturnType,
+  useNetworks,
+  type UseNetworksParameters,
+  type UseNetworksReturnType,
+  useSwitchNetwork,
+  type UseSwitchNetworkParameters,
+  type UseSwitchNetworkReturnType,
+  useNodeClient,
+  type UseNodeClientParameters,
+  type UseNodeClientReturnType,
+  useConnectorClient,
+  type UseConnectorClientParameters,
+  type UseConnectorClientReturnType,
+
+  // Chain reads
+  useBalance,
+  type UseBalanceParameters,
+  type UseBalanceReturnType,
+  useHeight,
+  type UseHeightParameters,
+  type UseHeightReturnType,
+  useAccount,
+  type UseAccountParameters,
+  type UseAccountReturnType,
+  useBlock,
+  type UseBlockParameters,
+  type UseBlockReturnType,
+  useTransaction,
+  type UseTransactionParameters,
+  type UseTransactionReturnType,
+  useTransactionCount,
+  type UseTransactionCountParameters,
+  type UseTransactionCountReturnType,
+  useWaitForTransaction,
+  type UseWaitForTransactionParameters,
+  type UseWaitForTransactionReturnType,
+  useContractBytecode,
+  type UseContractBytecodeParameters,
+  type UseContractBytecodeReturnType,
+  useEstimateGas,
+  type UseEstimateGasParameters,
+  type UseEstimateGasReturnType,
+
+  // Transactions
+  useSendTransaction,
+  type UseSendTransactionParameters,
+  type UseSendTransactionReturnType,
+  useSpend,
+  type UseSpendParameters,
+  type UseSpendReturnType,
+  usePayForTransaction,
+  type UsePayForTransactionParameters,
+  type UsePayForTransactionReturnType,
+
+  // Signing
+  useSignMessage,
+  type UseSignMessageParameters,
+  type UseSignMessageReturnType,
+  useSignTypedData,
+  type UseSignTypedDataParameters,
+  type UseSignTypedDataReturnType,
+  useSignTransaction,
+  type UseSignTransactionParameters,
+  type UseSignTransactionReturnType,
+  useVerifyMessage,
+  type UseVerifyMessageParameters,
+  type UseVerifyMessageReturnType,
+  useVerifyTypedData,
+  type UseVerifyTypedDataParameters,
+  type UseVerifyTypedDataReturnType,
+
+  // Contracts
+  useDeployContract,
+  type UseDeployContractParameters,
+  type UseDeployContractReturnType,
+  useCallContract,
+  type UseCallContractParameters,
+  type UseCallContractReturnType,
+  useReadContract,
+  type UseReadContractParameters,
+  type UseReadContractReturnType,
+  useReadContracts,
+  type UseReadContractsParameters,
+  type UseReadContractsReturnType,
+  useSimulateContract,
+  type UseSimulateContractParameters,
+  type UseSimulateContractReturnType,
+  useContractEvents,
+  type UseContractEventsParameters,
+  type UseContractEventsReturnType,
+
+  // AENS
+  usePreclaimName,
+  type UsePreclaimNameParameters,
+  type UsePreclaimNameReturnType,
+  useClaimName,
+  type UseClaimNameParameters,
+  type UseClaimNameReturnType,
+  useUpdateName,
+  type UseUpdateNameParameters,
+  type UseUpdateNameReturnType,
+  useTransferName,
+  type UseTransferNameParameters,
+  type UseTransferNameReturnType,
+  useRevokeName,
+  type UseRevokeNameParameters,
+  type UseRevokeNameReturnType,
+  useResolveName,
+  type UseResolveNameParameters,
+  type UseResolveNameReturnType,
+
+  // Oracles
+  useRegisterOracle,
+  type UseRegisterOracleParameters,
+  type UseRegisterOracleReturnType,
+  useQueryOracle,
+  type UseQueryOracleParameters,
+  type UseQueryOracleReturnType,
+  useRespondToQuery,
+  type UseRespondToQueryParameters,
+  type UseRespondToQueryReturnType,
+  useOracleState,
+  type UseOracleStateParameters,
+  type UseOracleStateReturnType,
+  useOracleQueries,
+  type UseOracleQueriesParameters,
+  type UseOracleQueriesReturnType,
+
+  // Channels
+  useOpenChannel,
+  type UseOpenChannelParameters,
+  type UseOpenChannelReturnType,
+  useCloseChannel,
+  type UseCloseChannelParameters,
+  type UseCloseChannelReturnType,
+  useChannelDeposit,
+  type UseChannelDepositParameters,
+  type UseChannelDepositReturnType,
+
+  // Watchers
+  useWatchHeight,
+  type UseWatchHeightParameters,
+  type UseWatchHeightReturnType,
+  useWatchConnection,
+  type UseWatchConnectionParameters,
+  type UseWatchConnectionReturnType,
+  useWatchConnectors,
+  type UseWatchConnectorsParameters,
+  type UseWatchConnectorsReturnType,
+} from '../hooks/index.js'
+
+////////////////////////////////////////////////////////////////////////////////
+// @growae/reactive re-exports
+////////////////////////////////////////////////////////////////////////////////
+
+export {
+  createConfig,
+  createStorage,
+  mainnet,
+  testnet,
+  toAe,
+  toAettos,
+  formatAmount,
+} from '@growae/reactive'
+
+export type {
+  Config,
+  Network,
+  State,
+  Connection,
+  Connector,
+} from '@growae/reactive'

package/src/exports/query.ts

@@ -0,0 +1,12 @@
+// Re-export core query utilities
+export { hashFn } from '@growae/reactive/query'
+
+// Re-export React query wrappers
+export {
+  useQuery,
+  useMutation,
+  type UseQueryParameters,
+  type UseQueryReturnType,
+  type UseMutationParameters,
+  type UseMutationReturnType,
+} from '../utils/query.js'

package/src/hooks/index.ts

@@ -0,0 +1,69 @@
+// Connection hooks
+export { useConfig, type UseConfigParameters, type UseConfigReturnType } from './useConfig.js'
+export { useConnect, type UseConnectParameters, type UseConnectReturnType } from './useConnect.js'
+export { useDisconnect, type UseDisconnectParameters, type UseDisconnectReturnType } from './useDisconnect.js'
+export { useReconnect, type UseReconnectParameters, type UseReconnectReturnType } from './useReconnect.js'
+export { useConnection, type UseConnectionParameters, type UseConnectionReturnType } from './useConnection.js'
+export { useConnections, type UseConnectionsParameters, type UseConnectionsReturnType } from './useConnections.js'
+export { useConnectors, type UseConnectorsParameters, type UseConnectorsReturnType } from './useConnectors.js'
+export { useNetworkId, type UseNetworkIdParameters, type UseNetworkIdReturnType } from './useNetworkId.js'
+export { useNetworks, type UseNetworksParameters, type UseNetworksReturnType } from './useNetworks.js'
+export { useSwitchNetwork, type UseSwitchNetworkParameters, type UseSwitchNetworkReturnType } from './useSwitchNetwork.js'
+export { useNodeClient, type UseNodeClientParameters, type UseNodeClientReturnType } from './useNodeClient.js'
+export { useConnectorClient, type UseConnectorClientParameters, type UseConnectorClientReturnType } from './useConnectorClient.js'
+
+// Chain read hooks
+export { useBalance, type UseBalanceParameters, type UseBalanceReturnType } from './useBalance.js'
+export { useHeight, type UseHeightParameters, type UseHeightReturnType } from './useHeight.js'
+export { useAccount, type UseAccountParameters, type UseAccountReturnType } from './useAccount.js'
+export { useBlock, type UseBlockParameters, type UseBlockReturnType } from './useBlock.js'
+export { useTransaction, type UseTransactionParameters, type UseTransactionReturnType } from './useTransaction.js'
+export { useTransactionCount, type UseTransactionCountParameters, type UseTransactionCountReturnType } from './useTransactionCount.js'
+export { useWaitForTransaction, type UseWaitForTransactionParameters, type UseWaitForTransactionReturnType } from './useWaitForTransaction.js'
+export { useContractBytecode, type UseContractBytecodeParameters, type UseContractBytecodeReturnType } from './useContractBytecode.js'
+export { useEstimateGas, type UseEstimateGasParameters, type UseEstimateGasReturnType } from './useEstimateGas.js'
+
+// Transaction hooks
+export { useSendTransaction, type UseSendTransactionParameters, type UseSendTransactionReturnType } from './useSendTransaction.js'
+export { useSpend, type UseSpendParameters, type UseSpendReturnType } from './useSpend.js'
+export { usePayForTransaction, type UsePayForTransactionParameters, type UsePayForTransactionReturnType } from './usePayForTransaction.js'
+
+// Signing hooks
+export { useSignMessage, type UseSignMessageParameters, type UseSignMessageReturnType } from './useSignMessage.js'
+export { useSignTypedData, type UseSignTypedDataParameters, type UseSignTypedDataReturnType } from './useSignTypedData.js'
+export { useSignTransaction, type UseSignTransactionParameters, type UseSignTransactionReturnType } from './useSignTransaction.js'
+export { useVerifyMessage, type UseVerifyMessageParameters, type UseVerifyMessageReturnType } from './useVerifyMessage.js'
+export { useVerifyTypedData, type UseVerifyTypedDataParameters, type UseVerifyTypedDataReturnType } from './useVerifyTypedData.js'
+
+// Contract hooks
+export { useDeployContract, type UseDeployContractParameters, type UseDeployContractReturnType } from './useDeployContract.js'
+export { useCallContract, type UseCallContractParameters, type UseCallContractReturnType } from './useCallContract.js'
+export { useReadContract, type UseReadContractParameters, type UseReadContractReturnType } from './useReadContract.js'
+export { useReadContracts, type UseReadContractsParameters, type UseReadContractsReturnType } from './useReadContracts.js'
+export { useSimulateContract, type UseSimulateContractParameters, type UseSimulateContractReturnType } from './useSimulateContract.js'
+export { useContractEvents, type UseContractEventsParameters, type UseContractEventsReturnType } from './useContractEvents.js'
+
+// AENS hooks
+export { usePreclaimName, type UsePreclaimNameParameters, type UsePreclaimNameReturnType } from './usePreclaimName.js'
+export { useClaimName, type UseClaimNameParameters, type UseClaimNameReturnType } from './useClaimName.js'
+export { useUpdateName, type UseUpdateNameParameters, type UseUpdateNameReturnType } from './useUpdateName.js'
+export { useTransferName, type UseTransferNameParameters, type UseTransferNameReturnType } from './useTransferName.js'
+export { useRevokeName, type UseRevokeNameParameters, type UseRevokeNameReturnType } from './useRevokeName.js'
+export { useResolveName, type UseResolveNameParameters, type UseResolveNameReturnType } from './useResolveName.js'
+
+// Oracle hooks
+export { useRegisterOracle, type UseRegisterOracleParameters, type UseRegisterOracleReturnType } from './useRegisterOracle.js'
+export { useQueryOracle, type UseQueryOracleParameters, type UseQueryOracleReturnType } from './useQueryOracle.js'
+export { useRespondToQuery, type UseRespondToQueryParameters, type UseRespondToQueryReturnType } from './useRespondToQuery.js'
+export { useOracleState, type UseOracleStateParameters, type UseOracleStateReturnType } from './useOracleState.js'
+export { useOracleQueries, type UseOracleQueriesParameters, type UseOracleQueriesReturnType } from './useOracleQueries.js'
+
+// Channel hooks
+export { useOpenChannel, type UseOpenChannelParameters, type UseOpenChannelReturnType } from './useOpenChannel.js'
+export { useCloseChannel, type UseCloseChannelParameters, type UseCloseChannelReturnType } from './useCloseChannel.js'
+export { useChannelDeposit, type UseChannelDepositParameters, type UseChannelDepositReturnType } from './useChannelDeposit.js'
+
+// Watcher hooks
+export { useWatchHeight, type UseWatchHeightParameters, type UseWatchHeightReturnType } from './useWatchHeight.js'
+export { useWatchConnection, type UseWatchConnectionParameters, type UseWatchConnectionReturnType } from './useWatchConnection.js'
+export { useWatchConnectors, type UseWatchConnectorsParameters, type UseWatchConnectorsReturnType } from './useWatchConnectors.js'

package/src/hooks/useAccount.test.ts

@@ -0,0 +1,12 @@
+import { describe, it, expect } from 'vitest'
+import { useAccount } from './useAccount.js'
+
+describe('useAccount', () => {
+  it('should be a function', () => {
+    expect(typeof useAccount).toBe('function')
+  })
+
+  it('should be exported', () => {
+    expect(useAccount).toBeDefined()
+  })
+})

package/src/hooks/useAccount.ts

@@ -0,0 +1,43 @@
+'use client'
+
+import {
+  type GetAccountParameters,
+  type GetAccountReturnType,
+  type GetAccountErrorType,
+  getAccount,
+} from '@growae/reactive'
+import type { Compute } from '@growae/reactive'
+import { type UseQueryReturnType, useQuery } from '../utils/query.js'
+import type { ConfigParameter } from '../types/properties.js'
+import { useConfig } from './useConfig.js'
+import { useNetworkId } from './useNetworkId.js'
+
+export type UseAccountParameters = Compute<
+  GetAccountParameters & ConfigParameter & { enabled?: boolean }
+>
+
+export type UseAccountReturnType = UseQueryReturnType<
+  GetAccountReturnType,
+  GetAccountErrorType
+>
+
+export function useAccount(
+  parameters: UseAccountParameters = {} as UseAccountParameters,
+): UseAccountReturnType {
+  const config = useConfig(parameters)
+  const networkId = useNetworkId({ config })
+
+  return useQuery({
+    queryKey: ['account', {
+      address: parameters.address,
+      networkId: parameters.networkId ?? networkId,
+      height: parameters.height,
+      hash: parameters.hash,
+    }],
+    queryFn: () => getAccount(config, {
+      ...parameters,
+      networkId: parameters.networkId ?? networkId,
+    }),
+    enabled: Boolean(parameters.address) && (parameters.enabled ?? true),
+  }) as UseAccountReturnType
+}

package/src/hooks/useBalance.test.ts

@@ -0,0 +1,72 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi } from 'vitest'
+
+vi.mock('@aeternity/aepp-sdk', () => ({
+  Node: vi.fn().mockImplementation(() => ({})),
+}))
+
+import { createElement } from 'react'
+import { renderHook } from '@testing-library/react'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { useBalance } from './useBalance.js'
+import { ReactiveProvider } from '../context.js'
+import { createConfig } from '@growae/reactive'
+import { testnet } from '@growae/reactive'
+import { mock } from '@growae/reactive'
+
+const TEST_ACCOUNTS = [
+  'ak_2swhLkgBPeeADxVTABy7tt6d2HgBQFnGJELkBUMY4FUa8RVLM',
+] as const
+
+function createWrapper() {
+  const config = createConfig({
+    networks: [testnet],
+    connectors: [mock({ accounts: [...TEST_ACCOUNTS] })],
+    storage: null,
+  })
+  const queryClient = new QueryClient({
+    defaultOptions: { queries: { retry: false } },
+  })
+  return {
+    config,
+    wrapper: ({ children }: { children: React.ReactNode }) =>
+      createElement(
+        QueryClientProvider,
+        { client: queryClient },
+        createElement(
+          ReactiveProvider,
+          { config, reconnectOnMount: false },
+          children,
+        ),
+      ),
+  }
+}
+
+describe('useBalance', () => {
+  it('should return query result shape', () => {
+    const { wrapper } = createWrapper()
+    const { result } = renderHook(
+      () =>
+        useBalance({
+          address:
+            'ak_2swhLkgBPeeADxVTABy7tt6d2HgBQFnGJELkBUMY4FUa8RVLM',
+        }),
+      { wrapper },
+    )
+
+    expect(result.current).toHaveProperty('data')
+    expect(result.current).toHaveProperty('isLoading')
+    expect(result.current).toHaveProperty('isError')
+    expect(result.current).toHaveProperty('error')
+    expect(result.current).toHaveProperty('queryKey')
+  })
+
+  it('should be idle without address', () => {
+    const { wrapper } = createWrapper()
+    const { result } = renderHook(
+      () => useBalance({} as any),
+      { wrapper },
+    )
+    expect(result.current.fetchStatus).toBe('idle')
+  })
+})

package/src/hooks/useBalance.ts

@@ -0,0 +1,42 @@
+'use client'
+
+import {
+  type GetBalanceParameters,
+  type GetBalanceReturnType,
+  type GetBalanceErrorType,
+  getBalance,
+} from '@growae/reactive'
+import type { Compute } from '@growae/reactive'
+import { type UseQueryReturnType, useQuery } from '../utils/query.js'
+import type { ConfigParameter } from '../types/properties.js'
+import { useConfig } from './useConfig.js'
+import { useNetworkId } from './useNetworkId.js'
+
+export type UseBalanceParameters = Compute<
+  GetBalanceParameters & ConfigParameter & { enabled?: boolean }
+>
+
+export type UseBalanceReturnType = UseQueryReturnType<
+  GetBalanceReturnType,
+  GetBalanceErrorType
+>
+
+export function useBalance(
+  parameters: UseBalanceParameters = {} as UseBalanceParameters,
+): UseBalanceReturnType {
+  const config = useConfig(parameters)
+  const networkId = useNetworkId({ config })
+
+  return useQuery({
+    queryKey: ['balance', {
+      address: parameters.address,
+      networkId: parameters.networkId ?? networkId,
+      format: parameters.format,
+    }],
+    queryFn: () => getBalance(config, {
+      ...parameters,
+      networkId: parameters.networkId ?? networkId,
+    }),
+    enabled: Boolean(parameters.address) && (parameters.enabled ?? true),
+  }) as UseBalanceReturnType
+}