77- Customizable chat interface
88- Easy to show/hide programmatically
99- Supports custom header components
10+ - Supports filling user information into live chat. (v0.5 or higher)
1011- Adjustable insets for different device sizes
1112- TypeScript support
1213
@@ -44,12 +45,24 @@ export default function App() {
4445 // widgetRef.current?.hide();
4546 };
4647
48+ const user = {
49+ user_id: ' UNIQUE_USER_ID' ,
50+ user: {
51+ email: ' acme@example.com' , // Your user's email address
52+ first_name: ' John' ,
53+ last_name: ' Doe' ,
54+ phone: ' +1234567890' ,
55+ custom_field: ' CUSTOMER_FIELD_VALUE' // Replace key and value with your custom field
56+ },
57+ }
58+
4759 return (
4860 < View style= {{ flex: 1 }}>
4961 < Button title= " Open Chat" onPress= {handleOpenChat} / >
5062 < ChativeWidget
5163 ref= {widgetRef}
5264 channelId= " your-channel-id"
65+ user= {user} // v0.5 or higher
5366 onClosed= {() => console .log (' Widget closed' )}
5467 onLoaded= {() => console .log (' Widget loaded' )}
5568 onNewMessage= {(message ) => console .log (' New message:' , message)}
@@ -64,6 +77,7 @@ export default function App() {
6477| Prop | Type | Required | Description |
6578|------|------|----------|-------------|
6679| channelId | string | Yes | The ID of the chat channel |
80+ | user | ChativeWidgetUser | No | Information about the user, used for booting into live chat.
6781| headerComponent | ReactElement | No | Custom header component |
6882| containerStyle | ViewStyle | No | Custom style for the container |
6983| insetTop | number | No | Top inset (default: 50 for iOS, 20 for Android) |
@@ -98,8 +112,17 @@ You can customize the appearance of the widget by providing a custom header comp
98112This module includes TypeScript declarations. You can import types like this:
99113
100114` ` ` typescript
101- import ChativeWidget , { ChativeWidgetRef } from ' @chative.io/react-native-widget' ;
115+ import ChativeWidget , { ChativeWidgetRef , ChativeWidgetUser } from ' @chative.io/react-native-widget' ;
102116` ` `
117+ ### ChativeWidgetUser Interface
118+ | Field | Type | Required | Description |
119+ |---------------|----------|----------|-------------|
120+ | user_id | string | Yes | A unique identifier for the user. This is used to track the user's session in the chat. |
121+ | user.email | string | No | The user's email address. Optional, but recommended for better user identification. |
122+ | user.first_name | string | No | The user's first name. Optional, useful for personalized interactions. |
123+ | user.last_name | string | No | The user's last name. Optional, useful for personalized interactions. |
124+ | user.phone | string | No | The user's phone number. Optional, can be used for follow-up contact. |
125+ | user.[key: string]: any | any | No | Any additional information about the user, represented as key-value pairs. This can be used for custom data. |
103126
104127## License
105128
0 commit comments