@microsoft/omnichannel-chat-components 1.1.17-main.5d1fc98 → 1.1.17-main.882d8f1

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 (9) hide show
  1. package/lib/cjs/components/prechatsurveypane/PreChatSurveyPane.js +45 -16
  2. package/lib/cjs/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneMultichoiceInputStyles.js +1 -0
  3. package/lib/cjs/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneMultilineTextInputStyles.js +1 -0
  4. package/lib/cjs/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneTextInputStyles.js +1 -0
  5. package/lib/esm/components/prechatsurveypane/PreChatSurveyPane.js +45 -16
  6. package/lib/esm/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneMultichoiceInputStyles.js +1 -0
  7. package/lib/esm/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneMultilineTextInputStyles.js +1 -0
  8. package/lib/esm/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneTextInputStyles.js +1 -0
  9. package/package.json +1 -1
package/lib/cjs/components/prechatsurveypane/PreChatSurveyPane.js CHANGED
@@ -16,7 +16,7 @@ var _defaultPreChatSurveyPaneGeneralStyles = require("./common/defaultProps/defa
16
16
  var _defaultPreChatSurveyPaneStyles = require("./common/defaultProps/defaultStyles/defaultPreChatSurveyPaneStyles");
17
17
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
18
18
  function PreChatSurveyPane(props) {
19
- var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps4, _props$styleProps5, _props$styleProps6, _props$styleProps7, _props$styleProps8, _props$styleProps9, _props$styleProps0, _defaultPreChatSurvey, _props$styleProps1, _defaultPreChatSurvey2, _props$styleProps10, _props$styleProps11, _defaultPreChatSurvey3, _props$styleProps12, _defaultPreChatSurvey4, _props$styleProps13, _props$styleProps14, _defaultPreChatSurvey5, _props$styleProps15, _defaultPreChatSurvey6, _props$styleProps16, _defaultPreChatSurvey7, _props$styleProps17, _defaultPreChatSurvey8, _props$styleProps18, _defaultPreChatSurvey9, _props$styleProps19, _defaultPreChatSurvey0, _props$styleProps20, _defaultPreChatSurvey1, _props$styleProps21, _defaultPreChatSurvey10, _props$controlProps6, _props$controlProps7, _props$controlProps8;
19
+ var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps4, _props$styleProps5, _props$styleProps6, _props$styleProps7, _props$styleProps8, _props$styleProps9, _defaultPreChatSurvey, _props$styleProps0, _defaultPreChatSurvey2, _props$styleProps1, _defaultPreChatSurvey3, _props$styleProps10, _defaultPreChatSurvey4, _props$styleProps11, _defaultPreChatSurvey5, _props$styleProps12, _defaultPreChatSurvey6, _props$styleProps13, _defaultPreChatSurvey7, _props$styleProps14, _defaultPreChatSurvey8, _props$styleProps15, _defaultPreChatSurvey9, _props$styleProps16, _defaultPreChatSurvey0, _props$styleProps17, _defaultPreChatSurvey1, _props$styleProps18, _defaultPreChatSurvey10, _props$styleProps19, _defaultPreChatSurvey11, _props$styleProps20, _defaultPreChatSurvey12, _props$styleProps21, _defaultPreChatSurvey13, _props$controlProps6, _props$controlProps7, _props$controlProps8;
20
20
  const elementId = ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.id) ?? _defaultPreChatSurveyPaneControlProps.defaultPreChatSurveyPaneControlProps.id;
21
21
  let adpativeCardPayload;
22
22
  let adaptiveCardHostConfig;
@@ -71,6 +71,22 @@ function PreChatSurveyPane(props) {
71
71
  // Render the card
72
72
  const renderedCard = adaptiveCard.render();
73
73
  (0, _utils.addNoreferrerNoopenerTag)(renderedCard);
74
+
75
+ // Fix iOS Safari blank space in <select> dropdowns
76
+ if (renderedCard) {
77
+ const selectElements = renderedCard.querySelectorAll("select.ac-choiceSetInput-compact");
78
+ selectElements.forEach(select => {
79
+ // Remove hidden placeholder option that causes blank space on iOS
80
+ const firstOption = select.options[0];
81
+ if (firstOption && firstOption.disabled && firstOption.hidden && firstOption.value === "") {
82
+ select.removeChild(firstOption);
83
+ }
84
+ // Override iOS native select rendering
85
+ select.style.webkitAppearance = "none";
86
+ select.style.height = "auto";
87
+ select.style.minHeight = "31px";
88
+ });
89
+ }
74
90
  return /*#__PURE__*/_react2.default.createElement(_react2.default.Fragment, null, /*#__PURE__*/_react2.default.createElement("style", null, `
75
91
  .ac-textBlock {
76
92
  font-size: ${(_props$styleProps3 = props.styleProps) === null || _props$styleProps3 === void 0 || (_props$styleProps3 = _props$styleProps3.customTextStyleProps) === null || _props$styleProps3 === void 0 ? void 0 : _props$styleProps3.fontSize} !important;
@@ -88,39 +104,52 @@ function PreChatSurveyPane(props) {
88
104
  margin-bottom: 6px;
89
105
  }
90
106
  .ac-input.ac-textInput {
91
- font-size: ${(_props$styleProps9 = props.styleProps) === null || _props$styleProps9 === void 0 || (_props$styleProps9 = _props$styleProps9.customTextInputStyleProps) === null || _props$styleProps9 === void 0 ? void 0 : _props$styleProps9.fontSize};
92
- font-family: ${((_props$styleProps0 = props.styleProps) === null || _props$styleProps0 === void 0 || (_props$styleProps0 = _props$styleProps0.customTextInputStyleProps) === null || _props$styleProps0 === void 0 ? void 0 : _props$styleProps0.fontFamily) ?? ((_defaultPreChatSurvey = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey === void 0 ? void 0 : _defaultPreChatSurvey.fontFamily)};
93
- height: ${((_props$styleProps1 = props.styleProps) === null || _props$styleProps1 === void 0 || (_props$styleProps1 = _props$styleProps1.customTextInputStyleProps) === null || _props$styleProps1 === void 0 ? void 0 : _props$styleProps1.height) ?? ((_defaultPreChatSurvey2 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey2 === void 0 ? void 0 : _defaultPreChatSurvey2.height)};
107
+ font-size: ${((_props$styleProps9 = props.styleProps) === null || _props$styleProps9 === void 0 || (_props$styleProps9 = _props$styleProps9.customTextInputStyleProps) === null || _props$styleProps9 === void 0 ? void 0 : _props$styleProps9.fontSize) ?? ((_defaultPreChatSurvey = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey === void 0 ? void 0 : _defaultPreChatSurvey.fontSize)};
108
+ font-family: ${((_props$styleProps0 = props.styleProps) === null || _props$styleProps0 === void 0 || (_props$styleProps0 = _props$styleProps0.customTextInputStyleProps) === null || _props$styleProps0 === void 0 ? void 0 : _props$styleProps0.fontFamily) ?? ((_defaultPreChatSurvey2 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey2 === void 0 ? void 0 : _defaultPreChatSurvey2.fontFamily)};
109
+ height: ${((_props$styleProps1 = props.styleProps) === null || _props$styleProps1 === void 0 || (_props$styleProps1 = _props$styleProps1.customTextInputStyleProps) === null || _props$styleProps1 === void 0 ? void 0 : _props$styleProps1.height) ?? ((_defaultPreChatSurvey3 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey3 === void 0 ? void 0 : _defaultPreChatSurvey3.height)};
94
110
  padding: 8px;
95
111
  }
96
112
  .ac-input.ac-textInput.ac-multiline {
97
- font-size: ${(_props$styleProps10 = props.styleProps) === null || _props$styleProps10 === void 0 || (_props$styleProps10 = _props$styleProps10.customMultilineTextInputStyleProps) === null || _props$styleProps10 === void 0 ? void 0 : _props$styleProps10.fontSize};
98
- font-family: ${((_props$styleProps11 = props.styleProps) === null || _props$styleProps11 === void 0 || (_props$styleProps11 = _props$styleProps11.customMultilineTextInputStyleProps) === null || _props$styleProps11 === void 0 ? void 0 : _props$styleProps11.fontFamily) ?? ((_defaultPreChatSurvey3 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey3 === void 0 ? void 0 : _defaultPreChatSurvey3.fontFamily)};
99
- height: ${((_props$styleProps12 = props.styleProps) === null || _props$styleProps12 === void 0 || (_props$styleProps12 = _props$styleProps12.customMultilineTextInputStyleProps) === null || _props$styleProps12 === void 0 ? void 0 : _props$styleProps12.height) ?? ((_defaultPreChatSurvey4 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey4 === void 0 ? void 0 : _defaultPreChatSurvey4.height)};
113
+ font-size: ${((_props$styleProps10 = props.styleProps) === null || _props$styleProps10 === void 0 || (_props$styleProps10 = _props$styleProps10.customMultilineTextInputStyleProps) === null || _props$styleProps10 === void 0 ? void 0 : _props$styleProps10.fontSize) ?? ((_defaultPreChatSurvey4 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey4 === void 0 ? void 0 : _defaultPreChatSurvey4.fontSize)};
114
+ font-family: ${((_props$styleProps11 = props.styleProps) === null || _props$styleProps11 === void 0 || (_props$styleProps11 = _props$styleProps11.customMultilineTextInputStyleProps) === null || _props$styleProps11 === void 0 ? void 0 : _props$styleProps11.fontFamily) ?? ((_defaultPreChatSurvey5 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey5 === void 0 ? void 0 : _defaultPreChatSurvey5.fontFamily)};
115
+ height: ${((_props$styleProps12 = props.styleProps) === null || _props$styleProps12 === void 0 || (_props$styleProps12 = _props$styleProps12.customMultilineTextInputStyleProps) === null || _props$styleProps12 === void 0 ? void 0 : _props$styleProps12.height) ?? ((_defaultPreChatSurvey6 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey6 === void 0 ? void 0 : _defaultPreChatSurvey6.height)};
100
116
  resize: none;
101
117
  }
102
118
  .ac-input.ac-multichoiceInput {
103
- font-size: ${(_props$styleProps13 = props.styleProps) === null || _props$styleProps13 === void 0 || (_props$styleProps13 = _props$styleProps13.customMultichoiceInputStyleProps) === null || _props$styleProps13 === void 0 ? void 0 : _props$styleProps13.fontSize};
104
- font-family: ${((_props$styleProps14 = props.styleProps) === null || _props$styleProps14 === void 0 || (_props$styleProps14 = _props$styleProps14.customMultichoiceInputStyleProps) === null || _props$styleProps14 === void 0 ? void 0 : _props$styleProps14.fontFamily) ?? ((_defaultPreChatSurvey5 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customMultichoiceInputStyleProps) === null || _defaultPreChatSurvey5 === void 0 ? void 0 : _defaultPreChatSurvey5.fontFamily)};
119
+ font-size: ${((_props$styleProps13 = props.styleProps) === null || _props$styleProps13 === void 0 || (_props$styleProps13 = _props$styleProps13.customMultichoiceInputStyleProps) === null || _props$styleProps13 === void 0 ? void 0 : _props$styleProps13.fontSize) ?? ((_defaultPreChatSurvey7 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customMultichoiceInputStyleProps) === null || _defaultPreChatSurvey7 === void 0 ? void 0 : _defaultPreChatSurvey7.fontSize)};
120
+ font-family: ${((_props$styleProps14 = props.styleProps) === null || _props$styleProps14 === void 0 || (_props$styleProps14 = _props$styleProps14.customMultichoiceInputStyleProps) === null || _props$styleProps14 === void 0 ? void 0 : _props$styleProps14.fontFamily) ?? ((_defaultPreChatSurvey8 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customMultichoiceInputStyleProps) === null || _defaultPreChatSurvey8 === void 0 ? void 0 : _defaultPreChatSurvey8.fontFamily)};
105
121
  padding: 3px;
106
122
  padding-top: 7px;
107
123
  padding-bottom: 7px;
124
+ box-sizing: border-box;
125
+ }
126
+ .ac-input.ac-multichoiceInput.ac-choiceSetInput-compact {
127
+ height: auto;
128
+ min-height: 31px;
129
+ max-height: 45px;
130
+ -webkit-appearance: none;
131
+ appearance: none;
132
+ background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
133
+ background-repeat: no-repeat;
134
+ background-position: right 8px center;
135
+ background-size: 16px;
136
+ padding-right: 30px;
108
137
  }
109
138
  .ac-input.ac-toggleInput {
110
- align-items: ${((_props$styleProps15 = props.styleProps) === null || _props$styleProps15 === void 0 || (_props$styleProps15 = _props$styleProps15.customToggleInputStyleProps) === null || _props$styleProps15 === void 0 ? void 0 : _props$styleProps15.alignItems) ?? ((_defaultPreChatSurvey6 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customToggleInputStyleProps) === null || _defaultPreChatSurvey6 === void 0 ? void 0 : _defaultPreChatSurvey6.alignItems)} !important;
139
+ align-items: ${((_props$styleProps15 = props.styleProps) === null || _props$styleProps15 === void 0 || (_props$styleProps15 = _props$styleProps15.customToggleInputStyleProps) === null || _props$styleProps15 === void 0 ? void 0 : _props$styleProps15.alignItems) ?? ((_defaultPreChatSurvey9 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customToggleInputStyleProps) === null || _defaultPreChatSurvey9 === void 0 ? void 0 : _defaultPreChatSurvey9.alignItems)} !important;
111
140
  }
112
141
  .ac-pushButton {
113
142
  border: 1px solid #00000000;
114
143
  margin: 2px;
115
- height: ${((_props$styleProps16 = props.styleProps) === null || _props$styleProps16 === void 0 || (_props$styleProps16 = _props$styleProps16.customButtonStyleProps) === null || _props$styleProps16 === void 0 ? void 0 : _props$styleProps16.height) ?? ((_defaultPreChatSurvey7 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey7 === void 0 ? void 0 : _defaultPreChatSurvey7.height)};
116
- width: ${((_props$styleProps17 = props.styleProps) === null || _props$styleProps17 === void 0 || (_props$styleProps17 = _props$styleProps17.customButtonStyleProps) === null || _props$styleProps17 === void 0 ? void 0 : _props$styleProps17.width) ?? ((_defaultPreChatSurvey8 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey8 === void 0 ? void 0 : _defaultPreChatSurvey8.width)};
144
+ height: ${((_props$styleProps16 = props.styleProps) === null || _props$styleProps16 === void 0 || (_props$styleProps16 = _props$styleProps16.customButtonStyleProps) === null || _props$styleProps16 === void 0 ? void 0 : _props$styleProps16.height) ?? ((_defaultPreChatSurvey0 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey0 === void 0 ? void 0 : _defaultPreChatSurvey0.height)};
145
+ width: ${((_props$styleProps17 = props.styleProps) === null || _props$styleProps17 === void 0 || (_props$styleProps17 = _props$styleProps17.customButtonStyleProps) === null || _props$styleProps17 === void 0 ? void 0 : _props$styleProps17.width) ?? ((_defaultPreChatSurvey1 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey1 === void 0 ? void 0 : _defaultPreChatSurvey1.width)};
117
146
  border-radius: 5px;
118
147
  cursor: pointer;
119
148
  font-weight: bold;
120
- font-size: ${((_props$styleProps18 = props.styleProps) === null || _props$styleProps18 === void 0 || (_props$styleProps18 = _props$styleProps18.customButtonStyleProps) === null || _props$styleProps18 === void 0 ? void 0 : _props$styleProps18.fontSize) ?? ((_defaultPreChatSurvey9 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey9 === void 0 ? void 0 : _defaultPreChatSurvey9.fontSize)};
121
- font-family: ${((_props$styleProps19 = props.styleProps) === null || _props$styleProps19 === void 0 || (_props$styleProps19 = _props$styleProps19.customButtonStyleProps) === null || _props$styleProps19 === void 0 ? void 0 : _props$styleProps19.fontFamily) ?? ((_defaultPreChatSurvey0 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey0 === void 0 ? void 0 : _defaultPreChatSurvey0.fontFamily)};
122
- color: ${((_props$styleProps20 = props.styleProps) === null || _props$styleProps20 === void 0 || (_props$styleProps20 = _props$styleProps20.customButtonStyleProps) === null || _props$styleProps20 === void 0 ? void 0 : _props$styleProps20.color) ?? ((_defaultPreChatSurvey1 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey1 === void 0 ? void 0 : _defaultPreChatSurvey1.color)};
123
- background-color: ${((_props$styleProps21 = props.styleProps) === null || _props$styleProps21 === void 0 || (_props$styleProps21 = _props$styleProps21.customButtonStyleProps) === null || _props$styleProps21 === void 0 ? void 0 : _props$styleProps21.backgroundColor) ?? ((_defaultPreChatSurvey10 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey10 === void 0 ? void 0 : _defaultPreChatSurvey10.backgroundColor)};
149
+ font-size: ${((_props$styleProps18 = props.styleProps) === null || _props$styleProps18 === void 0 || (_props$styleProps18 = _props$styleProps18.customButtonStyleProps) === null || _props$styleProps18 === void 0 ? void 0 : _props$styleProps18.fontSize) ?? ((_defaultPreChatSurvey10 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey10 === void 0 ? void 0 : _defaultPreChatSurvey10.fontSize)};
150
+ font-family: ${((_props$styleProps19 = props.styleProps) === null || _props$styleProps19 === void 0 || (_props$styleProps19 = _props$styleProps19.customButtonStyleProps) === null || _props$styleProps19 === void 0 ? void 0 : _props$styleProps19.fontFamily) ?? ((_defaultPreChatSurvey11 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey11 === void 0 ? void 0 : _defaultPreChatSurvey11.fontFamily)};
151
+ color: ${((_props$styleProps20 = props.styleProps) === null || _props$styleProps20 === void 0 || (_props$styleProps20 = _props$styleProps20.customButtonStyleProps) === null || _props$styleProps20 === void 0 ? void 0 : _props$styleProps20.color) ?? ((_defaultPreChatSurvey12 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey12 === void 0 ? void 0 : _defaultPreChatSurvey12.color)};
152
+ background-color: ${((_props$styleProps21 = props.styleProps) === null || _props$styleProps21 === void 0 || (_props$styleProps21 = _props$styleProps21.customButtonStyleProps) === null || _props$styleProps21 === void 0 ? void 0 : _props$styleProps21.backgroundColor) ?? ((_defaultPreChatSurvey13 = _defaultPreChatSurveyPaneStyles.defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey13 === void 0 ? void 0 : _defaultPreChatSurvey13.backgroundColor)};
124
153
  }`), !((_props$controlProps6 = props.controlProps) !== null && _props$controlProps6 !== void 0 && _props$controlProps6.hidePreChatSurveyPane) && /*#__PURE__*/_react2.default.createElement(_react.Stack, {
125
154
  id: elementId,
126
155
  tabIndex: -1,
package/lib/cjs/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneMultichoiceInputStyles.js CHANGED
@@ -5,5 +5,6 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.defaultPreChatSurveyPaneMultichoiceInputStyles = void 0;
7
7
  const defaultPreChatSurveyPaneMultichoiceInputStyles = exports.defaultPreChatSurveyPaneMultichoiceInputStyles = {
8
+ fontSize: "16px",
8
9
  fontFamily: "Segoe UI, Helvetica Neue, sans-serif"
9
10
  };
package/lib/cjs/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneMultilineTextInputStyles.js CHANGED
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.defaultPreChatSurveyPaneMultilineTextInputStyles = void 0;
7
7
  const defaultPreChatSurveyPaneMultilineTextInputStyles = exports.defaultPreChatSurveyPaneMultilineTextInputStyles = {
8
+ fontSize: "16px",
8
9
  height: "52px",
9
10
  fontFamily: "Segoe UI, Helvetica Neue, sans-serif"
10
11
  };
package/lib/cjs/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneTextInputStyles.js CHANGED
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.defaultPreChatSurveyPaneTextInputStyles = void 0;
7
7
  const defaultPreChatSurveyPaneTextInputStyles = exports.defaultPreChatSurveyPaneTextInputStyles = {
8
+ fontSize: "16px",
8
9
  height: "20px",
9
10
  fontFamily: "Segoe UI, Helvetica Neue, sans-serif"
10
11
  };
package/lib/esm/components/prechatsurveypane/PreChatSurveyPane.js CHANGED
@@ -9,7 +9,7 @@ import { defaultPreChatSurveyPaneControlProps } from "./common/defaultProps/defa
9
9
  import { defaultPreChatSurveyPaneGeneralStyles } from "./common/defaultProps/defaultStyles/defaultPreChatSurveyPaneGeneralStyles";
10
10
  import { defaultPreChatSurveyPaneStyles } from "./common/defaultProps/defaultStyles/defaultPreChatSurveyPaneStyles";
11
11
  function PreChatSurveyPane(props) {
12
- var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps4, _props$styleProps5, _props$styleProps6, _props$styleProps7, _props$styleProps8, _props$styleProps9, _props$styleProps0, _defaultPreChatSurvey, _props$styleProps1, _defaultPreChatSurvey2, _props$styleProps10, _props$styleProps11, _defaultPreChatSurvey3, _props$styleProps12, _defaultPreChatSurvey4, _props$styleProps13, _props$styleProps14, _defaultPreChatSurvey5, _props$styleProps15, _defaultPreChatSurvey6, _props$styleProps16, _defaultPreChatSurvey7, _props$styleProps17, _defaultPreChatSurvey8, _props$styleProps18, _defaultPreChatSurvey9, _props$styleProps19, _defaultPreChatSurvey0, _props$styleProps20, _defaultPreChatSurvey1, _props$styleProps21, _defaultPreChatSurvey10, _props$controlProps6, _props$controlProps7, _props$controlProps8;
12
+ var _props$controlProps, _props$styleProps, _props$styleProps2, _props$styleProps3, _props$styleProps4, _props$styleProps5, _props$styleProps6, _props$styleProps7, _props$styleProps8, _props$styleProps9, _defaultPreChatSurvey, _props$styleProps0, _defaultPreChatSurvey2, _props$styleProps1, _defaultPreChatSurvey3, _props$styleProps10, _defaultPreChatSurvey4, _props$styleProps11, _defaultPreChatSurvey5, _props$styleProps12, _defaultPreChatSurvey6, _props$styleProps13, _defaultPreChatSurvey7, _props$styleProps14, _defaultPreChatSurvey8, _props$styleProps15, _defaultPreChatSurvey9, _props$styleProps16, _defaultPreChatSurvey0, _props$styleProps17, _defaultPreChatSurvey1, _props$styleProps18, _defaultPreChatSurvey10, _props$styleProps19, _defaultPreChatSurvey11, _props$styleProps20, _defaultPreChatSurvey12, _props$styleProps21, _defaultPreChatSurvey13, _props$controlProps6, _props$controlProps7, _props$controlProps8;
13
13
  const elementId = ((_props$controlProps = props.controlProps) === null || _props$controlProps === void 0 ? void 0 : _props$controlProps.id) ?? defaultPreChatSurveyPaneControlProps.id;
14
14
  let adpativeCardPayload;
15
15
  let adaptiveCardHostConfig;
@@ -64,6 +64,22 @@ function PreChatSurveyPane(props) {
64
64
  // Render the card
65
65
  const renderedCard = adaptiveCard.render();
66
66
  addNoreferrerNoopenerTag(renderedCard);
67
+
68
+ // Fix iOS Safari blank space in <select> dropdowns
69
+ if (renderedCard) {
70
+ const selectElements = renderedCard.querySelectorAll("select.ac-choiceSetInput-compact");
71
+ selectElements.forEach(select => {
72
+ // Remove hidden placeholder option that causes blank space on iOS
73
+ const firstOption = select.options[0];
74
+ if (firstOption && firstOption.disabled && firstOption.hidden && firstOption.value === "") {
75
+ select.removeChild(firstOption);
76
+ }
77
+ // Override iOS native select rendering
78
+ select.style.webkitAppearance = "none";
79
+ select.style.height = "auto";
80
+ select.style.minHeight = "31px";
81
+ });
82
+ }
67
83
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("style", null, `
68
84
  .ac-textBlock {
69
85
  font-size: ${(_props$styleProps3 = props.styleProps) === null || _props$styleProps3 === void 0 || (_props$styleProps3 = _props$styleProps3.customTextStyleProps) === null || _props$styleProps3 === void 0 ? void 0 : _props$styleProps3.fontSize} !important;
@@ -81,39 +97,52 @@ function PreChatSurveyPane(props) {
81
97
  margin-bottom: 6px;
82
98
  }
83
99
  .ac-input.ac-textInput {
84
- font-size: ${(_props$styleProps9 = props.styleProps) === null || _props$styleProps9 === void 0 || (_props$styleProps9 = _props$styleProps9.customTextInputStyleProps) === null || _props$styleProps9 === void 0 ? void 0 : _props$styleProps9.fontSize};
85
- font-family: ${((_props$styleProps0 = props.styleProps) === null || _props$styleProps0 === void 0 || (_props$styleProps0 = _props$styleProps0.customTextInputStyleProps) === null || _props$styleProps0 === void 0 ? void 0 : _props$styleProps0.fontFamily) ?? ((_defaultPreChatSurvey = defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey === void 0 ? void 0 : _defaultPreChatSurvey.fontFamily)};
86
- height: ${((_props$styleProps1 = props.styleProps) === null || _props$styleProps1 === void 0 || (_props$styleProps1 = _props$styleProps1.customTextInputStyleProps) === null || _props$styleProps1 === void 0 ? void 0 : _props$styleProps1.height) ?? ((_defaultPreChatSurvey2 = defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey2 === void 0 ? void 0 : _defaultPreChatSurvey2.height)};
100
+ font-size: ${((_props$styleProps9 = props.styleProps) === null || _props$styleProps9 === void 0 || (_props$styleProps9 = _props$styleProps9.customTextInputStyleProps) === null || _props$styleProps9 === void 0 ? void 0 : _props$styleProps9.fontSize) ?? ((_defaultPreChatSurvey = defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey === void 0 ? void 0 : _defaultPreChatSurvey.fontSize)};
101
+ font-family: ${((_props$styleProps0 = props.styleProps) === null || _props$styleProps0 === void 0 || (_props$styleProps0 = _props$styleProps0.customTextInputStyleProps) === null || _props$styleProps0 === void 0 ? void 0 : _props$styleProps0.fontFamily) ?? ((_defaultPreChatSurvey2 = defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey2 === void 0 ? void 0 : _defaultPreChatSurvey2.fontFamily)};
102
+ height: ${((_props$styleProps1 = props.styleProps) === null || _props$styleProps1 === void 0 || (_props$styleProps1 = _props$styleProps1.customTextInputStyleProps) === null || _props$styleProps1 === void 0 ? void 0 : _props$styleProps1.height) ?? ((_defaultPreChatSurvey3 = defaultPreChatSurveyPaneStyles.customTextInputStyleProps) === null || _defaultPreChatSurvey3 === void 0 ? void 0 : _defaultPreChatSurvey3.height)};
87
103
  padding: 8px;
88
104
  }
89
105
  .ac-input.ac-textInput.ac-multiline {
90
- font-size: ${(_props$styleProps10 = props.styleProps) === null || _props$styleProps10 === void 0 || (_props$styleProps10 = _props$styleProps10.customMultilineTextInputStyleProps) === null || _props$styleProps10 === void 0 ? void 0 : _props$styleProps10.fontSize};
91
- font-family: ${((_props$styleProps11 = props.styleProps) === null || _props$styleProps11 === void 0 || (_props$styleProps11 = _props$styleProps11.customMultilineTextInputStyleProps) === null || _props$styleProps11 === void 0 ? void 0 : _props$styleProps11.fontFamily) ?? ((_defaultPreChatSurvey3 = defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey3 === void 0 ? void 0 : _defaultPreChatSurvey3.fontFamily)};
92
- height: ${((_props$styleProps12 = props.styleProps) === null || _props$styleProps12 === void 0 || (_props$styleProps12 = _props$styleProps12.customMultilineTextInputStyleProps) === null || _props$styleProps12 === void 0 ? void 0 : _props$styleProps12.height) ?? ((_defaultPreChatSurvey4 = defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey4 === void 0 ? void 0 : _defaultPreChatSurvey4.height)};
106
+ font-size: ${((_props$styleProps10 = props.styleProps) === null || _props$styleProps10 === void 0 || (_props$styleProps10 = _props$styleProps10.customMultilineTextInputStyleProps) === null || _props$styleProps10 === void 0 ? void 0 : _props$styleProps10.fontSize) ?? ((_defaultPreChatSurvey4 = defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey4 === void 0 ? void 0 : _defaultPreChatSurvey4.fontSize)};
107
+ font-family: ${((_props$styleProps11 = props.styleProps) === null || _props$styleProps11 === void 0 || (_props$styleProps11 = _props$styleProps11.customMultilineTextInputStyleProps) === null || _props$styleProps11 === void 0 ? void 0 : _props$styleProps11.fontFamily) ?? ((_defaultPreChatSurvey5 = defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey5 === void 0 ? void 0 : _defaultPreChatSurvey5.fontFamily)};
108
+ height: ${((_props$styleProps12 = props.styleProps) === null || _props$styleProps12 === void 0 || (_props$styleProps12 = _props$styleProps12.customMultilineTextInputStyleProps) === null || _props$styleProps12 === void 0 ? void 0 : _props$styleProps12.height) ?? ((_defaultPreChatSurvey6 = defaultPreChatSurveyPaneStyles.customMultilineTextInputStyleProps) === null || _defaultPreChatSurvey6 === void 0 ? void 0 : _defaultPreChatSurvey6.height)};
93
109
  resize: none;
94
110
  }
95
111
  .ac-input.ac-multichoiceInput {
96
- font-size: ${(_props$styleProps13 = props.styleProps) === null || _props$styleProps13 === void 0 || (_props$styleProps13 = _props$styleProps13.customMultichoiceInputStyleProps) === null || _props$styleProps13 === void 0 ? void 0 : _props$styleProps13.fontSize};
97
- font-family: ${((_props$styleProps14 = props.styleProps) === null || _props$styleProps14 === void 0 || (_props$styleProps14 = _props$styleProps14.customMultichoiceInputStyleProps) === null || _props$styleProps14 === void 0 ? void 0 : _props$styleProps14.fontFamily) ?? ((_defaultPreChatSurvey5 = defaultPreChatSurveyPaneStyles.customMultichoiceInputStyleProps) === null || _defaultPreChatSurvey5 === void 0 ? void 0 : _defaultPreChatSurvey5.fontFamily)};
112
+ font-size: ${((_props$styleProps13 = props.styleProps) === null || _props$styleProps13 === void 0 || (_props$styleProps13 = _props$styleProps13.customMultichoiceInputStyleProps) === null || _props$styleProps13 === void 0 ? void 0 : _props$styleProps13.fontSize) ?? ((_defaultPreChatSurvey7 = defaultPreChatSurveyPaneStyles.customMultichoiceInputStyleProps) === null || _defaultPreChatSurvey7 === void 0 ? void 0 : _defaultPreChatSurvey7.fontSize)};
113
+ font-family: ${((_props$styleProps14 = props.styleProps) === null || _props$styleProps14 === void 0 || (_props$styleProps14 = _props$styleProps14.customMultichoiceInputStyleProps) === null || _props$styleProps14 === void 0 ? void 0 : _props$styleProps14.fontFamily) ?? ((_defaultPreChatSurvey8 = defaultPreChatSurveyPaneStyles.customMultichoiceInputStyleProps) === null || _defaultPreChatSurvey8 === void 0 ? void 0 : _defaultPreChatSurvey8.fontFamily)};
98
114
  padding: 3px;
99
115
  padding-top: 7px;
100
116
  padding-bottom: 7px;
117
+ box-sizing: border-box;
118
+ }
119
+ .ac-input.ac-multichoiceInput.ac-choiceSetInput-compact {
120
+ height: auto;
121
+ min-height: 31px;
122
+ max-height: 45px;
123
+ -webkit-appearance: none;
124
+ appearance: none;
125
+ background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
126
+ background-repeat: no-repeat;
127
+ background-position: right 8px center;
128
+ background-size: 16px;
129
+ padding-right: 30px;
101
130
  }
102
131
  .ac-input.ac-toggleInput {
103
- align-items: ${((_props$styleProps15 = props.styleProps) === null || _props$styleProps15 === void 0 || (_props$styleProps15 = _props$styleProps15.customToggleInputStyleProps) === null || _props$styleProps15 === void 0 ? void 0 : _props$styleProps15.alignItems) ?? ((_defaultPreChatSurvey6 = defaultPreChatSurveyPaneStyles.customToggleInputStyleProps) === null || _defaultPreChatSurvey6 === void 0 ? void 0 : _defaultPreChatSurvey6.alignItems)} !important;
132
+ align-items: ${((_props$styleProps15 = props.styleProps) === null || _props$styleProps15 === void 0 || (_props$styleProps15 = _props$styleProps15.customToggleInputStyleProps) === null || _props$styleProps15 === void 0 ? void 0 : _props$styleProps15.alignItems) ?? ((_defaultPreChatSurvey9 = defaultPreChatSurveyPaneStyles.customToggleInputStyleProps) === null || _defaultPreChatSurvey9 === void 0 ? void 0 : _defaultPreChatSurvey9.alignItems)} !important;
104
133
  }
105
134
  .ac-pushButton {
106
135
  border: 1px solid #00000000;
107
136
  margin: 2px;
108
- height: ${((_props$styleProps16 = props.styleProps) === null || _props$styleProps16 === void 0 || (_props$styleProps16 = _props$styleProps16.customButtonStyleProps) === null || _props$styleProps16 === void 0 ? void 0 : _props$styleProps16.height) ?? ((_defaultPreChatSurvey7 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey7 === void 0 ? void 0 : _defaultPreChatSurvey7.height)};
109
- width: ${((_props$styleProps17 = props.styleProps) === null || _props$styleProps17 === void 0 || (_props$styleProps17 = _props$styleProps17.customButtonStyleProps) === null || _props$styleProps17 === void 0 ? void 0 : _props$styleProps17.width) ?? ((_defaultPreChatSurvey8 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey8 === void 0 ? void 0 : _defaultPreChatSurvey8.width)};
137
+ height: ${((_props$styleProps16 = props.styleProps) === null || _props$styleProps16 === void 0 || (_props$styleProps16 = _props$styleProps16.customButtonStyleProps) === null || _props$styleProps16 === void 0 ? void 0 : _props$styleProps16.height) ?? ((_defaultPreChatSurvey0 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey0 === void 0 ? void 0 : _defaultPreChatSurvey0.height)};
138
+ width: ${((_props$styleProps17 = props.styleProps) === null || _props$styleProps17 === void 0 || (_props$styleProps17 = _props$styleProps17.customButtonStyleProps) === null || _props$styleProps17 === void 0 ? void 0 : _props$styleProps17.width) ?? ((_defaultPreChatSurvey1 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey1 === void 0 ? void 0 : _defaultPreChatSurvey1.width)};
110
139
  border-radius: 5px;
111
140
  cursor: pointer;
112
141
  font-weight: bold;
113
- font-size: ${((_props$styleProps18 = props.styleProps) === null || _props$styleProps18 === void 0 || (_props$styleProps18 = _props$styleProps18.customButtonStyleProps) === null || _props$styleProps18 === void 0 ? void 0 : _props$styleProps18.fontSize) ?? ((_defaultPreChatSurvey9 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey9 === void 0 ? void 0 : _defaultPreChatSurvey9.fontSize)};
114
- font-family: ${((_props$styleProps19 = props.styleProps) === null || _props$styleProps19 === void 0 || (_props$styleProps19 = _props$styleProps19.customButtonStyleProps) === null || _props$styleProps19 === void 0 ? void 0 : _props$styleProps19.fontFamily) ?? ((_defaultPreChatSurvey0 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey0 === void 0 ? void 0 : _defaultPreChatSurvey0.fontFamily)};
115
- color: ${((_props$styleProps20 = props.styleProps) === null || _props$styleProps20 === void 0 || (_props$styleProps20 = _props$styleProps20.customButtonStyleProps) === null || _props$styleProps20 === void 0 ? void 0 : _props$styleProps20.color) ?? ((_defaultPreChatSurvey1 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey1 === void 0 ? void 0 : _defaultPreChatSurvey1.color)};
116
- background-color: ${((_props$styleProps21 = props.styleProps) === null || _props$styleProps21 === void 0 || (_props$styleProps21 = _props$styleProps21.customButtonStyleProps) === null || _props$styleProps21 === void 0 ? void 0 : _props$styleProps21.backgroundColor) ?? ((_defaultPreChatSurvey10 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey10 === void 0 ? void 0 : _defaultPreChatSurvey10.backgroundColor)};
142
+ font-size: ${((_props$styleProps18 = props.styleProps) === null || _props$styleProps18 === void 0 || (_props$styleProps18 = _props$styleProps18.customButtonStyleProps) === null || _props$styleProps18 === void 0 ? void 0 : _props$styleProps18.fontSize) ?? ((_defaultPreChatSurvey10 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey10 === void 0 ? void 0 : _defaultPreChatSurvey10.fontSize)};
143
+ font-family: ${((_props$styleProps19 = props.styleProps) === null || _props$styleProps19 === void 0 || (_props$styleProps19 = _props$styleProps19.customButtonStyleProps) === null || _props$styleProps19 === void 0 ? void 0 : _props$styleProps19.fontFamily) ?? ((_defaultPreChatSurvey11 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey11 === void 0 ? void 0 : _defaultPreChatSurvey11.fontFamily)};
144
+ color: ${((_props$styleProps20 = props.styleProps) === null || _props$styleProps20 === void 0 || (_props$styleProps20 = _props$styleProps20.customButtonStyleProps) === null || _props$styleProps20 === void 0 ? void 0 : _props$styleProps20.color) ?? ((_defaultPreChatSurvey12 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey12 === void 0 ? void 0 : _defaultPreChatSurvey12.color)};
145
+ background-color: ${((_props$styleProps21 = props.styleProps) === null || _props$styleProps21 === void 0 || (_props$styleProps21 = _props$styleProps21.customButtonStyleProps) === null || _props$styleProps21 === void 0 ? void 0 : _props$styleProps21.backgroundColor) ?? ((_defaultPreChatSurvey13 = defaultPreChatSurveyPaneStyles.customButtonStyleProps) === null || _defaultPreChatSurvey13 === void 0 ? void 0 : _defaultPreChatSurvey13.backgroundColor)};
117
146
  }`), !((_props$controlProps6 = props.controlProps) !== null && _props$controlProps6 !== void 0 && _props$controlProps6.hidePreChatSurveyPane) && /*#__PURE__*/React.createElement(Stack, {
118
147
  id: elementId,
119
148
  tabIndex: -1,
package/lib/esm/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneMultichoiceInputStyles.js CHANGED
@@ -1,3 +1,4 @@
1
1
  export const defaultPreChatSurveyPaneMultichoiceInputStyles = {
2
+ fontSize: "16px",
2
3
  fontFamily: "Segoe UI, Helvetica Neue, sans-serif"
3
4
  };
package/lib/esm/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneMultilineTextInputStyles.js CHANGED
@@ -1,4 +1,5 @@
1
1
  export const defaultPreChatSurveyPaneMultilineTextInputStyles = {
2
+ fontSize: "16px",
2
3
  height: "52px",
3
4
  fontFamily: "Segoe UI, Helvetica Neue, sans-serif"
4
5
  };
package/lib/esm/components/prechatsurveypane/common/defaultProps/defaultStyles/defaultPreChatSurveyPaneTextInputStyles.js CHANGED
@@ -1,4 +1,5 @@
1
1
  export const defaultPreChatSurveyPaneTextInputStyles = {
2
+ fontSize: "16px",
2
3
  height: "20px",
3
4
  fontFamily: "Segoe UI, Helvetica Neue, sans-serif"
4
5
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@microsoft/omnichannel-chat-components",
3
- "version": "1.1.17-main.5d1fc98",
3
+ "version": "1.1.17-main.882d8f1",
4
4
  "description": "Microsoft Omnichannel Chat Components",
5
5
  "main": "lib/cjs/index.js",
6
6
  "types": "lib/types/index.d.ts",