To get started simply add
papercups_flutter: and the latest version to your pubspec.yaml.
flutter pub get
🎉 Done, It's that simple.
Using the widget
Integration with your app requires just a few lines of code, add the following widget wherever you want your papercups chat window to be:
import 'package:papercups_flutter/papercups_flutter.dart'; PaperCupsWidget( props: Props( accountId: "xxxxxxxx-xxxxxxx-xxxx-xxxxxx", //Your account id goes here. ), ),
That should get you up and running in just a few seconds ⚡️.
Available PaperCupsWidget arguments
|An override of the iframe URL we use to render the chat, if you chose to self-host that as well||https://chat-widget.papercups.io|
|Required, here is where all of the config for the chat is contained||N/A|
|A function to execute on the close button, only visible in mobile versions. If ||N/A|
|A function that will be called when the widget starts loading the website.||N/A|
|A function that will be called when the widget finishes loading the website. May be called multiple times||N/A|
|A function that will be called if the widget finds an error while loading.||N/A|
Available Props paramaters
|Required, your Papercups account token||N/A|
|The title in the header of your chat widget||Welcome!|
|The subtitle in the header of your chat widget||How can we help you?|
|The placeholder text in the new message input||Start typing...|
|The theme color of your chat widget|
|An optional initial message to greet your customers with||N/A|
|If you want to show whether you (or your agents) are online or not|
|The text shown when you (or your agents) are online||We're online right now!|
|The text shown when you (and your agents) are offline||We're away at the moment.|
|Identifying information for the customer, including ||N/A|
|The base URL of your API if you're self-hosting Papercups||https://app.papercups.io|
|If you want to require unidentified customers to provide their email before they can message you|
Available CustomerMetaData paramaters
|The customer's email||N/A|
|The customer's external ID||N/A|
|The customer's name||N/A|
|Extra metadata to pass such as OS info.||N/A|
- closeAction is not supported on Web at this point in time, this is due to the iframe absorbing all clicks before the button detects them. For more info see https://github.com/flutter/flutter/issues/54027.
- Some widgets such as
clipRRectwill not affect the WebView on mobile, and will not change the widget. This works on web though.
- On mobile,
onFinishedLoading()will be called multiple times.