Skip to content

Commit

Permalink
Update chat docs with new options and methods
Browse files Browse the repository at this point in the history
  • Loading branch information
jordrake committed Dec 9, 2024
1 parent 7c9b895 commit acbd5a5
Show file tree
Hide file tree
Showing 3 changed files with 49 additions and 1 deletion.
12 changes: 11 additions & 1 deletion _snippets/chat/customization.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,9 @@ Plain.init({
// When specified, launcher will be hidden by default.
embedAt: '#embed',

// Optional. Hides the 'Powered by Plain' branding
hideBranding: false,

// Optional. The color scheme of the Chat, is either 'auto', 'light', or 'dark'
// 'auto' uses the user's browser preference to decide between light and dark mode (default: 'auto')
theme: 'light',
Expand All @@ -63,14 +66,21 @@ Plain.init({
alt: 'An example logo';
};

// Optional. Position of the chat widget when it is floating.
// See https://developer.mozilla.org/en-US/docs/Web/CSS/position for more information - only bottom and right are supported
position: {
right: '10px',
bottom: '10px',
}

// Optional. Allows you to set fields for the threads which are created from chats
threadDetails: {
// See the data model documentation [asdasd](/chat/customization#all-threads) for more information on these fields
};

// Optional. Lets you customize the buttons which are used to start a new chat on the intro screen
chatButtons: [
// See the chat buttons documentation (https://localhost:3000/chat/customization#chat-buttons) for more information on these fields
// See the chat buttons documentation for more information on these fields
];
});
```
30 changes: 30 additions & 0 deletions _snippets/chat/methods.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
```typescript
// This takes the same arguments as Plain.init. It will update the chat widget in-place with the new configuration.
// Only top-level fields are updated, nested fields are not merged.
Plain.update({ ... });

// This takes the same arguments as `customerDetails` in Plain.init.
// This will update just the customer details in the chat widget. This may be useful if you have asynchronous authentication state
Plain.setCustomerDetails({ ...})

// Opens and closes the widget if using the default, floating mode
Plain.open();
Plain.close();

// These are event listeners that will be fired when the chat widget is opened or closed respectively
// These return a function that can be called to remove the listener
Plain.onOpen(() =>{
// Opened
});
Plain.onClose(() => {
// Closed
});

// Returns whether or not the chat widget is initialized
Plain.isInitialized();

// This returns an array with debug logs that have been collected by the chat widget
// This is useful if you contacting Plain support with an issue regarding the chat widget
// This will redact sensitive information such as customer details
Plain.exportDebugLogs();
```
8 changes: 8 additions & 0 deletions chat/customization.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -59,3 +59,11 @@ Similar to chat buttons, chat forms allow you to set fields on the thread when t
<Accordion title="Chat forms code">
<Snippet file="chat/chat-forms.mdx" />
</Accordion>

### Additional methods

We provide additional methods on the Plain object to provide more control over the chat widget. This may be helpful to keep the chat widget in-sync with your existing application state.

<Accordion title="Chat forms code">
<Snippet file="chat/methods.mdx" />
</Accordion>

0 comments on commit acbd5a5

Please sign in to comment.