¡React 19 es compatible con Web SDK!
Instalando nuevas dependencias
Todas nuestras librerías de hooks han sido renombradas, estas son las nuevas dependencias que debe instalar para comenzar con Web SDK:
npm install @0xsequence/connect wagmi ethers@6.13.0 viem 0xsequence @tanstack/react-query
pnpm install @0xsequence/connect wagmi ethers@6.13.0 viem 0xsequence @tanstack/react-query
yarn add @0xsequence/connect wagmi ethers@6.13.0 viem 0xsequence @tanstack/react-query
Configurando su aplicación
Principales diferencias en cuanto a configuración:
import React from "react";
import ReactDOM from "react-dom/client";
import "./index.css";
import App from "./App";
import { SequenceConnect } from "@0xsequence/connect";
import { SequenceCheckoutProvider } from "@0xsequence/checkout"
import { config } from "./config";
function Dapp() {
return (
<SequenceConnect config={config}>
<SequenceCheckoutProvider>
<App />
</SequenceCheckoutProvider>
</SequenceConnect>
);
}
ReactDOM.createRoot(document.getElementById("root")!).render(
<React.StrictMode>
<Dapp />
</React.StrictMode>
);
@0xsequence/kit
-> @0xsequence/connect
para autenticación
@0xsequence/kit
-> @0xsequence/wallet-widget
para la interfaz de wallet
@0xsequence/kit-checkout
-> @0xsequence/checkout
- no es necesario importar manualmente
@0xsequence/design-system/styles.css
al usar @0xsequence/connect
@0xsequence/connect
es compatible con @0xsequence/design-system
v2
KitProvider
ahora es SequenceConnectProvider
KitCheckoutProvider
ahora es SequenceCheckoutProvider
KitWalletProvider
ahora es SequenceWalletProvider
Conectando su aplicación
import './App.css'
import { useOpenConnectModal } from '@0xsequence/connect'
function App() {
const {setOpenConnectModal} = useOpenConnectModal()
return (
<>
<button onClick={() => setOpenConnectModal(true)}>Connect</button>
</>
)
}
export default App