connect_x_flutter_livechat_sdk 1.1.3

Live Chat SDK for Flutter

Connect-X Live Chat SDK

An SDK for easily integrating the Connect-X Live Chat into your Flutter application for Connect-X ticket. You need to config Live Chat connector from Connect-X by navigating to: Organization Settings → Connector → Live Chat.

✨ Features

• Displays a chat window as a modal over the main screen.
• Supports sending text messages, images, and document.
• Displays chat history with date partitions.
• Customizable styles and colors from from Connect-X by navigating to: Organization Settings → Connector → Live Chat → Style.
• Supports custom header components.
• Image preview with zoom capabilities.

🔧 Installation

flutter pub add connect_x_flutter_livechat_sdk

🚀 Usage

import 'package:connect_x_flutter_livechat_sdk/connect_x_flutter_livechat_sdk.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await ChatController.instance.initialize(
    token: 'YOUR_TOKEN', // Replace with your actual token
    orgId: 'YOUR_ORG_ID', // Replace with your actual org ID
    channelId: 'YOUR_CHANNEL_ID', // Replace with your actual channel ID
    externalValue: 'YOUR_EXTERNAL_VALUE', // Replace with a unique user identifier
  );
  runApp(const MyApp());
}

// Open Chat Screen
ElevatedButton(
onPressed: () {
  Navigator.push(
    context,
    MaterialPageRoute(
      builder: (context) => ChatScreen(
        onClose: () => Navigator.pop(context),
         // You can also pass a custom header if needed:
        customHeader: AppBar(
          title: const Text("Support Chat"),
          backgroundColor: Colors.teal,
        ),
      ),
    ),
  );
},
child: const Text("Open Chat UI"),
),

// Send message to chat
ChatController.instance.sendMessage(text: text);

📖 API Reference

A method to open the chat window. It accepts a config object with the following properties:

Prop	Type	Required	Description
token	string	Yes	Authorization token for authentication from Connect-X by navigating to: Organization Settings → SDK Tracking.
orgId	string	Yes	Your organization's ID.
channelId	string	Yes	The ID of the Live Chat channel.
externalValue	string	Yes	A value to identify the customer(Should be unique), You can setup external key from Connect-X by navigating to: Organization Settings → Connector → Live Chat → Drop Form → Upsert Key.
customHeader	React.ReactNode	No	A React Component to render as a replacement for the default chat header.
isHideCloseButton	bool	No	Set to true to hide the default close (✕) button on the top right of the chat header.

---

📄 License

---

Made with create-react-native-library