Installation

React

bun add @q9labs/chalk-react

The React SDK includes @q9labs/chalk-core as a dependency.

Import Styles

Import the CSS stylesheet for built-in components:

import '@q9labs/chalk-react/styles.css'

Verify Installation

import { ChalkProvider, VideoConference } from '@q9labs/chalk-react'
import '@q9labs/chalk-react/styles.css'

function App() {
  // Token obtained from your backend (see Authentication guide)
  const token = 'eyJ...'

  return (
    <ChalkProvider apiUrl="https://api.chalk.q9labs.ai" token={token}>
      <VideoConference
        roomId="my-room"
        userName="Alice"
      />
    </ChalkProvider>
  )
}

ChalkProvider Props

Prop	Type	Description
apiUrl	string	Chalk API base URL
token	string	JWT token from participant join
children	ReactNode	Your app components

Next Steps

• Set up authentication to get tokens
• Explore the VideoConference component for customization