Skip to content

RtkGrid

The main grid component which abstracts all the grid handling logic and renders it for you.

Properties

PropertyTypeRequiredDefaultDescription
aspectRatiostring✅-The aspect ratio of each participant
configUIConfig❌createDefaultConfig()Config object
gapnumber✅-Gap between participants
gridSizeGridSize✅-Grid size
iconPackIconPack❌defaultIconPackIcon pack
layoutGridLayout✅-Grid Layout
meetingMeeting✅-Meeting object
overridesany✅-@deprecated
sizeSize✅-Size
statesStates✅-States
tRtkI18n❌useLanguage()Language

Usage Examples

Basic Usage

import { RtkGrid } from '@cloudflare/realtimekit-react-ui';
function MyComponent() {
return <RtkGrid />;
}

With Properties

import { RtkGrid } from '@cloudflare/realtimekit-react-ui';
function MyComponent() {
return (
<RtkGrid
aspectRatio="example"
gap={42}
gridSize="md"
/>
);
}