Añade Liquidify a una aplicación React Router.
Instala Liquidify en tu proyecto:
pnpm add @liquidify/reactImporta la hoja de estilos en la ruta raíz o en el punto de entrada del cliente para cargarla una sola vez:
// app/root.tsx
import "@liquidify/react/styles.css"
import { Outlet } from "react-router"
import { Theme } from "@liquidify/react"
export default function Root() {
return (
<Theme type="system">
<Outlet />
</Theme>
)
}Importa los componentes en los módulos de ruta:
import { Button } from "@liquidify/react"
export default function AccountRoute() {
return <Button onClick={() => console.log("saved")}>Guardar account</Button>
}Si usas renderizado en servidor, coloca la lógica que depende del navegador dentro de efectos. Usa los mismos valores controlados iniciales en el servidor y el cliente.