# Comenzar ### Descripción general El Trustless Work React SDK es una colección de hooks y entidades tipadas. Utiliza [Axios](https://axios-http.com/docs/intro) para solicitudes HTTP. {% hint style="info" %} Los flujos de escritura requieren una clave de API (`NEXT_PUBLIC_API_KEY`). Las llamadas de solo lectura pueden funcionar sin una. {% endhint %} ### Enlaces rápidos
TítuloEnlace
Paquete NPMhttps://www.npmjs.com/package/@trustless-work/escrow
Conceptos básicos de la API (URLs base, Swagger, límites)Introduction
Enviar transacciones firmadas (XDR)useSendTransaction
### Configuración {% stepper %} {% step %} ### Instalación Instala el SDK. {% tabs %} {% tab title="npm" %} ```sh npm install "@trustless-work/escrow" ``` {% endtab %} {% tab title="yarn" %} ```sh yarn add "@trustless-work/escrow" ``` {% endtab %} {% endtabs %} {% endstep %} {% step %} ### Configura el proveedor Configurarás 2 cosas: * `baseURL`: usa `development` (testnet) o `mainNet` (mainnet). * `apiKey`: desde el dApp BackOffice. El SDK exporta `TrustlessWorkConfig`. Envuelve tu aplicación con él para habilitar todos los hooks. {% code title="src/trustless-work-provider.tsx" overflow="wrap" fullWidth="true" %} ```typescript "use client"; // asegúrate de que este sea un componente cliente import React from "react"; import { // entorno de desarrollo = "https://dev.api.trustlesswork.com" development, // entorno mainnet = "https://api.trustlesswork.com" mainNet, TrustlessWorkConfig, } from "@trustless-work/escrow"; interface TrustlessWorkProviderProps { children: React.ReactNode; } export function TrustlessWorkProvider({ children, }: TrustlessWorkProviderProps) { const apiKey = process.env.NEXT_PUBLIC_API_KEY || ""; return ( {children} ); } ``` {% endcode %} {% hint style="warning" %} Si renderizas este proveedor en el servidor, los hooks fallarán. Mantenlo en un componente cliente. {% endhint %} {% endstep %} {% step %} ### Envuelve tu aplicación Elige el fragmento que coincida con tu configuración. {% tabs %} {% tab title="Next.js (App Router)" %} {% code title="app/layout.tsx" %} ```typescript import { TrustlessWorkProvider } from "@/trustless-work-provider"; export default function RootLayout({ children }: { children: React.ReactNode }) { return ( {children} ); } ``` {% endcode %} {% endtab %} {% tab title="React (SPA)" %} {% code title="src/app.tsx" %} ```typescript import { TrustlessWorkProvider } from "./trustless-work-provider"; export function App() { return ( ); } ``` {% endcode %} {% endtab %} {% endtabs %} {% endstep %} {% step %} ### Usa hooks y entidades Ahora puedes llamar a los hooks del SDK desde cualquier componente bajo el proveedor. Flujo típico: 1. Llama a un hook para obtener un **XDR sin firmar**. 2. Firma el XDR con la wallet del rol correcto. 3. Envíalo con `useSendTransaction`. Leer: [useSendTransaction](https://app.gitbook.com/s/Dg2e2YCRmNlhCnxxmEb6/escrow-react-sdk/usesendtransaction). {% endstep %} {% endstepper %} {% hint style="success" %} Este SDK soporta **single-release** y **multi-release** escrows. Usa el hook y el tipo de payload correctos para cada flujo. {% endhint %}