Skip to content

RtkControlbar

The main control bar container that renders meeting controls (mic, camera, leave, and more) using the declarative UI config system.

Properties

PropertyTypeRequiredDefaultDescription
meetingRealtimeKitClient-The RealtimeKit meeting instance
configUIConfigdefaultConfigUI configuration object
size'lg' | 'md' | 'sm' | 'xl''sm'Size variant
variant'boxed' | 'solid''solid'Visual style variant
iconPackIconPack-Custom icon pack
statesStates-UI state object
tRtkI18n-i18n translation function

Usage Examples

Basic Usage

import { RtkControlbar } from "@cloudflare/realtimekit-react-native-ui";
function MyComponent() {
return <RtkControlbar meeting={meeting} />;
}

With Properties

import { RtkControlbar } from "@cloudflare/realtimekit-react-native-ui";
function MyComponent() {
return (
<RtkControlbar
meeting={meeting}
variant="solid"
size="md"
config={customConfig}
/>
);
}