@avaya/infinity-omni-sdk-messaging-ui 1.0.2 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +63 -63
- package/lib/avaya-infinity-omni-sdk-messaging-ui.min.js +21982 -21868
- package/lib/index.d.ts +47 -1
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -41,15 +41,15 @@ Your website's main HTML file: `index.html`
|
|
|
41
41
|
<!-- Your index.html -->
|
|
42
42
|
<!doctype html>
|
|
43
43
|
<html lang="en" dir="ltr">
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
44
|
+
<head>
|
|
45
|
+
<meta charset="UTF-8" />
|
|
46
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
47
|
+
<title>Messaging-App-UI</title>
|
|
48
|
+
<script src="/path/to/your-website-script.js"></script>
|
|
49
|
+
</head>
|
|
50
|
+
<body>
|
|
51
|
+
<avaya-infinity-omni-sdk-messaging-ui></avaya-infinity-omni-sdk-messaging-ui>
|
|
52
|
+
</body>
|
|
53
53
|
</html>
|
|
54
54
|
```
|
|
55
55
|
|
|
@@ -60,37 +60,37 @@ As stated above the Avaya Infinity™ Omni SDK Messaging UI requires some config
|
|
|
60
60
|
**Example:**
|
|
61
61
|
|
|
62
62
|
```js
|
|
63
|
-
const messagingUiConfig = {
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
};
|
|
63
|
+
const messagingUiConfig = {
|
|
64
|
+
host: "<Avaya Infinity Hostname>",
|
|
65
|
+
integrationId: "<Web Chat Integration Id>",
|
|
66
|
+
// Other optional configurations are omitted for brevity.
|
|
67
|
+
// Please refer to 'MessagingUiConfig' type for more details.
|
|
68
|
+
};
|
|
69
69
|
```
|
|
70
70
|
|
|
71
71
|
#### Configuration options
|
|
72
72
|
|
|
73
73
|
The Avaya Infinity™ Omni SDK Messaging UI supports following configuration options:
|
|
74
74
|
|
|
75
|
-
| Option | Type
|
|
76
|
-
| ---------------------------------- |
|
|
77
|
-
| `host` | `string`
|
|
78
|
-
| `integrationId` | `string`
|
|
79
|
-
| `sessionParameters` | `object`
|
|
80
|
-
| `logLevel` | `LogLevel`
|
|
81
|
-
| `idleTimeoutDuration` | `number`
|
|
82
|
-
| `idleShutdownGraceTimeoutDuration` | `number`
|
|
83
|
-
| `locale` | `string`
|
|
84
|
-
| `onMessageBubbleClicked` | `function`
|
|
85
|
-
| `onInit` | `function`
|
|
86
|
-
| `onShutdown` | `function`
|
|
87
|
-
| `onIdleTimeout` | `function`
|
|
88
|
-
| `beforeMessageSend` | `function`
|
|
89
|
-
| `beforeMessageRender` | `function`
|
|
90
|
-
| `displayStrings` | `DisplayStrings`
|
|
91
|
-
| `emojiMartTranslations` | `Record<Locale,EmojiMartTranslation>`
|
|
92
|
-
| `themeCustomizations` | `Record<string, MessagingUiTheme>`
|
|
93
|
-
| `initialTheme` | `string`
|
|
75
|
+
| Option | Type | Required/Optional | Description |
|
|
76
|
+
| ---------------------------------- | -------------------------------------------- | ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
77
|
+
| `host` | `string` | Required | Hostname of the Avaya Infinity™ platform. |
|
|
78
|
+
| `integrationId` | `string` | Required | The Web Chat Integration Id available to your account administrator when the Web Chat Integration was created. |
|
|
79
|
+
| `sessionParameters` | `object` | Optional | The session parameters to be passed to the Avaya Infinity™ platform. |
|
|
80
|
+
| `logLevel` | `LogLevel` | Optional | The log level for the Messaging UI. Default is `WARN`. |
|
|
81
|
+
| `idleTimeoutDuration` | `number` | Optional | The duration in milliseconds after which the user is considered idle. |
|
|
82
|
+
| `idleShutdownGraceTimeoutDuration` | `number` | Optional | The maximum time in milliseconds a user can still remain inactive after the idle timeout, before which the Messaging UI automatically shuts down. |
|
|
83
|
+
| `locale` | `string` | Optional | The locale to be used for the Messaging UI. Default is `en-US`. |
|
|
84
|
+
| `onMessageBubbleClicked` | `function` | Optional | The callback function to be called when the message bubble is clicked. |
|
|
85
|
+
| `onInit` | `function` | Optional | The callback function to be called when the Messaging UI is initialized for the current User (identified by the JWT). |
|
|
86
|
+
| `onShutdown` | `function` | Optional | The callback function to be called when the current session for the current User is closed. |
|
|
87
|
+
| `onIdleTimeout` | `function` | Optional | The callback function to be called when the current User is considered idle. |
|
|
88
|
+
| `beforeMessageSend` | `function` | Optional | The callback function to be called before a message is sent. |
|
|
89
|
+
| `beforeMessageRender` | `function` | Optional | The callback function to be called before a message is rendered on the screen. |
|
|
90
|
+
| `displayStrings` | `DisplayStrings` | Optional | An object containing the display strings and their translations to be used in the Messaging UI. See [custom display strings and translations](#custom-display-strings-and-translations) section. |
|
|
91
|
+
| `emojiMartTranslations` | `Record<Locale,EmojiMartTranslation>` | Optional | Messaging UI uses [Emoji Mart](https://github.com/missive/emoji-mart) Component as emoji picker. This configuration expects an object containing the display strings and their translations to be used for the emoji mart component. |
|
|
92
|
+
| `themeCustomizations` | `Record<string, MessagingUiTheme>` | Optional | An object containing the theme customizations for the Messaging UI. Each key is a theme name and the value is the customizations for that theme. See [theme customization](#theme-customization) section. |
|
|
93
|
+
| `initialTheme` | `string` | Optional | Name of the initial theme to be applied out of the themes provided via the `themeCustomizations` configuration for the Messaging UI. |
|
|
94
94
|
|
|
95
95
|
### Load Messaging UI
|
|
96
96
|
|
|
@@ -101,30 +101,30 @@ The Messaging UI should be loaded by calling the static load method on the class
|
|
|
101
101
|
> The Messaging UI can only be loaded once per page.
|
|
102
102
|
|
|
103
103
|
```js
|
|
104
|
-
import { AvayaInfinityOmniSdkMessagingUi } from
|
|
104
|
+
import { AvayaInfinityOmniSdkMessagingUi } from '@avaya/infinity-omni-sdk-messaging-ui';
|
|
105
105
|
|
|
106
106
|
// Your code ...
|
|
107
107
|
|
|
108
108
|
async function loadMessagingUi() {
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
109
|
+
// Create the configuration object for the Messaging UI.
|
|
110
|
+
const messagingUiConfig = {
|
|
111
|
+
host: "<Avaya Infinity Hostname>",
|
|
112
|
+
integrationId: "<Web Chat Integration Id>",
|
|
113
|
+
// Other optional configurations are omitted for brevity.
|
|
114
|
+
// Please refer to 'MessagingUiConfig' type for more details.
|
|
115
|
+
};
|
|
116
|
+
|
|
117
|
+
// Fetch the JWT from your backend web application.
|
|
118
|
+
const token = await myBackendServer.fetchToken();
|
|
119
|
+
|
|
120
|
+
// Load the Messaging UI with the configuration and JWT.
|
|
121
|
+
await AvayaInfinityOmniSdkMessagingUi.load(messagingUiConfig, token);
|
|
122
122
|
}
|
|
123
123
|
|
|
124
124
|
// Call the loadMessagingUi function when the window is loaded.
|
|
125
125
|
window.onload = () => {
|
|
126
|
-
|
|
127
|
-
|
|
126
|
+
// Load the Messaging UI when the window is loaded.
|
|
127
|
+
loadMessagingUi()
|
|
128
128
|
};
|
|
129
129
|
```
|
|
130
130
|
|
|
@@ -145,19 +145,19 @@ JWT Provider example (in TypeScript):
|
|
|
145
145
|
import { JwtProvider } from "@avaya/infinity-omni-sdk-messaging-ui";
|
|
146
146
|
|
|
147
147
|
class MyJwtProvider implements JwtProvider {
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
148
|
+
onExpiryWarning(timeToExpiry: number): void {
|
|
149
|
+
// Fetch the JWT from your backend web application.
|
|
150
|
+
const token = await myBackendServer.fetchToken();
|
|
151
|
+
// Set the new JWT in the Messaging UI.
|
|
152
|
+
AvayaInfinityOmniSdkMessagingUi.getInstance().setJwt(token);
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
onExpiry(): void {
|
|
156
|
+
// Fetch the JWT from your backend web application.
|
|
157
|
+
const token = await myBackendServer.fetchToken();
|
|
158
|
+
// Set the new JWT in the Messaging UI.
|
|
159
|
+
AvayaInfinityOmniSdkMessagingUi.getInstance().setJwt(token);
|
|
160
|
+
}
|
|
161
161
|
}
|
|
162
162
|
```
|
|
163
163
|
|