@microsoft/omnichannel-chat-widget 1.8.4-main.d4c4cb2 → 1.8.4-main.f21df63

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.
Files changed (11) hide show
  1. package/lib/cjs/common/Constants.js +3 -0
  2. package/lib/cjs/components/prechatsurveypanestateful/common/defaultStyles/defaultGeneralPreChatSurveyPaneStyleProps.js +2 -1
  3. package/lib/cjs/components/webchatcontainerstateful/WebChatContainerStateful.js +19 -8
  4. package/lib/cjs/components/webchatcontainerstateful/common/defaultStyles/defaultAdaptiveCardStyles.js +3 -1
  5. package/lib/esm/common/Constants.js +3 -0
  6. package/lib/esm/components/prechatsurveypanestateful/common/defaultStyles/defaultGeneralPreChatSurveyPaneStyleProps.js +2 -1
  7. package/lib/esm/components/webchatcontainerstateful/WebChatContainerStateful.js +19 -8
  8. package/lib/esm/components/webchatcontainerstateful/common/defaultStyles/defaultAdaptiveCardStyles.js +3 -1
  9. package/lib/types/common/Constants.d.ts +2 -0
  10. package/lib/types/components/webchatcontainerstateful/interfaces/IAdaptiveCardStyles.d.ts +1 -0
  11. package/package.json +3 -3
package/lib/cjs/common/Constants.js CHANGED
@@ -146,6 +146,9 @@ _defineProperty(Constants, "customEventValue", "customEventValue");
146
146
  _defineProperty(Constants, "Hidden", "Hidden");
147
147
  _defineProperty(Constants, "EndConversationDueToOverflow", "endconversationduetooverflow");
148
148
  _defineProperty(Constants, "SkipSessionCloseForPersistentChatFlag", "skipSessionCloseForPersistentChat");
149
+ // Minimum font-size for input fields to prevent iOS Safari auto-zoom on focus
150
+ _defineProperty(Constants, "minInputFontSizePx", 16);
151
+ _defineProperty(Constants, "minInputFontSize", "16px");
149
152
  const Regex = (_class = /*#__PURE__*/_createClass(function Regex() {
150
153
  _classCallCheck(this, Regex);
151
154
  }), _defineProperty(_class, "EmailRegex", "^(?:[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+(?:\\.[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+)*|\"[^\"\\\\]*(?:\\\\.[^\"\\\\]*)*\")@(?:[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?)*|\\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\])$"), _class);
package/lib/cjs/components/prechatsurveypanestateful/common/defaultStyles/defaultGeneralPreChatSurveyPaneStyleProps.js CHANGED
@@ -12,6 +12,7 @@ const defaultGeneralPreChatSurveyPaneStyleProps = {
12
12
  borderColor: "#F1F1F1",
13
13
  overflowY: "auto",
14
14
  height: "inherit",
15
- width: "inherit"
15
+ width: "inherit",
16
+ overscrollBehavior: "none"
16
17
  };
17
18
  exports.defaultGeneralPreChatSurveyPaneStyleProps = defaultGeneralPreChatSurveyPaneStyleProps;
package/lib/cjs/components/webchatcontainerstateful/WebChatContainerStateful.js CHANGED
@@ -62,7 +62,7 @@ const createMagicCodeSuccessResponse = signin => {
62
62
  };
63
63
  };
