From b98daa8f6a415ce1a8a2ff04ab7c702f4a79887c Mon Sep 17 00:00:00 2001 From: Manuel Alessandro Collazo Date: Fri, 19 Dec 2025 14:40:11 +0700 Subject: [PATCH 01/24] initial commit --- docs.json | 53 +++- .../components/interwovenkit-provider.mdx | 185 ++++++++++++ .../references/components/interwovenkit.mdx | 77 +++++ .../initia-privy-wallet-connector.mdx | 39 +++ .../initia-privy-wallet-options.mdx | 47 ++++ .../connectors/initia-privy-wallet.mdx | 40 +++ .../references/connectors/privy-app-id.mdx | 47 ++++ .../constants/default-gas-adjustment.mdx | 18 ++ .../default-gas-price-multiplier.mdx | 18 ++ .../references/constants/mainnet.mdx | 35 +++ .../references/constants/testnet.mdx | 37 +++ .../references/errors/move-error.mdx | 50 ++++ .../references/hooks/use-address.mdx | 63 +++++ .../references/hooks/use-hex-address.mdx | 57 ++++ .../references/hooks/use-initia-address.mdx | 58 ++++ .../references/hooks/use-interwovenkit.mdx | 156 +++++++++++ .../references/hooks/use-portfolio.mdx | 135 +++++++++ .../references/hooks/use-username-query.mdx | 47 ++++ interwovenkit/references/index.mdx | 60 ++++ .../references/interwovenkit-provider.mdx | 217 --------------- interwovenkit/references/useinterwovenkit.mdx | 263 ------------------ .../references/utilities/inject-styles.mdx | 45 +++ 22 files changed, 1264 insertions(+), 483 deletions(-) create mode 100644 interwovenkit/references/components/interwovenkit-provider.mdx create mode 100644 interwovenkit/references/components/interwovenkit.mdx create mode 100644 interwovenkit/references/connectors/initia-privy-wallet-connector.mdx create mode 100644 interwovenkit/references/connectors/initia-privy-wallet-options.mdx create mode 100644 interwovenkit/references/connectors/initia-privy-wallet.mdx create mode 100644 interwovenkit/references/connectors/privy-app-id.mdx create mode 100644 interwovenkit/references/constants/default-gas-adjustment.mdx create mode 100644 interwovenkit/references/constants/default-gas-price-multiplier.mdx create mode 100644 interwovenkit/references/constants/mainnet.mdx create mode 100644 interwovenkit/references/constants/testnet.mdx create mode 100644 interwovenkit/references/errors/move-error.mdx create mode 100644 interwovenkit/references/hooks/use-address.mdx create mode 100644 interwovenkit/references/hooks/use-hex-address.mdx create mode 100644 interwovenkit/references/hooks/use-initia-address.mdx create mode 100644 interwovenkit/references/hooks/use-interwovenkit.mdx create mode 100644 interwovenkit/references/hooks/use-portfolio.mdx create mode 100644 interwovenkit/references/hooks/use-username-query.mdx create mode 100644 interwovenkit/references/index.mdx delete mode 100644 interwovenkit/references/interwovenkit-provider.mdx delete mode 100644 interwovenkit/references/useinterwovenkit.mdx create mode 100644 interwovenkit/references/utilities/inject-styles.mdx diff --git a/docs.json b/docs.json index 76427c6..2538b8e 100644 --- a/docs.json +++ b/docs.json @@ -399,10 +399,57 @@ ] }, { - "group": "References", + "group": "API Reference", "pages": [ - "interwovenkit/references/interwovenkit-provider", - "interwovenkit/references/useinterwovenkit" + "interwovenkit/references/index", + { + "group": "Components", + "pages": [ + "interwovenkit/references/components/interwovenkit", + "interwovenkit/references/components/interwovenkit-provider" + ] + }, + { + "group": "Connectors", + "pages": [ + "interwovenkit/references/connectors/initia-privy-wallet", + "interwovenkit/references/connectors/initia-privy-wallet-connector", + "interwovenkit/references/connectors/initia-privy-wallet-options", + "interwovenkit/references/connectors/privy-app-id" + ] + }, + { + "group": "Hooks", + "pages": [ + "interwovenkit/references/hooks/use-interwovenkit", + "interwovenkit/references/hooks/use-address", + "interwovenkit/references/hooks/use-initia-address", + "interwovenkit/references/hooks/use-hex-address", + "interwovenkit/references/hooks/use-portfolio", + "interwovenkit/references/hooks/use-username-query" + ] + }, + { + "group": "Constants", + "pages": [ + "interwovenkit/references/constants/mainnet", + "interwovenkit/references/constants/testnet", + "interwovenkit/references/constants/default-gas-adjustment", + "interwovenkit/references/constants/default-gas-price-multiplier" + ] + }, + { + "group": "Errors", + "pages": [ + "interwovenkit/references/errors/move-error" + ] + }, + { + "group": "Utilities", + "pages": [ + "interwovenkit/references/utilities/inject-styles" + ] + } ] } ] diff --git a/interwovenkit/references/components/interwovenkit-provider.mdx b/interwovenkit/references/components/interwovenkit-provider.mdx new file mode 100644 index 0000000..178f66b --- /dev/null +++ b/interwovenkit/references/components/interwovenkit-provider.mdx @@ -0,0 +1,185 @@ +--- +title: InterwovenKitProvider +--- + +## Overview + +- React provider that configures and renders the InterwovenKit widget shell (drawer, routes, and supporting providers) +- Mount once near the top of your app, typically wrapping your root component +- Privy and AutoSign features are optional; configure `privyContext` and `enableAutoSign` only if needed +- Renders into a Shadow DOM by default; use the `container` prop to attach to a specific DOM element + +## Prerequisites + +- Must be used within a React Query `QueryClientProvider` +- Required if you use wallet-related InterwovenKit APIs: Must be used within a wagmi `WagmiProvider` +- Client-only (no SSR): Put this in a `use client` provider tree, or use a dynamic import in Next.js + +## Quickstart + +```tsx +"use client" + +import { QueryClient, QueryClientProvider } from "@tanstack/react-query" +import { WagmiProvider } from "wagmi" +import { InterwovenKitProvider, MAINNET } from "@initia/interwovenkit-react" + +const queryClient = new QueryClient() +const wagmiConfig = /* your wagmi config */ + +export function AppProviders({ children }: { children: React.ReactNode }) { + return ( + + + + {children} + + + + ) +} +``` + +## Props + +| Prop | Type | Default | Description | +|------|------|---------|-------------| +| `defaultChainId` | `string` | From preset | Initia or rollup chain ID that InterwovenKit should treat as the "home" chain | +| `registryUrl` | `string` | From preset | Base URL for the Initia registry API used to resolve chains and assets | +| `routerApiUrl` | `string` | From preset | Base URL for the router API used by the bridge and swap flows | +| `glyphUrl` | `string` | From preset | Base URL for Glyph profile data (user avatars and related metadata) | +| `usernamesModuleAddress` | `string` | From preset | On‑chain module address of the `.init` username contract | +| `theme` | `"light" \| "dark"` | From preset (typically dark) | Visual theme for the widget | +| `customChain` | `Chain` | `undefined` | Adds or overrides a chain definition in the Initia registry. Use when you run a private rollup or need to inject a chain that is not yet in the public registry | +| `protoTypes` | `Iterable<[string, GeneratedType]>` | `undefined` | Additional protobuf type mappings used when encoding Cosmos transactions. Only needed if you use custom message types | +| `aminoConverters` | `AminoConverters` | `undefined` | Custom Amino converters for legacy signing. Only needed for advanced integrations | +| `container` | `HTMLElement` | `undefined` | Optional element the widget should render into instead of the default Shadow DOM host | +| `disableAnalytics` | `boolean` | `false` (mainnet), `true` (testnet) | When `true`, disables InterwovenKit's built‑in analytics events | +| `enableAutoSign` | `boolean \| Record` | `undefined` | Enables AutoSign and optionally whitelists chains and message types. `true` enables for supported chains and messages. `Record` is a per-chain allowlist of message type URLs. Required at runtime only if you want AutoSign flows to be available | +| `privyContext` | `PrivyContext` | `undefined` | Passes Privy authentication and wallet helpers into InterwovenKit. Required for embedded wallet and AutoSign features, otherwise optional | + +Types `Chain`, `GeneratedType`, `AminoConverters`, and `PrivyContext` members are from external packages. See `@initia/initia-registry-types`, `@cosmjs/proto-signing`, `@cosmjs/stargate`, and `@privy-io/react-auth` for details. + +## Return value + +Renders `children` and mounts the InterwovenKit UI shell. + +## Examples + +### Custom chain configuration + +```tsx +import type { Chain } from "@initia/initia-registry-types" +import { InterwovenKitProvider, MAINNET } from "@initia/interwovenkit-react" + +const MY_ROLLUP: Chain = { + // your custom chain definition +} as Chain + +export function Providers({ children }: { children: React.ReactNode }) { + return ( + + {children} + + ) +} +``` + +### AutoSign configuration + +```tsx +import { InterwovenKitProvider, MAINNET } from "@initia/interwovenkit-react" + +export function Providers({ children }: { children: React.ReactNode }) { + return ( + + {children} + + ) +} +``` + +### Privy integration + +```tsx +import { + PrivyProvider, + useCreateWallet, + useLoginWithSiwe, + usePrivy, + useWallets, +} from "@privy-io/react-auth" +import { InterwovenKitProvider, MAINNET } from "@initia/interwovenkit-react" + +function InterwovenKitWithPrivy({ children }: { children: React.ReactNode }) { + const privy = usePrivy() + const siwe = useLoginWithSiwe() + const { wallets } = useWallets() + const { createWallet } = useCreateWallet() + + return ( + + {children} + + ) +} + +export function AppProviders({ children }: { children: React.ReactNode }) { + return ( + + {children} + + ) +} +``` + +## Notes + +- Runs a one‑time local storage migration on mount to keep existing widget data compatible across versions +- Injects font stylesheets via `` elements for the widget; override the visual style by adjusting the `theme` prop or your app's global styles (font injection cannot currently be disabled) + +## Type reference (advanced) + +```ts +type InterwovenKitProviderProps = React.PropsWithChildren> + +type Config = { + defaultChainId: string + customChain?: Chain + protoTypes?: Iterable<[string, GeneratedType]> + aminoConverters?: AminoConverters + registryUrl: string + routerApiUrl: string + glyphUrl: string + usernamesModuleAddress: string + theme: "light" | "dark" + container?: HTMLElement + disableAnalytics?: boolean + enableAutoSign?: boolean | Record + privyContext?: PrivyContext +} + +type Chain = Chain // Type from @initia/initia-registry-types +type GeneratedType = GeneratedType // Type from @cosmjs/proto-signing +type AminoConverters = AminoConverters // Type from @cosmjs/stargate +type PrivyContext = { + privy: PrivyHookResult + createWallet: CreateWalletFunction + wallets: Wallet[] + siwe: SiweHookResult +} +``` + +Types `Chain`, `GeneratedType`, `AminoConverters`, and `PrivyContext` members are from external packages. See `@initia/initia-registry-types`, `@cosmjs/proto-signing`, `@cosmjs/stargate`, and `@privy-io/react-auth` for details. diff --git a/interwovenkit/references/components/interwovenkit.mdx b/interwovenkit/references/components/interwovenkit.mdx new file mode 100644 index 0000000..644d925 --- /dev/null +++ b/interwovenkit/references/components/interwovenkit.mdx @@ -0,0 +1,77 @@ +--- +title: InterwovenKit +--- + +## Overview + +- Full-screen InterwovenKit UI component that renders the complete drawer interface in a single surface +- Reuses configuration from the surrounding `InterwovenKitProvider` (network settings, theme, routing) +- Use this when you want a full-page InterwovenKit experience instead of modal drawers +- For modal-based UI with finer-grained control, prefer using `useInterwovenKit()` hook with `InterwovenKitProvider` + +## Prerequisites + +- Must be rendered within `InterwovenKitProvider` +- Must be used within a React Query `QueryClientProvider` +- Required if you use wallet-related InterwovenKit APIs: Must be used within a wagmi `WagmiProvider` +- Client-only (no SSR): Put this in a `use client` provider tree, or use a dynamic import in Next.js + +## Quickstart + +```tsx +"use client" + +import { QueryClient, QueryClientProvider } from "@tanstack/react-query" +import { WagmiProvider } from "wagmi" +import { InterwovenKit, InterwovenKitProvider, MAINNET } from "@initia/interwovenkit-react" + +const queryClient = new QueryClient() +const wagmiConfig = /* your wagmi config */ + +export function Page() { + return ( + + + + + + + + ) +} +``` + +## Props + +| Prop | Type | Default | Description | +|------|------|---------|-------------| +| `bridge` | `Partial` | `undefined` | Optional initial values for the bridge form. When provided, InterwovenKit opens on the bridge route and pre-fills the form | + +## Return value + +Renders the InterwovenKit route UI. + +## Notes + +- The `bridge` prop only sets initial values; users can still change the form inside the UI +- For finer-grained control (modals instead of full-screen), prefer using `useInterwovenKit()` with `InterwovenKitProvider` + +## Type reference (advanced) + +```ts +type InterwovenKitProps = { + bridge?: Partial +} + +type BridgeFormValues = { + srcChainId: string + srcDenom: string + dstChainId: string + dstDenom: string + quantity: string + sender: string + cosmosWalletName?: string + recipient: string + slippagePercent: string +} +``` diff --git a/interwovenkit/references/connectors/initia-privy-wallet-connector.mdx b/interwovenkit/references/connectors/initia-privy-wallet-connector.mdx new file mode 100644 index 0000000..3398f98 --- /dev/null +++ b/interwovenkit/references/connectors/initia-privy-wallet-connector.mdx @@ -0,0 +1,39 @@ +--- +title: initiaPrivyWalletConnector +--- + +## Overview + +- Wagmi connector created from `initiaPrivyWalletOptions` for integrating Privy wallets with wagmi and RainbowKit +- Wraps the Privy wallet into a wagmi `Connector` so it can be used in wagmi and RainbowKit configs +- Use this when you want to include the bundled Initia Privy wallet in your wagmi connector list + +## Prerequisites + +- Must be used with wagmi `createConfig` +- Privy must be set up separately (see Privy documentation for setup) + +## Quickstart + +```ts +import { createConfig } from "wagmi" +import { initiaPrivyWalletConnector } from "@initia/interwovenkit-react" + +const wagmiConfig = createConfig({ + connectors: [initiaPrivyWalletConnector], + /* your chains and transports */ +}) +``` + +## Return value + +```ts +const initiaPrivyWalletConnector: Connector +``` + +Type `Connector` is from `wagmi`. + +## Notes + +- Use this connector alongside other wagmi connectors in your `createConfig` call +- Uses the shared `initiaPrivyWalletOptions` metadata (name, icon, ID) diff --git a/interwovenkit/references/connectors/initia-privy-wallet-options.mdx b/interwovenkit/references/connectors/initia-privy-wallet-options.mdx new file mode 100644 index 0000000..ebe74a1 --- /dev/null +++ b/interwovenkit/references/connectors/initia-privy-wallet-options.mdx @@ -0,0 +1,47 @@ +--- +title: initiaPrivyWalletOptions +--- + +## Overview + +- Default options object provided by the SDK for constructing Privy wallet connectors and RainbowKit wallets +- Contains shared metadata (name, icon, ID) used by `initiaPrivyWalletConnector` and `initiaPrivyWallet` +- Use this when you want to customize the display name or icon by creating a copy and overriding fields + +## Prerequisites + +- Relevant only if you are using Privy with wagmi or RainbowKit +- Privy must be set up separately (see Privy documentation for setup) + +## Quickstart + +```ts +import { createConfig } from "wagmi" +import { initiaPrivyWalletOptions } from "@initia/interwovenkit-react" +import { toPrivyWalletConnector } from "@privy-io/cross-app-connect/rainbow-kit" + +// To customize, create a copy and override fields (do not mutate the export) +const customOptions = { ...initiaPrivyWalletOptions, name: "Custom Name" } +const customPrivyConnector = toPrivyWalletConnector(customOptions) + +const wagmiConfig = createConfig({ + connectors: [customPrivyConnector], + /* your chains and transports */ +}) +``` + +## Value + +```ts +const initiaPrivyWalletOptions: { + id: string + name: string + iconUrl: string + iconBackground: string +} +``` + +## Notes + +- This export is a provided default; do not mutate the imported object directly +- To customize name or icon, create a copy and override fields instead of mutating the export diff --git a/interwovenkit/references/connectors/initia-privy-wallet.mdx b/interwovenkit/references/connectors/initia-privy-wallet.mdx new file mode 100644 index 0000000..d216519 --- /dev/null +++ b/interwovenkit/references/connectors/initia-privy-wallet.mdx @@ -0,0 +1,40 @@ +--- +title: initiaPrivyWallet +--- + +## Overview + +- RainbowKit wallet definition created from `initiaPrivyWalletOptions` for integrating Privy wallets with RainbowKit +- Use this when configuring RainbowKit's `wallets` list and you want to include the bundled Privy wallet +- Shares its configuration with `initiaPrivyWalletConnector` via `initiaPrivyWalletOptions` + +## Prerequisites + +- Relevant only if you are using RainbowKit +- Privy must be set up separately (see Privy documentation for setup) + +## Quickstart + +```ts +import { initiaPrivyWallet } from "@initia/interwovenkit-react" +import { getDefaultConfig } from "@rainbow-me/rainbowkit" + +export const rainbowConfig = getDefaultConfig({ + appName: "My dApp", + wallets: [[initiaPrivyWallet]], +}) +``` + +## Return value + +```ts +const initiaPrivyWallet: Wallet +``` + +A RainbowKit `Wallet` object that can be included in the `wallets` array when configuring RainbowKit. The wallet object includes properties such as `id`, `name`, `iconUrl`, and `iconBackground` from `initiaPrivyWalletOptions`, along with RainbowKit-specific wallet connection methods. + +Type `Wallet` is from `@rainbow-me/rainbowkit`. + +## Notes + +- This wallet definition shares its configuration with `initiaPrivyWalletConnector` via `initiaPrivyWalletOptions` diff --git a/interwovenkit/references/connectors/privy-app-id.mdx b/interwovenkit/references/connectors/privy-app-id.mdx new file mode 100644 index 0000000..3ff9836 --- /dev/null +++ b/interwovenkit/references/connectors/privy-app-id.mdx @@ -0,0 +1,47 @@ +--- +title: PRIVY_APP_ID +--- + +## Overview + +- Initia's shared Privy application ID used by the bundled Initia Privy wallet helpers +- This is NOT your own app's Privy ID; it references Initia's shared Privy app (the bundled social / embedded wallet) +- Use this when configuring login methods that include the Initia Privy wallet alongside your own Privy app + +## Prerequisites + +- Relevant only if you are using Privy +- Privy must be set up separately (see Privy documentation for setup) + +## Quickstart + +```tsx +import { PRIVY_APP_ID } from "@initia/interwovenkit-react" +import { PrivyProvider } from "@privy-io/react-auth" + +export function Providers({ children }: { children: React.ReactNode }) { + return ( + + {children} + + ) +} +``` + +## Value + +```ts +const PRIVY_APP_ID: string +``` + +## Notes + +- Do not pass this value as your `PrivyProvider` `appId`; it is only for referencing Initia's bundled wallet in login method configuration +- Your own Privy app ID must be set separately as shown in the example above diff --git a/interwovenkit/references/constants/default-gas-adjustment.mdx b/interwovenkit/references/constants/default-gas-adjustment.mdx new file mode 100644 index 0000000..6b719ff --- /dev/null +++ b/interwovenkit/references/constants/default-gas-adjustment.mdx @@ -0,0 +1,18 @@ +--- +title: DEFAULT_GAS_ADJUSTMENT +--- + +## Overview + +- Default gas adjustment multiplier used by InterwovenKit when estimating gas for transactions +- Reference this constant when you need to reproduce InterwovenKit's default gas estimate behavior in your own code or pass an explicit `gasAdjustment` to advanced transaction helpers + +## Value + +```ts +const DEFAULT_GAS_ADJUSTMENT: number // 1.4 +``` + +## Notes + +- This value is used when InterwovenKit estimates gas for transactions without an explicit `gasAdjustment` diff --git a/interwovenkit/references/constants/default-gas-price-multiplier.mdx b/interwovenkit/references/constants/default-gas-price-multiplier.mdx new file mode 100644 index 0000000..dd9a2ba --- /dev/null +++ b/interwovenkit/references/constants/default-gas-price-multiplier.mdx @@ -0,0 +1,18 @@ +--- +title: DEFAULT_GAS_PRICE_MULTIPLIER +--- + +## Overview + +- Default gas price multiplier used by InterwovenKit when suggesting fees +- Reference this constant when you need to reproduce InterwovenKit's default gas price calculation in custom fee logic + +## Value + +```ts +const DEFAULT_GAS_PRICE_MULTIPLIER: number // 1.05 +``` + +## Notes + +- This multiplier is applied on top of base gas prices when InterwovenKit suggests fees diff --git a/interwovenkit/references/constants/mainnet.mdx b/interwovenkit/references/constants/mainnet.mdx new file mode 100644 index 0000000..e6beb88 --- /dev/null +++ b/interwovenkit/references/constants/mainnet.mdx @@ -0,0 +1,35 @@ +--- +title: MAINNET +--- + +## Overview + +- Default configuration preset for Initia mainnet providing safe defaults for registry, router, glyph, and username services +- Use as a starting point for production apps targeting the Initia mainnet + +## Quickstart + +```tsx +import { InterwovenKitProvider, MAINNET } from "@initia/interwovenkit-react" + +export function Providers({ children }: { children: React.ReactNode }) { + return {children} +} +``` + +## Value + +```ts +const MAINNET: { + defaultChainId: string + registryUrl: string + routerApiUrl: string + glyphUrl: string + usernamesModuleAddress: string + theme: "dark" +} +``` + +## Notes + +- Most apps should start with `{...MAINNET}` and override only what they need (for example `defaultChainId` or `theme`) diff --git a/interwovenkit/references/constants/testnet.mdx b/interwovenkit/references/constants/testnet.mdx new file mode 100644 index 0000000..a6dc527 --- /dev/null +++ b/interwovenkit/references/constants/testnet.mdx @@ -0,0 +1,37 @@ +--- +title: TESTNET +--- + +## Overview + +- Default configuration preset for Initia testnet pointing to testnet registry, router, glyph, and username services +- Use for development or staging apps targeting the Initia testnet + +## Quickstart + +```tsx +import { InterwovenKitProvider, TESTNET } from "@initia/interwovenkit-react" + +export function Providers({ children }: { children: React.ReactNode }) { + return {children} +} +``` + +## Value + +```ts +const TESTNET: { + defaultChainId: string + registryUrl: string + routerApiUrl: string + glyphUrl: string + usernamesModuleAddress: string + theme: "dark" + disableAnalytics: true +} +``` + +## Notes + +- Analytics are disabled by default on testnet via `disableAnalytics: true` +- Most apps should start with `{...TESTNET}` in non‑production environments and override only what they need diff --git a/interwovenkit/references/errors/move-error.mdx b/interwovenkit/references/errors/move-error.mdx new file mode 100644 index 0000000..75c4efa --- /dev/null +++ b/interwovenkit/references/errors/move-error.mdx @@ -0,0 +1,50 @@ +--- +title: MoveError +--- + +## Overview + +- Error type that carries parsed Move VM error metadata for distinguishing Move VM failures from generic network or client errors +- Thrown by transaction helpers when Move VM transactions fail, enabling developers to branch UI, logging, or telemetry based on Move-specific metadata +- Use `instanceof MoveError` to identify and handle Move VM errors separately from other error types + +## Quickstart + +```ts +import { MoveError } from "@initia/interwovenkit-react" + +function isMoveError(error: unknown): error is MoveError { + return error instanceof MoveError +} + +// Example: accessing Move-specific fields +try { + await submitTxBlock({ messages, fee }) +} catch (error) { + if (error instanceof MoveError) { + console.error(`Move error in ${error.moduleName} at ${error.moduleAddress}: ${error.errorCode}`) + } +} +``` + +## Properties + +```ts +class MoveError extends Error { + originalError: Error + moduleAddress: string + moduleName: string + errorCode: string + errorCodeHex: string + isFromRegistry: boolean +} +``` + +## Thrown by + +- `requestTxBlock` +- `submitTxBlock` + +## Notes + +- Use `instanceof MoveError` to branch UI or logging logic based on Move‑specific metadata such as `moduleAddress`, `moduleName`, and `errorCode` diff --git a/interwovenkit/references/hooks/use-address.mdx b/interwovenkit/references/hooks/use-address.mdx new file mode 100644 index 0000000..6e47cf4 --- /dev/null +++ b/interwovenkit/references/hooks/use-address.mdx @@ -0,0 +1,63 @@ +--- +title: useAddress +--- + +## Overview + +- Returns the connected wallet address, automatically adapting to the default chain's format (hex for `minievm` chains, bech32 Initia address for others) +- Use this hook when you need a single address that matches the default chain's format +- Returns an empty string when there is no connected address or Privy has not finished connecting + +## Prerequisites + +- Must be rendered within `InterwovenKitProvider` +- Must be used within a React Query `QueryClientProvider` +- Must be used within a wagmi `WagmiProvider` +- Client-only (no SSR): Put this in a `use client` provider tree, or use a dynamic import in Next.js + +## Quickstart + +```tsx +"use client" + +import { QueryClient, QueryClientProvider } from "@tanstack/react-query" +import { WagmiProvider } from "wagmi" +import { + InterwovenKitProvider, + MAINNET, + useAddress, +} from "@initia/interwovenkit-react" + +const queryClient = new QueryClient() +// Define your wagmi config with connectors, chains, and transports +const wagmiConfig = /* your wagmi config */ + +function Address() { + const address = useAddress() + return {address || "Not connected"} +} + +export function App() { + return ( + + + +
+ + + + ) +} +``` + +## Return value + +```ts +function useAddress(): string +``` + +Returns a hex address when the default chain is `minievm`, or an Initia bech32 address for other chain types. Returns an empty string when there is no connected address or when Privy is configured and not connected. + +## Notes + +- Prefer this hook over chain-specific address hooks (`useHexAddress`, `useInitiaAddress`) when you need a single address that automatically adapts to the default chain's format diff --git a/interwovenkit/references/hooks/use-hex-address.mdx b/interwovenkit/references/hooks/use-hex-address.mdx new file mode 100644 index 0000000..3b4737e --- /dev/null +++ b/interwovenkit/references/hooks/use-hex-address.mdx @@ -0,0 +1,57 @@ +--- +title: useHexAddress +--- + +## Overview + +- Returns the connected wallet address in hex format (always hex, regardless of chain type) +- Use this hook when you specifically need a hex address for EVM-style tooling or when you want a consistent hex format regardless of the default chain + +## Prerequisites + +- Must be rendered within `InterwovenKitProvider` +- Must be used within a wagmi `WagmiProvider` +- Client-only (no SSR): Put this in a `use client` provider tree, or use a dynamic import in Next.js + +## Quickstart + +```tsx +"use client" + +import { WagmiProvider } from "wagmi" +import { + InterwovenKitProvider, + MAINNET, + useHexAddress, +} from "@initia/interwovenkit-react" + +const wagmiConfig = /* your wagmi config */ + +function Address() { + const address = useHexAddress() + return {address || "Not connected"} +} + +export function App() { + return ( + + +
+ + + ) +} +``` + +## Return value + +```ts +function useHexAddress(): string +``` + +Returns the Initia account address in hex format when Privy is connected. Returns an empty string (`""`) when there is no connected address, or when Privy is configured and not connected. + +## Notes + +- This hook always returns a hex address, unlike `useAddress` which adapts to the default chain's format +- Use this hook for EVM-style integrations or when you need a consistent hex format regardless of chain type diff --git a/interwovenkit/references/hooks/use-initia-address.mdx b/interwovenkit/references/hooks/use-initia-address.mdx new file mode 100644 index 0000000..a5b152c --- /dev/null +++ b/interwovenkit/references/hooks/use-initia-address.mdx @@ -0,0 +1,58 @@ +--- +title: useInitiaAddress +--- + +## Overview + +- Returns the connected wallet address in Initia bech32 format (always bech32, regardless of chain type) +- Returns an empty string when there is no connected address or Privy is not connected yet +- Use this hook when you always need a bech32 Initia address, regardless of the default chain type + +## Prerequisites + +- Must be rendered within `InterwovenKitProvider` +- Must be used within a wagmi `WagmiProvider` +- Client-only (no SSR): Put this in a `use client` provider tree, or use a dynamic import in Next.js + +## Quickstart + +```tsx +"use client" + +import { WagmiProvider } from "wagmi" +import { + InterwovenKitProvider, + MAINNET, + useInitiaAddress, +} from "@initia/interwovenkit-react" + +const wagmiConfig = /* your wagmi config */ + +function Address() { + const address = useInitiaAddress() + return {address || "Not connected"} +} + +export function App() { + return ( + + +
+ + + ) +} +``` + +## Return value + +```ts +function useInitiaAddress(): string +``` + +Converts the connected hex wallet address into an Initia bech32 address. Returns an empty string (`""`) when there is no connected address, or when Privy is configured and not connected. + +## Notes + +- This hook always returns an Initia bech32 address, unlike `useAddress` which adapts to the default chain's format +- Use this hook for Initia-specific integrations or when you need a consistent bech32 format regardless of chain type diff --git a/interwovenkit/references/hooks/use-interwovenkit.mdx b/interwovenkit/references/hooks/use-interwovenkit.mdx new file mode 100644 index 0000000..369e5aa --- /dev/null +++ b/interwovenkit/references/hooks/use-interwovenkit.mdx @@ -0,0 +1,156 @@ +--- +title: useInterwovenKit +--- + +## Overview + +- Primary entry point for InterwovenKit connection state, UI actions, transaction helpers, and AutoSign functionality +- Required when opening the InterwovenKit drawer or sending transactions +- For simple address or username reads, prefer smaller hooks (`useAddress`, `useUsernameQuery`) to avoid extra transaction and AutoSign wiring + +## Prerequisites + +- Must be rendered within `InterwovenKitProvider` +- Must be used within a React Query `QueryClientProvider` +- Must be used within a wagmi `WagmiProvider` +- Client-only (no SSR): Put this in a `use client` provider tree, or use a dynamic import in Next.js + +## Quickstart + +```tsx +"use client" + +import { QueryClient, QueryClientProvider } from "@tanstack/react-query" +import { WagmiProvider } from "wagmi" +import { + InterwovenKitProvider, + MAINNET, + useInterwovenKit, +} from "@initia/interwovenkit-react" + +const queryClient = new QueryClient() +// Define your wagmi config with connectors, chains, and transports +const wagmiConfig = /* your wagmi config */ + +function ConnectButton() { + const { isConnected, openConnect, openWallet } = useInterwovenKit() + return ( + + ) +} + +export function App() { + return ( + + + + + + + + ) +} +``` + +## Return value + +Returns an object with: + +**Connection state:** +- `address`, `initiaAddress`, `hexAddress`, `username`, `offlineSigner`, `isConnected`, `isOpen` + +**UI actions:** +- `openConnect`, `openWallet`, `openBridge`, `disconnect` + +**AutoSign:** +- `autoSign` (status maps and `enable` / `disable` helpers) + +**Transaction helpers:** +- `estimateGas`, `simulateTx`, `requestTxSync`, `requestTxBlock`, `submitTxSync`, `submitTxBlock`, `waitForTxConfirmation` + +## Notes + +- `disconnect()` clears bridge-related values from `localStorage` +- Transaction helpers may throw `MoveError` on Move VM errors + +## Type reference (advanced) + +```ts +function useInterwovenKit(): InterwovenKitResult + +type InterwovenKitResult = { + address: string + initiaAddress: string + hexAddress: string + username: string | null | undefined + offlineSigner: OfflineAminoSigner + isConnected: boolean + isOpen: boolean + openConnect: () => void + openWallet: () => void + openBridge: (defaultValues?: Partial) => void + disconnect: () => void + autoSign: AutoSignState + estimateGas: (tx: Pick) => Promise + simulateTx: (tx: Pick) => Promise + requestTxSync: (tx: TxRequest) => Promise + requestTxBlock: (tx: TxRequest, timeoutMs?: number, intervalMs?: number) => Promise + submitTxSync: (tx: TxParams) => Promise + submitTxBlock: (tx: TxParams, timeoutMs?: number, intervalMs?: number) => Promise + waitForTxConfirmation: (options: WaitForTxOptions) => Promise +} + +type BridgeFormValues = { + srcChainId: string + srcDenom: string + dstChainId: string + dstDenom: string + quantity: string + sender: string + cosmosWalletName?: string + recipient: string + slippagePercent: string +} + +type TxRequest = { + messages: EncodeObject[] + memo?: string + chainId?: string + gas?: number + gasAdjustment?: number + gasPrices?: Coin[] | null + spendCoins?: Coin[] + internal?: boolean | string | number +} + +type TxParams = { + messages: EncodeObject[] + memo?: string + chainId?: string + fee: StdFee +} + +type WaitForTxOptions = { + txHash: string + chainId?: string + timeoutMs?: number + intervalMs?: number +} + +type AutoSignState = { + expiredAtByChain: Record + isEnabledByChain: Record + isLoading: boolean + enable: (chainId?: string) => Promise + disable: (chainId?: string) => Promise +} + +type OfflineAminoSigner = OfflineAminoSigner // Type from @cosmjs/amino +type EncodeObject = EncodeObject // Type from @cosmjs/proto-signing +type Coin = Coin // Type from cosmjs-types/cosmos/base/v1beta1/coin +type StdFee = StdFee // Type from @cosmjs/stargate +type DeliverTxResponse = DeliverTxResponse // Type from @cosmjs/stargate +type IndexedTx = IndexedTx // Type from @cosmjs/stargate +``` diff --git a/interwovenkit/references/hooks/use-portfolio.mdx b/interwovenkit/references/hooks/use-portfolio.mdx new file mode 100644 index 0000000..56a2a44 --- /dev/null +++ b/interwovenkit/references/hooks/use-portfolio.mdx @@ -0,0 +1,135 @@ +--- +title: usePortfolio +--- + +## Overview + +- Aggregates balances, asset metadata, and prices across all chains in the Initia registry into a single portfolio view +- Groups assets by symbol and computes per-chain and total portfolio value +- Tracks loading state and provides manual refetching for all underlying queries + +## Prerequisites + +- Must be rendered within `InterwovenKitProvider` +- Must be used within a React Query `QueryClientProvider` +- Must be used within a wagmi `WagmiProvider` +- Client-only (no SSR): Put this in a `use client` provider tree, or use a dynamic import in Next.js + +## Quickstart + +```tsx +"use client" + +import { usePortfolio } from "@initia/interwovenkit-react" + +function PortfolioValue() { + const { totalValue, isLoading } = usePortfolio() + if (isLoading) return Loading… + return ${totalValue.toFixed(2)} +} +``` + +## Return value + +**Aggregated values:** +- `totalValue`: Estimated total USD value across all chains +- `chainsByValue`: List of chains sorted by portfolio value on each chain + +**Grouped assets:** +- `assetGroups`: Aggregated assets grouped by symbol across chains +- `unlistedAssets`: Assets without registry metadata, kept separate from grouped assets + +**Loading and control helpers:** +- `isLoading`: `true` while any of the underlying queries are loading +- `refetch`: Manually refetches balances, assets, and prices for all chains + +## Examples + +### Full example (with providers) + +```tsx +"use client" + +import { QueryClient, QueryClientProvider } from "@tanstack/react-query" +import { WagmiProvider } from "wagmi" +import { + InterwovenKitProvider, + MAINNET, + usePortfolio, +} from "@initia/interwovenkit-react" + +const queryClient = new QueryClient() +// Define your wagmi config with connectors, chains, and transports +const wagmiConfig = /* your wagmi config */ + +function PortfolioValue() { + const { totalValue, isLoading } = usePortfolio() + if (isLoading) return Loading… + return ${totalValue.toFixed(2)} +} + +export function App() { + return ( + + + + + + + + ) +} +``` + +## Notes + +- The portfolio view only includes chains and assets that have non‑zero balances +- Prices are fetched from Initia's public APIs and may be slightly delayed relative to on‑chain data + +## Type reference (advanced) + +```ts +function usePortfolio(): PortfolioResult + +type PortfolioResult = { + chainsByValue: PortfolioChainItem[] + assetGroups: PortfolioAssetGroup[] + unlistedAssets: PortfolioAssetItem[] + totalValue: number + isLoading: boolean + refetch: () => void +} + +type PortfolioChainItem = { + chainId: string + name: string + logoUrl: string + value: number +} + +type PortfolioAssetGroup = { + symbol: string + logoUrl: string + assets: PortfolioAssetItem[] +} + +type PortfolioAssetItem = { + symbol: string + logoUrl: string + amount: string + denom: string + decimals: number + quantity: string + price?: number + value?: number + address?: string + unlisted?: boolean + chain: PortfolioChainInfo +} + +type PortfolioChainInfo = { + chainId: string + name: string + logoUrl: string +} +``` diff --git a/interwovenkit/references/hooks/use-username-query.mdx b/interwovenkit/references/hooks/use-username-query.mdx new file mode 100644 index 0000000..a7f25a7 --- /dev/null +++ b/interwovenkit/references/hooks/use-username-query.mdx @@ -0,0 +1,47 @@ +--- +title: useUsernameQuery +--- + +## Overview + +- React Query hook that fetches the `.init` username for the currently connected address +- Depends on the connected address and automatically re-runs when the address changes +- Exposes standard React Query loading and error state (`isLoading`, `error`, etc.) + +## Prerequisites + +- Must be rendered within `InterwovenKitProvider` +- Must be used within a React Query `QueryClientProvider` +- Must be used within a wagmi `WagmiProvider` +- Client-only (no SSR): Put this in a `use client` provider tree, or use a dynamic import in Next.js + +## Quickstart + +```tsx +"use client" + +import { useUsernameQuery } from "@initia/interwovenkit-react" + +function Username() { + const { data, isLoading } = useUsernameQuery() + if (isLoading) return Loading… + return {data ?? "No username"} +} +``` + +## Return value + +```ts +function useUsernameQuery(): UseQueryResult +``` + +Returns a React Query `UseQueryResult` object. The `data` property is: +- `string` when a username exists (ends with `.init`) +- `null` when no username exists or the address is invalid +- `undefined` before the query has produced a value or when the query is disabled + +Type `UseQueryResult` is from `@tanstack/react-query`. + +## Notes + +- The query is disabled until a non‑empty address is available from `useAddress()` diff --git a/interwovenkit/references/index.mdx b/interwovenkit/references/index.mdx new file mode 100644 index 0000000..7b765d2 --- /dev/null +++ b/interwovenkit/references/index.mdx @@ -0,0 +1,60 @@ +--- +title: Overview +--- + +The InterwovenKit React API provides components, hooks, and utilities for integrating Initia wallet connections, transaction signing, and UI flows into React applications. + +InterwovenKit is designed around a single provider (`InterwovenKitProvider`) that configures network and UI behavior, with hooks layered on top for state, UI control, and transactions. Most users start by configuring `InterwovenKitProvider` with a preset (`MAINNET` or `TESTNET`), then use hooks like `useInterwovenKit` or `useAddress` to read connection state and trigger UI flows. The API is organized into: + +- **Components**: React providers and UI components (`InterwovenKitProvider`, `InterwovenKit`) +- **Hooks**: React hooks for connection state, transactions, and data (`useInterwovenKit`, `useAddress`, `usePortfolio`, etc.) +- **Utilities**: Helper functions (`injectStyles`) +- **Errors**: Error types thrown by the API (`MoveError`) +- **Constants**: Configuration presets and default values (`MAINNET`, `TESTNET`, gas constants) +- **Connectors**: Wagmi and RainbowKit integration helpers for Privy wallets + +## Common starting points + +- **Initial setup**: [`InterwovenKitProvider`](./components/interwovenkit-provider.mdx) with [`MAINNET`](./constants/mainnet.mdx) or [`TESTNET`](./constants/testnet.mdx) +- **Read connection state**: [`useAddress`](./hooks/use-address.mdx) or [`useInterwovenKit`](./hooks/use-interwovenkit.mdx) +- **Open UI flows**: [`useInterwovenKit`](./hooks/use-interwovenkit.mdx) (`openConnect`, `openWallet`, `openBridge`) +- **Send transactions**: [`useInterwovenKit`](./hooks/use-interwovenkit.mdx) (`requestTxBlock`, `submitTxBlock`) + +If you are new to InterwovenKit, start with [`InterwovenKitProvider`](./components/interwovenkit-provider.mdx) and [`useInterwovenKit`](./hooks/use-interwovenkit.mdx). Everything else builds on top of those two APIs. + +## Components + +- [`InterwovenKitProvider`](./components/interwovenkit-provider.mdx) +- [`InterwovenKit`](./components/interwovenkit.mdx) + +## Hooks + +- [`useInterwovenKit`](./hooks/use-interwovenkit.mdx) +- [`useAddress`](./hooks/use-address.mdx) +- [`useHexAddress`](./hooks/use-hex-address.mdx) +- [`useInitiaAddress`](./hooks/use-initia-address.mdx) +- [`useUsernameQuery`](./hooks/use-username-query.mdx) +- [`usePortfolio`](./hooks/use-portfolio.mdx) + +## Utilities + +- [`injectStyles`](./utilities/inject-styles.mdx) + +## Errors + +- [`MoveError`](./errors/move-error.mdx) + +## Constants + +- [`MAINNET`](./constants/mainnet.mdx) +- [`TESTNET`](./constants/testnet.mdx) +- [`DEFAULT_GAS_ADJUSTMENT`](./constants/default-gas-adjustment.mdx) +- [`DEFAULT_GAS_PRICE_MULTIPLIER`](./constants/default-gas-price-multiplier.mdx) + +## Connectors + +- [`PRIVY_APP_ID`](./connectors/privy-app-id.mdx) +- [`initiaPrivyWalletOptions`](./connectors/initia-privy-wallet-options.mdx) +- [`initiaPrivyWalletConnector`](./connectors/initia-privy-wallet-connector.mdx) +- [`initiaPrivyWallet`](./connectors/initia-privy-wallet.mdx) + diff --git a/interwovenkit/references/interwovenkit-provider.mdx b/interwovenkit/references/interwovenkit-provider.mdx deleted file mode 100644 index 6d04232..0000000 --- a/interwovenkit/references/interwovenkit-provider.mdx +++ /dev/null @@ -1,217 +0,0 @@ ---- -title: InterwovenKitProvider ---- - -The `InterwovenKitProvider` is the root component that enables wallet -connectivity and transaction signing. - - - All applications using InterwovenKit must be wrapped with - `InterwovenKitProvider` at the root level to enable wallet functionality. - - -## Basic Configuration - -### Chain Connection - - - Sets the primary blockchain network that InterwovenKit uses as its default - throughout the application. This chain is used for transactions, balance - queries, appears first in asset displays, and serves as a fallback when no - specific chain is provided. - - -The `defaultChainId` parameter accepts **chain ID strings** that correspond to -chains in the [Initia registry](https://registry.initia.xyz). Common values -include: - -**Mainnet:** - -- `"interwoven-1"` - The main Initia network (default for mainnet) - -**Testnet:** - -- `"initiation-2"` - The Initia testnet (default for testnet) - - - When no `defaultChainId` is provided, the system automatically defaults to - `"interwoven-1"` (mainnet). For testnet development, use the `TESTNET` - configuration which includes `defaultChainId: "initiation-2"`. - - -```tsx -// Explicitly set to mainnet -export default function Providers() { - return ( - - {children} - - ) -} - -// Use testnet configuration (includes defaultChainId: "initiation-2") -export default function Providers() { - return {children} -} -``` - - - The `defaultChainId` affects transaction defaults, portfolio sorting, balance - queries, and bridge operations. Assets from the default chain will appear - first in lists, and all operations will use this chain unless explicitly - overridden. - - -### Custom Chain Support - - - Custom chain configuration for chains not registered in the initia-registry. - Use this when connecting to private or development chains. - - -```tsx -import { Chain } from '@initia/initia-registry-types' -import { ChainSchema } from '@initia/initia-registry-types/zod' -import { InterwovenKit } from '@initia/interwovenkit-react' - -const customChain: Chain = ChainSchema.parse({ - chain_id: 'YOUR_CHAIN_ID', - chain_name: 'YOUR_CHAIN_NAME', - apis: { - rpc: [{ address: 'YOUR_RPC_URL' }], - rest: [{ address: 'YOUR_LCD_URL' }], - }, - fees: { - fee_tokens: [{ denom: 'YOUR_FEE_DENOM', fixed_min_gas_price: 0.015 }], - }, - bech32_prefix: 'init', - network_type: 'mainnet', -}) - -export default function Providers() { - return ( - - {children} - - ) -} -``` - -### UI Theme - - - Controls the visual theme of wallet modals and components. - - -```tsx -export default function Providers() { - return {children} -} -``` - -## Advanced Configuration - -### Custom Message Types - -For applications that use custom transaction types beyond the standard Cosmos -and Initia modules, you'll need to configure protobuf types and amino -converters. - - - Protobuf message types for custom transaction signing. Only required when - using message types not included in default modules. - - -```tsx -import type { GeneratedType } from '@cosmjs/proto-signing' -import { MsgCustomAction } from './codec/myapp/tx' - -const protoTypes = [['/myapp.MsgCustomAction', MsgCustomAction]] as const - -export default function Providers() { - return ( - - {children} - - ) -} -``` - - - Amino converters for encoding/decoding custom messages. Required for - Amino-compatible messages not covered by default converters. - - -```tsx -import type { AminoConverters } from '@cosmjs/stargate' - -const aminoConverters: AminoConverters = { - '/myapp.MsgCustomAction': { - aminoType: 'myapp/MsgCustomAction', - toAmino: (msg) => ({ - creator: msg.creator, - data: msg.data, - }), - fromAmino: (amino) => ({ - creator: amino.creator, - data: amino.data, - }), - }, -} - -export default function Providers() { - return ( - - {children} - - ) -} -``` - -## Testnet Configuration - -### Infrastructure Endpoints - -The following props are automatically configured for Initia's mainnet -infrastructure and typically don't need to be set for rollup configurations: - - - URL for the chain registry service - - - - URL for the router API service - - - - Contract address for the usernames module - - -### Testnet Setup - -For testnet development, use the exported `TESTNET` constant which automatically -configures all required endpoints: - -```tsx -// providers.tsx -import { InterwovenKitProvider, TESTNET } from '@initia/interwovenkit-react' - -export default function Providers() { - return {children} -} -``` - - - The `TESTNET` constant automatically sets the correct `registryUrl`, - `routerApiUrl`, and `usernamesModuleAddress` for Initia's testnet environment. - - - - When switching between testnet and mainnet environments, clear your browser's - `localStorage` to avoid conflicts. InterwovenKit stores chain information - locally, and cached values from different networks can cause connection - errors. - diff --git a/interwovenkit/references/useinterwovenkit.mdx b/interwovenkit/references/useinterwovenkit.mdx deleted file mode 100644 index 7cf05be..0000000 --- a/interwovenkit/references/useinterwovenkit.mdx +++ /dev/null @@ -1,263 +0,0 @@ ---- -title: useInterwovenKit ---- - -The `useInterwovenKit` hook provides access to wallet connection state, account -information, UI controls, and transaction utilities for interacting with the -Initia blockchain. - - - This hook must be used within a component wrapped by `InterwovenKitProvider` - to access wallet functionality. - - -## Account Information - -The hook provides multiple address formats and account details for the currently -connected wallet: - - - Current address in either Bech32 or hex format, depending on the configured - `minitia` type. - - - - Bech32-formatted Initia wallet address of the connected account. - - - - Hex-encoded Ethereum-compatible address of the connected account. - - - - Optional username linked to the account. Returns `null` if no username is - associated. - - -```tsx -export default function Home() { - const { address, initiaAddress, hexAddress, username } = useInterwovenKit() - - return ( - <> -
{address}
-
{initiaAddress}
-
{hexAddress}
-
{username}
- - ) -} -``` - -## UI Controls - -The hook provides methods for controlling wallet-related UI components: - - - Opens a drawer for connecting an external wallet. - - - - Opens the main wallet drawer showing balances for the connected account. - - - - Opens the bridge drawer to onboard assets with optional pre-populated values. - - -### Bridge Form Interface - -The `BridgeFormValues` interface defines the optional parameters for -pre-populating the bridge form: - - - Source chain ID for the bridge transaction. - - - - Source token denomination to bridge from. - - - - Destination chain ID for the bridge transaction. - - - - Destination token denomination to bridge to. - - - - Initial bridge amount as entered by the user. Use human-readable values (e.g., - "1" for 1 INIT, not "1000000"). - - - - All bridge form values are optional. You can pre-populate any subset of fields - to improve the user experience. - - -```tsx -interface BridgeFormValues { - srcChainId?: string - srcDenom?: string - dstChainId?: string - dstDenom?: string - quantity?: string -} -``` - -### Example Usage - -```tsx -export default function Home() { - const { openConnect, openWallet, openBridge } = useInterwovenKit() - - return ( - <> - - - - - ) -} -``` - -## Transaction Methods - -The hook provides utilities for estimating, signing, and sending transactions on -the blockchain: - - - Estimates the gas required for a transaction before execution. - - - - Signs, broadcasts, and waits for block inclusion, returning the complete - transaction response. - - - - Signs and broadcasts a transaction, returning the transaction hash immediately - without waiting for block inclusion. - - - - Signs, broadcasts, and waits for block inclusion with pre-calculated fee, - returning the complete transaction response. - - - - Signs and broadcasts a transaction with pre-calculated fee, returning the - transaction hash immediately without waiting for block inclusion. - - - - Polls for transaction confirmation on-chain using a transaction hash. - - - - Use `requestTxSync` for better UX when you want to show immediate feedback, - then use `waitForTxConfirmation` to track the final transaction status. Use - `requestTxBlock` when you need the complete transaction result immediately. - - -### Transaction Request Interface - -The `TxRequest` interface defines the parameters for transaction operations: - - - Array of encoded transaction messages to include in the transaction. - - - - Optional memo to attach to the transaction. - - - - Target chain ID for the transaction. Defaults to the provider's - `defaultChainId`. - - - - Multiplier applied to the estimated gas amount for safety margin. - - - - Explicit gas limit for the transaction. If provided, skips gas estimation. - - - - Explicit fee for the transaction. If provided, skips the fee denomination - selection UI. - - -### Transaction Query Interface - -The `TxQuery` interface defines parameters for tracking transaction -confirmation: - - - Hash of the transaction to track for confirmation. - - - - Chain ID where the transaction was broadcast. - - - - Maximum time to wait for transaction confirmation before failing. - - - - Polling interval in seconds for checking transaction status. - - -### Type Definitions - -```tsx -import type { EncodeObject } from '@cosmjs/proto-signing' -import type { DeliverTxResponse, IndexedTx } from '@cosmjs/stargate' - -interface TxRequest { - messages: EncodeObject[] - memo?: string - chainId?: string - gasAdjustment?: number - gas?: number - fee?: StdFee | null -} - -interface TxQuery { - txHash: string - chainId?: string - timeoutSeconds?: number - intervalSeconds?: number -} -``` diff --git a/interwovenkit/references/utilities/inject-styles.mdx b/interwovenkit/references/utilities/inject-styles.mdx new file mode 100644 index 0000000..5ed740f --- /dev/null +++ b/interwovenkit/references/utilities/inject-styles.mdx @@ -0,0 +1,45 @@ +--- +title: injectStyles +--- + +## Overview + +- Injects CSS into InterwovenKit's Shadow DOM by appending a `