LLChatHeader represents the ChatUI Header and it is rendered at the top of the Chat UI
import React from 'react';
import { StyleSheet, View } from 'react-native';
import { LLChatHeader, LLChatHeaderStyles } from '@livelike/react-native';
import { Body, Footer } from '../components';
export function MyApp() {
return (
<View>
<LLChatHeader title="My Header" styles={headerStyle} />
<Body />
<Footer />
</View>
);
}
const headerStyle: Partial<LLChatHeaderStyles> = StyleSheet.create({
headerContainer: { padding: 10 },
headerTitle: { fontSize: 15 },
});
import React from 'react';
import {
LLChat,
LLChatHeader,
LLChatHeaderStyles,
} from '@livelike/react-native';
import { StyleSheet } from 'react-native';
export function MyApp() {
return (
<LLChat
roomId="<Your chat room id>"
HeaderComponent={() => (
<LLChatHeader title="My Chatroom" styles={headerStyle} />
)}
/>
);
}
const headerStyle: Partial<LLChatHeaderStyles> = StyleSheet.create({
headerContainer: { padding: 10 },
headerTitle: { fontSize: 15 },
});
| Type | Default |
|---|
| String (Required) | No Default |
| CSS Class | Type | Description |
|---|
| headerContainer | ViewStyle | Header container |
| headerTitle | TextStyle | Text in the header container |
