GuidesOther Frameworks

Other Frameworks

@suko/chat is a React package and works in any React-based project.

Vite + React

npm install @suko/chat
// src/App.tsx
import { SukoChat } from '@suko/chat'
 
function App() {
  return (
    <>
      {/* your app */}
      <SukoChat apiKey={import.meta.env.VITE_SUKO_API_KEY} />
    </>
  )
}
# .env
VITE_SUKO_API_KEY=sk_live_your_key

Remix

// app/root.tsx
import { SukoChat } from '@suko/chat'
 
export default function Root() {
  return (
    <html>
      <body>
        <Outlet />
        <SukoChat apiKey={process.env.SUKO_API_KEY!} />
        <Scripts />
      </body>
    </html>
  )
}

Astro (with React integration)

---
// src/layouts/Layout.astro
---
<html>
  <body>
    <slot />
    <SukoWidget client:load />
  </body>
</html>
// src/components/SukoWidget.tsx
import { SukoChat } from '@suko/chat'
 
export default function SukoWidget() {
  return <SukoChat apiKey={import.meta.env.PUBLIC_SUKO_API_KEY} />
}
Next.jsCustomization