64
64
  const WebChatContainerStateful = props => {
65
- var _props$webChatContain, _defaultWebChatContai, _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _props$webChatContain6, _props$webChatContain7, _defaultWebChatContai2, _props$webChatContain8, _props$webChatContain9, _defaultWebChatContai3, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _webChatContainerProp24, _webChatContainerProp25, _webChatContainerProp26, _webChatContainerProp27, _webChatContainerProp28, _webChatContainerProp29, _props$webChatContain10, _props$webChatContain11, _webChatContainerProp30, _webChatContainerProp31, _webChatContainerProp32, _webChatContainerProp33, _props$citationPanePr, _props$citationPanePr2, _props$citationPanePr3, _props$citationPanePr4, _props$citationPanePr5;
65
+ var _props$webChatContain, _defaultWebChatContai, _props$webChatContain2, _props$webChatContain3, _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _props$webChatContain8, _props$webChatContain9, _defaultWebChatContai2, _props$webChatContain10, _props$webChatContain11, _defaultWebChatContai3, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _webChatContainerProp24, _webChatContainerProp25, _webChatContainerProp26, _webChatContainerProp27, _webChatContainerProp28, _webChatContainerProp29, _props$webChatContain12, _props$webChatContain13, _webChatContainerProp30, _webChatContainerProp31, _webChatContainerProp32, _webChatContainerProp33, _props$citationPanePr, _props$citationPanePr2, _props$citationPanePr3, _props$citationPanePr4, _props$citationPanePr5;
66
66
  const [facadeChatSDK] = (0, _useFacadeChatSDKStore.default)();
67
67
 
68
68
  // Create a font family that includes emoji support, based on the primary font or default
@@ -71,6 +71,10 @@ const WebChatContainerStateful = props => {
71
71
 
72
72
  // Use iOS-optimized emoji font that prioritizes system-ui for proper emoji rendering
73
73
  const fontFamilyWithEmojis = (0, _fontUtils.createIOSOptimizedEmojiFont)(primaryFont);
74
+
75
+ // Enforce minimum input font-size to prevent iOS Safari auto-zoom on focus
76
+ const configuredInputFontSize = ((_props$webChatContain2 = props.webChatContainerProps) === null || _props$webChatContain2 === void 0 ? void 0 : (_props$webChatContain3 = _props$webChatContain2.adaptiveCardStyles) === null || _props$webChatContain3 === void 0 ? void 0 : _props$webChatContain3.inputFontSize) ?? _defaultAdaptiveCardStyles.defaultAdaptiveCardStyles.inputFontSize;
77
+ const inputFontSize = parseFloat(configuredInputFontSize ?? String(_Constants.Constants.minInputFontSizePx)) < _Constants.Constants.minInputFontSizePx ? _Constants.Constants.minInputFontSize : configuredInputFontSize;
74
78
  (0, _react2.useEffect)(() => {
75
79
  uiTimer = (0, _utils.createTimer)();
76
80
  _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
@@ -170,7 +174,7 @@ const WebChatContainerStateful = props => {
170
174
  ...(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.localizedTexts)
171
175
  };
172
176
  (0, _react2.useEffect)(() => {
173
- var _props$webChatContain2, _props$webChatContain3;
177
+ var _props$webChatContain4, _props$webChatContain5;
174
178
  if ((0, _utils.getDeviceType)() !== "standard" && (webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.webChatHistoryMobileAccessibilityLabel) !== undefined) {
175
179
  const chatHistoryElement = document.querySelector(`.${_Constants.HtmlClassNames.webChatHistoryContainer}`);
176
180
  if (chatHistoryElement) {
@@ -188,7 +192,7 @@ const WebChatContainerStateful = props => {
188
192
  _TelemetryHelper.TelemetryHelper.logLoadingEvent(_TelemetryConstants.LogLevel.INFO, {
189
193
  Event: _TelemetryConstants.TelemetryEvent.WebChatLoaded
190
194
  });
191
- if (((_props$webChatContain2 = props.webChatContainerProps) === null || _props$webChatContain2 === void 0 ? void 0 : (_props$webChatContain3 = _props$webChatContain2.renderingMiddlewareProps) === null || _props$webChatContain3 === void 0 ? void 0 : _props$webChatContain3.disableThirdPartyCookiesAlert) !== true && !contextDataStore) {
195
+ if (((_props$webChatContain4 = props.webChatContainerProps) === null || _props$webChatContain4 === void 0 ? void 0 : (_props$webChatContain5 = _props$webChatContain4.renderingMiddlewareProps) === null || _props$webChatContain5 === void 0 ? void 0 : _props$webChatContain5.disableThirdPartyCookiesAlert) !== true && !contextDataStore) {
192
196
  try {
193
197
  localStorage;
194
198
  sessionStorage;
@@ -203,8 +207,8 @@ const WebChatContainerStateful = props => {
203
207
  }
204
208
  }, []);
205
209
  (0, _react2.useEffect)(() => {
206
- var _props$webChatContain4, _props$webChatContain5;
207
- if (!((_props$webChatContain4 = props.webChatContainerProps) !== null && _props$webChatContain4 !== void 0 && (_props$webChatContain5 = _props$webChatContain4.botMagicCode) !== null && _props$webChatContain5 !== void 0 && _props$webChatContain5.disabled)) {
210
+ var _props$webChatContain6, _props$webChatContain7;
211
+ if (!((_props$webChatContain6 = props.webChatContainerProps) !== null && _props$webChatContain6 !== void 0 && (_props$webChatContain7 = _props$webChatContain6.botMagicCode) !== null && _props$webChatContain7 !== void 0 && _props$webChatContain7.disabled)) {
208
212
  return;
209
213
  }
210
214
  if (!window.BroadcastChannel) {
@@ -302,9 +306,15 @@ const WebChatContainerStateful = props => {
302
306
  ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp12 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp12 !== void 0 && _webChatContainerProp12.choiceInputPadding ? `padding: ${webChatContainerProps.adaptiveCardStyles.choiceInputPadding} !important;` : ""}
303
307
  }
304
308
 
309
+ div[class="ac-input-container"] input,
310
+ div[class="ac-input-container"] textarea,
311
+ div[class="ac-input-container"] select {
312
+ font-size: ${inputFontSize} !important;
313
+ }
314
+
305
315
  .ms_lcw_webchat_received_message>div.webchat__stacked-layout>div.webchat__stacked-layout__main>div.webchat__stacked-layout__content>div.webchat__stacked-layout__message-row>[class^=webchat]:not(.webchat__bubble--from-user)>.webchat__bubble__content {
306
- background-color: ${((_props$webChatContain6 = props.webChatContainerProps) === null || _props$webChatContain6 === void 0 ? void 0 : (_props$webChatContain7 = _props$webChatContain6.webChatStyles) === null || _props$webChatContain7 === void 0 ? void 0 : _props$webChatContain7.bubbleBackground) ?? ((_defaultWebChatContai2 = _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.webChatStyles) === null || _defaultWebChatContai2 === void 0 ? void 0 : _defaultWebChatContai2.bubbleBackground)};
307
- color:${((_props$webChatContain8 = props.webChatContainerProps) === null || _props$webChatContain8 === void 0 ? void 0 : (_props$webChatContain9 = _props$webChatContain8.webChatStyles) === null || _props$webChatContain9 === void 0 ? void 0 : _props$webChatContain9.bubbleTextColor) ?? ((_defaultWebChatContai3 = _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.webChatStyles) === null || _defaultWebChatContai3 === void 0 ? void 0 : _defaultWebChatContai3.bubbleTextColor)};
316
+ background-color: ${((_props$webChatContain8 = props.webChatContainerProps) === null || _props$webChatContain8 === void 0 ? void 0 : (_props$webChatContain9 = _props$webChatContain8.webChatStyles) === null || _props$webChatContain9 === void 0 ? void 0 : _props$webChatContain9.bubbleBackground) ?? ((_defaultWebChatContai2 = _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.webChatStyles) === null || _defaultWebChatContai2 === void 0 ? void 0 : _defaultWebChatContai2.bubbleBackground)};
317
+ color:${((_props$webChatContain10 = props.webChatContainerProps) === null || _props$webChatContain10 === void 0 ? void 0 : (_props$webChatContain11 = _props$webChatContain10.webChatStyles) === null || _props$webChatContain11 === void 0 ? void 0 : _props$webChatContain11.bubbleTextColor) ?? ((_defaultWebChatContai3 = _defaultWebChatContainerStatefulProps.defaultWebChatContainerStatefulProps.webChatStyles) === null || _defaultWebChatContai3 === void 0 ? void 0 : _defaultWebChatContai3.bubbleTextColor)};
308
318
  }
309
319
 
310
320
  div[class="ac-textBlock"] a:link,
@@ -389,7 +399,7 @@ const WebChatContainerStateful = props => {
389
399
  }
390
400
 
391
401
  .webchat__stacked-layout_container>div {
392
- background: ${(props === null || props === void 0 ? void 0 : (_props$webChatContain10 = props.webChatContainerProps) === null || _props$webChatContain10 === void 0 ? void 0 : (_props$webChatContain11 = _props$webChatContain10.containerStyles) === null || _props$webChatContain11 === void 0 ? void 0 : _props$webChatContain11.background) ?? ""}
402
+ background: ${(props === null || props === void 0 ? void 0 : (_props$webChatContain12 = props.webChatContainerProps) === null || _props$webChatContain12 === void 0 ? void 0 : (_props$webChatContain13 = _props$webChatContain12.containerStyles) === null || _props$webChatContain13 === void 0 ? void 0 : _props$webChatContain13.background) ?? ""}
393
403
  }
394
404
  .webchat__toast_text {
395
405
  display: flex;
@@ -418,6 +428,7 @@ const WebChatContainerStateful = props => {
418
428
 
419
429
  .webchat__auto-resize-textarea__textarea.webchat__send-box-text-box__html-text-area {
420
430
  font-family: ${fontFamilyWithEmojis} !important;
431
+ font-size: ${inputFontSize} !important;
421
432
  }
422
433
 
423
434
  /* Suggested actions carousel previous/next navigation focus */
package/lib/cjs/components/webchatcontainerstateful/common/defaultStyles/defaultAdaptiveCardStyles.js CHANGED
@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.defaultAdaptiveCardStyles = void 0;
7
+ var _Constants = require("../../../../common/Constants");
7
8
  const defaultAdaptiveCardStyles = {
8
9
  background: "white",
9
10
  color: "black",
@@ -11,6 +12,7 @@ const defaultAdaptiveCardStyles = {
11
12
  textWhiteSpace: "normal",
12
13
  buttonWhiteSpace: "normal",
13
14
  buttonFlexWrap: "nowrap",
14
- buttonGap: "0px"
15
+ buttonGap: "0px",
16
+ inputFontSize: _Constants.Constants.minInputFontSize
15
17
  };
16
18
  exports.defaultAdaptiveCardStyles = defaultAdaptiveCardStyles;
package/lib/esm/common/Constants.js CHANGED
@@ -139,6 +139,9 @@ _defineProperty(Constants, "customEventValue", "customEventValue");
139
139
  _defineProperty(Constants, "Hidden", "Hidden");
140
140
  _defineProperty(Constants, "EndConversationDueToOverflow", "endconversationduetooverflow");
141
141
  _defineProperty(Constants, "SkipSessionCloseForPersistentChatFlag", "skipSessionCloseForPersistentChat");
142
+ // Minimum font-size for input fields to prevent iOS Safari auto-zoom on focus
143
+ _defineProperty(Constants, "minInputFontSizePx", 16);
144
+ _defineProperty(Constants, "minInputFontSize", "16px");
142
145
  export const Regex = (_class = /*#__PURE__*/_createClass(function Regex() {
143
146
  _classCallCheck(this, Regex);
144
147
  }), _defineProperty(_class, "EmailRegex", "^(?:[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+(?:\\.[a-zA-Z0-9!#$%&'*+/=?^_`{|}~-]+)*|\"[^\"\\\\]*(?:\\\\.[^\"\\\\]*)*\")@(?:[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?(?:\\.[a-zA-Z0-9](?:[a-zA-Z0-9-]*[a-zA-Z0-9])?)*|\\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\])$"), _class);
package/lib/esm/components/prechatsurveypanestateful/common/defaultStyles/defaultGeneralPreChatSurveyPaneStyleProps.js CHANGED
@@ -6,5 +6,6 @@ export const defaultGeneralPreChatSurveyPaneStyleProps = {
6
6
  borderColor: "#F1F1F1",
7
7
  overflowY: "auto",
8
8
  height: "inherit",
9
- width: "inherit"
9
+ width: "inherit",
10
+ overscrollBehavior: "none"
10
11
  };
package/lib/esm/components/webchatcontainerstateful/WebChatContainerStateful.js CHANGED
@@ -53,7 +53,7 @@ const createMagicCodeSuccessResponse = signin => {
53
53
  };
54
54
  };
55
55
  export const WebChatContainerStateful = props => {
56
- var _props$webChatContain, _defaultWebChatContai, _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _props$webChatContain6, _props$webChatContain7, _defaultWebChatContai2, _props$webChatContain8, _props$webChatContain9, _defaultWebChatContai3, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _webChatContainerProp24, _webChatContainerProp25, _webChatContainerProp26, _webChatContainerProp27, _webChatContainerProp28, _webChatContainerProp29, _props$webChatContain10, _props$webChatContain11, _webChatContainerProp30, _webChatContainerProp31, _webChatContainerProp32, _webChatContainerProp33, _props$citationPanePr, _props$citationPanePr2, _props$citationPanePr3, _props$citationPanePr4, _props$citationPanePr5;
56
+ var _props$webChatContain, _defaultWebChatContai, _props$webChatContain2, _props$webChatContain3, _webChatContainerProp, _webChatContainerProp2, _webChatContainerProp3, _webChatContainerProp4, _webChatContainerProp5, _webChatContainerProp6, _webChatContainerProp7, _webChatContainerProp8, _webChatContainerProp9, _webChatContainerProp10, _webChatContainerProp11, _webChatContainerProp12, _props$webChatContain8, _props$webChatContain9, _defaultWebChatContai2, _props$webChatContain10, _props$webChatContain11, _defaultWebChatContai3, _webChatContainerProp13, _webChatContainerProp14, _webChatContainerProp15, _webChatContainerProp16, _webChatContainerProp17, _webChatContainerProp18, _webChatContainerProp19, _webChatContainerProp20, _webChatContainerProp21, _webChatContainerProp22, _webChatContainerProp23, _webChatContainerProp24, _webChatContainerProp25, _webChatContainerProp26, _webChatContainerProp27, _webChatContainerProp28, _webChatContainerProp29, _props$webChatContain12, _props$webChatContain13, _webChatContainerProp30, _webChatContainerProp31, _webChatContainerProp32, _webChatContainerProp33, _props$citationPanePr, _props$citationPanePr2, _props$citationPanePr3, _props$citationPanePr4, _props$citationPanePr5;
57
57
  const [facadeChatSDK] = useFacadeSDKStore();
58
58
 
59
59
  // Create a font family that includes emoji support, based on the primary font or default
@@ -62,6 +62,10 @@ export const WebChatContainerStateful = props => {
62
62
 
63
63
  // Use iOS-optimized emoji font that prioritizes system-ui for proper emoji rendering
64
64
  const fontFamilyWithEmojis = createIOSOptimizedEmojiFont(primaryFont);
65
+
66
+ // Enforce minimum input font-size to prevent iOS Safari auto-zoom on focus
67
+ const configuredInputFontSize = ((_props$webChatContain2 = props.webChatContainerProps) === null || _props$webChatContain2 === void 0 ? void 0 : (_props$webChatContain3 = _props$webChatContain2.adaptiveCardStyles) === null || _props$webChatContain3 === void 0 ? void 0 : _props$webChatContain3.inputFontSize) ?? defaultAdaptiveCardStyles.inputFontSize;
68
+ const inputFontSize = parseFloat(configuredInputFontSize ?? String(Constants.minInputFontSizePx)) < Constants.minInputFontSizePx ? Constants.minInputFontSize : configuredInputFontSize;
65
69
  useEffect(() => {
66
70
  uiTimer = createTimer();
67
71
  TelemetryHelper.logLoadingEvent(LogLevel.INFO, {
@@ -161,7 +165,7 @@ export const WebChatContainerStateful = props => {
161
165
  ...(webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.localizedTexts)
162
166
  };
163
167
  useEffect(() => {
164
- var _props$webChatContain2, _props$webChatContain3;
168
+ var _props$webChatContain4, _props$webChatContain5;
165
169
  if (getDeviceType() !== "standard" && (webChatContainerProps === null || webChatContainerProps === void 0 ? void 0 : webChatContainerProps.webChatHistoryMobileAccessibilityLabel) !== undefined) {
166
170
  const chatHistoryElement = document.querySelector(`.${HtmlClassNames.webChatHistoryContainer}`);
167
171
  if (chatHistoryElement) {
@@ -179,7 +183,7 @@ export const WebChatContainerStateful = props => {
179
183
  TelemetryHelper.logLoadingEvent(LogLevel.INFO, {
180
184
  Event: TelemetryEvent.WebChatLoaded
181
185
  });
182
- if (((_props$webChatContain2 = props.webChatContainerProps) === null || _props$webChatContain2 === void 0 ? void 0 : (_props$webChatContain3 = _props$webChatContain2.renderingMiddlewareProps) === null || _props$webChatContain3 === void 0 ? void 0 : _props$webChatContain3.disableThirdPartyCookiesAlert) !== true && !contextDataStore) {
186
+ if (((_props$webChatContain4 = props.webChatContainerProps) === null || _props$webChatContain4 === void 0 ? void 0 : (_props$webChatContain5 = _props$webChatContain4.renderingMiddlewareProps) === null || _props$webChatContain5 === void 0 ? void 0 : _props$webChatContain5.disableThirdPartyCookiesAlert) !== true && !contextDataStore) {
183
187
  try {
184
188
  localStorage;
185
189
  sessionStorage;
@@ -194,8 +198,8 @@ export const WebChatContainerStateful = props => {
194
198
  }
195
199
  }, []);
196
200
  useEffect(() => {
197
- var _props$webChatContain4, _props$webChatContain5;
198
- if (!((_props$webChatContain4 = props.webChatContainerProps) !== null && _props$webChatContain4 !== void 0 && (_props$webChatContain5 = _props$webChatContain4.botMagicCode) !== null && _props$webChatContain5 !== void 0 && _props$webChatContain5.disabled)) {
201
+ var _props$webChatContain6, _props$webChatContain7;
202
+ if (!((_props$webChatContain6 = props.webChatContainerProps) !== null && _props$webChatContain6 !== void 0 && (_props$webChatContain7 = _props$webChatContain6.botMagicCode) !== null && _props$webChatContain7 !== void 0 && _props$webChatContain7.disabled)) {
199
203
  return;
200
204
  }
201
205
  if (!window.BroadcastChannel) {
@@ -293,9 +297,15 @@ export const WebChatContainerStateful = props => {
293
297
  ${webChatContainerProps !== null && webChatContainerProps !== void 0 && (_webChatContainerProp12 = webChatContainerProps.adaptiveCardStyles) !== null && _webChatContainerProp12 !== void 0 && _webChatContainerProp12.choiceInputPadding ? `padding: ${webChatContainerProps.adaptiveCardStyles.choiceInputPadding} !important;` : ""}
294
298
  }
295
299
 
300
+ div[class="ac-input-container"] input,
301
+ div[class="ac-input-container"] textarea,
302
+ div[class="ac-input-container"] select {
303
+ font-size: ${inputFontSize} !important;
304
+ }
305
+
296
306
  .ms_lcw_webchat_received_message>div.webchat__stacked-layout>div.webchat__stacked-layout__main>div.webchat__stacked-layout__content>div.webchat__stacked-layout__message-row>[class^=webchat]:not(.webchat__bubble--from-user)>.webchat__bubble__content {
297
- background-color: ${((_props$webChatContain6 = props.webChatContainerProps) === null || _props$webChatContain6 === void 0 ? void 0 : (_props$webChatContain7 = _props$webChatContain6.webChatStyles) === null || _props$webChatContain7 === void 0 ? void 0 : _props$webChatContain7.bubbleBackground) ?? ((_defaultWebChatContai2 = defaultWebChatContainerStatefulProps.webChatStyles) === null || _defaultWebChatContai2 === void 0 ? void 0 : _defaultWebChatContai2.bubbleBackground)};
298
- color:${((_props$webChatContain8 = props.webChatContainerProps) === null || _props$webChatContain8 === void 0 ? void 0 : (_props$webChatContain9 = _props$webChatContain8.webChatStyles) === null || _props$webChatContain9 === void 0 ? void 0 : _props$webChatContain9.bubbleTextColor) ?? ((_defaultWebChatContai3 = defaultWebChatContainerStatefulProps.webChatStyles) === null || _defaultWebChatContai3 === void 0 ? void 0 : _defaultWebChatContai3.bubbleTextColor)};
307
+ background-color: ${((_props$webChatContain8 = props.webChatContainerProps) === null || _props$webChatContain8 === void 0 ? void 0 : (_props$webChatContain9 = _props$webChatContain8.webChatStyles) === null || _props$webChatContain9 === void 0 ? void 0 : _props$webChatContain9.bubbleBackground) ?? ((_defaultWebChatContai2 = defaultWebChatContainerStatefulProps.webChatStyles) === null || _defaultWebChatContai2 === void 0 ? void 0 : _defaultWebChatContai2.bubbleBackground)};
308
+ color:${((_props$webChatContain10 = props.webChatContainerProps) === null || _props$webChatContain10 === void 0 ? void 0 : (_props$webChatContain11 = _props$webChatContain10.webChatStyles) === null || _props$webChatContain11 === void 0 ? void 0 : _props$webChatContain11.bubbleTextColor) ?? ((_defaultWebChatContai3 = defaultWebChatContainerStatefulProps.webChatStyles) === null || _defaultWebChatContai3 === void 0 ? void 0 : _defaultWebChatContai3.bubbleTextColor)};
299
309
  }
300
310
 
301
311
  div[class="ac-textBlock"] a:link,
@@ -380,7 +390,7 @@ export const WebChatContainerStateful = props => {
380
390
  }
381
391
 
382
392
  .webchat__stacked-layout_container>div {
383
- background: ${(props === null || props === void 0 ? void 0 : (_props$webChatContain10 = props.webChatContainerProps) === null || _props$webChatContain10 === void 0 ? void 0 : (_props$webChatContain11 = _props$webChatContain10.containerStyles) === null || _props$webChatContain11 === void 0 ? void 0 : _props$webChatContain11.background) ?? ""}
393
+ background: ${(props === null || props === void 0 ? void 0 : (_props$webChatContain12 = props.webChatContainerProps) === null || _props$webChatContain12 === void 0 ? void 0 : (_props$webChatContain13 = _props$webChatContain12.containerStyles) === null || _props$webChatContain13 === void 0 ? void 0 : _props$webChatContain13.background) ?? ""}
384
394
  }
385
395
  .webchat__toast_text {
386
396
  display: flex;
@@ -409,6 +419,7 @@ export const WebChatContainerStateful = props => {
409
419
 
410
420
  .webchat__auto-resize-textarea__textarea.webchat__send-box-text-box__html-text-area {
411
421
  font-family: ${fontFamilyWithEmojis} !important;
422
+ font-size: ${inputFontSize} !important;
412
423
  }
413
424
 
414
425
  /* Suggested actions carousel previous/next navigation focus */
package/lib/esm/components/webchatcontainerstateful/common/defaultStyles/defaultAdaptiveCardStyles.js CHANGED
@@ -1,3 +1,4 @@
1
+ import { Constants } from "../../../../common/Constants";
1
2
  export const defaultAdaptiveCardStyles = {
2
3
  background: "white",
3
4
  color: "black",
@@ -5,5 +6,6 @@ export const defaultAdaptiveCardStyles = {
5
6
  textWhiteSpace: "normal",
6
7
  buttonWhiteSpace: "normal",
7
8
  buttonFlexWrap: "nowrap",
8
- buttonGap: "0px"
9
+ buttonGap: "0px",
10
+ inputFontSize: Constants.minInputFontSize
9
11
  };
package/lib/types/common/Constants.d.ts CHANGED
@@ -110,6 +110,8 @@ export declare class Constants {
110
110
  static readonly Hidden = "Hidden";
111
111
  static readonly EndConversationDueToOverflow = "endconversationduetooverflow";
112
112
  static readonly SkipSessionCloseForPersistentChatFlag = "skipSessionCloseForPersistentChat";
113
+ static readonly minInputFontSizePx = 16;
114
+ static readonly minInputFontSize = "16px";
113
115
  }
114
116
  export declare const Regex: {
115
117
  new (): {};
package/lib/types/components/webchatcontainerstateful/interfaces/IAdaptiveCardStyles.d.ts CHANGED
@@ -7,4 +7,5 @@ export interface IAdaptiveCardStyles {
7
7
  choiceInputPadding?: string;
8
8
  buttonFlexWrap?: string;
9
9
  buttonGap?: string;
10
+ inputFontSize?: string;
10
11
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@microsoft/omnichannel-chat-widget",
3
- "version": "1.8.4-main.d4c4cb2",
3
+ "version": "1.8.4-main.f21df63",
4
4
  "description": "Microsoft Omnichannel Chat Widget",
5
5
  "main": "lib/cjs/index.js",
6
6
  "types": "lib/types/index.d.ts",
@@ -90,7 +90,7 @@
90
90
  "dependencies": {
91
91
  "@azure/core-tracing": "^1.2.0",
92
92
  "@microsoft/applicationinsights-web": "^3.3.6",
93
- "@microsoft/omnichannel-chat-components": "1.1.17-main.940d996",
93
+ "@microsoft/omnichannel-chat-components": "1.1.17-main.d4c4cb2",
94
94
  "@microsoft/omnichannel-chat-sdk": "1.11.9-main.da8219b",
95
95
  "@opentelemetry/api": "^1.9.0",
96
96
  "abort-controller": "^3",
@@ -153,7 +153,7 @@
153
153
  "**/semver": "7.5.4",
154
154
  "**/lodash": "4.17.23",
155
155
  "**/@babel/runtime-corejs3": "^7.29.0",
156
- "**/brace-expansion": "2.0.2",
156
+ "**/brace-expansion": "2.0.3",
157
157
  "**/swiper": "9.4.1"
158
158
  },
159
159
  "jest": {