@microsoft/omnichannel-chat-components 0.1.0-main.1756db4 → 0.1.0-main.423d0ce
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/components/common/commandbutton/CommandButton.js +4 -7
- package/lib/cjs/components/footer/subcomponents/AudioNotificationButton.js +2 -8
- package/lib/cjs/components/prechatsurveypane/PreChatSurveyPane.js +5 -4
- package/lib/cjs/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneButtonStyles.js +2 -1
- package/lib/esm/components/common/commandbutton/CommandButton.js +4 -7
- package/lib/esm/components/footer/subcomponents/AudioNotificationButton.js +2 -8
- package/lib/esm/components/prechatsurveypane/PreChatSurveyPane.js +5 -4
- package/lib/esm/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneButtonStyles.js +2 -1
- package/lib/types/components/prechatsurveypane/interfaces/IPreChatSurveyPaneButtonStyles.d.ts +1 -0
- package/package.json +1 -1
|
@@ -22,12 +22,9 @@ function CommandButton(props) {
|
|
|
22
22
|
const iconProp = props.imageIconProps ? {
|
|
23
23
|
imageProps: props.imageIconProps
|
|
24
24
|
} : {
|
|
25
|
-
iconName: props.iconName
|
|
26
|
-
styles: {
|
|
27
|
-
root: props.styles
|
|
28
|
-
}
|
|
25
|
+
iconName: props.iconName
|
|
29
26
|
};
|
|
30
|
-
const
|
|
27
|
+
const buttonStyles = {
|
|
31
28
|
root: props.styles,
|
|
32
29
|
rootHovered: props.hoverStyles,
|
|
33
30
|
rootFocused: props.focusStyles,
|
|
@@ -53,14 +50,14 @@ function CommandButton(props) {
|
|
|
53
50
|
onClick: handleOnClick,
|
|
54
51
|
disabled: props.disabled,
|
|
55
52
|
className: props.className,
|
|
56
|
-
styles:
|
|
53
|
+
styles: buttonStyles
|
|
57
54
|
}), props.type === "icon" && /*#__PURE__*/_react2.default.createElement(_react.IconButton, {
|
|
58
55
|
id: props.id,
|
|
59
56
|
iconProps: iconProp,
|
|
60
57
|
title: props.ariaLabel,
|
|
61
58
|
ariaLabel: props.ariaLabel,
|
|
62
59
|
disabled: props.disabled,
|
|
63
|
-
styles:
|
|
60
|
+
styles: buttonStyles,
|
|
64
61
|
onClick: handleOnClick,
|
|
65
62
|
className: props.className
|
|
66
63
|
}));
|
|
@@ -32,18 +32,12 @@ function AudioNotificationButton(props) {
|
|
|
32
32
|
const volume0Icon = props.imageToggleIconProps ? {
|
|
33
33
|
imageProps: props === null || props === void 0 ? void 0 : props.imageToggleIconProps
|
|
34
34
|
} : {
|
|
35
|
-
iconName: (props === null || props === void 0 ? void 0 : props.toggleIconName) ?? "Volume0"
|
|
36
|
-
styles: {
|
|
37
|
-
root: props.styles
|
|
38
|
-
}
|
|
35
|
+
iconName: (props === null || props === void 0 ? void 0 : props.toggleIconName) ?? "Volume0"
|
|
39
36
|
};
|
|
40
37
|
const volume3Icon = props.imageIconProps ? {
|
|
41
38
|
imageProps: props === null || props === void 0 ? void 0 : props.imageIconProps
|
|
42
39
|
} : {
|
|
43
|
-
iconName: (props === null || props === void 0 ? void 0 : props.iconName) ?? "Volume3"
|
|
44
|
-
styles: {
|
|
45
|
-
root: props.styles
|
|
46
|
-
}
|
|
40
|
+
iconName: (props === null || props === void 0 ? void 0 : props.iconName) ?? "Volume3"
|
|
47
41
|
};
|
|
48
42
|
const handleOnClick = (0, _react2.useCallback)(() => {
|
|
49
43
|
setMuted(!muted);
|
|
@@ -30,7 +30,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
30
30
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
31
31
|
|
|
32
32
|
function PreChatSurveyPane(props) {
|
|
33
|
-
var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps3$cu, _defaultPreChatSurvey, _props$styleProps4, _props$styleProps4$cu, _defaultPreChatSurvey2, _props$controlProps6, _props$controlProps7, _props$controlProps8;
|
|
33
|
+
var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps3$cu, _defaultPreChatSurvey, _props$styleProps4, _props$styleProps4$cu, _defaultPreChatSurvey2, _props$styleProps5, _props$styleProps5$cu, _defaultPreChatSurvey3, _props$controlProps6, _props$controlProps7, _props$controlProps8;
|
|
34
34
|
|
|
35
35
|
const elementId = ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.id) ?? "lcw-components-prechatsurvey-pane";
|
|
36
36
|
let adpativeCardPayload;
|
|
@@ -111,11 +111,12 @@ function PreChatSurveyPane(props) {
|
|
|
111
111
|
margin: 2px;
|
|
112
112
|
height: 48px;
|
|
113
113
|
border-radius: 5px;
|
|
114
|
+
cursor: pointer;
|
|
114
115
|
font-weight: bold;
|
|
115
116
|
font-size: 15px;
|
|
116
|
-
|
|
117
|
-
color: ${((_props$
|
|
118
|
-
background-color: ${((_props$
|
|
117
|
+
font-family: ${((_props$styleProps3 = props.styleProps) === null || _props$styleProps3 === void 0 ? void 0 : (_props$styleProps3$cu = _props$styleProps3.customButtonStyleProps) === null || _props$styleProps3$cu === void 0 ? void 0 : _props$styleProps3$cu.fontFamily) ?? ((_defaultPreChatSurvey = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey === void 0 ? void 0 : _defaultPreChatSurvey.fontFamily)};
|
|
118
|
+
color: ${((_props$styleProps4 = props.styleProps) === null || _props$styleProps4 === void 0 ? void 0 : (_props$styleProps4$cu = _props$styleProps4.customButtonStyleProps) === null || _props$styleProps4$cu === void 0 ? void 0 : _props$styleProps4$cu.color) ?? ((_defaultPreChatSurvey2 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey2 === void 0 ? void 0 : _defaultPreChatSurvey2.color)};
|
|
119
|
+
background-color: ${((_props$styleProps5 = props.styleProps) === null || _props$styleProps5 === void 0 ? void 0 : (_props$styleProps5$cu = _props$styleProps5.customButtonStyleProps) === null || _props$styleProps5$cu === void 0 ? void 0 : _props$styleProps5$cu.backgroundColor) ?? ((_defaultPreChatSurvey3 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey3 === void 0 ? void 0 : _defaultPreChatSurvey3.backgroundColor)};
|
|
119
120
|
}`), !((_props$controlProps6 = props.controlProps) !== null && _props$controlProps6 !== void 0 && _props$controlProps6.hidePreChatSurveyPane) && /*#__PURE__*/_react2.default.createElement(_react.Stack, {
|
|
120
121
|
id: elementId,
|
|
121
122
|
tabIndex: -1,
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.defaultPreChatSurveyPaneButtonStyles = void 0;
|
|
7
7
|
const defaultPreChatSurveyPaneButtonStyles = {
|
|
8
8
|
backgroundColor: "rgb(49, 95, 162)",
|
|
9
|
-
color: "#FFFFFF"
|
|
9
|
+
color: "#FFFFFF",
|
|
10
|
+
fontFamily: "Segoe UI, Arial, sans-serif"
|
|
10
11
|
};
|
|
11
12
|
exports.defaultPreChatSurveyPaneButtonStyles = defaultPreChatSurveyPaneButtonStyles;
|
|
@@ -8,12 +8,9 @@ function CommandButton(props) {
|
|
|
8
8
|
const iconProp = props.imageIconProps ? {
|
|
9
9
|
imageProps: props.imageIconProps
|
|
10
10
|
} : {
|
|
11
|
-
iconName: props.iconName
|
|
12
|
-
styles: {
|
|
13
|
-
root: props.styles
|
|
14
|
-
}
|
|
11
|
+
iconName: props.iconName
|
|
15
12
|
};
|
|
16
|
-
const
|
|
13
|
+
const buttonStyles = {
|
|
17
14
|
root: props.styles,
|
|
18
15
|
rootHovered: props.hoverStyles,
|
|
19
16
|
rootFocused: props.focusStyles,
|
|
@@ -37,14 +34,14 @@ function CommandButton(props) {
|
|
|
37
34
|
onClick: handleOnClick,
|
|
38
35
|
disabled: props.disabled,
|
|
39
36
|
className: props.className,
|
|
40
|
-
styles:
|
|
37
|
+
styles: buttonStyles
|
|
41
38
|
}), props.type === "icon" && /*#__PURE__*/React.createElement(IconButton, {
|
|
42
39
|
id: props.id,
|
|
43
40
|
iconProps: iconProp,
|
|
44
41
|
title: props.ariaLabel,
|
|
45
42
|
ariaLabel: props.ariaLabel,
|
|
46
43
|
disabled: props.disabled,
|
|
47
|
-
styles:
|
|
44
|
+
styles: buttonStyles,
|
|
48
45
|
onClick: handleOnClick,
|
|
49
46
|
className: props.className
|
|
50
47
|
}));
|
|
@@ -18,18 +18,12 @@ function AudioNotificationButton(props) {
|
|
|
18
18
|
const volume0Icon = props.imageToggleIconProps ? {
|
|
19
19
|
imageProps: props === null || props === void 0 ? void 0 : props.imageToggleIconProps
|
|
20
20
|
} : {
|
|
21
|
-
iconName: (props === null || props === void 0 ? void 0 : props.toggleIconName) ?? "Volume0"
|
|
22
|
-
styles: {
|
|
23
|
-
root: props.styles
|
|
24
|
-
}
|
|
21
|
+
iconName: (props === null || props === void 0 ? void 0 : props.toggleIconName) ?? "Volume0"
|
|
25
22
|
};
|
|
26
23
|
const volume3Icon = props.imageIconProps ? {
|
|
27
24
|
imageProps: props === null || props === void 0 ? void 0 : props.imageIconProps
|
|
28
25
|
} : {
|
|
29
|
-
iconName: (props === null || props === void 0 ? void 0 : props.iconName) ?? "Volume3"
|
|
30
|
-
styles: {
|
|
31
|
-
root: props.styles
|
|
32
|
-
}
|
|
26
|
+
iconName: (props === null || props === void 0 ? void 0 : props.iconName) ?? "Volume3"
|
|
33
27
|
};
|
|
34
28
|
const handleOnClick = useCallback(() => {
|
|
35
29
|
setMuted(!muted);
|
|
@@ -10,7 +10,7 @@ import { defaultPreChatSurveyPaneGeneralStyles } from "./common/defaultProps/def
|
|
|
10
10
|
import { defaultPreChatSurveyPaneStyles } from "./common/defaultProps/defaultStyles/defaultPreChatSurveyPaneStyles";
|
|
11
11
|
|
|
12
12
|
function PreChatSurveyPane(props) {
|
|
13
|
-
var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps3$cu, _defaultPreChatSurvey, _props$styleProps4, _props$styleProps4$cu, _defaultPreChatSurvey2, _props$controlProps6, _props$controlProps7, _props$controlProps8;
|
|
13
|
+
var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps3$cu, _defaultPreChatSurvey, _props$styleProps4, _props$styleProps4$cu, _defaultPreChatSurvey2, _props$styleProps5, _props$styleProps5$cu, _defaultPreChatSurvey3, _props$controlProps6, _props$controlProps7, _props$controlProps8;
|
|
14
14
|
|
|
15
15
|
const elementId = ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.id) ?? "lcw-components-prechatsurvey-pane";
|
|
16
16
|
let adpativeCardPayload;
|
|
@@ -89,11 +89,12 @@ function PreChatSurveyPane(props) {
|
|
|
89
89
|
margin: 2px;
|
|
90
90
|
height: 48px;
|
|
91
91
|
border-radius: 5px;
|
|
92
|
+
cursor: pointer;
|
|
92
93
|
font-weight: bold;
|
|
93
94
|
font-size: 15px;
|
|
94
|
-
|
|
95
|
-
color: ${((_props$
|
|
96
|
-
background-color: ${((_props$
|
|
95
|
+
font-family: ${((_props$styleProps3 = props.styleProps) === null || _props$styleProps3 === void 0 ? void 0 : (_props$styleProps3$cu = _props$styleProps3.customButtonStyleProps) === null || _props$styleProps3$cu === void 0 ? void 0 : _props$styleProps3$cu.fontFamily) ?? ((_defaultPreChatSurvey = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey === void 0 ? void 0 : _defaultPreChatSurvey.fontFamily)};
|
|
96
|
+
color: ${((_props$styleProps4 = props.styleProps) === null || _props$styleProps4 === void 0 ? void 0 : (_props$styleProps4$cu = _props$styleProps4.customButtonStyleProps) === null || _props$styleProps4$cu === void 0 ? void 0 : _props$styleProps4$cu.color) ?? ((_defaultPreChatSurvey2 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey2 === void 0 ? void 0 : _defaultPreChatSurvey2.color)};
|
|
97
|
+
background-color: ${((_props$styleProps5 = props.styleProps) === null || _props$styleProps5 === void 0 ? void 0 : (_props$styleProps5$cu = _props$styleProps5.customButtonStyleProps) === null || _props$styleProps5$cu === void 0 ? void 0 : _props$styleProps5$cu.backgroundColor) ?? ((_defaultPreChatSurvey3 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey3 === void 0 ? void 0 : _defaultPreChatSurvey3.backgroundColor)};
|
|
97
98
|
}`), !((_props$controlProps6 = props.controlProps) !== null && _props$controlProps6 !== void 0 && _props$controlProps6.hidePreChatSurveyPane) && /*#__PURE__*/React.createElement(Stack, {
|
|
98
99
|
id: elementId,
|
|
99
100
|
tabIndex: -1,
|
package/package.json
CHANGED