Embed Dashboard

The <Dashboard> component renders the full BIAB dashboard as an iframe inside your application — your users see the same dashboard they'd see at app.biab.app, without leaving your site.

import { Dashboard, DashboardProvider } from '@biab-dev/sdk/react'

function App() {
  return (
    <DashboardProvider apiKey={process.env.BIAB_API_KEY}>
      <Dashboard defaultPath="/dashboard/forms" />
    </DashboardProvider>
  )
}

Props:

The SDK handles authentication and session creation automatically through the DashboardProvider. The iframe communicates with the parent window via a secure postMessage protocol, so your app can listen for navigation changes or trigger dashboard actions.

import { useDashboardSession } from '@biab-dev/sdk/react'

function DashboardToolbar() {
  const session = useDashboardSession()
  return <span>Session: {session.id}</span>
}