logo pub package likes style: effective dart

Installing

To get started simply add papercups_flutter: and the latest version to your pubspec.yaml. Then run 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 ⚡️.

Configuration

Available PaperCupsWidget arguments

ParameterTypeValueDefault
iframeUrlstringAn override of the iframe URL we use to render the chat, if you chose to self-host that as wellhttps://chat-widget.papercups.io
propsPropsRequired, here is where all of the config for the chat is containedN/A
closeActionFunctionA function to execute on the close button, only visible in mobile versions. If null, close button will not render.N/A
onStartLoadingFunctionA function that will be called when the widget starts loading the website.N/A
onFinishLoadingFunctionA function that will be called when the widget finishes loading the website. May be called multiple timesN/A
onErrorFunctionA function that will be called if the widget finds an error while loading.N/A

Available Props paramaters

PropTypeValueDefault
accountIdstringRequired, your Papercups account tokenN/A
titlestringThe title in the header of your chat widgetWelcome!
subtitlestringThe subtitle in the header of your chat widgetHow can we help you?
newMessagePlaceholderstringThe placeholder text in the new message inputStart typing...
primaryColorColorThe theme color of your chat widgetTheme.of(context).primaryColor without alpha
greetingstringAn optional initial message to greet your customers withN/A
showAgentAvailabilitybooleanIf you want to show whether you (or your agents) are online or notfalse
agentAvailableTextstringThe text shown when you (or your agents) are onlineWe're online right now!
agentUnavailableTextstringThe text shown when you (and your agents) are offlineWe're away at the moment.
customerCustomerMetadataIdentifying information for the customer, including name, email, external_id, and metadata (for any custom fields)N/A
baseUrlstringThe base URL of your API if you're self-hosting Papercupshttps://app.papercups.io
requireEmailUpfrontbooleanIf you want to require unidentified customers to provide their email before they can message youfalse

Available CustomerMetaData paramaters

ParametersTypeValueDefault
emailstringThe customer's emailN/A
externalIdstringThe customer's external IDN/A
namestringThe customer's nameN/A
otherMetadataMap<String, String>Extra metadata to pass such as OS info.N/A

Known Issues

  • 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 clipRRect will 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.

Libraries

classes
empty
genIframeUrl
mobileWidget
papercups_flutter
platformViewStub
webWidget