RtkParticipantTile

A video tile for a single participant showing their video feed, name tag with audio indicator, avatar (when video is off), and pin indicator.

Properties

Property	Type	Required	Default	Description
meeting	RealtimeKitClient	✅	-	The RealtimeKit meeting instance
participant	RTKParticipant | RTKSelf	✅	-	The participant to render
config	UIConfig	❌	defaultConfig	UI configuration object
style	StyleProp<any>	❌	-	Custom styles (typically width/height for grid sizing)
nameTagPosition	'bottom-center' | 'bottom-left' | 'bottom-right' | 'top-center' | 'top-left' | 'top-right' | 'none'	❌	'bottom-left'	Position of the name tag overlay
isPreview	boolean	❌	false	Whether this is a preview tile (setup screen)
iconPack	IconPack	❌	defaultIconPack	Custom icon pack
size	'lg' | 'md' | 'sm' | 'xl'	❌	'sm'	Size variant
states	States	❌	-	UI state object
t	RtkI18n	❌	-	i18n translation function
children	ReactNode	❌	-	Additional content to overlay on the tile

Usage Examples

Basic Usage

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

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

With Properties

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

function MyComponent() {
  return (
    <RtkParticipantTile
      meeting={meeting}
      participant={participant}
      nameTagPosition="bottom-left"
      isPreview={false}
      size="md"
    />
  );
}

Explain Code