@microsoft/omnichannel-chat-widget 0.1.0-main.d5a92f2 → 0.1.0-main.d8553fe
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/lib/cjs/common/Constants.js +2 -2
- package/lib/cjs/components/confirmationpanestateful/ConfirmationPaneStateful.js +1 -1
- package/lib/cjs/components/emailtranscriptpanestateful/EmailTranscriptPaneStateful.js +1 -1
- package/lib/cjs/components/headerstateful/HeaderStateful.js +3 -1
- package/lib/cjs/components/livechatwidget/common/defaultProps/dummyDefaultProps.js +55 -7
- package/lib/cjs/components/livechatwidget/common/reconnectChatHelper.js +1 -4
- package/lib/cjs/components/webchatcontainerstateful/common/utils/FileAttachmentIconManager.js +2 -0
- package/lib/cjs/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/timestamps/DeliveredTimestamp.js +5 -6
- package/lib/esm/common/Constants.js +2 -2
- package/lib/esm/components/confirmationpanestateful/ConfirmationPaneStateful.js +1 -1
- package/lib/esm/components/emailtranscriptpanestateful/EmailTranscriptPaneStateful.js +1 -1
- package/lib/esm/components/headerstateful/HeaderStateful.js +3 -1
- package/lib/esm/components/livechatwidget/common/defaultProps/dummyDefaultProps.js +55 -7
- package/lib/esm/components/livechatwidget/common/reconnectChatHelper.js +1 -4
- package/lib/esm/components/webchatcontainerstateful/common/utils/FileAttachmentIconManager.js +2 -0
- package/lib/esm/components/webchatcontainerstateful/webchatcontroller/middlewares/renderingmiddlewares/timestamps/DeliveredTimestamp.js +5 -6
- package/package.json +3 -3
|
@@ -51,8 +51,8 @@ _defineProperty(Constants, "acsChannel", "ACS_CHANNEL");
|
|
|
51
51
|
_defineProperty(Constants, "publicMessageTag", "public");
|
|
52
52
|
_defineProperty(Constants, "supportedAdaptiveCardContentTypes", ["application/vnd.microsoft.card.adaptive", "application/vnd.microsoft.card.audio", "application/vnd.microsoft.card.hero", "application/vnd.microsoft.card.receipt", "application/vnd.microsoft.card.thumbnail", "application/vnd.microsoft.card.signin", "application/vnd.microsoft.card.oauth"]);
|
|
53
53
|
_defineProperty(Constants, "maxUploadFileSize", "500000");
|
|
54
|
-
_defineProperty(Constants, "imageRegex", /(\.)(jpeg|jpg|jiff|png|gif|bmp)$/i);
|
|
55
|
-
_defineProperty(Constants, "audioMediaRegex", /(\.)(aac|aiff|alac|flac|mp2|mp3|pcm|wav|wma)$/i);
|
|
54
|
+
_defineProperty(Constants, "imageRegex", /(\.)(jpeg|jpg|jiff|png|gif|bmp|webp)$/i);
|
|
55
|
+
_defineProperty(Constants, "audioMediaRegex", /(\.)(aac|aiff|alac|amr|flac|mp2|mp3|pcm|wav|wma)$/i);
|
|
56
56
|
_defineProperty(Constants, "videoMediaRegex", /(\.)(avchd|avi|flv|mpe|mpeg|mpg|mpv|mp4|m4p|m4v|mov|qt|swf|webm|wmv)$/i);
|
|
57
57
|
_defineProperty(Constants, "chromeSupportedInlineMediaRegex", /(\.)(aac|mp3|wav|mp4)$/i);
|
|
58
58
|
_defineProperty(Constants, "firefoxSupportedInlineMediaRegex", /(\.)(aac|flac|mp3|wav|mp4|mov)$/i);
|
|
@@ -90,7 +90,7 @@ const ConfirmationPaneStateful = props => {
|
|
|
90
90
|
Event: _TelemetryConstants.TelemetryEvent.ConfirmationPaneLoaded
|
|
91
91
|
});
|
|
92
92
|
}, []);
|
|
93
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null,
|
|
93
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_DimLayer.DimLayer, {
|
|
94
94
|
brightness: (controlProps === null || controlProps === void 0 ? void 0 : controlProps.brightnessValueOnDim) ?? "0.2"
|
|
95
95
|
}), /*#__PURE__*/_react.default.createElement(_omnichannelChatComponents.ConfirmationPane, {
|
|
96
96
|
componentOverrides: props === null || props === void 0 ? void 0 : props.componentOverrides,
|
|
@@ -97,7 +97,7 @@ const EmailTranscriptPaneStateful = props => {
|
|
|
97
97
|
Event: _TelemetryConstants.TelemetryEvent.EmailTranscriptLoaded
|
|
98
98
|
});
|
|
99
99
|
}, [initialEmail]);
|
|
100
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null,
|
|
100
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_DimLayer.DimLayer, {
|
|
101
101
|
brightness: (controlProps === null || controlProps === void 0 ? void 0 : controlProps.brightnessValueOnDim) ?? "0.2"
|
|
102
102
|
}), /*#__PURE__*/_react.default.createElement(_omnichannelChatComponents.InputValidationPane, {
|
|
103
103
|
componentOverrides: props.componentOverrides,
|
|
@@ -30,6 +30,7 @@ const HeaderStateful = props => {
|
|
|
30
30
|
const [outOfOperatingHours, setOutOfOperatingHours] = (0, _react.useState)(((_state$domainStates$l = state.domainStates.liveChatConfig) === null || _state$domainStates$l === void 0 ? void 0 : (_state$domainStates$l2 = _state$domainStates$l.LiveWSAndLiveChatEngJoin) === null || _state$domainStates$l2 === void 0 ? void 0 : _state$domainStates$l2.OutOfOperatingHours) === "True");
|
|
31
31
|
const outOfOfficeStyleProps = Object.assign({}, _defaultOutOfOfficeHeaderStyleProps.defaultOutOfOfficeHeaderStyleProps, outOfOfficeHeaderProps === null || outOfOfficeHeaderProps === void 0 ? void 0 : outOfOfficeHeaderProps.styleProps);
|
|
32
32
|
const conversationState = (0, _react.useRef)(state.appStates.conversationState);
|
|
33
|
+
const conversationEndedByAgent = (0, _react.useRef)(state.appStates.conversationEndedByAgent);
|
|
33
34
|
const controlProps = {
|
|
34
35
|
id: "oc-lcw-header",
|
|
35
36
|
dir: state.domainStates.globalDir,
|
|
@@ -49,7 +50,7 @@ const HeaderStateful = props => {
|
|
|
49
50
|
Event: _TelemetryConstants.TelemetryEvent.HeaderCloseButtonClicked,
|
|
50
51
|
Description: "Header Close button clicked."
|
|
51
52
|
});
|
|
52
|
-
if (conversationState.current === _ConversationState.ConversationState.Active) {
|
|
53
|
+
if (conversationState.current === _ConversationState.ConversationState.Active || conversationEndedByAgent.current) {
|
|
53
54
|
dispatch({
|
|
54
55
|
type: _LiveChatWidgetActionType.LiveChatWidgetActionType.SET_SHOW_CONFIRMATION,
|
|
55
56
|
payload: true
|
|
@@ -95,6 +96,7 @@ const HeaderStateful = props => {
|
|
|
95
96
|
if (state.appStates.conversationState) {
|
|
96
97
|
conversationState.current = state.appStates.conversationState;
|
|
97
98
|
}
|
|
99
|
+
conversationEndedByAgent.current = state.appStates.conversationEndedByAgent;
|
|
98
100
|
}, [state.appStates]);
|
|
99
101
|
return /*#__PURE__*/_react.default.createElement(_omnichannelChatComponents.Header, {
|
|
100
102
|
componentOverrides: headerProps === null || headerProps === void 0 ? void 0 : headerProps.componentOverrides,
|
|
@@ -413,6 +413,7 @@ const dummyDefaultProps = {
|
|
|
413
413
|
width: "90px",
|
|
414
414
|
cursor: "pointer",
|
|
415
415
|
overflow: "hidden",
|
|
416
|
+
padding: "0px",
|
|
416
417
|
whiteSpace: "nowrap"
|
|
417
418
|
},
|
|
418
419
|
subtitleStyleProps: {
|
|
@@ -420,6 +421,7 @@ const dummyDefaultProps = {
|
|
|
420
421
|
fontWeight: "200",
|
|
421
422
|
color: "#666",
|
|
422
423
|
overflow: "hidden",
|
|
424
|
+
padding: "0px",
|
|
423
425
|
fontFamily: "'Segoe UI',Arial,sans-serif",
|
|
424
426
|
display: "block",
|
|
425
427
|
alignItems: "center",
|
|
@@ -475,7 +477,6 @@ const dummyDefaultProps = {
|
|
|
475
477
|
cancelButtonText: "Cancel",
|
|
476
478
|
cancelButtonAriaLabel: "Cancel. Return to Chat",
|
|
477
479
|
brightnessValueOnDim: "0.2",
|
|
478
|
-
disableDimLayer: false,
|
|
479
480
|
onConfirm: () => {},
|
|
480
481
|
// Detailed implementation omitted
|
|
481
482
|
onCancel: () => {} // Detailed implementation omitted
|
|
@@ -483,20 +484,23 @@ const dummyDefaultProps = {
|
|
|
483
484
|
|
|
484
485
|
styleProps: {
|
|
485
486
|
generalStyleProps: {
|
|
487
|
+
display: "flex",
|
|
488
|
+
minHeight: "160px",
|
|
489
|
+
maxHeight: "300px",
|
|
490
|
+
boxSizing: "border-box",
|
|
486
491
|
backgroundColor: "#FFFFFF",
|
|
487
492
|
borderRadius: "2px",
|
|
488
493
|
color: "black",
|
|
489
494
|
fontFamily: "Segoe UI, Arial, sans-serif",
|
|
490
495
|
fontSize: "14px",
|
|
491
|
-
height: "160px",
|
|
492
496
|
padding: "10px 20px",
|
|
493
|
-
width: "262px",
|
|
494
497
|
position: "absolute",
|
|
495
498
|
justifyContent: "center",
|
|
496
499
|
alignItems: "center",
|
|
497
|
-
display: "flex",
|
|
498
500
|
flexFlow: "column",
|
|
499
|
-
zIndex: "9999"
|
|
501
|
+
zIndex: "9999",
|
|
502
|
+
left: "26px",
|
|
503
|
+
right: "26px"
|
|
500
504
|
},
|
|
501
505
|
titleStyleProps: {
|
|
502
506
|
color: "#323130",
|
|
@@ -518,10 +522,14 @@ const dummyDefaultProps = {
|
|
|
518
522
|
},
|
|
519
523
|
buttonGroupStyleProps: {
|
|
520
524
|
display: "flex",
|
|
525
|
+
width: "auto",
|
|
526
|
+
height: "auto",
|
|
527
|
+
boxSizing: "border-box",
|
|
521
528
|
flexFlow: "row",
|
|
522
529
|
justifyContent: "center",
|
|
523
530
|
alignItems: "center",
|
|
524
|
-
gap: "10px"
|
|
531
|
+
gap: "10px",
|
|
532
|
+
marginBottom: "10px"
|
|
525
533
|
},
|
|
526
534
|
confirmButtonStyleProps: {
|
|
527
535
|
backgroundColor: "rgba(9,72,159,1)",
|
|
@@ -626,7 +634,6 @@ const dummyDefaultProps = {
|
|
|
626
634
|
cancelButtonText: "Cancel",
|
|
627
635
|
cancelButtonAriaLabel: "Cancel",
|
|
628
636
|
brightnessValueOnDim: "0.2",
|
|
629
|
-
disableDimLayer: false,
|
|
630
637
|
onSend: undefined,
|
|
631
638
|
onCancel: undefined,
|
|
632
639
|
checkInput: undefined
|
|
@@ -1190,6 +1197,47 @@ const dummyDefaultProps = {
|
|
|
1190
1197
|
},
|
|
1191
1198
|
isCustomerVoiceSurveyCompact: undefined
|
|
1192
1199
|
},
|
|
1200
|
+
preChatSurveyPaneProps: {
|
|
1201
|
+
controlProps: {
|
|
1202
|
+
id: "oc-lcw-prechatsurveypane-default",
|
|
1203
|
+
dir: "auto",
|
|
1204
|
+
hidePreChatSurveyPane: false,
|
|
1205
|
+
adaptiveCardHostConfig: "{\"fontFamily\":\"Segoe UI, Helvetica Neue, sans-serif\",\"containerStyles\":{\"default\":{\"foregroundColors\":{\"default\":{\"default\":\"#000000\"}},\"backgroundColor\":\"#FFFFFF\"}},\"actions\":{\"actionsOrientation\":\"Vertical\",\"actionAlignment\":\"stretch\"}}",
|
|
1206
|
+
payload: "{\"$schema\":\"http://adaptivecards.io/schemas/adaptive-card.json\",\"type\":\"AdaptiveCard\",\"version\":\"1.1\",\"body\":[{\"type\":\"TextBlock\",\"weight\":\"bolder\",\"text\":\"Please answer below questions.\"},{\"type\":\"Input.Text\",\"id\":\"1e5e4e7a-8f0b-ec11-b6e6-000d3a305d38\",\"label\":\"name pls?\",\"maxLength\":100,\"isRequired\":true,\"errorMessage\":\"Name is required\"},{\"type\":\"Input.Text\",\"id\":\"7f8f5d6d-995e-ec11-8f8f-000d3a31376e\",\"label\":\"multi\\nmulti\\nmulti\",\"style\":\"text\",\"isMultiline\":true,\"maxLength\":250},{\"type\":\"Input.ChoiceSet\",\"id\":\"e4bdf7cb-995e-ec11-8f8f-000d3a31376e\",\"label\":\"options\",\"isMultiSelect\":false,\"value\":\"1\",\"style\":\"compact\",\"choices\":[{\"title\":\"one\",\"value\":\"1\"},{\"title\":\"two\",\"value\":\"2\"},{\"title\":\"three\",\"value\":\"3\"}]},{\"type\":\"Input.Toggle\",\"id\":\"b26011d2-995e-ec11-8f8f-000d3a31376e\",\"title\":\"consent\",\"valueOn\":\"True\",\"valueOff\":\"False\",\"value\":\"false\"},{\"type\":\"TextBlock\",\"isSubtle\":true,\"text\":\"Fields marked with * are mandatory.\",\"wrap\":true}],\"actions\":[{\"type\":\"Action.Submit\",\"title\":\"Submit\",\"data\":{\"Type\":\"InputSubmit\"}}]}",
|
|
1207
|
+
onSubmit: function () {} // Detailed implementation omitted
|
|
1208
|
+
},
|
|
1209
|
+
|
|
1210
|
+
styleProps: {
|
|
1211
|
+
generalStyleProps: {
|
|
1212
|
+
borderStyle: "solid",
|
|
1213
|
+
borderRadius: "4px",
|
|
1214
|
+
borderWidth: "3px",
|
|
1215
|
+
backgroundColor: "#FFFFFF",
|
|
1216
|
+
borderColor: "#F1F1F1",
|
|
1217
|
+
overflowY: "auto",
|
|
1218
|
+
height: "inherit",
|
|
1219
|
+
width: "inherit"
|
|
1220
|
+
},
|
|
1221
|
+
customButtonStyleProps: {
|
|
1222
|
+
backgroundColor: "rgb(49, 95, 162)",
|
|
1223
|
+
color: "#FFFFFF",
|
|
1224
|
+
fontFamily: "Segoe UI, Arial, sans-serif",
|
|
1225
|
+
fontSize: "15px",
|
|
1226
|
+
height: "48px"
|
|
1227
|
+
},
|
|
1228
|
+
adaptiveCardContainerStyleProps: {
|
|
1229
|
+
border: "1px solid #ECECEC",
|
|
1230
|
+
borderRadius: "4px",
|
|
1231
|
+
margin: "3%"
|
|
1232
|
+
},
|
|
1233
|
+
customTextInputStyleProps: {
|
|
1234
|
+
height: "20px"
|
|
1235
|
+
},
|
|
1236
|
+
customMultilineTextInputStyleProps: {
|
|
1237
|
+
height: "52px"
|
|
1238
|
+
}
|
|
1239
|
+
}
|
|
1240
|
+
},
|
|
1193
1241
|
proactiveChatPaneProps: {
|
|
1194
1242
|
componentOverrides: {
|
|
1195
1243
|
title: undefined,
|
|
@@ -84,10 +84,7 @@ const getChatReconnectContext = async (chatSDK, chatConfig, props, isAuthenticat
|
|
|
84
84
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
85
85
|
exports.getChatReconnectContext = getChatReconnectContext;
|
|
86
86
|
const setReconnectIdAndStartChat = async (isAuthenticatedChat, chatSDK, props, dispatch, setAdapter, reconnectId, initStartChat) => {
|
|
87
|
-
if (isAuthenticatedChat) {
|
|
88
|
-
// Get auth token for for getting chat reconnect context
|
|
89
|
-
await (0, _authHelper.handleAuthentication)(chatSDK, props.chatConfig, props.getAuthToken);
|
|
90
|
-
} else {
|
|
87
|
+
if (!isAuthenticatedChat) {
|
|
91
88
|
const startUnauthenticatedReconnectChat = {
|
|
92
89
|
eventName: _TelemetryConstants.BroadcastEvent.StartUnauthenticatedReconnectChat
|
|
93
90
|
};
|
package/lib/cjs/components/webchatcontainerstateful/common/utils/FileAttachmentIconManager.js
CHANGED
|
@@ -12,6 +12,7 @@ const FileAttachmentIconMap = {
|
|
|
12
12
|
"aac": _Icons.AudioIcon,
|
|
13
13
|
"aiff": _Icons.AudioIcon,
|
|
14
14
|
"alac": _Icons.AudioIcon,
|
|
15
|
+
"amr": _Icons.AudioIcon,
|
|
15
16
|
"avchd": _Icons.VideoIcon,
|
|
16
17
|
"avi": _Icons.VideoIcon,
|
|
17
18
|
"bmp": _Icons.ImageIcon,
|
|
@@ -50,6 +51,7 @@ const FileAttachmentIconMap = {
|
|
|
50
51
|
"vsdx": _Icons.VisioIcon,
|
|
51
52
|
"wav": _Icons.AudioIcon,
|
|
52
53
|
"webm": _Icons.VideoIcon,
|
|
54
|
+
"webp": _Icons.ImageIcon,
|
|
53
55
|
"wma": _Icons.AudioIcon,
|
|
54
56
|
"wmv": _Icons.VideoIcon,
|
|
55
57
|
"xls": _Icons.ExcelIcon,
|
|
@@ -33,14 +33,13 @@ const DeliveredTimestamp = _ref => {
|
|
|
33
33
|
} = args;
|
|
34
34
|
return /*#__PURE__*/_react.default.createElement(_react2.Stack, {
|
|
35
35
|
style: contentStyles,
|
|
36
|
+
dir: dir
|
|
37
|
+
}, role === _DirectLineSenderRole.DirectLineSenderRole.Bot && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
|
|
36
38
|
dir: dir,
|
|
37
|
-
horizontal: true
|
|
38
|
-
}, role === _DirectLineSenderRole.DirectLineSenderRole.Bot && /*#__PURE__*/_react.default.createElement("span", {
|
|
39
39
|
"aria-hidden": "false"
|
|
40
|
-
}, name), role === _DirectLineSenderRole.DirectLineSenderRole.
|
|
40
|
+
}, name, " - ", (0, _utils.getTimestampHourMinute)(timestamp))), role === _DirectLineSenderRole.DirectLineSenderRole.User && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
|
|
41
|
+
"aria-hidden": "false",
|
|
41
42
|
dir: dir
|
|
42
|
-
}, " ", (0, _utils.getTimestampHourMinute)(timestamp)
|
|
43
|
-
"aria-hidden": "false"
|
|
44
|
-
}, ((_state$domainStates$m = state.domainStates.middlewareLocalizedTexts) === null || _state$domainStates$m === void 0 ? void 0 : _state$domainStates$m.MIDDLEWARE_MESSAGE_DELIVERED) ?? _defaultMiddlewareLocalizedTexts.defaultMiddlewareLocalizedTexts.MIDDLEWARE_MESSAGE_DELIVERED));
|
|
43
|
+
}, " ", (0, _utils.getTimestampHourMinute)(timestamp), " - ", ((_state$domainStates$m = state.domainStates.middlewareLocalizedTexts) === null || _state$domainStates$m === void 0 ? void 0 : _state$domainStates$m.MIDDLEWARE_MESSAGE_DELIVERED) ?? _defaultMiddlewareLocalizedTexts.defaultMiddlewareLocalizedTexts.MIDDLEWARE_MESSAGE_DELIVERED)));
|
|
45
44
|
};
|
|
46
45
|
exports.DeliveredTimestamp = DeliveredTimestamp;
|
|
@@ -44,8 +44,8 @@ _defineProperty(Constants, "acsChannel", "ACS_CHANNEL");
|
|
|
44
44
|
_defineProperty(Constants, "publicMessageTag", "public");
|
|
45
45
|
_defineProperty(Constants, "supportedAdaptiveCardContentTypes", ["application/vnd.microsoft.card.adaptive", "application/vnd.microsoft.card.audio", "application/vnd.microsoft.card.hero", "application/vnd.microsoft.card.receipt", "application/vnd.microsoft.card.thumbnail", "application/vnd.microsoft.card.signin", "application/vnd.microsoft.card.oauth"]);
|
|
46
46
|
_defineProperty(Constants, "maxUploadFileSize", "500000");
|
|
47
|
-
_defineProperty(Constants, "imageRegex", /(\.)(jpeg|jpg|jiff|png|gif|bmp)$/i);
|
|
48
|
-
_defineProperty(Constants, "audioMediaRegex", /(\.)(aac|aiff|alac|flac|mp2|mp3|pcm|wav|wma)$/i);
|
|
47
|
+
_defineProperty(Constants, "imageRegex", /(\.)(jpeg|jpg|jiff|png|gif|bmp|webp)$/i);
|
|
48
|
+
_defineProperty(Constants, "audioMediaRegex", /(\.)(aac|aiff|alac|amr|flac|mp2|mp3|pcm|wav|wma)$/i);
|
|
49
49
|
_defineProperty(Constants, "videoMediaRegex", /(\.)(avchd|avi|flv|mpe|mpeg|mpg|mpv|mp4|m4p|m4v|mov|qt|swf|webm|wmv)$/i);
|
|
50
50
|
_defineProperty(Constants, "chromeSupportedInlineMediaRegex", /(\.)(aac|mp3|wav|mp4)$/i);
|
|
51
51
|
_defineProperty(Constants, "firefoxSupportedInlineMediaRegex", /(\.)(aac|flac|mp3|wav|mp4|mov)$/i);
|
|
@@ -82,7 +82,7 @@ export const ConfirmationPaneStateful = props => {
|
|
|
82
82
|
Event: TelemetryEvent.ConfirmationPaneLoaded
|
|
83
83
|
});
|
|
84
84
|
}, []);
|
|
85
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null,
|
|
85
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DimLayer, {
|
|
86
86
|
brightness: (controlProps === null || controlProps === void 0 ? void 0 : controlProps.brightnessValueOnDim) ?? "0.2"
|
|
87
87
|
}), /*#__PURE__*/React.createElement(ConfirmationPane, {
|
|
88
88
|
componentOverrides: props === null || props === void 0 ? void 0 : props.componentOverrides,
|
|
@@ -88,7 +88,7 @@ export const EmailTranscriptPaneStateful = props => {
|
|
|
88
88
|
Event: TelemetryEvent.EmailTranscriptLoaded
|
|
89
89
|
});
|
|
90
90
|
}, [initialEmail]);
|
|
91
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null,
|
|
91
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DimLayer, {
|
|
92
92
|
brightness: (controlProps === null || controlProps === void 0 ? void 0 : controlProps.brightnessValueOnDim) ?? "0.2"
|
|
93
93
|
}), /*#__PURE__*/React.createElement(InputValidationPane, {
|
|
94
94
|
componentOverrides: props.componentOverrides,
|
|
@@ -21,6 +21,7 @@ export const HeaderStateful = props => {
|
|
|
21
21
|
const [outOfOperatingHours, setOutOfOperatingHours] = useState(((_state$domainStates$l = state.domainStates.liveChatConfig) === null || _state$domainStates$l === void 0 ? void 0 : (_state$domainStates$l2 = _state$domainStates$l.LiveWSAndLiveChatEngJoin) === null || _state$domainStates$l2 === void 0 ? void 0 : _state$domainStates$l2.OutOfOperatingHours) === "True");
|
|
22
22
|
const outOfOfficeStyleProps = Object.assign({}, defaultOutOfOfficeHeaderStyleProps, outOfOfficeHeaderProps === null || outOfOfficeHeaderProps === void 0 ? void 0 : outOfOfficeHeaderProps.styleProps);
|
|
23
23
|
const conversationState = useRef(state.appStates.conversationState);
|
|
24
|
+
const conversationEndedByAgent = useRef(state.appStates.conversationEndedByAgent);
|
|
24
25
|
const controlProps = {
|
|
25
26
|
id: "oc-lcw-header",
|
|
26
27
|
dir: state.domainStates.globalDir,
|
|
@@ -40,7 +41,7 @@ export const HeaderStateful = props => {
|
|
|
40
41
|
Event: TelemetryEvent.HeaderCloseButtonClicked,
|
|
41
42
|
Description: "Header Close button clicked."
|
|
42
43
|
});
|
|
43
|
-
if (conversationState.current === ConversationState.Active) {
|
|
44
|
+
if (conversationState.current === ConversationState.Active || conversationEndedByAgent.current) {
|
|
44
45
|
dispatch({
|
|
45
46
|
type: LiveChatWidgetActionType.SET_SHOW_CONFIRMATION,
|
|
46
47
|
payload: true
|
|
@@ -86,6 +87,7 @@ export const HeaderStateful = props => {
|
|
|
86
87
|
if (state.appStates.conversationState) {
|
|
87
88
|
conversationState.current = state.appStates.conversationState;
|
|
88
89
|
}
|
|
90
|
+
conversationEndedByAgent.current = state.appStates.conversationEndedByAgent;
|
|
89
91
|
}, [state.appStates]);
|
|
90
92
|
return /*#__PURE__*/React.createElement(Header, {
|
|
91
93
|
componentOverrides: headerProps === null || headerProps === void 0 ? void 0 : headerProps.componentOverrides,
|
|
@@ -407,6 +407,7 @@ export const dummyDefaultProps = {
|
|
|
407
407
|
width: "90px",
|
|
408
408
|
cursor: "pointer",
|
|
409
409
|
overflow: "hidden",
|
|
410
|
+
padding: "0px",
|
|
410
411
|
whiteSpace: "nowrap"
|
|
411
412
|
},
|
|
412
413
|
subtitleStyleProps: {
|
|
@@ -414,6 +415,7 @@ export const dummyDefaultProps = {
|
|
|
414
415
|
fontWeight: "200",
|
|
415
416
|
color: "#666",
|
|
416
417
|
overflow: "hidden",
|
|
418
|
+
padding: "0px",
|
|
417
419
|
fontFamily: "'Segoe UI',Arial,sans-serif",
|
|
418
420
|
display: "block",
|
|
419
421
|
alignItems: "center",
|
|
@@ -469,7 +471,6 @@ export const dummyDefaultProps = {
|
|
|
469
471
|
cancelButtonText: "Cancel",
|
|
470
472
|
cancelButtonAriaLabel: "Cancel. Return to Chat",
|
|
471
473
|
brightnessValueOnDim: "0.2",
|
|
472
|
-
disableDimLayer: false,
|
|
473
474
|
onConfirm: () => {},
|
|
474
475
|
// Detailed implementation omitted
|
|
475
476
|
onCancel: () => {} // Detailed implementation omitted
|
|
@@ -477,20 +478,23 @@ export const dummyDefaultProps = {
|
|
|
477
478
|
|
|
478
479
|
styleProps: {
|
|
479
480
|
generalStyleProps: {
|
|
481
|
+
display: "flex",
|
|
482
|
+
minHeight: "160px",
|
|
483
|
+
maxHeight: "300px",
|
|
484
|
+
boxSizing: "border-box",
|
|
480
485
|
backgroundColor: "#FFFFFF",
|
|
481
486
|
borderRadius: "2px",
|
|
482
487
|
color: "black",
|
|
483
488
|
fontFamily: "Segoe UI, Arial, sans-serif",
|
|
484
489
|
fontSize: "14px",
|
|
485
|
-
height: "160px",
|
|
486
490
|
padding: "10px 20px",
|
|
487
|
-
width: "262px",
|
|
488
491
|
position: "absolute",
|
|
489
492
|
justifyContent: "center",
|
|
490
493
|
alignItems: "center",
|
|
491
|
-
display: "flex",
|
|
492
494
|
flexFlow: "column",
|
|
493
|
-
zIndex: "9999"
|
|
495
|
+
zIndex: "9999",
|
|
496
|
+
left: "26px",
|
|
497
|
+
right: "26px"
|
|
494
498
|
},
|
|
495
499
|
titleStyleProps: {
|
|
496
500
|
color: "#323130",
|
|
@@ -512,10 +516,14 @@ export const dummyDefaultProps = {
|
|
|
512
516
|
},
|
|
513
517
|
buttonGroupStyleProps: {
|
|
514
518
|
display: "flex",
|
|
519
|
+
width: "auto",
|
|
520
|
+
height: "auto",
|
|
521
|
+
boxSizing: "border-box",
|
|
515
522
|
flexFlow: "row",
|
|
516
523
|
justifyContent: "center",
|
|
517
524
|
alignItems: "center",
|
|
518
|
-
gap: "10px"
|
|
525
|
+
gap: "10px",
|
|
526
|
+
marginBottom: "10px"
|
|
519
527
|
},
|
|
520
528
|
confirmButtonStyleProps: {
|
|
521
529
|
backgroundColor: "rgba(9,72,159,1)",
|
|
@@ -620,7 +628,6 @@ export const dummyDefaultProps = {
|
|
|
620
628
|
cancelButtonText: "Cancel",
|
|
621
629
|
cancelButtonAriaLabel: "Cancel",
|
|
622
630
|
brightnessValueOnDim: "0.2",
|
|
623
|
-
disableDimLayer: false,
|
|
624
631
|
onSend: undefined,
|
|
625
632
|
onCancel: undefined,
|
|
626
633
|
checkInput: undefined
|
|
@@ -1184,6 +1191,47 @@ export const dummyDefaultProps = {
|
|
|
1184
1191
|
},
|
|
1185
1192
|
isCustomerVoiceSurveyCompact: undefined
|
|
1186
1193
|
},
|
|
1194
|
+
preChatSurveyPaneProps: {
|
|
1195
|
+
controlProps: {
|
|
1196
|
+
id: "oc-lcw-prechatsurveypane-default",
|
|
1197
|
+
dir: "auto",
|
|
1198
|
+
hidePreChatSurveyPane: false,
|
|
1199
|
+
adaptiveCardHostConfig: "{\"fontFamily\":\"Segoe UI, Helvetica Neue, sans-serif\",\"containerStyles\":{\"default\":{\"foregroundColors\":{\"default\":{\"default\":\"#000000\"}},\"backgroundColor\":\"#FFFFFF\"}},\"actions\":{\"actionsOrientation\":\"Vertical\",\"actionAlignment\":\"stretch\"}}",
|
|
1200
|
+
payload: "{\"$schema\":\"http://adaptivecards.io/schemas/adaptive-card.json\",\"type\":\"AdaptiveCard\",\"version\":\"1.1\",\"body\":[{\"type\":\"TextBlock\",\"weight\":\"bolder\",\"text\":\"Please answer below questions.\"},{\"type\":\"Input.Text\",\"id\":\"1e5e4e7a-8f0b-ec11-b6e6-000d3a305d38\",\"label\":\"name pls?\",\"maxLength\":100,\"isRequired\":true,\"errorMessage\":\"Name is required\"},{\"type\":\"Input.Text\",\"id\":\"7f8f5d6d-995e-ec11-8f8f-000d3a31376e\",\"label\":\"multi\\nmulti\\nmulti\",\"style\":\"text\",\"isMultiline\":true,\"maxLength\":250},{\"type\":\"Input.ChoiceSet\",\"id\":\"e4bdf7cb-995e-ec11-8f8f-000d3a31376e\",\"label\":\"options\",\"isMultiSelect\":false,\"value\":\"1\",\"style\":\"compact\",\"choices\":[{\"title\":\"one\",\"value\":\"1\"},{\"title\":\"two\",\"value\":\"2\"},{\"title\":\"three\",\"value\":\"3\"}]},{\"type\":\"Input.Toggle\",\"id\":\"b26011d2-995e-ec11-8f8f-000d3a31376e\",\"title\":\"consent\",\"valueOn\":\"True\",\"valueOff\":\"False\",\"value\":\"false\"},{\"type\":\"TextBlock\",\"isSubtle\":true,\"text\":\"Fields marked with * are mandatory.\",\"wrap\":true}],\"actions\":[{\"type\":\"Action.Submit\",\"title\":\"Submit\",\"data\":{\"Type\":\"InputSubmit\"}}]}",
|
|
1201
|
+
onSubmit: function () {} // Detailed implementation omitted
|
|
1202
|
+
},
|
|
1203
|
+
|
|
1204
|
+
styleProps: {
|
|
1205
|
+
generalStyleProps: {
|
|
1206
|
+
borderStyle: "solid",
|
|
1207
|
+
borderRadius: "4px",
|
|
1208
|
+
borderWidth: "3px",
|
|
1209
|
+
backgroundColor: "#FFFFFF",
|
|
1210
|
+
borderColor: "#F1F1F1",
|
|
1211
|
+
overflowY: "auto",
|
|
1212
|
+
height: "inherit",
|
|
1213
|
+
width: "inherit"
|
|
1214
|
+
},
|
|
1215
|
+
customButtonStyleProps: {
|
|
1216
|
+
backgroundColor: "rgb(49, 95, 162)",
|
|
1217
|
+
color: "#FFFFFF",
|
|
1218
|
+
fontFamily: "Segoe UI, Arial, sans-serif",
|
|
1219
|
+
fontSize: "15px",
|
|
1220
|
+
height: "48px"
|
|
1221
|
+
},
|
|
1222
|
+
adaptiveCardContainerStyleProps: {
|
|
1223
|
+
border: "1px solid #ECECEC",
|
|
1224
|
+
borderRadius: "4px",
|
|
1225
|
+
margin: "3%"
|
|
1226
|
+
},
|
|
1227
|
+
customTextInputStyleProps: {
|
|
1228
|
+
height: "20px"
|
|
1229
|
+
},
|
|
1230
|
+
customMultilineTextInputStyleProps: {
|
|
1231
|
+
height: "52px"
|
|
1232
|
+
}
|
|
1233
|
+
}
|
|
1234
|
+
},
|
|
1187
1235
|
proactiveChatPaneProps: {
|
|
1188
1236
|
componentOverrides: {
|
|
1189
1237
|
title: undefined,
|
|
@@ -76,10 +76,7 @@ const getChatReconnectContext = async (chatSDK, chatConfig, props, isAuthenticat
|
|
|
76
76
|
|
|
77
77
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
78
78
|
const setReconnectIdAndStartChat = async (isAuthenticatedChat, chatSDK, props, dispatch, setAdapter, reconnectId, initStartChat) => {
|
|
79
|
-
if (isAuthenticatedChat) {
|
|
80
|
-
// Get auth token for for getting chat reconnect context
|
|
81
|
-
await handleAuthentication(chatSDK, props.chatConfig, props.getAuthToken);
|
|
82
|
-
} else {
|
|
79
|
+
if (!isAuthenticatedChat) {
|
|
83
80
|
const startUnauthenticatedReconnectChat = {
|
|
84
81
|
eventName: BroadcastEvent.StartUnauthenticatedReconnectChat
|
|
85
82
|
};
|
package/lib/esm/components/webchatcontainerstateful/common/utils/FileAttachmentIconManager.js
CHANGED
|
@@ -6,6 +6,7 @@ const FileAttachmentIconMap = {
|
|
|
6
6
|
"aac": AudioIcon,
|
|
7
7
|
"aiff": AudioIcon,
|
|
8
8
|
"alac": AudioIcon,
|
|
9
|
+
"amr": AudioIcon,
|
|
9
10
|
"avchd": VideoIcon,
|
|
10
11
|
"avi": VideoIcon,
|
|
11
12
|
"bmp": ImageIcon,
|
|
@@ -44,6 +45,7 @@ const FileAttachmentIconMap = {
|
|
|
44
45
|
"vsdx": VisioIcon,
|
|
45
46
|
"wav": AudioIcon,
|
|
46
47
|
"webm": VideoIcon,
|
|
48
|
+
"webp": ImageIcon,
|
|
47
49
|
"wma": AudioIcon,
|
|
48
50
|
"wmv": VideoIcon,
|
|
49
51
|
"xls": ExcelIcon,
|
|
@@ -27,13 +27,12 @@ export const DeliveredTimestamp = _ref => {
|
|
|
27
27
|
} = args;
|
|
28
28
|
return /*#__PURE__*/React.createElement(Stack, {
|
|
29
29
|
style: contentStyles,
|
|
30
|
+
dir: dir
|
|
31
|
+
}, role === DirectLineSenderRole.Bot && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
|
|
30
32
|
dir: dir,
|
|
31
|
-
horizontal: true
|
|
32
|
-
}, role === DirectLineSenderRole.Bot && /*#__PURE__*/React.createElement("span", {
|
|
33
33
|
"aria-hidden": "false"
|
|
34
|
-
}, name), role === DirectLineSenderRole.
|
|
34
|
+
}, name, " - ", getTimestampHourMinute(timestamp))), role === DirectLineSenderRole.User && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
|
|
35
|
+
"aria-hidden": "false",
|
|
35
36
|
dir: dir
|
|
36
|
-
}, " ", getTimestampHourMinute(timestamp)
|
|
37
|
-
"aria-hidden": "false"
|
|
38
|
-
}, ((_state$domainStates$m = state.domainStates.middlewareLocalizedTexts) === null || _state$domainStates$m === void 0 ? void 0 : _state$domainStates$m.MIDDLEWARE_MESSAGE_DELIVERED) ?? defaultMiddlewareLocalizedTexts.MIDDLEWARE_MESSAGE_DELIVERED));
|
|
37
|
+
}, " ", getTimestampHourMinute(timestamp), " - ", ((_state$domainStates$m = state.domainStates.middlewareLocalizedTexts) === null || _state$domainStates$m === void 0 ? void 0 : _state$domainStates$m.MIDDLEWARE_MESSAGE_DELIVERED) ?? defaultMiddlewareLocalizedTexts.MIDDLEWARE_MESSAGE_DELIVERED)));
|
|
39
38
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@microsoft/omnichannel-chat-widget",
|
|
3
|
-
"version": "0.1.0-main.
|
|
3
|
+
"version": "0.1.0-main.d8553fe",
|
|
4
4
|
"description": "Microsoft Omnichannel Chat Widget",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"types": "lib/types/index.d.ts",
|
|
@@ -74,8 +74,8 @@
|
|
|
74
74
|
},
|
|
75
75
|
"dependencies": {
|
|
76
76
|
"@fluentui/react": "^8.49.1",
|
|
77
|
-
"@microsoft/omnichannel-chat-components": "0.1.0-main.
|
|
78
|
-
"@microsoft/omnichannel-chat-sdk": "1.
|
|
77
|
+
"@microsoft/omnichannel-chat-components": "0.1.0-main.501b425",
|
|
78
|
+
"@microsoft/omnichannel-chat-sdk": "^1.2.0",
|
|
79
79
|
"abort-controller-es5": "^2.0.1",
|
|
80
80
|
"dompurify": "^2.3.4",
|
|
81
81
|
"markdown-it": "^12.3.2",
|