RtkMeeting

The top-level meeting component that orchestrates the entire meeting UI. Manages meeting lifecycle (idle, setup, joined, ended, waiting states), applies design system, handles room join/leave events, and renders the appropriate screen. With this component, you do not have to handle all the states, dialogs, and other smaller bits of managing the application.

Properties

Property	Type	Required	Default	Description
`meeting`	`RealtimeKitClient`	✅	-	The RealtimeKit meeting instance
`applyDesignSystem`	`boolean`	❌	`true`	Whether to apply the preset design system colors from the meeting config
`config`	`UIConfig`	❌	`defaultConfig`	UI configuration object
`iconPackUrl`	`string`	❌	`''`	URL to fetch a custom icon pack from
`showSetupScreen`	`boolean`	❌	`true`	Whether to show the setup/preview screen before joining
`iOSScreenshareEnabled`	`boolean`	❌	`false`	Turn on screenshare on iOS (requires additional native setup)
`t`	`RtkI18n`	❌	-	i18n translation function

Usage Examples

Basic Usage

import { RtkMeeting } from "@cloudflare/realtimekit-react-native-ui";

function MyComponent() {
  return <RtkMeeting meeting={meeting} />;
}

With Properties

import { RtkMeeting } from "@cloudflare/realtimekit-react-native-ui";

function MyComponent() {
  return (
    <RtkMeeting
      meeting={meeting}
      applyDesignSystem={true}
      showSetupScreen={true}
      iOSScreenshareEnabled={false}
    />
  );
}