@micromag/screen-quiz 0.4.71 → 0.4.74

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 (3) hide show
  1. package/es/index.d.ts +3 -3
  2. package/es/index.js +1903 -1330
  3. package/package.json +21 -20
package/es/index.js CHANGED
@@ -1,7 +1,5 @@
1
1
  import { FormattedMessage, defineMessage } from 'react-intl';
2
- import _objectSpread from '@babel/runtime/helpers/objectSpread2';
3
- import _defineProperty from '@babel/runtime/helpers/defineProperty';
4
- import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
2
+ import { c } from 'react/compiler-runtime';
5
3
  import { faRedo } from '@fortawesome/free-solid-svg-icons/faRedo';
6
4
  import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
7
5
  import classNames from 'classnames';
@@ -20,7 +18,6 @@ import Heading from '@micromag/element-heading';
20
18
  import Layout, { Spacer } from '@micromag/element-layout';
21
19
  import Text from '@micromag/element-text';
22
20
  import Visual from '@micromag/element-visual';
23
- import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
24
21
  import { faCheck } from '@fortawesome/free-solid-svg-icons/faCheck';
25
22
  import { faTimes } from '@fortawesome/free-solid-svg-icons/faTimes';
26
23
  import Button$1, { RichButton } from '@micromag/element-button';
@@ -31,88 +28,59 @@ import isArray from 'lodash/isArray';
31
28
 
32
29
  var styles$4 = {"container":"micromag-screen-quiz-answers-container","items":"micromag-screen-quiz-answers-items","emptyAnswer":"micromag-screen-quiz-answers-emptyAnswer","item":"micromag-screen-quiz-answers-item","isPlaceholder":"micromag-screen-quiz-answers-isPlaceholder","userAnswer":"micromag-screen-quiz-answers-userAnswer","otherAnswer":"micromag-screen-quiz-answers-otherAnswer","withoutOpacity":"micromag-screen-quiz-answers-withoutOpacity","button":"micromag-screen-quiz-answers-button","withIcon":"micromag-screen-quiz-answers-withIcon","withSquareItems":"micromag-screen-quiz-answers-withSquareItems","resultIcon":"micromag-screen-quiz-answers-resultIcon","answered":"micromag-screen-quiz-answers-answered","rightAnswer":"micromag-screen-quiz-answers-rightAnswer","faIcon":"micromag-screen-quiz-answers-faIcon","itemContent":"micromag-screen-quiz-answers-itemContent"};
33
30
 
34
- function Answers(_ref) {
35
- var items = _ref.items,
36
- _ref$keypadLayout = _ref.keypadLayout,
37
- keypadLayout = _ref$keypadLayout === void 0 ? null : _ref$keypadLayout,
38
- _ref$answeredIndex = _ref.answeredIndex,
39
- answeredIndex = _ref$answeredIndex === void 0 ? null : _ref$answeredIndex,
40
- _ref$answersCollapseD = _ref.answersCollapseDelay,
41
- answersCollapseDelay = _ref$answersCollapseD === void 0 ? 1000 : _ref$answersCollapseD,
42
- _ref$buttonsStyle = _ref.buttonsStyle,
43
- buttonsStyle = _ref$buttonsStyle === void 0 ? null : _ref$buttonsStyle,
44
- _ref$buttonsLayout = _ref.buttonsLayout,
45
- buttonsLayout = _ref$buttonsLayout === void 0 ? null : _ref$buttonsLayout,
46
- _ref$inactiveButtonsS = _ref.inactiveButtonsStyle,
47
- inactiveButtonsStyle = _ref$inactiveButtonsS === void 0 ? null : _ref$inactiveButtonsS,
48
- _ref$buttonsTextStyle = _ref.buttonsTextStyle,
49
- buttonsTextStyle = _ref$buttonsTextStyle === void 0 ? null : _ref$buttonsTextStyle,
50
- _ref$inactiveButtonsT = _ref.inactiveButtonsTextStyle,
51
- inactiveButtonsTextStyle = _ref$inactiveButtonsT === void 0 ? null : _ref$inactiveButtonsT,
52
- _ref$goodAnswerColor = _ref.goodAnswerColor,
53
- goodAnswerColor = _ref$goodAnswerColor === void 0 ? null : _ref$goodAnswerColor,
54
- _ref$badAnswerColor = _ref.badAnswerColor,
55
- badAnswerColor = _ref$badAnswerColor === void 0 ? null : _ref$badAnswerColor,
56
- _ref$showUserAnswer = _ref.showUserAnswer,
57
- showUserAnswer = _ref$showUserAnswer === void 0 ? false : _ref$showUserAnswer,
58
- _ref$withoutGoodAnswe = _ref.withoutGoodAnswer,
59
- withoutGoodAnswer = _ref$withoutGoodAnswe === void 0 ? false : _ref$withoutGoodAnswe,
60
- _ref$withoutIcon = _ref.withoutIcon,
61
- withoutIcon = _ref$withoutIcon === void 0 ? false : _ref$withoutIcon,
62
- _ref$focusable = _ref.focusable,
63
- focusable = _ref$focusable === void 0 ? false : _ref$focusable,
64
- _ref$animated = _ref.animated,
65
- collapseAnimated = _ref$animated === void 0 ? false : _ref$animated,
66
- _ref$collapsed = _ref.collapsed,
67
- initialCollapsed = _ref$collapsed === void 0 ? false : _ref$collapsed,
68
- _ref$onClick = _ref.onClick,
69
- onClick = _ref$onClick === void 0 ? null : _ref$onClick,
70
- _ref$onCollapse = _ref.onCollapse,
71
- onCollapse = _ref$onCollapse === void 0 ? null : _ref$onCollapse,
72
- _ref$onCollapsed = _ref.onCollapsed,
73
- onCollapsed = _ref$onCollapsed === void 0 ? null : _ref$onCollapsed,
74
- _ref$onTransitionEnd = _ref.onTransitionEnd,
75
- onTransitionEnd = _ref$onTransitionEnd === void 0 ? null : _ref$onTransitionEnd,
76
- _ref$withoutCollapse = _ref.withoutCollapse,
77
- withoutCollapse = _ref$withoutCollapse === void 0 ? false : _ref$withoutCollapse,
78
- _ref$className = _ref.className,
79
- className = _ref$className === void 0 ? null : _ref$className;
80
- var _useScreenRenderConte = useScreenRenderContext(),
81
- isView = _useScreenRenderConte.isView,
82
- isPreview = _useScreenRenderConte.isPreview,
83
- isPlaceholder = _useScreenRenderConte.isPlaceholder,
84
- isEdit = _useScreenRenderConte.isEdit;
85
- var answered = answeredIndex !== null;
86
- var _ref2 = answeredIndex !== null ? items[answeredIndex] : {},
87
- _ref2$good = _ref2.good,
88
- hasAnsweredRight = _ref2$good === void 0 ? false : _ref2$good;
89
- var _useState = useState(true),
90
- _useState2 = _slicedToArray(_useState, 1),
91
- visible = _useState2[0];
92
- var hasRightAnswer = items !== null && !isPlaceholder ? items.reduce(function (hasGood, answer) {
93
- var _ref3 = answer || {},
94
- _ref3$good = _ref3.good,
95
- good = _ref3$good === void 0 ? false : _ref3$good;
31
+ /* eslint-disable react/no-array-index-key */
32
+
33
+ function Answers({
34
+ items,
35
+ keypadLayout = null,
36
+ answeredIndex = null,
37
+ answersCollapseDelay = 1000,
38
+ buttonsStyle = null,
39
+ buttonsLayout = null,
40
+ inactiveButtonsStyle = null,
41
+ buttonsTextStyle = null,
42
+ inactiveButtonsTextStyle = null,
43
+ goodAnswerColor = null,
44
+ badAnswerColor = null,
45
+ showUserAnswer = false,
46
+ withoutGoodAnswer = false,
47
+ withoutIcon = false,
48
+ focusable = false,
49
+ animated: collapseAnimated = false,
50
+ collapsed: initialCollapsed = false,
51
+ onClick = null,
52
+ onCollapse = null,
53
+ onCollapsed = null,
54
+ onTransitionEnd = null,
55
+ withoutCollapse = false,
56
+ className = null
57
+ }) {
58
+ const {
59
+ isView,
60
+ isPreview,
61
+ isPlaceholder,
62
+ isEdit
63
+ } = useScreenRenderContext();
64
+ const answered = answeredIndex !== null;
65
+ const {
66
+ good: hasAnsweredRight = false
67
+ } = answeredIndex !== null ? items[answeredIndex] : {};
68
+ const [visible] = useState(true);
69
+ const hasRightAnswer = items !== null && !isPlaceholder ? items.reduce((hasGood, answer) => {
70
+ const {
71
+ good = false
72
+ } = answer || {};
96
73
  return hasGood || good;
97
74
  }, false) : false;
98
- var finalShowUserAnswer = showUserAnswer || !hasRightAnswer;
99
- var shouldCollapse = !withoutGoodAnswer || finalShowUserAnswer && answeredIndex !== null && !withoutCollapse;
100
- var _useState3 = useState(answeredIndex !== null),
101
- _useState4 = _slicedToArray(_useState3, 2),
102
- answersCollapsed = _useState4[0],
103
- setAnswersCollapsed = _useState4[1];
104
- var _useState5 = useState(initialCollapsed || answeredIndex !== null),
105
- _useState6 = _slicedToArray(_useState5, 2),
106
- answersDidCollapse = _useState6[0];
107
- _useState6[1];
108
- var _useState7 = useState(initialCollapsed || answeredIndex !== null),
109
- _useState8 = _slicedToArray(_useState7, 2),
110
- answersFinalCollapse = _useState8[0],
111
- setAnswersFinalCollapse = _useState8[1];
112
- useEffect(function () {
113
- var timeout = null;
75
+ const finalShowUserAnswer = showUserAnswer || !hasRightAnswer;
76
+ const shouldCollapse = !withoutGoodAnswer || finalShowUserAnswer && answeredIndex !== null && !withoutCollapse;
77
+ const [answersCollapsed, setAnswersCollapsed] = useState(answeredIndex !== null);
78
+ const [answersDidCollapse, setAnswersDidCollapse] = useState(initialCollapsed || answeredIndex !== null);
79
+ const [answersFinalCollapse, setAnswersFinalCollapse] = useState(initialCollapsed || answeredIndex !== null);
80
+ useEffect(() => {
81
+ let timeout = null;
114
82
  if (answeredIndex !== null && shouldCollapse) {
115
- timeout = setTimeout(function () {
83
+ timeout = setTimeout(() => {
116
84
  // console.log('ok should collapse whatever');
117
85
  setAnswersCollapsed(true);
118
86
  if (onCollapse !== null) {
@@ -120,7 +88,7 @@ function Answers(_ref) {
120
88
  }
121
89
  }, hasAnsweredRight || finalShowUserAnswer ? 500 : answersCollapseDelay);
122
90
  } else if (answeredIndex !== null && !shouldCollapse) {
123
- timeout = setTimeout(function () {
91
+ timeout = setTimeout(() => {
124
92
  // console.log('ok no collapse');
125
93
  if (onCollapse !== null) {
126
94
  onCollapse();
@@ -135,29 +103,29 @@ function Answers(_ref) {
135
103
  } else if (answeredIndex === null && shouldCollapse) {
136
104
  setAnswersCollapsed(false);
137
105
  }
138
- return function () {
106
+ return () => {
139
107
  if (timeout !== null) {
140
108
  clearTimeout(timeout);
141
109
  }
142
110
  };
143
111
  }, [answeredIndex, withoutGoodAnswer, setAnswersCollapsed, onCollapse, onCollapsed, onTransitionEnd, answersCollapseDelay, hasAnsweredRight, finalShowUserAnswer, shouldCollapse]);
144
- useEffect(function () {
145
- var timeout = null;
146
- var endTimeout = null;
112
+ useEffect(() => {
113
+ let timeout_0 = null;
114
+ let endTimeout = null;
147
115
  if (answersCollapsed) {
148
- timeout = setTimeout(function () {
116
+ timeout_0 = setTimeout(() => {
149
117
  setAnswersFinalCollapse(true);
150
118
  }, 300);
151
- endTimeout = setTimeout(function () {
119
+ endTimeout = setTimeout(() => {
152
120
  // Failsafe cause collapse transition is not always active
153
121
  if (onTransitionEnd !== null) {
154
122
  onTransitionEnd();
155
123
  }
156
124
  }, 500);
157
125
  }
158
- return function () {
159
- if (timeout !== null) {
160
- clearTimeout(timeout);
126
+ return () => {
127
+ if (timeout_0 !== null) {
128
+ clearTimeout(timeout_0);
161
129
  }
162
130
  if (endTimeout !== null) {
163
131
  clearTimeout(endTimeout);
@@ -183,15 +151,15 @@ function Answers(_ref) {
183
151
  // onTransitionEnd,
184
152
  // ]);
185
153
 
186
- var itemsRefs = useRef([]);
187
- var listOfItems = isPlaceholder || isEdit && items.length === 0 ? _toConsumableArray(new Array(2)) : items;
188
- var heights = useMemo(function () {
154
+ const itemsRefs = useRef([]);
155
+ const listOfItems = isPlaceholder || isEdit && items.length === 0 ? [...new Array(2)] : items;
156
+ const heights = useMemo(() => {
189
157
  if (collapseAnimated) {
190
- var allHeights = listOfItems.reduce(function (acc, it, i) {
158
+ const allHeights = listOfItems.reduce((acc, it, i) => {
191
159
  if (itemsRefs.current[i] && collapseAnimated) {
192
- var _ref4 = itemsRefs.current[i].getBoundingClientRect() || {},
193
- _ref4$height = _ref4.height,
194
- height = _ref4$height === void 0 ? 0 : _ref4$height;
160
+ const {
161
+ height = 0
162
+ } = itemsRefs.current[i].getBoundingClientRect() || {};
195
163
  acc.push(height);
196
164
  }
197
165
  return acc;
@@ -200,31 +168,32 @@ function Answers(_ref) {
200
168
  }
201
169
  return [];
202
170
  }, [collapseAnimated, answeredIndex, shouldCollapse, collapseAnimated, listOfItems]);
203
- var showAnimation = isView || isEdit;
204
- var filteredListOfItems = listOfItems.map(function (answer, answerI) {
205
- var height = heights[answerI] ? heights[answerI] : 0;
206
- var userAnswer = answerI === answeredIndex;
207
- var _ref5 = answer || {},
208
- _ref5$good = _ref5.good,
209
- rightAnswer = _ref5$good === void 0 ? false : _ref5$good;
210
- var hidden = false;
171
+ const showAnimation = isView || isEdit;
172
+ const filteredListOfItems = listOfItems.map((answer_0, answerI) => {
173
+ const height_0 = heights[answerI] ? heights[answerI] : 0;
174
+ const userAnswer = answerI === answeredIndex;
175
+ const {
176
+ good: rightAnswer = false
177
+ } = answer_0 || {};
178
+ let hidden = false;
211
179
  if (answeredIndex !== null && showAnimation && answersDidCollapse && !rightAnswer && (hasRightAnswer || !userAnswer)) {
212
180
  hidden = true;
213
181
  }
214
182
  if (answeredIndex !== null && showAnimation && answersCollapsed && !rightAnswer) {
215
183
  hidden = true;
216
184
  }
217
- var _ref6 = answer || {},
218
- _ref6$label = _ref6.label,
219
- label = _ref6$label === void 0 ? null : _ref6$label;
220
- var key = "key-".concat(answerI, "-").concat((label === null || label === void 0 ? void 0 : label.body) || null);
221
- return _objectSpread(_objectSpread({}, answer), {}, {
222
- hidden: hidden,
223
- userAnswer: userAnswer,
185
+ const {
186
+ label = null
187
+ } = answer_0 || {};
188
+ const key = `key-${answerI}-${label?.body || null}`;
189
+ return {
190
+ ...answer_0,
191
+ hidden,
192
+ userAnswer,
224
193
  index: answerI,
225
- maxHeight: height,
226
- key: key
227
- });
194
+ maxHeight: height_0,
195
+ key
196
+ };
228
197
  });
229
198
 
230
199
  // const transitions = useTransition(filteredListOfItems, {
@@ -262,128 +231,135 @@ function Answers(_ref) {
262
231
  // }
263
232
  // }, [transitioned, onTransitionEnd]);
264
233
 
265
- var hasGoodOrBadAnswerInList = useMemo(function () {
234
+ const hasGoodOrBadAnswerInList = useMemo(() => {
266
235
  if (filteredListOfItems !== null) {
267
- return filteredListOfItems.reduce(function (hasGoodOrBad, answer) {
268
- return hasGoodOrBad || answer.good === true && !withoutGoodAnswer || answer.good === false && !withoutIcon;
269
- }, false);
236
+ return filteredListOfItems.reduce((hasGoodOrBad, answer_1) => hasGoodOrBad || answer_1.good === true && !withoutGoodAnswer || answer_1.good === false && !withoutIcon, false);
270
237
  }
271
238
  return false;
272
239
  }, [filteredListOfItems, withoutGoodAnswer, withoutIcon]);
273
- var hasOpacity = useMemo(function () {
274
- var _ref7 = inactiveButtonsStyle || {},
275
- _ref7$backgroundColor = _ref7.backgroundColor,
276
- backgroundColor = _ref7$backgroundColor === void 0 ? null : _ref7$backgroundColor;
240
+ const hasOpacity = useMemo(() => {
241
+ const {
242
+ backgroundColor = null
243
+ } = inactiveButtonsStyle || {};
277
244
  return backgroundColor === null;
278
245
  }, [inactiveButtonsStyle]);
279
- var itemsWithStyle = filteredListOfItems.map(function (answer) {
280
- var _ref8 = answer || {},
281
- hidden = _ref8.hidden,
282
- maxHeight = _ref8.maxHeight;
283
- var style = {
284
- opacity: hidden && showAnimation && !withoutGoodAnswer ? 0 : 1,
246
+ const itemsWithStyle = filteredListOfItems.map(answer_2 => {
247
+ const {
248
+ hidden: hidden_0,
249
+ maxHeight
250
+ } = answer_2 || {};
251
+ const style = {
252
+ opacity: hidden_0 && showAnimation && !withoutGoodAnswer ? 0 : 1,
285
253
  // Animate this, not height
286
254
  maxHeight:
287
255
  // eslint-disable-next-line no-nested-ternary
288
- hidden && showAnimation && !withoutGoodAnswer && collapseAnimated && answersFinalCollapse ? 0 : maxHeight > 0 ? maxHeight : null,
289
- height: hidden && showAnimation && !withoutGoodAnswer && !collapseAnimated && answersFinalCollapse ? 0 : 'auto'
256
+ hidden_0 && showAnimation && !withoutGoodAnswer && collapseAnimated && answersFinalCollapse ? 0 : maxHeight > 0 ? maxHeight : null,
257
+ height: hidden_0 && showAnimation && !withoutGoodAnswer && !collapseAnimated && answersFinalCollapse ? 0 : 'auto'
258
+ };
259
+ return {
260
+ ...answer_2,
261
+ style
290
262
  };
291
- return _objectSpread(_objectSpread({}, answer), {}, {
292
- style: style
293
- });
294
263
  });
295
264
 
296
265
  // const keypadItems = transitions((style, answer, t, answerI) => {
297
- var keypadItems = (itemsWithStyle || []).map(function (answer, answerI) {
298
- var userAnswer = answerI === answeredIndex;
299
- var _ref9 = answer || {},
300
- _ref9$good = _ref9.good,
301
- rightAnswer = _ref9$good === void 0 ? null : _ref9$good,
302
- _ref9$label = _ref9.label,
303
- label = _ref9$label === void 0 ? null : _ref9$label,
304
- _ref9$visual = _ref9.visual,
305
- visual = _ref9$visual === void 0 ? null : _ref9$visual,
306
- _ref9$buttonLayout = _ref9.buttonLayout,
307
- buttonLayout = _ref9$buttonLayout === void 0 ? null : _ref9$buttonLayout,
308
- _ref9$buttonStyle = _ref9.buttonStyle,
309
- answerButtonStyle = _ref9$buttonStyle === void 0 ? null : _ref9$buttonStyle,
310
- _ref9$textStyle = _ref9.textStyle,
311
- answerButtonTextStyle = _ref9$textStyle === void 0 ? null : _ref9$textStyle,
312
- _ref9$style = _ref9.style,
313
- style = _ref9$style === void 0 ? null : _ref9$style;
314
- var _ref0 = label || {},
315
- _ref0$textStyle = _ref0.textStyle,
316
- textStyle = _ref0$textStyle === void 0 ? null : _ref0$textStyle;
317
- var hasText = isTextFilled(label);
318
- var hasVisual = isImageFilled(visual);
319
- var hasAnswer = hasText || hasVisual;
320
- var isUserAnswer = withoutGoodAnswer && userAnswer;
321
- var isOtherAnswer = withoutGoodAnswer && !userAnswer;
322
- var isInactive = isOtherAnswer && answeredIndex !== null;
323
- var inactiveButtonStyle = isInactive ? inactiveButtonsStyle : null;
324
- var inactiveButtonTextStyle = isInactive ? inactiveButtonsTextStyle : null;
325
- var finalButtonStyle = _objectSpread(_objectSpread(_objectSpread({}, buttonsStyle), inactiveButtonStyle), answerButtonStyle);
326
- var finalTextStyle = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, Object.keys(buttonsTextStyle || {}).reduce(function (acc, key) {
327
- var value = buttonsTextStyle[key];
328
- if (value !== null && value !== '') {
329
- acc[key] = value;
330
- }
331
- return acc;
332
- }, {})), Object.keys(textStyle || {}).reduce(function (acc, key) {
333
- var value = textStyle[key];
334
- if (value !== null && value !== '') {
335
- acc[key] = value;
336
- }
337
- return acc;
338
- }, {})), inactiveButtonTextStyle), answerButtonTextStyle);
266
+ const keypadItems = (itemsWithStyle || []).map((answer_3, answerI_0) => {
267
+ const userAnswer_0 = answerI_0 === answeredIndex;
268
+ const {
269
+ good: rightAnswer_0 = null,
270
+ label: label_0 = null,
271
+ visual = null,
272
+ buttonLayout = null,
273
+ buttonStyle: answerButtonStyle = null,
274
+ textStyle: answerButtonTextStyle = null,
275
+ style: style_0 = null
276
+ } = answer_3 || {};
277
+ const {
278
+ textStyle = null
279
+ } = label_0 || {};
280
+ const hasText = isTextFilled(label_0);
281
+ const hasVisual = isImageFilled(visual);
282
+ const hasAnswer = hasText || hasVisual;
283
+ const isUserAnswer = withoutGoodAnswer && userAnswer_0;
284
+ const isOtherAnswer = withoutGoodAnswer && !userAnswer_0;
285
+ const isInactive = isOtherAnswer && answeredIndex !== null;
286
+ const inactiveButtonStyle = isInactive ? inactiveButtonsStyle : null;
287
+ const inactiveButtonTextStyle = isInactive ? inactiveButtonsTextStyle : null;
288
+ const finalButtonStyle = {
289
+ ...buttonsStyle,
290
+ ...inactiveButtonStyle,
291
+ ...answerButtonStyle
292
+ };
293
+ const finalTextStyle = {
294
+ ...Object.keys(buttonsTextStyle || {}).reduce((acc_0, key_0) => {
295
+ const value = buttonsTextStyle[key_0];
296
+ if (value !== null && value !== '') {
297
+ acc_0[key_0] = value;
298
+ }
299
+ return acc_0;
300
+ }, {}),
301
+ ...Object.keys(textStyle || {}).reduce((acc_1, key_1) => {
302
+ const value_0 = textStyle[key_1];
303
+ if (value_0 !== null && value_0 !== '') {
304
+ acc_1[key_1] = value_0;
305
+ }
306
+ return acc_1;
307
+ }, {}),
308
+ ...inactiveButtonTextStyle,
309
+ ...answerButtonTextStyle
310
+ };
339
311
  return /*#__PURE__*/jsx("div", {
340
- className: classNames([styles$4.item, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, styles$4.rightAnswer, !withoutGoodAnswer && rightAnswer === true), styles$4.userAnswer, isUserAnswer), styles$4.otherAnswer, isOtherAnswer), styles$4.withoutOpacity, !hasOpacity)])
312
+ className: classNames([styles$4.item, {
313
+ [styles$4.rightAnswer]: !withoutGoodAnswer && rightAnswer_0 === true,
314
+ [styles$4.userAnswer]: isUserAnswer,
315
+ [styles$4.otherAnswer]: isOtherAnswer,
316
+ [styles$4.withoutOpacity]: !hasOpacity
317
+ }])
341
318
  // onTransitionEnd={onAnswerTransitionEnd}
342
319
  ,
343
- style: _objectSpread({}, style),
320
+ style: {
321
+ ...style_0
322
+ },
344
323
  children: /*#__PURE__*/jsx("div", {
345
324
  className: styles$4.itemContent,
346
- ref: function ref(el) {
347
- itemsRefs.current[answerI] = el;
325
+ ref: el => {
326
+ itemsRefs.current[answerI_0] = el;
348
327
  },
349
328
  children: /*#__PURE__*/jsx(ScreenElement, {
350
329
  placeholder: "quizAnswer",
351
330
  placeholderProps: {
352
- good: answerI === 0
331
+ good: answerI_0 === 0
353
332
  },
354
333
  emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
355
334
  id: "+Ok+7S",
356
- defaultMessage: [{
357
- "type": 0,
358
- "value": "Answer"
359
- }]
335
+ defaultMessage: "Answer"
360
336
  }),
361
337
  emptyClassName: styles$4.emptyAnswer,
362
338
  isEmpty: !hasAnswer,
363
339
  children: hasAnswer ? /*#__PURE__*/jsxs(RichButton, {
364
340
  className: styles$4.button,
365
- onPointerUp: function onPointerUp(e) {
341
+ onPointerUp: e => {
366
342
  if (e.pointerType !== 'mouse' || e.button === 0) {
367
- onClick(answer, answerI);
343
+ onClick(answer_3, answerI_0);
368
344
  }
369
345
  },
370
346
  disabled: !visible || isPreview || answered,
371
347
  focusable: focusable,
372
348
  buttonStyle: finalButtonStyle,
373
349
  textStyle: finalTextStyle,
374
- label: label,
350
+ label: label_0,
375
351
  visual: visual,
376
352
  visualClassName: styles$4.optionVisual,
377
353
  imageClassName: styles$4.optionImage,
378
354
  layout: buttonLayout || buttonsLayout || (hasVisual ? 'label-right' : null),
379
- children: [answered && !withoutIcon && rightAnswer === true ? /*#__PURE__*/jsx("span", {
355
+ children: [answered && !withoutIcon && rightAnswer_0 === true ? /*#__PURE__*/jsx("span", {
380
356
  className: styles$4.resultIcon,
381
357
  style: getStyleFromColor(goodAnswerColor, 'backgroundColor'),
382
358
  children: /*#__PURE__*/jsx(FontAwesomeIcon, {
383
359
  className: styles$4.faIcon,
384
360
  icon: faCheck
385
361
  })
386
- }) : null, !withoutIcon && answered && rightAnswer === false ? /*#__PURE__*/jsx("span", {
362
+ }) : null, !withoutIcon && answered && rightAnswer_0 === false ? /*#__PURE__*/jsx("span", {
387
363
  className: styles$4.resultIcon,
388
364
  style: getStyleFromColor(badAnswerColor, 'backgroundColor'),
389
365
  children: /*#__PURE__*/jsx(FontAwesomeIcon, {
@@ -394,19 +370,21 @@ function Answers(_ref) {
394
370
  }) : null
395
371
  })
396
372
  })
397
- }, "answer-".concat(answerI));
373
+ }, `answer-${answerI_0}`);
398
374
  });
399
- var _ref10 = keypadLayout || {},
400
- _ref10$columnAlign = _ref10.columnAlign,
401
- align = _ref10$columnAlign === void 0 ? null : _ref10$columnAlign,
402
- _ref10$columns = _ref10.columns,
403
- columns = _ref10$columns === void 0 ? 1 : _ref10$columns,
404
- _ref10$spacing = _ref10.spacing,
405
- spacing = _ref10$spacing === void 0 ? null : _ref10$spacing,
406
- _ref10$withSquareItem = _ref10.withSquareItems,
407
- withSquareItems = _ref10$withSquareItem === void 0 ? false : _ref10$withSquareItem;
375
+ const {
376
+ columnAlign: align = null,
377
+ columns = 1,
378
+ spacing = null,
379
+ withSquareItems = false
380
+ } = keypadLayout || {};
408
381
  return /*#__PURE__*/jsx("div", {
409
- className: classNames([styles$4.container, className, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, styles$4.answered, answered), styles$4.withIcon, !withoutIcon && hasGoodOrBadAnswerInList), styles$4.withSquareItems, withSquareItems === true), styles$4.isPlaceholder, isPlaceholder)]),
382
+ className: classNames([styles$4.container, className, {
383
+ [styles$4.answered]: answered,
384
+ [styles$4.withIcon]: !withoutIcon && hasGoodOrBadAnswerInList,
385
+ [styles$4.withSquareItems]: withSquareItems === true,
386
+ [styles$4.isPlaceholder]: isPlaceholder
387
+ }]),
410
388
  children: filteredListOfItems !== null || isPlaceholder ? /*#__PURE__*/jsx(Keypad, {
411
389
  className: styles$4.items,
412
390
  items: keypadItems,
@@ -419,113 +397,204 @@ function Answers(_ref) {
419
397
 
420
398
  var styles$3 = {"container":"micromag-screen-quiz-question-container","question":"micromag-screen-quiz-question-question","index":"micromag-screen-quiz-question-index","resultContent":"micromag-screen-quiz-question-resultContent","result":"micromag-screen-quiz-question-result","emptyQuestion":"micromag-screen-quiz-question-emptyQuestion","emptyResult":"micromag-screen-quiz-question-emptyResult","resultVisible":"micromag-screen-quiz-question-resultVisible","resultHidden":"micromag-screen-quiz-question-resultHidden","isPlaceholder":"micromag-screen-quiz-question-isPlaceholder"};
421
399
 
422
- function Question(_ref) {
423
- var _ref$question = _ref.question,
424
- question = _ref$question === void 0 ? null : _ref$question,
425
- _ref$answers = _ref.answers,
426
- answers = _ref$answers === void 0 ? null : _ref$answers,
427
- _ref$keypadLayout = _ref.keypadLayout,
428
- keypadLayout = _ref$keypadLayout === void 0 ? null : _ref$keypadLayout,
429
- _ref$result = _ref.result,
430
- result = _ref$result === void 0 ? null : _ref$result,
431
- _ref$resultImage = _ref.resultImage,
432
- resultImage = _ref$resultImage === void 0 ? null : _ref$resultImage,
433
- _ref$index = _ref.index,
434
- index = _ref$index === void 0 ? null : _ref$index,
435
- _ref$totalCount = _ref.totalCount,
436
- totalCount = _ref$totalCount === void 0 ? null : _ref$totalCount,
437
- _ref$answeredIndex = _ref.answeredIndex,
438
- answeredIndex = _ref$answeredIndex === void 0 ? null : _ref$answeredIndex,
439
- _ref$buttonsLayout = _ref.buttonsLayout,
440
- buttonsLayout = _ref$buttonsLayout === void 0 ? null : _ref$buttonsLayout,
441
- _ref$buttonsStyle = _ref.buttonsStyle,
442
- buttonsStyle = _ref$buttonsStyle === void 0 ? null : _ref$buttonsStyle,
443
- _ref$inactiveButtonsS = _ref.inactiveButtonsStyle,
444
- inactiveButtonsStyle = _ref$inactiveButtonsS === void 0 ? null : _ref$inactiveButtonsS,
445
- _ref$buttonsTextStyle = _ref.buttonsTextStyle,
446
- buttonsTextStyle = _ref$buttonsTextStyle === void 0 ? null : _ref$buttonsTextStyle,
447
- _ref$inactiveButtonsT = _ref.inactiveButtonsTextStyle,
448
- inactiveButtonsTextStyle = _ref$inactiveButtonsT === void 0 ? null : _ref$inactiveButtonsT,
449
- _ref$questionsHeading = _ref.questionsHeadingStyle,
450
- questionsHeadingStyle = _ref$questionsHeading === void 0 ? null : _ref$questionsHeading,
451
- _ref$feedbackTextStyl = _ref.feedbackTextStyle,
452
- feedbackTextStyle = _ref$feedbackTextStyl === void 0 ? null : _ref$feedbackTextStyl,
453
- _ref$numbersTextStyle = _ref.numbersTextStyle,
454
- numbersTextStyle = _ref$numbersTextStyle === void 0 ? null : _ref$numbersTextStyle,
455
- _ref$goodAnswerColor = _ref.goodAnswerColor,
456
- goodAnswerColor = _ref$goodAnswerColor === void 0 ? null : _ref$goodAnswerColor,
457
- _ref$badAnswerColor = _ref.badAnswerColor,
458
- badAnswerColor = _ref$badAnswerColor === void 0 ? null : _ref$badAnswerColor,
459
- _ref$focusable = _ref.focusable,
460
- focusable = _ref$focusable === void 0 ? false : _ref$focusable,
461
- _ref$animated = _ref.animated,
462
- animated = _ref$animated === void 0 ? false : _ref$animated,
463
- _ref$showInstantAnswe = _ref.showInstantAnswer,
464
- showInstantAnswer = _ref$showInstantAnswe === void 0 ? false : _ref$showInstantAnswe,
465
- _ref$withResult = _ref.withResult,
466
- withResult = _ref$withResult === void 0 ? false : _ref$withResult,
467
- _ref$withoutGoodAnswe = _ref.withoutGoodAnswer,
468
- withoutGoodAnswer = _ref$withoutGoodAnswe === void 0 ? false : _ref$withoutGoodAnswe,
469
- _ref$withoutTrueFalse = _ref.withoutTrueFalse,
470
- withoutTrueFalse = _ref$withoutTrueFalse === void 0 ? false : _ref$withoutTrueFalse,
471
- _ref$withoutIndex = _ref.withoutIndex,
472
- withoutIndex = _ref$withoutIndex === void 0 ? false : _ref$withoutIndex,
473
- _ref$layout = _ref.layout,
474
- layout = _ref$layout === void 0 ? null : _ref$layout,
475
- _ref$transitions = _ref.transitions,
476
- transitions = _ref$transitions === void 0 ? null : _ref$transitions,
477
- _ref$transitionPlayin = _ref.transitionPlaying,
478
- transitionPlaying = _ref$transitionPlayin === void 0 ? false : _ref$transitionPlayin,
479
- _ref$transitionStagge = _ref.transitionStagger,
480
- transitionStagger = _ref$transitionStagge === void 0 ? 100 : _ref$transitionStagge,
481
- _ref$transitionDisabl = _ref.transitionDisabled,
482
- transitionDisabled = _ref$transitionDisabl === void 0 ? false : _ref$transitionDisabl,
483
- _ref$onAnswerClick = _ref.onAnswerClick,
484
- onAnswerClick = _ref$onAnswerClick === void 0 ? null : _ref$onAnswerClick,
485
- _ref$onAnswerTransiti = _ref.onAnswerTransitionEnd,
486
- onAnswerTransitionEnd = _ref$onAnswerTransiti === void 0 ? null : _ref$onAnswerTransiti,
487
- _ref$withoutCollapse = _ref.withoutCollapse,
488
- withoutCollapse = _ref$withoutCollapse === void 0 ? false : _ref$withoutCollapse,
489
- _ref$className = _ref.className,
490
- className = _ref$className === void 0 ? null : _ref$className,
491
- _ref$style = _ref.style,
492
- style = _ref$style === void 0 ? null : _ref$style;
493
- var _useScreenRenderConte = useScreenRenderContext(),
494
- isPlaceholder = _useScreenRenderConte.isPlaceholder;
495
- var isSplitted = layout === 'split';
496
- var verticalAlign = isSplitted ? null : layout;
497
- var hasQuestion = isTextFilled(question);
498
- var _ref2 = question || {},
499
- _ref2$textStyle = _ref2.textStyle,
500
- questionTextStyle = _ref2$textStyle === void 0 ? null : _ref2$textStyle;
501
- var _useState = useState(showInstantAnswer),
502
- _useState2 = _slicedToArray(_useState, 2),
503
- resultVisible = _useState2[0],
504
- setResultVisible = _useState2[1];
505
- var answered = answeredIndex !== null;
506
- var answer = answeredIndex !== null && answers[answeredIndex] ? answers[answeredIndex] : null;
507
- var _ref3 = answer || {},
508
- _ref3$result = _ref3.result,
509
- answerResult = _ref3$result === void 0 ? null : _ref3$result,
510
- _ref3$answerImage = _ref3.answerImage,
511
- answerImage = _ref3$answerImage === void 0 ? null : _ref3$answerImage;
512
- var hasResult = isTextFilled(answerResult) || isTextFilled(result);
513
- var hasResultVisual = isImageFilled(answerImage) || isImageFilled(resultImage);
514
- var defaultResult = isTextFilled(result) ? result : null;
515
- var customResult = isTextFilled(answerResult) ? answerResult : null;
516
- var finalResult = customResult || defaultResult;
517
- var _ref4 = finalResult || {},
518
- _ref4$textStyle = _ref4.textStyle,
519
- resultTextStyle = _ref4$textStyle === void 0 ? null : _ref4$textStyle;
520
- var onAnswersCollapse = useCallback(function () {
521
- setResultVisible(true);
522
- }, [setResultVisible]);
523
- var hasIndex = index !== null && totalCount !== null;
524
- return /*#__PURE__*/jsx(Layout, {
525
- className: classNames([styles$3.container, className, _defineProperty(_defineProperty(_defineProperty({}, styles$3.isPlaceholder, isPlaceholder), styles$3.resultVisible, resultVisible), styles$3.resultHidden, !hasResult)]),
526
- verticalAlign: verticalAlign,
527
- style: style,
528
- children: [!withoutIndex && hasIndex ? /*#__PURE__*/jsx(ScreenElement, {
400
+ function Question(t0) {
401
+ const $ = c(97);
402
+ const {
403
+ question: t1,
404
+ answers: t2,
405
+ keypadLayout: t3,
406
+ result: t4,
407
+ resultImage: t5,
408
+ index: t6,
409
+ totalCount: t7,
410
+ answeredIndex: t8,
411
+ buttonsLayout: t9,
412
+ buttonsStyle: t10,
413
+ inactiveButtonsStyle: t11,
414
+ buttonsTextStyle: t12,
415
+ inactiveButtonsTextStyle: t13,
416
+ questionsHeadingStyle: t14,
417
+ feedbackTextStyle: t15,
418
+ numbersTextStyle: t16,
419
+ goodAnswerColor: t17,
420
+ badAnswerColor: t18,
421
+ focusable: t19,
422
+ animated: t20,
423
+ showInstantAnswer: t21,
424
+ withResult: t22,
425
+ withoutGoodAnswer: t23,
426
+ withoutTrueFalse: t24,
427
+ withoutIndex: t25,
428
+ layout: t26,
429
+ transitions: t27,
430
+ transitionPlaying: t28,
431
+ transitionStagger: t29,
432
+ transitionDisabled: t30,
433
+ onAnswerClick: t31,
434
+ onAnswerTransitionEnd: t32,
435
+ withoutCollapse: t33,
436
+ className: t34,
437
+ style: t35
438
+ } = t0;
439
+ const question = t1 === undefined ? null : t1;
440
+ const answers = t2 === undefined ? null : t2;
441
+ const keypadLayout = t3 === undefined ? null : t3;
442
+ const result = t4 === undefined ? null : t4;
443
+ const resultImage = t5 === undefined ? null : t5;
444
+ const index = t6 === undefined ? null : t6;
445
+ const totalCount = t7 === undefined ? null : t7;
446
+ const answeredIndex = t8 === undefined ? null : t8;
447
+ const buttonsLayout = t9 === undefined ? null : t9;
448
+ const buttonsStyle = t10 === undefined ? null : t10;
449
+ const inactiveButtonsStyle = t11 === undefined ? null : t11;
450
+ const buttonsTextStyle = t12 === undefined ? null : t12;
451
+ const inactiveButtonsTextStyle = t13 === undefined ? null : t13;
452
+ const questionsHeadingStyle = t14 === undefined ? null : t14;
453
+ const feedbackTextStyle = t15 === undefined ? null : t15;
454
+ const numbersTextStyle = t16 === undefined ? null : t16;
455
+ const goodAnswerColor = t17 === undefined ? null : t17;
456
+ const badAnswerColor = t18 === undefined ? null : t18;
457
+ const focusable = t19 === undefined ? false : t19;
458
+ const animated = t20 === undefined ? false : t20;
459
+ const showInstantAnswer = t21 === undefined ? false : t21;
460
+ const withResult = t22 === undefined ? false : t22;
461
+ const withoutGoodAnswer = t23 === undefined ? false : t23;
462
+ const withoutTrueFalse = t24 === undefined ? false : t24;
463
+ const withoutIndex = t25 === undefined ? false : t25;
464
+ const layout = t26 === undefined ? null : t26;
465
+ const transitions = t27 === undefined ? null : t27;
466
+ const transitionPlaying = t28 === undefined ? false : t28;
467
+ const transitionStagger = t29 === undefined ? 100 : t29;
468
+ const transitionDisabled = t30 === undefined ? false : t30;
469
+ const onAnswerClick = t31 === undefined ? null : t31;
470
+ const onAnswerTransitionEnd = t32 === undefined ? null : t32;
471
+ const withoutCollapse = t33 === undefined ? false : t33;
472
+ const className = t34 === undefined ? null : t34;
473
+ const style = t35 === undefined ? null : t35;
474
+ const {
475
+ isPlaceholder
476
+ } = useScreenRenderContext();
477
+ const isSplitted = layout === "split";
478
+ const verticalAlign = isSplitted ? null : layout;
479
+ let t36;
480
+ if ($[0] !== question) {
481
+ t36 = isTextFilled(question);
482
+ $[0] = question;
483
+ $[1] = t36;
484
+ } else {
485
+ t36 = $[1];
486
+ }
487
+ const hasQuestion = t36;
488
+ let t37;
489
+ if ($[2] !== question) {
490
+ t37 = question || {};
491
+ $[2] = question;
492
+ $[3] = t37;
493
+ } else {
494
+ t37 = $[3];
495
+ }
496
+ const {
497
+ textStyle: t38
498
+ } = t37;
499
+ const questionTextStyle = t38 === undefined ? null : t38;
500
+ const [resultVisible, setResultVisible] = useState(showInstantAnswer);
501
+ const answered = answeredIndex !== null;
502
+ const answer = answeredIndex !== null && answers[answeredIndex] ? answers[answeredIndex] : null;
503
+ let t39;
504
+ if ($[4] !== answer) {
505
+ t39 = answer || {};
506
+ $[4] = answer;
507
+ $[5] = t39;
508
+ } else {
509
+ t39 = $[5];
510
+ }
511
+ const {
512
+ result: t40,
513
+ answerImage: t41
514
+ } = t39;
515
+ const answerResult = t40 === undefined ? null : t40;
516
+ const answerImage = t41 === undefined ? null : t41;
517
+ let t42;
518
+ if ($[6] !== answerResult || $[7] !== result) {
519
+ t42 = isTextFilled(answerResult) || isTextFilled(result);
520
+ $[6] = answerResult;
521
+ $[7] = result;
522
+ $[8] = t42;
523
+ } else {
524
+ t42 = $[8];
525
+ }
526
+ const hasResult = t42;
527
+ let t43;
528
+ if ($[9] !== answerImage || $[10] !== resultImage) {
529
+ t43 = isImageFilled(answerImage) || isImageFilled(resultImage);
530
+ $[9] = answerImage;
531
+ $[10] = resultImage;
532
+ $[11] = t43;
533
+ } else {
534
+ t43 = $[11];
535
+ }
536
+ const hasResultVisual = t43;
537
+ let t44;
538
+ if ($[12] !== result) {
539
+ t44 = isTextFilled(result) ? result : null;
540
+ $[12] = result;
541
+ $[13] = t44;
542
+ } else {
543
+ t44 = $[13];
544
+ }
545
+ const defaultResult = t44;
546
+ let t45;
547
+ if ($[14] !== answerResult) {
548
+ t45 = isTextFilled(answerResult) ? answerResult : null;
549
+ $[14] = answerResult;
550
+ $[15] = t45;
551
+ } else {
552
+ t45 = $[15];
553
+ }
554
+ const customResult = t45;
555
+ const finalResult = customResult || defaultResult;
556
+ let t46;
557
+ if ($[16] !== finalResult) {
558
+ t46 = finalResult || {};
559
+ $[16] = finalResult;
560
+ $[17] = t46;
561
+ } else {
562
+ t46 = $[17];
563
+ }
564
+ const {
565
+ textStyle: t47
566
+ } = t46;
567
+ const resultTextStyle = t47 === undefined ? null : t47;
568
+ let t48;
569
+ if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
570
+ t48 = () => {
571
+ setResultVisible(true);
572
+ };
573
+ $[18] = t48;
574
+ } else {
575
+ t48 = $[18];
576
+ }
577
+ const onAnswersCollapse = t48;
578
+ const hasIndex = index !== null && totalCount !== null;
579
+ const t49 = !hasResult;
580
+ let t50;
581
+ if ($[19] !== className || $[20] !== isPlaceholder || $[21] !== resultVisible || $[22] !== t49) {
582
+ t50 = classNames([styles$3.container, className, {
583
+ [styles$3.isPlaceholder]: isPlaceholder,
584
+ [styles$3.resultVisible]: resultVisible,
585
+ [styles$3.resultHidden]: t49
586
+ }]);
587
+ $[19] = className;
588
+ $[20] = isPlaceholder;
589
+ $[21] = resultVisible;
590
+ $[22] = t49;
591
+ $[23] = t50;
592
+ } else {
593
+ t50 = $[23];
594
+ }
595
+ let t51;
596
+ if ($[24] !== hasIndex || $[25] !== index || $[26] !== numbersTextStyle || $[27] !== totalCount || $[28] !== transitionDisabled || $[29] !== transitionPlaying || $[30] !== transitions || $[31] !== withoutIndex) {
597
+ t51 = !withoutIndex && hasIndex ? /*#__PURE__*/jsx(ScreenElement, {
529
598
  placeholder: /*#__PURE__*/jsx("div", {
530
599
  className: styles$3.index,
531
600
  children: "1 / 10"
@@ -536,32 +605,95 @@ function Question(_ref) {
536
605
  disabled: transitionDisabled,
537
606
  children: /*#__PURE__*/jsx(Text, {
538
607
  className: styles$3.index,
539
- body: "".concat(index + 1, " / ").concat(totalCount),
608
+ body: `${index + 1} / ${totalCount}`,
540
609
  textStyle: numbersTextStyle
541
610
  })
542
611
  }) : null
543
- }, "stats") : null, /*#__PURE__*/jsx(ScreenElement, {
612
+ }, "stats") : null;
613
+ $[24] = hasIndex;
614
+ $[25] = index;
615
+ $[26] = numbersTextStyle;
616
+ $[27] = totalCount;
617
+ $[28] = transitionDisabled;
618
+ $[29] = transitionPlaying;
619
+ $[30] = transitions;
620
+ $[31] = withoutIndex;
621
+ $[32] = t51;
622
+ } else {
623
+ t51 = $[32];
624
+ }
625
+ let t52;
626
+ if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
627
+ t52 = /*#__PURE__*/jsx(FormattedMessage, {
628
+ id: "FOmgqv",
629
+ defaultMessage: "Question"
630
+ });
631
+ $[33] = t52;
632
+ } else {
633
+ t52 = $[33];
634
+ }
635
+ const t53 = !hasQuestion;
636
+ let t54;
637
+ if ($[34] !== hasQuestion || $[35] !== question || $[36] !== questionTextStyle || $[37] !== questionsHeadingStyle || $[38] !== transitionDisabled || $[39] !== transitionPlaying || $[40] !== transitions) {
638
+ t54 = hasQuestion ? /*#__PURE__*/jsx(Transitions, {
639
+ transitions: transitions,
640
+ playing: transitionPlaying,
641
+ disabled: transitionDisabled,
642
+ children: /*#__PURE__*/jsx(Heading, {
643
+ ...question,
644
+ className: styles$3.question,
645
+ textStyle: {
646
+ ...questionsHeadingStyle,
647
+ ...questionTextStyle
648
+ }
649
+ })
650
+ }) : null;
651
+ $[34] = hasQuestion;
652
+ $[35] = question;
653
+ $[36] = questionTextStyle;
654
+ $[37] = questionsHeadingStyle;
655
+ $[38] = transitionDisabled;
656
+ $[39] = transitionPlaying;
657
+ $[40] = transitions;
658
+ $[41] = t54;
659
+ } else {
660
+ t54 = $[41];
661
+ }
662
+ let t55;
663
+ if ($[42] !== t53 || $[43] !== t54) {
664
+ t55 = /*#__PURE__*/jsx(ScreenElement, {
544
665
  placeholder: "title",
545
- emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
546
- id: "FOmgqv",
547
- defaultMessage: [{
548
- "type": 0,
549
- "value": "Question"
550
- }]
551
- }),
666
+ emptyLabel: t52,
552
667
  emptyClassName: styles$3.emptyQuestion,
553
- isEmpty: !hasQuestion,
554
- children: hasQuestion ? /*#__PURE__*/jsx(Transitions, {
555
- transitions: transitions,
556
- playing: transitionPlaying,
557
- disabled: transitionDisabled,
558
- children: /*#__PURE__*/jsx(Heading, _objectSpread(_objectSpread({}, question), {}, {
559
- className: styles$3.question,
560
- textStyle: _objectSpread(_objectSpread({}, questionsHeadingStyle), questionTextStyle)
561
- }))
562
- }) : null
563
- }, "question"), isSplitted ? /*#__PURE__*/jsx(Spacer, {}, "spacer") : null, /*#__PURE__*/jsx(Answers, {
564
- items: answers || [],
668
+ isEmpty: t53,
669
+ children: t54
670
+ }, "question");
671
+ $[42] = t53;
672
+ $[43] = t54;
673
+ $[44] = t55;
674
+ } else {
675
+ t55 = $[44];
676
+ }
677
+ let t56;
678
+ if ($[45] !== isSplitted) {
679
+ t56 = isSplitted ? /*#__PURE__*/jsx(Spacer, {}, "spacer") : null;
680
+ $[45] = isSplitted;
681
+ $[46] = t56;
682
+ } else {
683
+ t56 = $[46];
684
+ }
685
+ let t57;
686
+ if ($[47] !== answers) {
687
+ t57 = answers || [];
688
+ $[47] = answers;
689
+ $[48] = t57;
690
+ } else {
691
+ t57 = $[48];
692
+ }
693
+ let t58;
694
+ if ($[49] !== animated || $[50] !== answeredIndex || $[51] !== badAnswerColor || $[52] !== buttonsLayout || $[53] !== buttonsStyle || $[54] !== buttonsTextStyle || $[55] !== focusable || $[56] !== goodAnswerColor || $[57] !== inactiveButtonsStyle || $[58] !== inactiveButtonsTextStyle || $[59] !== keypadLayout || $[60] !== onAnswerClick || $[61] !== onAnswerTransitionEnd || $[62] !== t57 || $[63] !== transitionDisabled || $[64] !== transitionPlaying || $[65] !== transitionStagger || $[66] !== transitions || $[67] !== withoutCollapse || $[68] !== withoutGoodAnswer || $[69] !== withoutTrueFalse) {
695
+ t58 = /*#__PURE__*/jsx(Answers, {
696
+ items: t57,
565
697
  keypadLayout: keypadLayout,
566
698
  answeredIndex: answeredIndex,
567
699
  goodAnswerColor: goodAnswerColor,
@@ -584,17 +716,42 @@ function Question(_ref) {
584
716
  onCollapse: onAnswersCollapse,
585
717
  onTransitionEnd: onAnswerTransitionEnd,
586
718
  withoutCollapse: withoutCollapse
587
- }, "answers"), withResult ? /*#__PURE__*/jsx("div", {
719
+ }, "answers");
720
+ $[49] = animated;
721
+ $[50] = answeredIndex;
722
+ $[51] = badAnswerColor;
723
+ $[52] = buttonsLayout;
724
+ $[53] = buttonsStyle;
725
+ $[54] = buttonsTextStyle;
726
+ $[55] = focusable;
727
+ $[56] = goodAnswerColor;
728
+ $[57] = inactiveButtonsStyle;
729
+ $[58] = inactiveButtonsTextStyle;
730
+ $[59] = keypadLayout;
731
+ $[60] = onAnswerClick;
732
+ $[61] = onAnswerTransitionEnd;
733
+ $[62] = t57;
734
+ $[63] = transitionDisabled;
735
+ $[64] = transitionPlaying;
736
+ $[65] = transitionStagger;
737
+ $[66] = transitions;
738
+ $[67] = withoutCollapse;
739
+ $[68] = withoutGoodAnswer;
740
+ $[69] = withoutTrueFalse;
741
+ $[70] = t58;
742
+ } else {
743
+ t58 = $[70];
744
+ }
745
+ let t59;
746
+ if ($[71] !== answerImage || $[72] !== answered || $[73] !== answers || $[74] !== feedbackTextStyle || $[75] !== finalResult || $[76] !== hasResult || $[77] !== hasResultVisual || $[78] !== resultImage || $[79] !== resultTextStyle || $[80] !== transitionDisabled || $[81] !== transitionPlaying || $[82] !== transitionStagger || $[83] !== transitions || $[84] !== withResult) {
747
+ t59 = withResult ? /*#__PURE__*/jsx("div", {
588
748
  className: styles$3.result,
589
749
  children: /*#__PURE__*/jsx("div", {
590
750
  className: styles$3.resultContent,
591
751
  children: /*#__PURE__*/jsx(ScreenElement, {
592
752
  emptyLabel: answered ? /*#__PURE__*/jsx(FormattedMessage, {
593
753
  id: "li7ADr",
594
- defaultMessage: [{
595
- "type": 0,
596
- "value": "Result"
597
- }]
754
+ defaultMessage: "Result"
598
755
  }) : null,
599
756
  isEmpty: answered && !hasResult,
600
757
  emptyClassName: styles$3.emptyResult,
@@ -603,10 +760,14 @@ function Question(_ref) {
603
760
  playing: transitionPlaying,
604
761
  delay: (1 + answers.length) * transitionStagger,
605
762
  disabled: transitionDisabled,
606
- children: [hasResult ? /*#__PURE__*/jsx(Text, _objectSpread(_objectSpread({}, finalResult || {}), {}, {
763
+ children: [hasResult ? /*#__PURE__*/jsx(Text, {
764
+ ...(finalResult || {}),
607
765
  className: styles$3.resultText,
608
- textStyle: _objectSpread(_objectSpread({}, feedbackTextStyle || null), resultTextStyle || null)
609
- })) : null, hasResultVisual ? /*#__PURE__*/jsx(Visual, {
766
+ textStyle: {
767
+ ...(feedbackTextStyle || null),
768
+ ...(resultTextStyle || null)
769
+ }
770
+ }) : null, hasResultVisual ? /*#__PURE__*/jsx(Visual, {
610
771
  media: answerImage || resultImage,
611
772
  width: "100%",
612
773
  height: "auto"
@@ -614,293 +775,623 @@ function Question(_ref) {
614
775
  }) : null
615
776
  })
616
777
  })
617
- }, "results") : null]
618
- });
778
+ }, "results") : null;
779
+ $[71] = answerImage;
780
+ $[72] = answered;
781
+ $[73] = answers;
782
+ $[74] = feedbackTextStyle;
783
+ $[75] = finalResult;
784
+ $[76] = hasResult;
785
+ $[77] = hasResultVisual;
786
+ $[78] = resultImage;
787
+ $[79] = resultTextStyle;
788
+ $[80] = transitionDisabled;
789
+ $[81] = transitionPlaying;
790
+ $[82] = transitionStagger;
791
+ $[83] = transitions;
792
+ $[84] = withResult;
793
+ $[85] = t59;
794
+ } else {
795
+ t59 = $[85];
796
+ }
797
+ let t60;
798
+ if ($[86] !== t51 || $[87] !== t55 || $[88] !== t56 || $[89] !== t58 || $[90] !== t59) {
799
+ t60 = [t51, t55, t56, t58, t59];
800
+ $[86] = t51;
801
+ $[87] = t55;
802
+ $[88] = t56;
803
+ $[89] = t58;
804
+ $[90] = t59;
805
+ $[91] = t60;
806
+ } else {
807
+ t60 = $[91];
808
+ }
809
+ let t61;
810
+ if ($[92] !== style || $[93] !== t50 || $[94] !== t60 || $[95] !== verticalAlign) {
811
+ t61 = /*#__PURE__*/jsx(Layout, {
812
+ className: t50,
813
+ verticalAlign: verticalAlign,
814
+ style: style,
815
+ children: t60
816
+ });
817
+ $[92] = style;
818
+ $[93] = t50;
819
+ $[94] = t60;
820
+ $[95] = verticalAlign;
821
+ $[96] = t61;
822
+ } else {
823
+ t61 = $[96];
824
+ }
825
+ return t61;
619
826
  }
620
827
 
621
828
  var styles$2 = {"container":"micromag-screen-quiz-container","background":"micromag-screen-quiz-background","content":"micromag-screen-quiz-content","disabled":"micromag-screen-quiz-disabled","reset":"micromag-screen-quiz-reset","points":"micromag-screen-quiz-points","header":"micromag-screen-quiz-header","footer":"micromag-screen-quiz-footer","nextButton":"micromag-screen-quiz-nextButton","question":"micromag-screen-quiz-question","results":"micromag-screen-quiz-results","intro":"micromag-screen-quiz-intro"};
622
829
 
623
- function QuizScreen(_ref) {
624
- var _ref$id = _ref.id,
625
- id = _ref$id === void 0 ? null : _ref$id,
626
- _ref$layout = _ref.layout,
627
- layout = _ref$layout === void 0 ? 'middle' : _ref$layout,
628
- _ref$keypadLayout = _ref.keypadLayout,
629
- keypadLayout = _ref$keypadLayout === void 0 ? null : _ref$keypadLayout,
630
- _ref$question = _ref.question,
631
- question = _ref$question === void 0 ? null : _ref$question,
632
- _ref$answers = _ref.answers,
633
- answers = _ref$answers === void 0 ? null : _ref$answers,
634
- _ref$result = _ref.result,
635
- result = _ref$result === void 0 ? null : _ref$result,
636
- _ref$resultImage = _ref.resultImage,
637
- resultImage = _ref$resultImage === void 0 ? null : _ref$resultImage,
638
- _ref$buttonsLayout = _ref.buttonsLayout,
639
- buttonsLayout = _ref$buttonsLayout === void 0 ? null : _ref$buttonsLayout,
640
- _ref$buttonsStyle = _ref.buttonsStyle,
641
- buttonsStyle = _ref$buttonsStyle === void 0 ? null : _ref$buttonsStyle,
642
- _ref$inactiveButtonsS = _ref.inactiveButtonsStyle,
643
- inactiveButtonsStyle = _ref$inactiveButtonsS === void 0 ? null : _ref$inactiveButtonsS,
644
- _ref$buttonsTextStyle = _ref.buttonsTextStyle,
645
- buttonsTextStyle = _ref$buttonsTextStyle === void 0 ? null : _ref$buttonsTextStyle,
646
- _ref$inactiveButtonsT = _ref.inactiveButtonsTextStyle,
647
- inactiveButtonsTextStyle = _ref$inactiveButtonsT === void 0 ? null : _ref$inactiveButtonsT,
648
- _ref$feedbackTextStyl = _ref.feedbackTextStyle,
649
- feedbackTextStyle = _ref$feedbackTextStyl === void 0 ? null : _ref$feedbackTextStyl,
650
- _ref$numbersTextStyle = _ref.numbersTextStyle,
651
- numbersTextStyle = _ref$numbersTextStyle === void 0 ? null : _ref$numbersTextStyle,
652
- _ref$goodAnswerColor = _ref.goodAnswerColor,
653
- goodAnswerColor = _ref$goodAnswerColor === void 0 ? null : _ref$goodAnswerColor,
654
- _ref$badAnswerColor = _ref.badAnswerColor,
655
- badAnswerColor = _ref$badAnswerColor === void 0 ? null : _ref$badAnswerColor,
656
- _ref$withoutTrueFalse = _ref.withoutTrueFalse,
657
- withoutTrueFalse = _ref$withoutTrueFalse === void 0 ? false : _ref$withoutTrueFalse,
658
- _ref$spacing = _ref.spacing,
659
- spacing = _ref$spacing === void 0 ? 20 : _ref$spacing,
660
- _ref$header = _ref.header,
661
- header = _ref$header === void 0 ? null : _ref$header,
662
- _ref$footer = _ref.footer,
663
- footer = _ref$footer === void 0 ? null : _ref$footer,
664
- _ref$background = _ref.background,
665
- background = _ref$background === void 0 ? null : _ref$background,
666
- _ref$current = _ref.current,
667
- current = _ref$current === void 0 ? true : _ref$current,
668
- _ref$preload = _ref.preload,
669
- preload = _ref$preload === void 0 ? true : _ref$preload,
670
- _ref$ready = _ref.ready,
671
- ready = _ref$ready === void 0 ? true : _ref$ready,
672
- _ref$transitions = _ref.transitions,
673
- transitions = _ref$transitions === void 0 ? null : _ref$transitions,
674
- _ref$transitionStagge = _ref.transitionStagger,
675
- transitionStagger = _ref$transitionStagge === void 0 ? 100 : _ref$transitionStagge,
676
- _ref$type = _ref.type,
677
- type = _ref$type === void 0 ? null : _ref$type,
678
- _ref$mediaRef = _ref.mediaRef,
679
- customMediaRef = _ref$mediaRef === void 0 ? null : _ref$mediaRef,
680
- _ref$className = _ref.className,
681
- className = _ref$className === void 0 ? null : _ref$className;
682
- var screenId = id || 'screen-id';
683
- var trackScreenEvent = useTrackScreenEvent(type);
684
- var _useScreenSize = useScreenSize(),
685
- width = _useScreenSize.width,
686
- height = _useScreenSize.height,
687
- resolution = _useScreenSize.resolution;
688
- var _useScreenRenderConte = useScreenRenderContext(),
689
- isView = _useScreenRenderConte.isView,
690
- isPreview = _useScreenRenderConte.isPreview,
691
- isPlaceholder = _useScreenRenderConte.isPlaceholder,
692
- isEdit = _useScreenRenderConte.isEdit,
693
- isStatic = _useScreenRenderConte.isStatic,
694
- isCapture = _useScreenRenderConte.isCapture;
695
- var clickDisabled = !ready;
696
- var _useViewerContext = useViewerContext(),
697
- viewerTopHeight = _useViewerContext.topHeight,
698
- viewerBottomHeight = _useViewerContext.bottomHeight,
699
- viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
700
- var _useViewerWebView = useViewerWebView(),
701
- openWebView = _useViewerWebView.open;
702
- var _usePlaybackContext = usePlaybackContext(),
703
- muted = _usePlaybackContext.muted;
704
- var _usePlaybackMediaRef = usePlaybackMediaRef(current, true),
705
- mediaRef = _usePlaybackMediaRef.ref,
706
- _usePlaybackMediaRef$ = _usePlaybackMediaRef.isCurrent,
707
- isCurrentMedia = _usePlaybackMediaRef$ === void 0 ? false : _usePlaybackMediaRef$;
708
- var transitionPlaying = current && ready;
709
- var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
710
- var backgroundPlaying = current && (isView || isEdit) && (isCurrentMedia || !isView);
711
- var mediaShouldLoad = current || preload;
712
- var hasHeader = isHeaderFilled(header);
713
- var hasFooter = isFooterFilled(footer);
714
- var footerProps = getFooterProps(footer, {
715
- isView: isView,
716
- current: current,
717
- openWebView: openWebView,
718
- isPreview: isPreview
719
- });
720
- var _useDimensionObserver = useDimensionObserver(),
721
- headerRef = _useDimensionObserver.ref,
722
- _useDimensionObserver2 = _useDimensionObserver.height,
723
- headerHeight = _useDimensionObserver2 === void 0 ? 0 : _useDimensionObserver2;
724
- var _useDimensionObserver3 = useDimensionObserver(),
725
- footerRef = _useDimensionObserver3.ref,
726
- _useDimensionObserver4 = _useDimensionObserver3.height,
727
- footerHeight = _useDimensionObserver4 === void 0 ? 0 : _useDimensionObserver4;
728
- var showInstantAnswer = isStatic || isCapture;
729
- var goodAnswerIndex = answers !== null ? answers.findIndex(function (answer) {
730
- return answer !== null && answer.good;
731
- }) : null;
732
- var withoutGoodAnswer = goodAnswerIndex === null || goodAnswerIndex === -1;
733
- var _useState = useState(showInstantAnswer ? goodAnswerIndex : null),
734
- _useState2 = _slicedToArray(_useState, 2),
735
- userAnswerIndex = _useState2[0],
736
- setUserAnswerIndex = _useState2[1];
737
- var _useQuizCreate = useQuizCreate({
738
- screenId: screenId
739
- }),
740
- submitQuiz = _useQuizCreate.create;
741
- var onAnswerClick = useCallback(function (answer, answerI) {
742
- if (userAnswerIndex !== null) {
743
- return;
744
- }
745
- setUserAnswerIndex(answerI);
746
- trackScreenEvent('click_answer', "".concat(userAnswerIndex + 1, ": ").concat(answer.label.body), {
747
- linkType: 'quiz_answer',
748
- answer: answer,
749
- answerIndex: answerI,
750
- isGood: answer.good || false
830
+ function QuizScreen(t0) {
831
+ const $ = c(135);
832
+ const {
833
+ id: t1,
834
+ layout: t2,
835
+ keypadLayout: t3,
836
+ question: t4,
837
+ answers: t5,
838
+ result: t6,
839
+ resultImage: t7,
840
+ buttonsLayout: t8,
841
+ buttonsStyle: t9,
842
+ inactiveButtonsStyle: t10,
843
+ buttonsTextStyle: t11,
844
+ inactiveButtonsTextStyle: t12,
845
+ feedbackTextStyle: t13,
846
+ numbersTextStyle: t14,
847
+ goodAnswerColor: t15,
848
+ badAnswerColor: t16,
849
+ withoutTrueFalse: t17,
850
+ spacing: t18,
851
+ header: t19,
852
+ footer: t20,
853
+ background: t21,
854
+ current: t22,
855
+ preload: t23,
856
+ ready: t24,
857
+ transitions: t25,
858
+ transitionStagger: t26,
859
+ type: t27,
860
+ mediaRef: t28,
861
+ className: t29
862
+ } = t0;
863
+ const id = t1 === undefined ? null : t1;
864
+ const layout = t2 === undefined ? "middle" : t2;
865
+ const keypadLayout = t3 === undefined ? null : t3;
866
+ const question = t4 === undefined ? null : t4;
867
+ const answers = t5 === undefined ? null : t5;
868
+ const result = t6 === undefined ? null : t6;
869
+ const resultImage = t7 === undefined ? null : t7;
870
+ const buttonsLayout = t8 === undefined ? null : t8;
871
+ const buttonsStyle = t9 === undefined ? null : t9;
872
+ const inactiveButtonsStyle = t10 === undefined ? null : t10;
873
+ const buttonsTextStyle = t11 === undefined ? null : t11;
874
+ const inactiveButtonsTextStyle = t12 === undefined ? null : t12;
875
+ const feedbackTextStyle = t13 === undefined ? null : t13;
876
+ const numbersTextStyle = t14 === undefined ? null : t14;
877
+ const goodAnswerColor = t15 === undefined ? null : t15;
878
+ const badAnswerColor = t16 === undefined ? null : t16;
879
+ const withoutTrueFalse = t17 === undefined ? false : t17;
880
+ const spacing = t18 === undefined ? 20 : t18;
881
+ const header = t19 === undefined ? null : t19;
882
+ const footer = t20 === undefined ? null : t20;
883
+ const background = t21 === undefined ? null : t21;
884
+ const current = t22 === undefined ? true : t22;
885
+ const preload = t23 === undefined ? true : t23;
886
+ const ready = t24 === undefined ? true : t24;
887
+ const transitions = t25 === undefined ? null : t25;
888
+ const transitionStagger = t26 === undefined ? 100 : t26;
889
+ const type = t27 === undefined ? null : t27;
890
+ const customMediaRef = t28 === undefined ? null : t28;
891
+ const className = t29 === undefined ? null : t29;
892
+ const screenId = id || "screen-id";
893
+ const trackScreenEvent = useTrackScreenEvent(type);
894
+ const {
895
+ width,
896
+ height,
897
+ resolution
898
+ } = useScreenSize();
899
+ const {
900
+ isView,
901
+ isPreview,
902
+ isPlaceholder,
903
+ isEdit,
904
+ isStatic,
905
+ isCapture
906
+ } = useScreenRenderContext();
907
+ const clickDisabled = !ready;
908
+ const {
909
+ topHeight: viewerTopHeight,
910
+ bottomHeight: viewerBottomHeight,
911
+ bottomSidesWidth: viewerBottomSidesWidth
912
+ } = useViewerContext();
913
+ const {
914
+ open: openWebView
915
+ } = useViewerWebView();
916
+ const {
917
+ muted
918
+ } = usePlaybackContext();
919
+ const {
920
+ ref: mediaRef,
921
+ isCurrent: t30
922
+ } = usePlaybackMediaRef(current, true);
923
+ const isCurrentMedia = t30 === undefined ? false : t30;
924
+ const transitionPlaying = current && ready;
925
+ const transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
926
+ const backgroundPlaying = current && (isView || isEdit) && (isCurrentMedia || !isView);
927
+ const mediaShouldLoad = current || preload;
928
+ let t31;
929
+ if ($[0] !== header) {
930
+ t31 = isHeaderFilled(header);
931
+ $[0] = header;
932
+ $[1] = t31;
933
+ } else {
934
+ t31 = $[1];
935
+ }
936
+ const hasHeader = t31;
937
+ let t32;
938
+ if ($[2] !== footer) {
939
+ t32 = isFooterFilled(footer);
940
+ $[2] = footer;
941
+ $[3] = t32;
942
+ } else {
943
+ t32 = $[3];
944
+ }
945
+ const hasFooter = t32;
946
+ let t33;
947
+ if ($[4] !== current || $[5] !== footer || $[6] !== isPreview || $[7] !== isView || $[8] !== openWebView) {
948
+ t33 = getFooterProps(footer, {
949
+ isView,
950
+ current,
951
+ openWebView,
952
+ isPreview
751
953
  });
752
- }, [userAnswerIndex, setUserAnswerIndex, trackScreenEvent, answers]);
753
- useEffect(function () {
754
- if (!current && isEdit && userAnswerIndex !== null) {
755
- setUserAnswerIndex(null);
756
- }
757
- }, [isEdit, current, userAnswerIndex, setUserAnswerIndex]);
758
- useEffect(function () {
759
- if (!isView) {
760
- return;
761
- }
762
- if (userAnswerIndex !== null) {
763
- var _ref2 = userAnswerIndex !== null && answers ? answers[userAnswerIndex] : {},
764
- _ref2$good = _ref2.good,
765
- isGood = _ref2$good === void 0 ? false : _ref2$good,
766
- _ref2$label = _ref2.label,
767
- label = _ref2$label === void 0 ? {} : _ref2$label;
768
- var _ref3 = label || {},
769
- _ref3$body = _ref3.body,
770
- body = _ref3$body === void 0 ? '' : _ref3$body;
771
- submitQuiz({
772
- choice: body || userAnswerIndex,
773
- value: isGood ? 1 : 0
774
- });
775
- }
776
- }, [isView, userAnswerIndex, answers, submitQuiz]);
777
- var scrollingDisabled = !isEdit && transitionDisabled || !current;
778
- var _useState3 = useState(false),
779
- _useState4 = _slicedToArray(_useState3, 2),
780
- scrolledBottom = _useState4[0],
781
- setScrolledBottom = _useState4[1];
782
- var onScrolledBottom = useCallback(function (_ref4) {
783
- var initial = _ref4.initial;
784
- if (initial) {
785
- trackScreenEvent('scroll', 'Screen');
786
- }
787
- setScrolledBottom(true);
788
- }, [trackScreenEvent]);
789
- var onScrolledNotBottom = useCallback(function () {
790
- setScrolledBottom(false);
791
- }, [setScrolledBottom]);
792
- var onScrolledTrigger = useCallback(function () {
793
- var trigger = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
794
- if (trigger !== null) {
795
- var scrollPercent = Math.round(trigger * 100);
796
- trackScreenEvent('scroll', scrollPercent, {
797
- scrollPercent: scrollPercent
954
+ $[4] = current;
955
+ $[5] = footer;
956
+ $[6] = isPreview;
957
+ $[7] = isView;
958
+ $[8] = openWebView;
959
+ $[9] = t33;
960
+ } else {
961
+ t33 = $[9];
962
+ }
963
+ const footerProps = t33;
964
+ const {
965
+ ref: headerRef,
966
+ height: t34
967
+ } = useDimensionObserver();
968
+ const headerHeight = t34 === undefined ? 0 : t34;
969
+ const {
970
+ ref: footerRef,
971
+ height: t35
972
+ } = useDimensionObserver();
973
+ const footerHeight = t35 === undefined ? 0 : t35;
974
+ const showInstantAnswer = isStatic || isCapture;
975
+ let t36;
976
+ if ($[10] !== answers) {
977
+ t36 = answers !== null ? answers.findIndex(_temp) : null;
978
+ $[10] = answers;
979
+ $[11] = t36;
980
+ } else {
981
+ t36 = $[11];
982
+ }
983
+ const goodAnswerIndex = t36;
984
+ const withoutGoodAnswer = goodAnswerIndex === null || goodAnswerIndex === -1;
985
+ const [userAnswerIndex, setUserAnswerIndex] = useState(showInstantAnswer ? goodAnswerIndex : null);
986
+ let t37;
987
+ if ($[12] !== screenId) {
988
+ t37 = {
989
+ screenId
990
+ };
991
+ $[12] = screenId;
992
+ $[13] = t37;
993
+ } else {
994
+ t37 = $[13];
995
+ }
996
+ const {
997
+ create: submitQuiz
998
+ } = useQuizCreate(t37);
999
+ let t38;
1000
+ if ($[14] !== trackScreenEvent || $[15] !== userAnswerIndex) {
1001
+ t38 = (answer_0, answerI) => {
1002
+ if (userAnswerIndex !== null) {
1003
+ return;
1004
+ }
1005
+ setUserAnswerIndex(answerI);
1006
+ trackScreenEvent("click_answer", `${userAnswerIndex + 1}: ${answer_0.label.body}`, {
1007
+ linkType: "quiz_answer",
1008
+ answer: answer_0,
1009
+ answerIndex: answerI,
1010
+ isGood: answer_0.good || false
798
1011
  });
799
- }
800
- }, [trackScreenEvent]);
801
- var _useState5 = useState(false),
802
- _useState6 = _slicedToArray(_useState5, 2),
803
- hasScroll = _useState6[0],
804
- setHasScroll = _useState6[1];
805
- var onScrollHeightChange = useCallback(function (_ref5) {
806
- var _ref5$canScroll = _ref5.canScroll,
807
- canScroll = _ref5$canScroll === void 0 ? false : _ref5$canScroll;
808
- setHasScroll(canScroll);
809
- }, [setHasScroll]);
810
- var onQuizReset = useCallback(function () {
811
- setUserAnswerIndex(null);
812
- }, [setUserAnswerIndex]);
813
- var numberOfAnswers = (answers || []).length;
814
- useEffect(function () {
815
- onQuizReset();
816
- }, [numberOfAnswers, onQuizReset]);
817
- var isSplitted = layout === 'split';
818
- var verticalAlign = isSplitted ? null : layout;
819
- var showReset = isEdit && userAnswerIndex !== null;
820
- return /*#__PURE__*/jsxs("div", {
821
- className: classNames([styles$2.container, className, _defineProperty({}, styles$2.disabled, clickDisabled)]),
822
- "data-screen-ready": true,
823
- children: [/*#__PURE__*/jsxs(Container, {
1012
+ };
1013
+ $[14] = trackScreenEvent;
1014
+ $[15] = userAnswerIndex;
1015
+ $[16] = t38;
1016
+ } else {
1017
+ t38 = $[16];
1018
+ }
1019
+ const onAnswerClick = t38;
1020
+ let t39;
1021
+ let t40;
1022
+ if ($[17] !== current || $[18] !== isEdit || $[19] !== userAnswerIndex) {
1023
+ t39 = () => {
1024
+ if (!current && isEdit && userAnswerIndex !== null) {
1025
+ setUserAnswerIndex(null);
1026
+ }
1027
+ };
1028
+ t40 = [isEdit, current, userAnswerIndex, setUserAnswerIndex];
1029
+ $[17] = current;
1030
+ $[18] = isEdit;
1031
+ $[19] = userAnswerIndex;
1032
+ $[20] = t39;
1033
+ $[21] = t40;
1034
+ } else {
1035
+ t39 = $[20];
1036
+ t40 = $[21];
1037
+ }
1038
+ useEffect(t39, t40);
1039
+ let t41;
1040
+ let t42;
1041
+ if ($[22] !== answers || $[23] !== isView || $[24] !== submitQuiz || $[25] !== userAnswerIndex) {
1042
+ t41 = () => {
1043
+ if (!isView) {
1044
+ return;
1045
+ }
1046
+ if (userAnswerIndex !== null) {
1047
+ const {
1048
+ good: t43,
1049
+ label: t44
1050
+ } = userAnswerIndex !== null && answers ? answers[userAnswerIndex] : {};
1051
+ const isGood = t43 === undefined ? false : t43;
1052
+ const label = t44 === undefined ? {} : t44;
1053
+ const {
1054
+ body: t45
1055
+ } = label || {};
1056
+ const body = t45 === undefined ? "" : t45;
1057
+ submitQuiz({
1058
+ choice: body || userAnswerIndex,
1059
+ value: isGood ? 1 : 0
1060
+ });
1061
+ }
1062
+ };
1063
+ t42 = [isView, userAnswerIndex, answers, submitQuiz];
1064
+ $[22] = answers;
1065
+ $[23] = isView;
1066
+ $[24] = submitQuiz;
1067
+ $[25] = userAnswerIndex;
1068
+ $[26] = t41;
1069
+ $[27] = t42;
1070
+ } else {
1071
+ t41 = $[26];
1072
+ t42 = $[27];
1073
+ }
1074
+ useEffect(t41, t42);
1075
+ const scrollingDisabled = !isEdit && transitionDisabled || !current;
1076
+ const [scrolledBottom, setScrolledBottom] = useState(false);
1077
+ let t43;
1078
+ if ($[28] !== trackScreenEvent) {
1079
+ t43 = t44 => {
1080
+ const {
1081
+ initial
1082
+ } = t44;
1083
+ if (initial) {
1084
+ trackScreenEvent("scroll", "Screen");
1085
+ }
1086
+ setScrolledBottom(true);
1087
+ };
1088
+ $[28] = trackScreenEvent;
1089
+ $[29] = t43;
1090
+ } else {
1091
+ t43 = $[29];
1092
+ }
1093
+ const onScrolledBottom = t43;
1094
+ let t44;
1095
+ if ($[30] === Symbol.for("react.memo_cache_sentinel")) {
1096
+ t44 = () => {
1097
+ setScrolledBottom(false);
1098
+ };
1099
+ $[30] = t44;
1100
+ } else {
1101
+ t44 = $[30];
1102
+ }
1103
+ const onScrolledNotBottom = t44;
1104
+ let t45;
1105
+ if ($[31] !== trackScreenEvent) {
1106
+ t45 = t46 => {
1107
+ const trigger = t46 === undefined ? null : t46;
1108
+ if (trigger !== null) {
1109
+ const scrollPercent = Math.round(trigger * 100);
1110
+ trackScreenEvent("scroll", scrollPercent, {
1111
+ scrollPercent
1112
+ });
1113
+ }
1114
+ };
1115
+ $[31] = trackScreenEvent;
1116
+ $[32] = t45;
1117
+ } else {
1118
+ t45 = $[32];
1119
+ }
1120
+ const onScrolledTrigger = t45;
1121
+ const [hasScroll, setHasScroll] = useState(false);
1122
+ let t46;
1123
+ if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
1124
+ t46 = t47 => {
1125
+ const {
1126
+ canScroll: t48
1127
+ } = t47;
1128
+ const canScroll = t48 === undefined ? false : t48;
1129
+ setHasScroll(canScroll);
1130
+ };
1131
+ $[33] = t46;
1132
+ } else {
1133
+ t46 = $[33];
1134
+ }
1135
+ const onScrollHeightChange = t46;
1136
+ let t47;
1137
+ if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
1138
+ t47 = () => {
1139
+ setUserAnswerIndex(null);
1140
+ };
1141
+ $[34] = t47;
1142
+ } else {
1143
+ t47 = $[34];
1144
+ }
1145
+ const onQuizReset = t47;
1146
+ let t48;
1147
+ if ($[35] !== answers) {
1148
+ t48 = answers || [];
1149
+ $[35] = answers;
1150
+ $[36] = t48;
1151
+ } else {
1152
+ t48 = $[36];
1153
+ }
1154
+ const numberOfAnswers = t48.length;
1155
+ let t49;
1156
+ if ($[37] === Symbol.for("react.memo_cache_sentinel")) {
1157
+ t49 = () => {
1158
+ onQuizReset();
1159
+ };
1160
+ $[37] = t49;
1161
+ } else {
1162
+ t49 = $[37];
1163
+ }
1164
+ let t50;
1165
+ if ($[38] !== numberOfAnswers) {
1166
+ t50 = [numberOfAnswers, onQuizReset];
1167
+ $[38] = numberOfAnswers;
1168
+ $[39] = t50;
1169
+ } else {
1170
+ t50 = $[39];
1171
+ }
1172
+ useEffect(t49, t50);
1173
+ const isSplitted = layout === "split";
1174
+ const verticalAlign = isSplitted ? null : layout;
1175
+ const showReset = isEdit && userAnswerIndex !== null;
1176
+ let t51;
1177
+ if ($[40] !== className || $[41] !== clickDisabled) {
1178
+ t51 = classNames([styles$2.container, className, {
1179
+ [styles$2.disabled]: clickDisabled
1180
+ }]);
1181
+ $[40] = className;
1182
+ $[41] = clickDisabled;
1183
+ $[42] = t51;
1184
+ } else {
1185
+ t51 = $[42];
1186
+ }
1187
+ let t52;
1188
+ if ($[43] !== showReset) {
1189
+ t52 = showReset ? /*#__PURE__*/jsx(Button, {
1190
+ className: styles$2.reset,
1191
+ icon: /*#__PURE__*/jsx(FontAwesomeIcon, {
1192
+ icon: faRedo,
1193
+ size: "md"
1194
+ }),
1195
+ onClick: onQuizReset
1196
+ }) : null;
1197
+ $[43] = showReset;
1198
+ $[44] = t52;
1199
+ } else {
1200
+ t52 = $[44];
1201
+ }
1202
+ let t53;
1203
+ if ($[45] !== hasHeader || $[46] !== hasScroll || $[47] !== header || $[48] !== headerRef || $[49] !== isPlaceholder || $[50] !== isPreview || $[51] !== scrolledBottom || $[52] !== scrollingDisabled || $[53] !== spacing || $[54] !== userAnswerIndex || $[55] !== viewerTopHeight) {
1204
+ t53 = !isPlaceholder && hasHeader ? /*#__PURE__*/jsx("div", {
1205
+ className: classNames([styles$2.header, {
1206
+ [styles$2.disabled]: userAnswerIndex !== null || scrolledBottom && !scrollingDisabled && hasScroll
1207
+ }]),
1208
+ ref: headerRef,
1209
+ style: {
1210
+ paddingTop: spacing / 2,
1211
+ paddingLeft: spacing,
1212
+ paddingRight: spacing,
1213
+ paddingBottom: spacing,
1214
+ transform: !isPreview ? `translate(0, ${viewerTopHeight}px)` : null
1215
+ },
1216
+ children: /*#__PURE__*/jsx(Header, {
1217
+ ...header
1218
+ })
1219
+ }) : null;
1220
+ $[45] = hasHeader;
1221
+ $[46] = hasScroll;
1222
+ $[47] = header;
1223
+ $[48] = headerRef;
1224
+ $[49] = isPlaceholder;
1225
+ $[50] = isPreview;
1226
+ $[51] = scrolledBottom;
1227
+ $[52] = scrollingDisabled;
1228
+ $[53] = spacing;
1229
+ $[54] = userAnswerIndex;
1230
+ $[55] = viewerTopHeight;
1231
+ $[56] = t53;
1232
+ } else {
1233
+ t53 = $[56];
1234
+ }
1235
+ const t54 = current && isView;
1236
+ let t55;
1237
+ if ($[57] !== current || $[58] !== footerHeight || $[59] !== headerHeight || $[60] !== isPlaceholder || $[61] !== isPreview || $[62] !== spacing || $[63] !== viewerBottomHeight || $[64] !== viewerTopHeight) {
1238
+ t55 = !isPlaceholder ? {
1239
+ paddingLeft: spacing,
1240
+ paddingRight: spacing,
1241
+ paddingTop: (!isPreview ? viewerTopHeight : 0) + (headerHeight || spacing),
1242
+ paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + (footerHeight || spacing)
1243
+ } : null;
1244
+ $[57] = current;
1245
+ $[58] = footerHeight;
1246
+ $[59] = headerHeight;
1247
+ $[60] = isPlaceholder;
1248
+ $[61] = isPreview;
1249
+ $[62] = spacing;
1250
+ $[63] = viewerBottomHeight;
1251
+ $[64] = viewerTopHeight;
1252
+ $[65] = t55;
1253
+ } else {
1254
+ t55 = $[65];
1255
+ }
1256
+ let t56;
1257
+ if ($[66] !== answers || $[67] !== badAnswerColor || $[68] !== buttonsLayout || $[69] !== buttonsStyle || $[70] !== buttonsTextStyle || $[71] !== feedbackTextStyle || $[72] !== goodAnswerColor || $[73] !== inactiveButtonsStyle || $[74] !== inactiveButtonsTextStyle || $[75] !== isView || $[76] !== keypadLayout || $[77] !== layout || $[78] !== numbersTextStyle || $[79] !== onAnswerClick || $[80] !== question || $[81] !== result || $[82] !== resultImage || $[83] !== showInstantAnswer || $[84] !== t54 || $[85] !== t55 || $[86] !== transitionDisabled || $[87] !== transitionPlaying || $[88] !== transitionStagger || $[89] !== transitions || $[90] !== userAnswerIndex || $[91] !== withoutGoodAnswer || $[92] !== withoutTrueFalse) {
1258
+ t56 = /*#__PURE__*/jsx(Question, {
1259
+ question: question,
1260
+ answers: answers,
1261
+ keypadLayout: keypadLayout,
1262
+ result: result,
1263
+ resultImage: resultImage,
1264
+ answeredIndex: userAnswerIndex,
1265
+ buttonsLayout: buttonsLayout,
1266
+ buttonsStyle: buttonsStyle,
1267
+ buttonsTextStyle: buttonsTextStyle,
1268
+ inactiveButtonsStyle: inactiveButtonsStyle,
1269
+ inactiveButtonsTextStyle: inactiveButtonsTextStyle,
1270
+ feedbackTextStyle: feedbackTextStyle,
1271
+ numbersTextStyle: numbersTextStyle,
1272
+ goodAnswerColor: goodAnswerColor,
1273
+ badAnswerColor: badAnswerColor,
1274
+ withoutTrueFalse: withoutTrueFalse,
1275
+ withoutGoodAnswer: withoutGoodAnswer,
1276
+ focusable: t54,
1277
+ animated: isView,
1278
+ showInstantAnswer: showInstantAnswer,
1279
+ withResult: true,
1280
+ layout: layout,
1281
+ transitions: transitions,
1282
+ transitionPlaying: transitionPlaying,
1283
+ transitionStagger: transitionStagger,
1284
+ transitionDisabled: transitionDisabled,
1285
+ onAnswerClick: onAnswerClick,
1286
+ className: styles$2.question,
1287
+ style: t55
1288
+ });
1289
+ $[66] = answers;
1290
+ $[67] = badAnswerColor;
1291
+ $[68] = buttonsLayout;
1292
+ $[69] = buttonsStyle;
1293
+ $[70] = buttonsTextStyle;
1294
+ $[71] = feedbackTextStyle;
1295
+ $[72] = goodAnswerColor;
1296
+ $[73] = inactiveButtonsStyle;
1297
+ $[74] = inactiveButtonsTextStyle;
1298
+ $[75] = isView;
1299
+ $[76] = keypadLayout;
1300
+ $[77] = layout;
1301
+ $[78] = numbersTextStyle;
1302
+ $[79] = onAnswerClick;
1303
+ $[80] = question;
1304
+ $[81] = result;
1305
+ $[82] = resultImage;
1306
+ $[83] = showInstantAnswer;
1307
+ $[84] = t54;
1308
+ $[85] = t55;
1309
+ $[86] = transitionDisabled;
1310
+ $[87] = transitionPlaying;
1311
+ $[88] = transitionStagger;
1312
+ $[89] = transitions;
1313
+ $[90] = userAnswerIndex;
1314
+ $[91] = withoutGoodAnswer;
1315
+ $[92] = withoutTrueFalse;
1316
+ $[93] = t56;
1317
+ } else {
1318
+ t56 = $[93];
1319
+ }
1320
+ let t57;
1321
+ if ($[94] !== onScrolledBottom || $[95] !== onScrolledTrigger || $[96] !== scrollingDisabled || $[97] !== t53 || $[98] !== t56 || $[99] !== verticalAlign) {
1322
+ t57 = /*#__PURE__*/jsxs(Scroll, {
1323
+ verticalAlign: verticalAlign,
1324
+ disabled: scrollingDisabled,
1325
+ onScrolledTrigger: onScrolledTrigger,
1326
+ onScrolledBottom: onScrolledBottom,
1327
+ onScrolledNotBottom: onScrolledNotBottom,
1328
+ onScrollHeightChange: onScrollHeightChange,
1329
+ withShadow: true,
1330
+ children: [t53, t56]
1331
+ });
1332
+ $[94] = onScrolledBottom;
1333
+ $[95] = onScrolledTrigger;
1334
+ $[96] = scrollingDisabled;
1335
+ $[97] = t53;
1336
+ $[98] = t56;
1337
+ $[99] = verticalAlign;
1338
+ $[100] = t57;
1339
+ } else {
1340
+ t57 = $[100];
1341
+ }
1342
+ let t58;
1343
+ if ($[101] !== current || $[102] !== footerProps || $[103] !== footerRef || $[104] !== hasFooter || $[105] !== hasScroll || $[106] !== isPlaceholder || $[107] !== isPreview || $[108] !== scrolledBottom || $[109] !== spacing || $[110] !== viewerBottomHeight || $[111] !== viewerBottomSidesWidth) {
1344
+ t58 = !isPlaceholder && hasFooter ? /*#__PURE__*/jsx("div", {
1345
+ ref: footerRef,
1346
+ className: classNames([styles$2.footer, {
1347
+ [styles$2.disabled]: !scrolledBottom && hasScroll
1348
+ }]),
1349
+ style: {
1350
+ transform: current && !isPreview ? `translate(0, -${viewerBottomHeight}px)` : null,
1351
+ paddingLeft: Math.max(spacing / 2, viewerBottomSidesWidth),
1352
+ paddingRight: Math.max(spacing / 2, viewerBottomSidesWidth),
1353
+ paddingTop: spacing / 2,
1354
+ paddingBottom: spacing / 2
1355
+ },
1356
+ children: /*#__PURE__*/jsx(Footer, {
1357
+ ...footerProps
1358
+ })
1359
+ }) : null;
1360
+ $[101] = current;
1361
+ $[102] = footerProps;
1362
+ $[103] = footerRef;
1363
+ $[104] = hasFooter;
1364
+ $[105] = hasScroll;
1365
+ $[106] = isPlaceholder;
1366
+ $[107] = isPreview;
1367
+ $[108] = scrolledBottom;
1368
+ $[109] = spacing;
1369
+ $[110] = viewerBottomHeight;
1370
+ $[111] = viewerBottomSidesWidth;
1371
+ $[112] = t58;
1372
+ } else {
1373
+ t58 = $[112];
1374
+ }
1375
+ let t59;
1376
+ if ($[113] !== height || $[114] !== t52 || $[115] !== t57 || $[116] !== t58 || $[117] !== width) {
1377
+ t59 = /*#__PURE__*/jsxs(Container, {
824
1378
  width: width,
825
1379
  height: height,
826
1380
  className: styles$2.content,
827
- children: [showReset ? /*#__PURE__*/jsx(Button, {
828
- className: styles$2.reset,
829
- icon: /*#__PURE__*/jsx(FontAwesomeIcon, {
830
- icon: faRedo,
831
- size: "md"
832
- }),
833
- onClick: onQuizReset
834
- }) : null, /*#__PURE__*/jsxs(Scroll, {
835
- verticalAlign: verticalAlign
836
- // disabled={scrollingDisabled || userAnswerIndex !== null}
837
- ,
838
- disabled: scrollingDisabled,
839
- onScrolledTrigger: onScrolledTrigger,
840
- onScrolledBottom: onScrolledBottom,
841
- onScrolledNotBottom: onScrolledNotBottom,
842
- onScrollHeightChange: onScrollHeightChange,
843
- withShadow: true,
844
- children: [!isPlaceholder && hasHeader ? /*#__PURE__*/jsx("div", {
845
- className: classNames([styles$2.header, _defineProperty({}, styles$2.disabled, userAnswerIndex !== null || scrolledBottom && !scrollingDisabled && hasScroll)]),
846
- ref: headerRef,
847
- style: {
848
- paddingTop: spacing / 2,
849
- paddingLeft: spacing,
850
- paddingRight: spacing,
851
- paddingBottom: spacing,
852
- transform: !isPreview ? "translate(0, ".concat(viewerTopHeight, "px)") : null
853
- },
854
- children: /*#__PURE__*/jsx(Header, _objectSpread({}, header))
855
- }) : null, /*#__PURE__*/jsx(Question, {
856
- question: question,
857
- answers: answers,
858
- keypadLayout: keypadLayout,
859
- result: result,
860
- resultImage: resultImage,
861
- answeredIndex: userAnswerIndex,
862
- buttonsLayout: buttonsLayout,
863
- buttonsStyle: buttonsStyle,
864
- buttonsTextStyle: buttonsTextStyle,
865
- inactiveButtonsStyle: inactiveButtonsStyle,
866
- inactiveButtonsTextStyle: inactiveButtonsTextStyle,
867
- feedbackTextStyle: feedbackTextStyle,
868
- numbersTextStyle: numbersTextStyle,
869
- goodAnswerColor: goodAnswerColor,
870
- badAnswerColor: badAnswerColor,
871
- withoutTrueFalse: withoutTrueFalse,
872
- withoutGoodAnswer: withoutGoodAnswer,
873
- focusable: current && isView,
874
- animated: isView,
875
- showInstantAnswer: showInstantAnswer,
876
- withResult: true,
877
- layout: layout,
878
- transitions: transitions,
879
- transitionPlaying: transitionPlaying,
880
- transitionStagger: transitionStagger,
881
- transitionDisabled: transitionDisabled,
882
- onAnswerClick: onAnswerClick,
883
- className: styles$2.question,
884
- style: !isPlaceholder ? {
885
- paddingLeft: spacing,
886
- paddingRight: spacing,
887
- paddingTop: (!isPreview ? viewerTopHeight : 0) + (headerHeight || spacing),
888
- paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + (footerHeight || spacing)
889
- } : null
890
- })]
891
- }), !isPlaceholder && hasFooter ? /*#__PURE__*/jsx("div", {
892
- ref: footerRef,
893
- className: classNames([styles$2.footer, _defineProperty({}, styles$2.disabled, !scrolledBottom && hasScroll)]),
894
- style: {
895
- transform: current && !isPreview ? "translate(0, -".concat(viewerBottomHeight, "px)") : null,
896
- paddingLeft: Math.max(spacing / 2, viewerBottomSidesWidth),
897
- paddingRight: Math.max(spacing / 2, viewerBottomSidesWidth),
898
- paddingTop: spacing / 2,
899
- paddingBottom: spacing / 2
900
- },
901
- children: /*#__PURE__*/jsx(Footer, _objectSpread({}, footerProps))
902
- }) : null]
903
- }), !isPlaceholder ? /*#__PURE__*/jsx(Background, {
1381
+ children: [t52, t57, t58]
1382
+ });
1383
+ $[113] = height;
1384
+ $[114] = t52;
1385
+ $[115] = t57;
1386
+ $[116] = t58;
1387
+ $[117] = width;
1388
+ $[118] = t59;
1389
+ } else {
1390
+ t59 = $[118];
1391
+ }
1392
+ let t60;
1393
+ if ($[119] !== background || $[120] !== backgroundPlaying || $[121] !== customMediaRef || $[122] !== height || $[123] !== isPlaceholder || $[124] !== isPreview || $[125] !== mediaRef || $[126] !== mediaShouldLoad || $[127] !== muted || $[128] !== resolution || $[129] !== width) {
1394
+ t60 = !isPlaceholder ? /*#__PURE__*/jsx(Background, {
904
1395
  background: background,
905
1396
  width: width,
906
1397
  height: height,
@@ -911,447 +1402,703 @@ function QuizScreen(_ref) {
911
1402
  mediaRef: mergeRefs(mediaRef, customMediaRef),
912
1403
  withoutVideo: isPreview,
913
1404
  className: styles$2.background
914
- }) : null]
915
- });
1405
+ }) : null;
1406
+ $[119] = background;
1407
+ $[120] = backgroundPlaying;
1408
+ $[121] = customMediaRef;
1409
+ $[122] = height;
1410
+ $[123] = isPlaceholder;
1411
+ $[124] = isPreview;
1412
+ $[125] = mediaRef;
1413
+ $[126] = mediaShouldLoad;
1414
+ $[127] = muted;
1415
+ $[128] = resolution;
1416
+ $[129] = width;
1417
+ $[130] = t60;
1418
+ } else {
1419
+ t60 = $[130];
1420
+ }
1421
+ let t61;
1422
+ if ($[131] !== t51 || $[132] !== t59 || $[133] !== t60) {
1423
+ t61 = /*#__PURE__*/jsxs("div", {
1424
+ className: t51,
1425
+ "data-screen-ready": true,
1426
+ children: [t59, t60]
1427
+ });
1428
+ $[131] = t51;
1429
+ $[132] = t59;
1430
+ $[133] = t60;
1431
+ $[134] = t61;
1432
+ } else {
1433
+ t61 = $[134];
1434
+ }
1435
+ return t61;
1436
+ }
1437
+ function _temp(answer) {
1438
+ return answer !== null && answer.good;
916
1439
  }
917
1440
 
918
1441
  var styles$1 = {"container":"micromag-screen-quiz-results-container","title":"micromag-screen-quiz-results-title","emptyTitle":"micromag-screen-quiz-results-emptyTitle","emptyDescription":"micromag-screen-quiz-results-emptyDescription"};
919
1442
 
920
- function Results(_ref) {
921
- var _ref$layout = _ref.layout,
922
- layout = _ref$layout === void 0 ? null : _ref$layout,
923
- _ref$title = _ref.title,
924
- title = _ref$title === void 0 ? null : _ref$title,
925
- _ref$description = _ref.description,
926
- description = _ref$description === void 0 ? null : _ref$description,
927
- _ref$resultsHeadingSt = _ref.resultsHeadingStyle,
928
- resultsHeadingStyle = _ref$resultsHeadingSt === void 0 ? null : _ref$resultsHeadingSt,
929
- _ref$resultsTextStyle = _ref.resultsTextStyle,
930
- resultsTextStyle = _ref$resultsTextStyle === void 0 ? null : _ref$resultsTextStyle,
931
- _ref$transitions = _ref.transitions,
932
- transitions = _ref$transitions === void 0 ? null : _ref$transitions,
933
- _ref$transitionPlayin = _ref.transitionPlaying,
934
- transitionPlaying = _ref$transitionPlayin === void 0 ? false : _ref$transitionPlayin,
935
- _ref$transitionStagge = _ref.transitionStagger,
936
- transitionStagger = _ref$transitionStagge === void 0 ? 100 : _ref$transitionStagge,
937
- _ref$transitionDisabl = _ref.transitionDisabled,
938
- transitionDisabled = _ref$transitionDisabl === void 0 ? false : _ref$transitionDisabl,
939
- _ref$className = _ref.className,
940
- className = _ref$className === void 0 ? null : _ref$className,
941
- _ref$style = _ref.style,
942
- style = _ref$style === void 0 ? null : _ref$style;
943
- var isSplitted = layout === 'split';
944
- var verticalAlign = isSplitted ? null : layout;
945
- var hasTitle = isTextFilled(title);
946
- var _ref2 = title || {},
947
- _ref2$textStyle = _ref2.textStyle,
948
- titleTextStyle = _ref2$textStyle === void 0 ? null : _ref2$textStyle;
949
- var hasDescription = isTextFilled(description);
950
- var _ref3 = description || {},
951
- _ref3$textStyle = _ref3.textStyle,
952
- descriptionTextStyle = _ref3$textStyle === void 0 ? null : _ref3$textStyle;
953
- return /*#__PURE__*/jsx(Layout, {
954
- className: classNames([styles$1.container, className]),
955
- fullscreen: true,
956
- verticalAlign: verticalAlign,
957
- style: style,
958
- children: [/*#__PURE__*/jsx(ScreenElement, {
1443
+ function Results(t0) {
1444
+ const $ = c(46);
1445
+ const {
1446
+ layout: t1,
1447
+ title: t2,
1448
+ description: t3,
1449
+ resultsHeadingStyle: t4,
1450
+ resultsTextStyle: t5,
1451
+ transitions: t6,
1452
+ transitionPlaying: t7,
1453
+ transitionStagger: t8,
1454
+ transitionDisabled: t9,
1455
+ className: t10,
1456
+ style: t11
1457
+ } = t0;
1458
+ const layout = t1 === undefined ? null : t1;
1459
+ const title = t2 === undefined ? null : t2;
1460
+ const description = t3 === undefined ? null : t3;
1461
+ const resultsHeadingStyle = t4 === undefined ? null : t4;
1462
+ const resultsTextStyle = t5 === undefined ? null : t5;
1463
+ const transitions = t6 === undefined ? null : t6;
1464
+ const transitionPlaying = t7 === undefined ? false : t7;
1465
+ const transitionStagger = t8 === undefined ? 100 : t8;
1466
+ const transitionDisabled = t9 === undefined ? false : t9;
1467
+ const className = t10 === undefined ? null : t10;
1468
+ const style = t11 === undefined ? null : t11;
1469
+ const isSplitted = layout === "split";
1470
+ const verticalAlign = isSplitted ? null : layout;
1471
+ let t12;
1472
+ if ($[0] !== title) {
1473
+ t12 = isTextFilled(title);
1474
+ $[0] = title;
1475
+ $[1] = t12;
1476
+ } else {
1477
+ t12 = $[1];
1478
+ }
1479
+ const hasTitle = t12;
1480
+ let t13;
1481
+ if ($[2] !== title) {
1482
+ t13 = title || {};
1483
+ $[2] = title;
1484
+ $[3] = t13;
1485
+ } else {
1486
+ t13 = $[3];
1487
+ }
1488
+ const {
1489
+ textStyle: t14
1490
+ } = t13;
1491
+ const titleTextStyle = t14 === undefined ? null : t14;
1492
+ let t15;
1493
+ if ($[4] !== description) {
1494
+ t15 = isTextFilled(description);
1495
+ $[4] = description;
1496
+ $[5] = t15;
1497
+ } else {
1498
+ t15 = $[5];
1499
+ }
1500
+ const hasDescription = t15;
1501
+ let t16;
1502
+ if ($[6] !== description) {
1503
+ t16 = description || {};
1504
+ $[6] = description;
1505
+ $[7] = t16;
1506
+ } else {
1507
+ t16 = $[7];
1508
+ }
1509
+ const {
1510
+ textStyle: t17
1511
+ } = t16;
1512
+ const descriptionTextStyle = t17 === undefined ? null : t17;
1513
+ let t18;
1514
+ if ($[8] !== className) {
1515
+ t18 = classNames([styles$1.container, className]);
1516
+ $[8] = className;
1517
+ $[9] = t18;
1518
+ } else {
1519
+ t18 = $[9];
1520
+ }
1521
+ let t19;
1522
+ if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
1523
+ t19 = /*#__PURE__*/jsx(FormattedMessage, {
1524
+ id: "BSTWf8",
1525
+ defaultMessage: "Title"
1526
+ });
1527
+ $[10] = t19;
1528
+ } else {
1529
+ t19 = $[10];
1530
+ }
1531
+ const t20 = !hasTitle;
1532
+ let t21;
1533
+ if ($[11] !== hasTitle || $[12] !== resultsHeadingStyle || $[13] !== title || $[14] !== titleTextStyle || $[15] !== transitionDisabled || $[16] !== transitionPlaying || $[17] !== transitions) {
1534
+ t21 = hasTitle ? /*#__PURE__*/jsx(Transitions, {
1535
+ transitions: transitions,
1536
+ playing: transitionPlaying,
1537
+ disabled: transitionDisabled,
1538
+ children: /*#__PURE__*/jsx(Heading, {
1539
+ ...title,
1540
+ className: styles$1.title,
1541
+ textStyle: {
1542
+ ...resultsHeadingStyle,
1543
+ ...titleTextStyle
1544
+ }
1545
+ })
1546
+ }) : null;
1547
+ $[11] = hasTitle;
1548
+ $[12] = resultsHeadingStyle;
1549
+ $[13] = title;
1550
+ $[14] = titleTextStyle;
1551
+ $[15] = transitionDisabled;
1552
+ $[16] = transitionPlaying;
1553
+ $[17] = transitions;
1554
+ $[18] = t21;
1555
+ } else {
1556
+ t21 = $[18];
1557
+ }
1558
+ let t22;
1559
+ if ($[19] !== t20 || $[20] !== t21) {
1560
+ t22 = /*#__PURE__*/jsx(ScreenElement, {
959
1561
  placeholder: "title",
960
- emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
961
- id: "BSTWf8",
962
- defaultMessage: [{
963
- "type": 0,
964
- "value": "Title"
965
- }]
966
- }),
1562
+ emptyLabel: t19,
967
1563
  emptyClassName: styles$1.emptyTitle,
968
- isEmpty: !hasTitle,
969
- children: hasTitle ? /*#__PURE__*/jsx(Transitions, {
970
- transitions: transitions,
971
- playing: transitionPlaying,
972
- disabled: transitionDisabled,
973
- children: /*#__PURE__*/jsx(Heading, _objectSpread(_objectSpread({}, title), {}, {
974
- className: styles$1.title,
975
- textStyle: _objectSpread(_objectSpread({}, resultsHeadingStyle), titleTextStyle)
976
- }))
977
- }) : null
978
- }, "title"), isSplitted ? /*#__PURE__*/jsx(Spacer, {}, "spacer") : null, /*#__PURE__*/jsx(ScreenElement, {
1564
+ isEmpty: t20,
1565
+ children: t21
1566
+ }, "title");
1567
+ $[19] = t20;
1568
+ $[20] = t21;
1569
+ $[21] = t22;
1570
+ } else {
1571
+ t22 = $[21];
1572
+ }
1573
+ let t23;
1574
+ if ($[22] !== isSplitted) {
1575
+ t23 = isSplitted ? /*#__PURE__*/jsx(Spacer, {}, "spacer") : null;
1576
+ $[22] = isSplitted;
1577
+ $[23] = t23;
1578
+ } else {
1579
+ t23 = $[23];
1580
+ }
1581
+ let t24;
1582
+ if ($[24] === Symbol.for("react.memo_cache_sentinel")) {
1583
+ t24 = /*#__PURE__*/jsx(FormattedMessage, {
1584
+ id: "hoDz0O",
1585
+ defaultMessage: "Description"
1586
+ });
1587
+ $[24] = t24;
1588
+ } else {
1589
+ t24 = $[24];
1590
+ }
1591
+ const t25 = !hasDescription;
1592
+ let t26;
1593
+ if ($[25] !== description || $[26] !== descriptionTextStyle || $[27] !== hasTitle || $[28] !== resultsTextStyle || $[29] !== transitionDisabled || $[30] !== transitionPlaying || $[31] !== transitionStagger || $[32] !== transitions) {
1594
+ t26 = hasTitle ? /*#__PURE__*/jsx(Transitions, {
1595
+ transitions: transitions,
1596
+ playing: transitionPlaying,
1597
+ disabled: transitionDisabled,
1598
+ delay: transitionStagger,
1599
+ children: /*#__PURE__*/jsx(Text, {
1600
+ ...description,
1601
+ className: styles$1.description,
1602
+ textStyle: {
1603
+ ...resultsTextStyle,
1604
+ ...descriptionTextStyle
1605
+ }
1606
+ })
1607
+ }) : null;
1608
+ $[25] = description;
1609
+ $[26] = descriptionTextStyle;
1610
+ $[27] = hasTitle;
1611
+ $[28] = resultsTextStyle;
1612
+ $[29] = transitionDisabled;
1613
+ $[30] = transitionPlaying;
1614
+ $[31] = transitionStagger;
1615
+ $[32] = transitions;
1616
+ $[33] = t26;
1617
+ } else {
1618
+ t26 = $[33];
1619
+ }
1620
+ let t27;
1621
+ if ($[34] !== t25 || $[35] !== t26) {
1622
+ t27 = /*#__PURE__*/jsx(ScreenElement, {
979
1623
  placeholder: "text",
980
- emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
981
- id: "hoDz0O",
982
- defaultMessage: [{
983
- "type": 0,
984
- "value": "Description"
985
- }]
986
- }),
1624
+ emptyLabel: t24,
987
1625
  emptyClassName: styles$1.emptyDescription,
988
- isEmpty: !hasDescription,
989
- children: hasTitle ? /*#__PURE__*/jsx(Transitions, {
990
- transitions: transitions,
991
- playing: transitionPlaying,
992
- disabled: transitionDisabled,
993
- delay: transitionStagger,
994
- children: /*#__PURE__*/jsx(Text, _objectSpread(_objectSpread({}, description), {}, {
995
- className: styles$1.description,
996
- textStyle: _objectSpread(_objectSpread({}, resultsTextStyle), descriptionTextStyle)
997
- }))
998
- }) : null
999
- }, "description")]
1000
- });
1626
+ isEmpty: t25,
1627
+ children: t26
1628
+ }, "description");
1629
+ $[34] = t25;
1630
+ $[35] = t26;
1631
+ $[36] = t27;
1632
+ } else {
1633
+ t27 = $[36];
1634
+ }
1635
+ let t28;
1636
+ if ($[37] !== t22 || $[38] !== t23 || $[39] !== t27) {
1637
+ t28 = [t22, t23, t27];
1638
+ $[37] = t22;
1639
+ $[38] = t23;
1640
+ $[39] = t27;
1641
+ $[40] = t28;
1642
+ } else {
1643
+ t28 = $[40];
1644
+ }
1645
+ let t29;
1646
+ if ($[41] !== style || $[42] !== t18 || $[43] !== t28 || $[44] !== verticalAlign) {
1647
+ t29 = /*#__PURE__*/jsx(Layout, {
1648
+ className: t18,
1649
+ fullscreen: true,
1650
+ verticalAlign: verticalAlign,
1651
+ style: style,
1652
+ children: t28
1653
+ });
1654
+ $[41] = style;
1655
+ $[42] = t18;
1656
+ $[43] = t28;
1657
+ $[44] = verticalAlign;
1658
+ $[45] = t29;
1659
+ } else {
1660
+ t29 = $[45];
1661
+ }
1662
+ return t29;
1001
1663
  }
1002
1664
 
1003
1665
  var styles = {"container":"micromag-screen-quiz-title-container","title":"micromag-screen-quiz-title-title","description":"micromag-screen-quiz-title-description","emptyTitle":"micromag-screen-quiz-title-emptyTitle","emptyDescription":"micromag-screen-quiz-title-emptyDescription"};
1004
1666
 
1005
- function Title(_ref) {
1006
- var _ref$layout = _ref.layout,
1007
- layout = _ref$layout === void 0 ? null : _ref$layout,
1008
- _ref$title = _ref.title,
1009
- title = _ref$title === void 0 ? null : _ref$title,
1010
- _ref$description = _ref.description,
1011
- description = _ref$description === void 0 ? null : _ref$description,
1012
- _ref$button = _ref.button,
1013
- button = _ref$button === void 0 ? null : _ref$button,
1014
- _ref$buttonDisabled = _ref.buttonDisabled,
1015
- buttonDisabled = _ref$buttonDisabled === void 0 ? false : _ref$buttonDisabled,
1016
- _ref$focusable = _ref.focusable,
1017
- focusable = _ref$focusable === void 0 ? false : _ref$focusable,
1018
- _ref$className = _ref.className,
1019
- className = _ref$className === void 0 ? null : _ref$className,
1020
- _ref$style = _ref.style,
1021
- style = _ref$style === void 0 ? null : _ref$style,
1022
- _ref$onClickButton = _ref.onClickButton,
1023
- onClickButton = _ref$onClickButton === void 0 ? null : _ref$onClickButton;
1024
- // const { isPreview, isEdit } = useScreenRenderContext();
1025
- var isSplitted = layout === 'split';
1026
- var verticalAlign = isSplitted ? null : layout;
1027
- var hasTitle = isTextFilled(title);
1028
- var hasDescription = isTextFilled(description);
1029
- var hasButton = isTextFilled(button);
1030
- return /*#__PURE__*/jsx(Layout, {
1031
- className: classNames([styles.container, className]),
1032
- fullscreen: true,
1033
- verticalAlign: verticalAlign,
1034
- style: style,
1035
- children: [/*#__PURE__*/jsx(ScreenElement, {
1667
+ function Title(t0) {
1668
+ const $ = c(43);
1669
+ const {
1670
+ layout: t1,
1671
+ title: t2,
1672
+ description: t3,
1673
+ button: t4,
1674
+ buttonDisabled: t5,
1675
+ focusable: t6,
1676
+ className: t7,
1677
+ style: t8,
1678
+ onClickButton: t9
1679
+ } = t0;
1680
+ const layout = t1 === undefined ? null : t1;
1681
+ const title = t2 === undefined ? null : t2;
1682
+ const description = t3 === undefined ? null : t3;
1683
+ const button = t4 === undefined ? null : t4;
1684
+ const buttonDisabled = t5 === undefined ? false : t5;
1685
+ const focusable = t6 === undefined ? false : t6;
1686
+ const className = t7 === undefined ? null : t7;
1687
+ const style = t8 === undefined ? null : t8;
1688
+ const onClickButton = t9 === undefined ? null : t9;
1689
+ const isSplitted = layout === "split";
1690
+ const verticalAlign = isSplitted ? null : layout;
1691
+ let t10;
1692
+ if ($[0] !== title) {
1693
+ t10 = isTextFilled(title);
1694
+ $[0] = title;
1695
+ $[1] = t10;
1696
+ } else {
1697
+ t10 = $[1];
1698
+ }
1699
+ const hasTitle = t10;
1700
+ let t11;
1701
+ if ($[2] !== description) {
1702
+ t11 = isTextFilled(description);
1703
+ $[2] = description;
1704
+ $[3] = t11;
1705
+ } else {
1706
+ t11 = $[3];
1707
+ }
1708
+ const hasDescription = t11;
1709
+ let t12;
1710
+ if ($[4] !== button) {
1711
+ t12 = isTextFilled(button);
1712
+ $[4] = button;
1713
+ $[5] = t12;
1714
+ } else {
1715
+ t12 = $[5];
1716
+ }
1717
+ const hasButton = t12;
1718
+ let t13;
1719
+ if ($[6] !== className) {
1720
+ t13 = classNames([styles.container, className]);
1721
+ $[6] = className;
1722
+ $[7] = t13;
1723
+ } else {
1724
+ t13 = $[7];
1725
+ }
1726
+ let t14;
1727
+ if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
1728
+ t14 = /*#__PURE__*/jsx(FormattedMessage, {
1729
+ id: "BSTWf8",
1730
+ defaultMessage: "Title"
1731
+ });
1732
+ $[8] = t14;
1733
+ } else {
1734
+ t14 = $[8];
1735
+ }
1736
+ const t15 = !hasTitle;
1737
+ let t16;
1738
+ if ($[9] !== hasTitle || $[10] !== title) {
1739
+ t16 = hasTitle ? /*#__PURE__*/jsx(Heading, {
1740
+ ...title,
1741
+ className: styles.title
1742
+ }) : null;
1743
+ $[9] = hasTitle;
1744
+ $[10] = title;
1745
+ $[11] = t16;
1746
+ } else {
1747
+ t16 = $[11];
1748
+ }
1749
+ let t17;
1750
+ if ($[12] !== t15 || $[13] !== t16) {
1751
+ t17 = /*#__PURE__*/jsx(ScreenElement, {
1036
1752
  placeholder: "title",
1037
- emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
1038
- id: "BSTWf8",
1039
- defaultMessage: [{
1040
- "type": 0,
1041
- "value": "Title"
1042
- }]
1043
- }),
1753
+ emptyLabel: t14,
1044
1754
  emptyClassName: styles.emptyTitle,
1045
- isEmpty: !hasTitle,
1046
- children: hasTitle ? /*#__PURE__*/jsx(Heading, _objectSpread(_objectSpread({}, title), {}, {
1047
- className: styles.title
1048
- })) : null
1049
- }, "title"), /*#__PURE__*/jsx(ScreenElement, {
1755
+ isEmpty: t15,
1756
+ children: t16
1757
+ }, "title");
1758
+ $[12] = t15;
1759
+ $[13] = t16;
1760
+ $[14] = t17;
1761
+ } else {
1762
+ t17 = $[14];
1763
+ }
1764
+ let t18;
1765
+ if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
1766
+ t18 = /*#__PURE__*/jsx(FormattedMessage, {
1767
+ id: "hoDz0O",
1768
+ defaultMessage: "Description"
1769
+ });
1770
+ $[15] = t18;
1771
+ } else {
1772
+ t18 = $[15];
1773
+ }
1774
+ const t19 = !hasDescription;
1775
+ let t20;
1776
+ if ($[16] !== description || $[17] !== hasDescription) {
1777
+ t20 = hasDescription ? /*#__PURE__*/jsx(Text, {
1778
+ ...description,
1779
+ className: styles.description
1780
+ }) : null;
1781
+ $[16] = description;
1782
+ $[17] = hasDescription;
1783
+ $[18] = t20;
1784
+ } else {
1785
+ t20 = $[18];
1786
+ }
1787
+ let t21;
1788
+ if ($[19] !== t19 || $[20] !== t20) {
1789
+ t21 = /*#__PURE__*/jsx(ScreenElement, {
1050
1790
  placeholder: "text",
1051
- emptyLabel: /*#__PURE__*/jsx(FormattedMessage, {
1052
- id: "hoDz0O",
1053
- defaultMessage: [{
1054
- "type": 0,
1055
- "value": "Description"
1056
- }]
1057
- }),
1791
+ emptyLabel: t18,
1058
1792
  emptyClassName: styles.emptyDescription,
1059
- isEmpty: !hasDescription,
1060
- children: hasDescription ? /*#__PURE__*/jsx(Text, _objectSpread(_objectSpread({}, description), {}, {
1061
- className: styles.description
1062
- })) : null
1063
- }, "description"), isSplitted ? /*#__PURE__*/jsx(Spacer, {}, "spacer") : null, /*#__PURE__*/jsx(ScreenElement, {
1793
+ isEmpty: t19,
1794
+ children: t20
1795
+ }, "description");
1796
+ $[19] = t19;
1797
+ $[20] = t20;
1798
+ $[21] = t21;
1799
+ } else {
1800
+ t21 = $[21];
1801
+ }
1802
+ let t22;
1803
+ if ($[22] !== isSplitted) {
1804
+ t22 = isSplitted ? /*#__PURE__*/jsx(Spacer, {}, "spacer") : null;
1805
+ $[22] = isSplitted;
1806
+ $[23] = t22;
1807
+ } else {
1808
+ t22 = $[23];
1809
+ }
1810
+ const t23 = button !== null ? button.buttonStyle : null;
1811
+ let t24;
1812
+ if ($[24] !== button || $[25] !== hasButton) {
1813
+ t24 = hasButton ? /*#__PURE__*/jsx(Text, {
1814
+ ...button,
1815
+ className: styles.label
1816
+ }) : /*#__PURE__*/jsx(FormattedMessage, {
1817
+ id: "D7LIZQ",
1818
+ defaultMessage: "Start"
1819
+ });
1820
+ $[24] = button;
1821
+ $[25] = hasButton;
1822
+ $[26] = t24;
1823
+ } else {
1824
+ t24 = $[26];
1825
+ }
1826
+ let t25;
1827
+ if ($[27] !== buttonDisabled || $[28] !== focusable || $[29] !== onClickButton || $[30] !== t23 || $[31] !== t24) {
1828
+ t25 = /*#__PURE__*/jsx(ScreenElement, {
1064
1829
  placeholder: "button",
1065
1830
  children: /*#__PURE__*/jsx(Button$1, {
1066
1831
  disabled: buttonDisabled,
1067
1832
  focusable: focusable,
1068
- buttonStyle: button !== null ? button.buttonStyle : null,
1833
+ buttonStyle: t23,
1069
1834
  className: styles.button,
1070
1835
  onClick: onClickButton,
1071
- children: hasButton ? /*#__PURE__*/jsx(Text, _objectSpread(_objectSpread({}, button), {}, {
1072
- className: styles.label
1073
- })) : /*#__PURE__*/jsx(FormattedMessage, {
1074
- id: "D7LIZQ",
1075
- defaultMessage: [{
1076
- "type": 0,
1077
- "value": "Start"
1078
- }]
1079
- })
1836
+ children: t24
1080
1837
  })
1081
- }, "button")]
1082
- });
1838
+ }, "button");
1839
+ $[27] = buttonDisabled;
1840
+ $[28] = focusable;
1841
+ $[29] = onClickButton;
1842
+ $[30] = t23;
1843
+ $[31] = t24;
1844
+ $[32] = t25;
1845
+ } else {
1846
+ t25 = $[32];
1847
+ }
1848
+ let t26;
1849
+ if ($[33] !== t17 || $[34] !== t21 || $[35] !== t22 || $[36] !== t25) {
1850
+ t26 = [t17, t21, t22, t25];
1851
+ $[33] = t17;
1852
+ $[34] = t21;
1853
+ $[35] = t22;
1854
+ $[36] = t25;
1855
+ $[37] = t26;
1856
+ } else {
1857
+ t26 = $[37];
1858
+ }
1859
+ let t27;
1860
+ if ($[38] !== style || $[39] !== t13 || $[40] !== t26 || $[41] !== verticalAlign) {
1861
+ t27 = /*#__PURE__*/jsx(Layout, {
1862
+ className: t13,
1863
+ fullscreen: true,
1864
+ verticalAlign: verticalAlign,
1865
+ style: style,
1866
+ children: t26
1867
+ });
1868
+ $[38] = style;
1869
+ $[39] = t13;
1870
+ $[40] = t26;
1871
+ $[41] = verticalAlign;
1872
+ $[42] = t27;
1873
+ } else {
1874
+ t27 = $[42];
1875
+ }
1876
+ return t27;
1083
1877
  }
1084
1878
 
1085
- function QuizMultipleScreen(_ref) {
1086
- var _ref$id = _ref.id,
1087
- id = _ref$id === void 0 ? null : _ref$id,
1088
- _ref$layout = _ref.layout,
1089
- layout = _ref$layout === void 0 ? 'middle' : _ref$layout,
1090
- _ref$introLayout = _ref.introLayout,
1091
- introLayout = _ref$introLayout === void 0 ? null : _ref$introLayout,
1092
- _ref$title = _ref.title,
1093
- title = _ref$title === void 0 ? null : _ref$title,
1094
- _ref$description = _ref.description,
1095
- description = _ref$description === void 0 ? null : _ref$description,
1096
- _ref$questions = _ref.questions,
1097
- questions = _ref$questions === void 0 ? null : _ref$questions,
1098
- _ref$results = _ref.results,
1099
- results = _ref$results === void 0 ? null : _ref$results,
1100
- _ref$buttonsStyle = _ref.buttonsStyle,
1101
- buttonsStyle = _ref$buttonsStyle === void 0 ? null : _ref$buttonsStyle,
1102
- _ref$inactiveButtonsS = _ref.inactiveButtonsStyle,
1103
- inactiveButtonsStyle = _ref$inactiveButtonsS === void 0 ? null : _ref$inactiveButtonsS,
1104
- _ref$buttonsTextStyle = _ref.buttonsTextStyle,
1105
- buttonsTextStyle = _ref$buttonsTextStyle === void 0 ? null : _ref$buttonsTextStyle,
1106
- _ref$inactiveButtonsT = _ref.inactiveButtonsTextStyle,
1107
- inactiveButtonsTextStyle = _ref$inactiveButtonsT === void 0 ? null : _ref$inactiveButtonsT,
1108
- _ref$questionsHeading = _ref.questionsHeadingStyle,
1109
- questionsHeadingStyle = _ref$questionsHeading === void 0 ? null : _ref$questionsHeading,
1110
- _ref$resultsHeadingSt = _ref.resultsHeadingStyle,
1111
- resultsHeadingStyle = _ref$resultsHeadingSt === void 0 ? null : _ref$resultsHeadingSt,
1112
- _ref$resultsTextStyle = _ref.resultsTextStyle,
1113
- resultsTextStyle = _ref$resultsTextStyle === void 0 ? null : _ref$resultsTextStyle,
1114
- _ref$feedbackTextStyl = _ref.feedbackTextStyle,
1115
- feedbackTextStyle = _ref$feedbackTextStyl === void 0 ? null : _ref$feedbackTextStyl,
1116
- _ref$numbersTextStyle = _ref.numbersTextStyle,
1117
- numbersTextStyle = _ref$numbersTextStyle === void 0 ? null : _ref$numbersTextStyle,
1118
- _ref$goodAnswerColor = _ref.goodAnswerColor,
1119
- goodAnswerColor = _ref$goodAnswerColor === void 0 ? null : _ref$goodAnswerColor,
1120
- _ref$badAnswerColor = _ref.badAnswerColor,
1121
- badAnswerColor = _ref$badAnswerColor === void 0 ? null : _ref$badAnswerColor,
1122
- _ref$spacing = _ref.spacing,
1123
- spacing = _ref$spacing === void 0 ? 20 : _ref$spacing,
1124
- _ref$background = _ref.background,
1125
- background = _ref$background === void 0 ? null : _ref$background,
1126
- _ref$introBackground = _ref.introBackground,
1127
- introBackground = _ref$introBackground === void 0 ? null : _ref$introBackground,
1128
- _ref$introButton = _ref.introButton,
1129
- introButton = _ref$introButton === void 0 ? null : _ref$introButton,
1130
- _ref$nextButton = _ref.nextButton,
1131
- nextButton = _ref$nextButton === void 0 ? null : _ref$nextButton,
1132
- _ref$header = _ref.header,
1133
- header = _ref$header === void 0 ? null : _ref$header,
1134
- _ref$footer = _ref.footer,
1135
- footer = _ref$footer === void 0 ? null : _ref$footer,
1136
- _ref$current = _ref.current,
1137
- current = _ref$current === void 0 ? true : _ref$current,
1138
- _ref$active = _ref.active,
1139
- active = _ref$active === void 0 ? true : _ref$active,
1140
- _ref$transitions = _ref.transitions,
1141
- transitions = _ref$transitions === void 0 ? null : _ref$transitions,
1142
- _ref$transitionStagge = _ref.transitionStagger,
1143
- transitionStagger = _ref$transitionStagge === void 0 ? 100 : _ref$transitionStagge,
1144
- _ref$type = _ref.type,
1145
- type = _ref$type === void 0 ? null : _ref$type,
1146
- _ref$mediaRef = _ref.mediaRef,
1147
- customMediaRef = _ref$mediaRef === void 0 ? null : _ref$mediaRef,
1148
- _ref$className = _ref.className,
1149
- className = _ref$className === void 0 ? null : _ref$className;
1150
- var screenId = id || 'screen-id';
1151
- var trackScreenEvent = useTrackScreenEvent(type);
1152
- var _useScreenSize = useScreenSize(),
1153
- width = _useScreenSize.width,
1154
- height = _useScreenSize.height,
1155
- resolution = _useScreenSize.resolution;
1156
- var _useViewerContext = useViewerContext(),
1157
- viewerTopHeight = _useViewerContext.topHeight,
1158
- viewerBottomHeight = _useViewerContext.bottomHeight,
1159
- viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
1160
- var _useScreenRenderConte = useScreenRenderContext(),
1161
- isView = _useScreenRenderConte.isView,
1162
- isPreview = _useScreenRenderConte.isPreview,
1163
- isPlaceholder = _useScreenRenderConte.isPlaceholder,
1164
- isEdit = _useScreenRenderConte.isEdit,
1165
- isStatic = _useScreenRenderConte.isStatic,
1166
- isCapture = _useScreenRenderConte.isCapture;
1167
- var _usePlaybackContext = usePlaybackContext(),
1168
- muted = _usePlaybackContext.muted;
1879
+ function QuizMultipleScreen({
1880
+ id = null,
1881
+ layout = 'middle',
1882
+ introLayout = null,
1883
+ title = null,
1884
+ description = null,
1885
+ questions = null,
1886
+ results = null,
1887
+ buttonsStyle = null,
1888
+ inactiveButtonsStyle = null,
1889
+ buttonsTextStyle = null,
1890
+ inactiveButtonsTextStyle = null,
1891
+ questionsHeadingStyle = null,
1892
+ resultsHeadingStyle = null,
1893
+ resultsTextStyle = null,
1894
+ feedbackTextStyle = null,
1895
+ numbersTextStyle = null,
1896
+ goodAnswerColor = null,
1897
+ badAnswerColor = null,
1898
+ spacing = 20,
1899
+ background = null,
1900
+ introBackground = null,
1901
+ introButton = null,
1902
+ nextButton = null,
1903
+ header = null,
1904
+ footer = null,
1905
+ current = true,
1906
+ active = true,
1907
+ transitions = null,
1908
+ transitionStagger = 100,
1909
+ type = null,
1910
+ mediaRef: customMediaRef = null,
1911
+ className = null
1912
+ }) {
1913
+ const screenId = id || 'screen-id';
1914
+ const trackScreenEvent = useTrackScreenEvent(type);
1915
+ const {
1916
+ width,
1917
+ height,
1918
+ resolution
1919
+ } = useScreenSize();
1920
+ const {
1921
+ topHeight: viewerTopHeight,
1922
+ bottomHeight: viewerBottomHeight,
1923
+ bottomSidesWidth: viewerBottomSidesWidth
1924
+ } = useViewerContext();
1925
+ const {
1926
+ isView,
1927
+ isPreview,
1928
+ isPlaceholder,
1929
+ isEdit,
1930
+ isStatic,
1931
+ isCapture
1932
+ } = useScreenRenderContext();
1933
+ const {
1934
+ muted
1935
+ } = usePlaybackContext();
1169
1936
 
1170
1937
  // console.log('isCurrentMedia', isCurrentMedia, mediaRef);
1171
1938
 
1172
- var _useViewerWebView = useViewerWebView(),
1173
- openWebView = _useViewerWebView.open;
1174
- var screenState = useScreenState();
1175
- var _ref2 = screenState !== null ? screenState.split('.') : [],
1176
- _ref3 = _slicedToArray(_ref2, 2),
1177
- _ref3$ = _ref3[0],
1178
- stateId = _ref3$ === void 0 ? null : _ref3$,
1179
- _ref3$2 = _ref3[1],
1180
- stateIndex = _ref3$2 === void 0 ? 0 : _ref3$2;
1181
- var transitionPlaying = current;
1182
- var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
1183
- var hasButtonText = isTextFilled(nextButton);
1939
+ const {
1940
+ open: openWebView
1941
+ } = useViewerWebView();
1942
+ const screenState = useScreenState();
1943
+ const [stateId = null, stateIndex = 0] = screenState !== null ? screenState.split('.') : [];
1944
+ const transitionPlaying = current;
1945
+ const transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
1946
+ const hasButtonText = isTextFilled(nextButton);
1184
1947
 
1185
1948
  // Call to Action
1186
- var hasHeader = isHeaderFilled(header);
1187
- var hasFooter = isFooterFilled(footer);
1188
- var footerProps = getFooterProps(footer, {
1189
- isView: isView,
1190
- current: current,
1191
- openWebView: openWebView,
1192
- isPreview: isPreview
1949
+ const hasHeader = isHeaderFilled(header);
1950
+ const hasFooter = isFooterFilled(footer);
1951
+ const footerProps = getFooterProps(footer, {
1952
+ isView,
1953
+ current,
1954
+ openWebView,
1955
+ isPreview
1193
1956
  });
1194
- var _useDimensionObserver = useDimensionObserver(),
1195
- headerRef = _useDimensionObserver.ref,
1196
- _useDimensionObserver2 = _useDimensionObserver.height,
1197
- headerHeight = _useDimensionObserver2 === void 0 ? 0 : _useDimensionObserver2;
1198
- var _useDimensionObserver3 = useDimensionObserver(),
1199
- footerRef = _useDimensionObserver3.ref,
1200
- _useDimensionObserver4 = _useDimensionObserver3.height,
1201
- callToActionHeight = _useDimensionObserver4 === void 0 ? 0 : _useDimensionObserver4;
1202
- var showInstantAnswer = isStatic || isCapture;
1203
- var hasIntro = title !== null || description !== null || isEdit || stateId === 'intro';
1204
- var _useState = useState(null),
1205
- _useState2 = _slicedToArray(_useState, 2),
1206
- userAnswers = _useState2[0],
1207
- setUserAnswers = _useState2[1];
1208
- var initialQuestionIndex = 'intro';
1957
+ const {
1958
+ ref: headerRef,
1959
+ height: headerHeight = 0
1960
+ } = useDimensionObserver();
1961
+ const {
1962
+ ref: footerRef,
1963
+ height: callToActionHeight = 0
1964
+ } = useDimensionObserver();
1965
+ const showInstantAnswer = isStatic || isCapture;
1966
+ const hasIntro = title !== null || description !== null || isEdit || stateId === 'intro';
1967
+ const [userAnswers, setUserAnswers] = useState(null);
1968
+ let initialQuestionIndex = 'intro';
1209
1969
  if (stateId !== null) {
1210
1970
  initialQuestionIndex = stateId === 'questions' ? parseInt(stateIndex, 10) : stateId;
1211
1971
  } else if (isPlaceholder || !hasIntro) {
1212
1972
  initialQuestionIndex = 0;
1213
1973
  }
1214
- var _useState3 = useState(initialQuestionIndex),
1215
- _useState4 = _slicedToArray(_useState3, 2),
1216
- questionIndex = _useState4[0],
1217
- setQuestionIndex = _useState4[1];
1218
- useEffect(function () {
1974
+ const [questionIndex, setQuestionIndex] = useState(initialQuestionIndex);
1975
+ useEffect(() => {
1219
1976
  if (isPreview && hasIntro && questionIndex !== 'intro') {
1220
1977
  setQuestionIndex('intro');
1221
1978
  }
1222
1979
  }, [isPreview, hasIntro, questionIndex, setQuestionIndex]);
1223
- var onAnswerClick = useCallback(function (answer, answerIndex) {
1224
- setUserAnswers(_objectSpread(_objectSpread({}, userAnswers), {}, _defineProperty({}, questionIndex, answerIndex)));
1225
- trackScreenEvent('click_answer', "Question #".concat(questionIndex + 1, " ").concat(answerIndex + 1, ": ").concat(answer.label.body), {
1980
+ const onAnswerClick = useCallback((answer, answerIndex) => {
1981
+ setUserAnswers({
1982
+ ...userAnswers,
1983
+ [questionIndex]: answerIndex
1984
+ });
1985
+ trackScreenEvent('click_answer', `Question #${questionIndex + 1} ${answerIndex + 1}: ${answer.label.body}`, {
1226
1986
  linkType: 'quiz_answer',
1227
1987
  question: questions[questionIndex],
1228
- questionIndex: questionIndex,
1229
- answer: answer,
1230
- answerIndex: answerIndex
1988
+ questionIndex,
1989
+ answer,
1990
+ answerIndex
1231
1991
  });
1232
1992
  }, [userAnswers, setUserAnswers, trackScreenEvent, questions, questionIndex]);
1233
- var onClickIntroButton = useCallback(function () {
1993
+ const onClickIntroButton = useCallback(() => {
1234
1994
  setQuestionIndex(0);
1235
1995
  }, [setQuestionIndex]);
1236
- useEffect(function () {
1996
+ useEffect(() => {
1237
1997
  if (!current && isEdit && userAnswers !== null) {
1238
1998
  setUserAnswers(null);
1239
1999
  }
1240
2000
  }, [isEdit, current, userAnswers, setUserAnswers]);
1241
- var hasQuestions = questions !== null && questions.length > 0;
1242
- var currentQuestion = hasQuestions ? questions[questionIndex] || {} : {};
1243
- var _ref4 = currentQuestion || {},
1244
- _ref4$text = _ref4.text,
1245
- text = _ref4$text === void 0 ? null : _ref4$text,
1246
- _ref4$answers = _ref4.answers,
1247
- answers = _ref4$answers === void 0 ? [] : _ref4$answers,
1248
- _ref4$background = _ref4.background,
1249
- questionBackground = _ref4$background === void 0 ? null : _ref4$background,
1250
- _ref4$layout = _ref4.layout,
1251
- questionLayout = _ref4$layout === void 0 ? null : _ref4$layout,
1252
- _ref4$keypadLayout = _ref4.keypadLayout,
1253
- keypadLayout = _ref4$keypadLayout === void 0 ? null : _ref4$keypadLayout,
1254
- _ref4$result = _ref4.result,
1255
- questionResult = _ref4$result === void 0 ? null : _ref4$result,
1256
- _ref4$resultImage = _ref4.resultImage,
1257
- questionResultImage = _ref4$resultImage === void 0 ? null : _ref4$resultImage;
1258
- var currentAnsweredIndex = userAnswers !== null && typeof userAnswers[questionIndex] !== 'undefined' ? userAnswers[questionIndex] : null;
1259
- var answer = currentAnsweredIndex !== null && typeof answers[currentAnsweredIndex] !== 'undefined' ? answers[currentAnsweredIndex] : null;
1260
- var _ref5 = answer || {},
1261
- _ref5$result = _ref5.result,
1262
- answerResult = _ref5$result === void 0 ? null : _ref5$result;
1263
- var hasTrueFalse = answers !== null ? (answers || []).find(function (ans) {
1264
- return (ans === null || ans === void 0 ? void 0 : ans.good) === true || (ans === null || ans === void 0 ? void 0 : ans.good) === false;
1265
- }) !== undefined : false;
1266
- var goodAnswerIndex = answers !== null ? answers.findIndex(function (ans) {
1267
- return ans !== null && ans.good === true;
1268
- }) : null;
1269
- var withoutGoodAnswer = goodAnswerIndex === null || goodAnswerIndex === -1;
1270
- var questionResultHasText = isTextFilled(questionResult);
1271
- var questionResultHasImage = isImageFilled(questionResultImage);
1272
- var answerResultHasText = isTextFilled(answerResult);
1273
- var hasResult = questionResultHasText || questionResultHasImage || answerResultHasText;
1274
- var onNextSlide = useCallback(function () {
2001
+ const hasQuestions = questions !== null && questions.length > 0;
2002
+ const currentQuestion = hasQuestions ? questions[questionIndex] || {} : {};
2003
+ const {
2004
+ text = null,
2005
+ answers = [],
2006
+ background: questionBackground = null,
2007
+ layout: questionLayout = null,
2008
+ keypadLayout = null,
2009
+ result: questionResult = null,
2010
+ resultImage: questionResultImage = null
2011
+ } = currentQuestion || {};
2012
+ const currentAnsweredIndex = userAnswers !== null && typeof userAnswers[questionIndex] !== 'undefined' ? userAnswers[questionIndex] : null;
2013
+ const answer_0 = currentAnsweredIndex !== null && typeof answers[currentAnsweredIndex] !== 'undefined' ? answers[currentAnsweredIndex] : null;
2014
+ const {
2015
+ result: answerResult = null
2016
+ } = answer_0 || {};
2017
+ const hasTrueFalse = answers !== null ? (answers || []).find(ans => ans?.good === true || ans?.good === false) !== undefined : false;
2018
+ const goodAnswerIndex = answers !== null ? answers.findIndex(ans_0 => ans_0 !== null && ans_0.good === true) : null;
2019
+ const withoutGoodAnswer = goodAnswerIndex === null || goodAnswerIndex === -1;
2020
+ const questionResultHasText = isTextFilled(questionResult);
2021
+ const questionResultHasImage = isImageFilled(questionResultImage);
2022
+ const answerResultHasText = isTextFilled(answerResult);
2023
+ const hasResult = questionResultHasText || questionResultHasImage || answerResultHasText;
2024
+ const onNextSlide = useCallback(() => {
1275
2025
  // console.log('onNextSlide', isEdit, isPreview);
1276
2026
  if (isEdit || isPreview) {
1277
2027
  return;
1278
2028
  }
1279
- var nextIndex = questionIndex + 1;
1280
- var questionsCount = questions.length;
2029
+ const nextIndex = questionIndex + 1;
2030
+ const questionsCount = questions.length;
1281
2031
  if (nextIndex < questionsCount) {
1282
2032
  setQuestionIndex(nextIndex);
1283
2033
  } else if (nextIndex === questionsCount) {
1284
2034
  setQuestionIndex('results');
1285
2035
  }
1286
2036
  }, [questions, questionIndex, setQuestionIndex, isEdit, isPreview]);
1287
- var currentPoints = useMemo(function () {
1288
- return userAnswers !== null ? Object.keys(userAnswers).reduce(function (totalPoints, answerQuestionIndex) {
1289
- var _ref6 = questions !== null ? questions[answerQuestionIndex] || {} : {},
1290
- _ref6$answers = _ref6.answers,
1291
- questionAnswers = _ref6$answers === void 0 ? [] : _ref6$answers;
1292
- var answerIndex = userAnswers[answerQuestionIndex];
1293
- var _ref7 = questionAnswers[answerIndex] || {},
1294
- _ref7$points = _ref7.points,
1295
- points = _ref7$points === void 0 ? 0 : _ref7$points;
1296
- return points + totalPoints;
1297
- }, 0) : 0;
1298
- }, [userAnswers, questions]);
1299
- var isIntro = hasIntro && questionIndex === 'intro';
1300
- var isResults = questionIndex === 'results';
1301
- var isQuestion = !isIntro && !isResults;
1302
- var currentResult = useMemo(function () {
2037
+ const currentPoints = useMemo(() => userAnswers !== null ? Object.keys(userAnswers).reduce((totalPoints, answerQuestionIndex) => {
2038
+ const {
2039
+ answers: questionAnswers = []
2040
+ } = questions !== null ? questions[answerQuestionIndex] || {} : {};
2041
+ const answerIndex_0 = userAnswers[answerQuestionIndex];
2042
+ const {
2043
+ points = 0
2044
+ } = questionAnswers[answerIndex_0] || {};
2045
+ return points + totalPoints;
2046
+ }, 0) : 0, [userAnswers, questions]);
2047
+ const isIntro = hasIntro && questionIndex === 'intro';
2048
+ const isResults = questionIndex === 'results';
2049
+ const isQuestion = !isIntro && !isResults;
2050
+ const currentResult = useMemo(() => {
1303
2051
  if (!isResults) {
1304
2052
  return null;
1305
2053
  }
1306
2054
  if (stateId === 'results') {
1307
2055
  return (results || [])[parseInt(stateIndex, 10)] || null;
1308
2056
  }
1309
- return (results || []).sort(function (_ref8, _ref9) {
1310
- var _ref8$points = _ref8.points,
1311
- pointsA = _ref8$points === void 0 ? 0 : _ref8$points;
1312
- var _ref9$points = _ref9.points,
1313
- pointsB = _ref9$points === void 0 ? 0 : _ref9$points;
2057
+ return (results || []).sort(({
2058
+ points: pointsA = 0
2059
+ }, {
2060
+ points: pointsB = 0
2061
+ }) => {
1314
2062
  if (pointsA === pointsB) {
1315
2063
  return 0;
1316
2064
  }
1317
2065
  return pointsA > pointsB ? 1 : -1;
1318
- }).reduce(function (lastResult, result) {
1319
- var _ref0 = lastResult || {},
1320
- _ref0$points = _ref0.points,
1321
- lastPoints = _ref0$points === void 0 ? 0 : _ref0$points;
1322
- var _ref1 = result || {},
1323
- _ref1$points = _ref1.points,
1324
- points = _ref1$points === void 0 ? 0 : _ref1$points;
1325
- return currentPoints >= (lastPoints || 0) && currentPoints >= points ? result : lastResult;
2066
+ }).reduce((lastResult, result) => {
2067
+ const {
2068
+ points: lastPoints = 0
2069
+ } = lastResult || {};
2070
+ const {
2071
+ points: points_0 = 0
2072
+ } = result || {};
2073
+ return currentPoints >= (lastPoints || 0) && currentPoints >= points_0 ? result : lastResult;
1326
2074
  }, null);
1327
2075
  }, [isResults, results, currentPoints, stateId, stateIndex]);
1328
- useEffect(function () {
2076
+ useEffect(() => {
1329
2077
  if (currentResult !== null && isResults) {
1330
- var _ref10 = currentResult || {},
1331
- _ref10$title = _ref10.title,
1332
- resultTitle = _ref10$title === void 0 ? null : _ref10$title,
1333
- _ref10$points = _ref10.points,
1334
- points = _ref10$points === void 0 ? null : _ref10$points;
1335
- trackScreenEvent('view_result', "Result: ".concat((resultTitle === null || resultTitle === void 0 ? void 0 : resultTitle.body) || 'No title'), {
1336
- resultPoints: points || null,
2078
+ const {
2079
+ title: resultTitle = null,
2080
+ points: points_1 = null
2081
+ } = currentResult || {};
2082
+ trackScreenEvent('view_result', `Result: ${resultTitle?.body || 'No title'}`, {
2083
+ resultPoints: points_1 || null,
1337
2084
  userPoints: currentPoints || null
1338
2085
  });
1339
2086
  }
1340
2087
  }, [currentResult, currentPoints, isResults, trackScreenEvent]);
1341
- var _ref11 = currentResult || {},
1342
- _ref11$background = _ref11.background,
1343
- resultBackground = _ref11$background === void 0 ? null : _ref11$background,
1344
- _ref11$layout = _ref11.layout,
1345
- resultLayout = _ref11$layout === void 0 ? null : _ref11$layout;
1346
- var _useQuizCreate = useQuizCreate({
1347
- screenId: screenId
1348
- }),
1349
- submitQuiz = _useQuizCreate.create;
1350
- useEffect(function () {
2088
+ const {
2089
+ background: resultBackground = null,
2090
+ layout: resultLayout = null
2091
+ } = currentResult || {};
2092
+ const {
2093
+ create: submitQuiz
2094
+ } = useQuizCreate({
2095
+ screenId
2096
+ });
2097
+ useEffect(() => {
1351
2098
  if (!isResults || !isView) {
1352
2099
  return;
1353
2100
  }
1354
- var finalUserAnswers = isArray(userAnswers) ? JSON.stringify(userAnswers) : userAnswers;
2101
+ const finalUserAnswers = isArray(userAnswers) ? JSON.stringify(userAnswers) : userAnswers;
1355
2102
  submitQuiz({
1356
2103
  choice: finalUserAnswers,
1357
2104
  value: currentPoints
@@ -1359,7 +2106,7 @@ function QuizMultipleScreen(_ref) {
1359
2106
  }, [isView, isResults, userAnswers, submitQuiz]);
1360
2107
 
1361
2108
  // Switch state
1362
- useEffect(function () {
2109
+ useEffect(() => {
1363
2110
  if (!isEdit && !isPreview) {
1364
2111
  return;
1365
2112
  }
@@ -1371,8 +2118,8 @@ function QuizMultipleScreen(_ref) {
1371
2118
  setQuestionIndex('intro');
1372
2119
  }
1373
2120
  }, [stateId, stateIndex, isEdit, isPreview, setQuestionIndex]);
1374
- var finalBackground = background;
1375
- var backgroundKey = 'background';
2121
+ let finalBackground = background;
2122
+ let backgroundKey = 'background';
1376
2123
  if (isIntro && introBackground !== null) {
1377
2124
  finalBackground = introBackground;
1378
2125
  backgroundKey = 'results';
@@ -1381,22 +2128,24 @@ function QuizMultipleScreen(_ref) {
1381
2128
  backgroundKey = 'results';
1382
2129
  } else if (isQuestion && questionBackground !== null) {
1383
2130
  finalBackground = questionBackground;
1384
- backgroundKey = "question_".concat(questionIndex);
1385
- }
1386
- var _usePlaybackMediaRef = usePlaybackMediaRef(current, finalBackground !== null, backgroundKey),
1387
- mediaRef = _usePlaybackMediaRef.ref,
1388
- _usePlaybackMediaRef$ = _usePlaybackMediaRef.isCurrent,
1389
- isCurrentMedia = _usePlaybackMediaRef$ === void 0 ? false : _usePlaybackMediaRef$;
1390
- var backgroundPlaying = current && (isView || isEdit) && (isCurrentMedia || !isView);
1391
- var backgroundShouldLoad = current || active;
2131
+ backgroundKey = `question_${questionIndex}`;
2132
+ }
2133
+ const {
2134
+ ref: mediaRef,
2135
+ isCurrent: isCurrentMedia = false
2136
+ } = usePlaybackMediaRef(current, finalBackground !== null, backgroundKey);
2137
+ const backgroundPlaying = current && (isView || isEdit) && (isCurrentMedia || !isView);
2138
+ const backgroundShouldLoad = current || active;
1392
2139
 
1393
2140
  // Transition direction
1394
- var lastQuestionIndexRef = useRef(questionIndex);
1395
- var direction = useMemo(function () {
2141
+ const lastQuestionIndexRef = useRef(questionIndex);
2142
+ const direction = useMemo(() => {
1396
2143
  if (questionIndex === lastQuestionIndexRef.current) {
1397
2144
  return null;
1398
2145
  }
1399
- var lastQuestionIndex = lastQuestionIndexRef.current;
2146
+ const {
2147
+ current: lastQuestionIndex
2148
+ } = lastQuestionIndexRef;
1400
2149
  lastQuestionIndexRef.current = questionIndex;
1401
2150
  if (questionIndex === 'intro' || lastQuestionIndex === 'results' || lastQuestionIndex > questionIndex) {
1402
2151
  return 'left';
@@ -1404,43 +2153,37 @@ function QuizMultipleScreen(_ref) {
1404
2153
  lastQuestionIndexRef.current = questionIndex;
1405
2154
  return 'right';
1406
2155
  }, [questionIndex]);
1407
- var scrollingDisabled = !isEdit && transitionDisabled || !current || isIntro;
1408
- var _useState5 = useState(false),
1409
- _useState6 = _slicedToArray(_useState5, 2),
1410
- scrolledBottom = _useState6[0],
1411
- setScrolledBottom = _useState6[1];
1412
- var onScrolledBottom = useCallback(function (_ref12) {
1413
- var initial = _ref12.initial;
2156
+ const scrollingDisabled = !isEdit && transitionDisabled || !current || isIntro;
2157
+ const [scrolledBottom, setScrolledBottom] = useState(false);
2158
+ const onScrolledBottom = useCallback(({
2159
+ initial
2160
+ }) => {
1414
2161
  if (initial) {
1415
2162
  trackScreenEvent('scroll', 'Screen');
1416
2163
  }
1417
2164
  setScrolledBottom(true);
1418
2165
  }, [trackScreenEvent]);
1419
- var onScrolledNotBottom = useCallback(function () {
2166
+ const onScrolledNotBottom = useCallback(() => {
1420
2167
  setScrolledBottom(false);
1421
2168
  }, [setScrolledBottom]);
1422
- var onScrolledTrigger = useCallback(function () {
1423
- var trigger = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
2169
+ const onScrolledTrigger = useCallback((trigger = null) => {
1424
2170
  if (trigger !== null) {
1425
- var scrollPercent = Math.round(trigger * 100);
2171
+ const scrollPercent = Math.round(trigger * 100);
1426
2172
  trackScreenEvent('scroll', scrollPercent, {
1427
- scrollPercent: scrollPercent
2173
+ scrollPercent
1428
2174
  });
1429
2175
  }
1430
2176
  }, [trackScreenEvent]);
1431
- var _useState7 = useState(false),
1432
- _useState8 = _slicedToArray(_useState7, 2),
1433
- hasScroll = _useState8[0],
1434
- setHasScroll = _useState8[1];
1435
- var onScrollHeightChange = useCallback(function (_ref13) {
1436
- var _ref13$canScroll = _ref13.canScroll,
1437
- canScroll = _ref13$canScroll === void 0 ? false : _ref13$canScroll;
2177
+ const [hasScroll, setHasScroll] = useState(false);
2178
+ const onScrollHeightChange = useCallback(({
2179
+ canScroll = false
2180
+ }) => {
1438
2181
  setHasScroll(canScroll);
1439
2182
  }, [setHasScroll]);
1440
- var onQuizReset = useCallback(function () {
2183
+ const onQuizReset = useCallback(() => {
1441
2184
  setUserAnswers(null);
1442
2185
  }, [setUserAnswers]);
1443
- var verticalAlign = layout;
2186
+ let verticalAlign = layout;
1444
2187
  if (isIntro && introLayout !== null) {
1445
2188
  verticalAlign = introLayout;
1446
2189
  } else if (isQuestion && questionLayout !== null) {
@@ -1448,11 +2191,11 @@ function QuizMultipleScreen(_ref) {
1448
2191
  } else if (isResults && resultLayout !== null) {
1449
2192
  verticalAlign = questionLayout;
1450
2193
  }
1451
- var showPoints = isEdit;
1452
- var showReset = isEdit && currentAnsweredIndex !== null;
2194
+ const showPoints = isEdit;
2195
+ const showReset = isEdit && currentAnsweredIndex !== null;
1453
2196
 
1454
2197
  // Content transition items (captured for leaving animations)
1455
- var contentItems = [];
2198
+ const contentItems = [];
1456
2199
  if (isIntro) {
1457
2200
  contentItems.push({
1458
2201
  key: 'intro',
@@ -1480,7 +2223,7 @@ function QuizMultipleScreen(_ref) {
1480
2223
  }
1481
2224
  if (isQuestion) {
1482
2225
  contentItems.push({
1483
- key: "question-".concat(questionIndex),
2226
+ key: `question-${questionIndex}`,
1484
2227
  element: /*#__PURE__*/jsx(Question, {
1485
2228
  index: questionIndex,
1486
2229
  totalCount: (questions || []).length,
@@ -1539,16 +2282,14 @@ function QuizMultipleScreen(_ref) {
1539
2282
  buttonStyle: nextButton !== null ? nextButton.buttonStyle : null,
1540
2283
  className: styles$2.nextButton,
1541
2284
  onClick: onNextSlide,
1542
- children: hasButtonText ? /*#__PURE__*/jsx(Text, _objectSpread(_objectSpread({}, nextButton), {}, {
2285
+ children: hasButtonText ? /*#__PURE__*/jsx(Text, {
2286
+ ...nextButton,
1543
2287
  className: styles$2.label
1544
- })) : /*#__PURE__*/jsx("span", {
2288
+ }) : /*#__PURE__*/jsx("span", {
1545
2289
  className: styles$2.label,
1546
2290
  children: /*#__PURE__*/jsx(FormattedMessage, {
1547
2291
  id: "SVLGTA",
1548
- defaultMessage: [{
1549
- "type": 0,
1550
- "value": "Next"
1551
- }]
2292
+ defaultMessage: "Next"
1552
2293
  })
1553
2294
  })
1554
2295
  })
@@ -1558,7 +2299,8 @@ function QuizMultipleScreen(_ref) {
1558
2299
  if (isResults) {
1559
2300
  contentItems.push({
1560
2301
  key: 'results',
1561
- element: /*#__PURE__*/jsx(Results, _objectSpread(_objectSpread({}, currentResult), {}, {
2302
+ element: /*#__PURE__*/jsx(Results, {
2303
+ ...currentResult,
1562
2304
  resultsHeadingStyle: resultsHeadingStyle,
1563
2305
  resultsTextStyle: resultsTextStyle,
1564
2306
  layout: resultLayout || layout,
@@ -1573,51 +2315,39 @@ function QuizMultipleScreen(_ref) {
1573
2315
  paddingTop: (current && !isPreview ? viewerTopHeight : 0) + (headerHeight || spacing),
1574
2316
  paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + (callToActionHeight || spacing)
1575
2317
  } : null
1576
- }))
2318
+ })
1577
2319
  });
1578
2320
  }
1579
- var contentTransitions = useTransition(contentItems, {
1580
- keys: function keys(item) {
1581
- return item.key;
1582
- },
1583
- from: function from(item) {
1584
- return item.key === 'next' ? {
1585
- transform: 'translateX(0%)'
1586
- } : {
1587
- transform: direction === 'left' ? 'translateX(-100%)' : 'translateX(100%)'
1588
- };
2321
+ const contentTransitions = useTransition(contentItems, {
2322
+ keys: item => item.key,
2323
+ from: item_0 => item_0.key === 'next' ? {
2324
+ transform: 'translateX(0%)'
2325
+ } : {
2326
+ transform: direction === 'left' ? 'translateX(-100%)' : 'translateX(100%)'
1589
2327
  },
1590
2328
  enter: {
1591
2329
  transform: 'translateX(0%)'
1592
2330
  },
1593
- leave: function leave(item) {
1594
- return item.key === 'next' ? {
1595
- transform: 'translateX(0%)'
1596
- } : {
1597
- transform: direction === 'left' ? 'translateX(100%)' : 'translateX(-100%)'
1598
- };
2331
+ leave: item_1 => item_1.key === 'next' ? {
2332
+ transform: 'translateX(0%)'
2333
+ } : {
2334
+ transform: direction === 'left' ? 'translateX(100%)' : 'translateX(-100%)'
1599
2335
  },
1600
- config: function config(item) {
1601
- return item.key === 'next' ? {
1602
- duration: 0
1603
- } : {
1604
- duration: 1000,
1605
- easing: easings.easeInOutSine
1606
- };
2336
+ config: item_2 => item_2.key === 'next' ? {
2337
+ duration: 0
2338
+ } : {
2339
+ duration: 1000,
2340
+ easing: easings.easeInOutSine
1607
2341
  }
1608
2342
  });
1609
2343
 
1610
2344
  // Background transition
1611
- var bgItem = useMemo(function () {
1612
- return {
1613
- key: backgroundKey,
1614
- background: finalBackground || null
1615
- };
1616
- }, [backgroundKey, finalBackground]);
1617
- var bgTransitions = useTransition(bgItem, {
1618
- keys: function keys(item) {
1619
- return item.key;
1620
- },
2345
+ const bgItem = useMemo(() => ({
2346
+ key: backgroundKey,
2347
+ background: finalBackground || null
2348
+ }), [backgroundKey, finalBackground]);
2349
+ const bgTransitions = useTransition(bgItem, {
2350
+ keys: item_3 => item_3.key,
1621
2351
  from: {
1622
2352
  opacity: 0
1623
2353
  },
@@ -1641,12 +2371,9 @@ function QuizMultipleScreen(_ref) {
1641
2371
  className: styles$2.content,
1642
2372
  children: [showPoints && currentPoints !== null && currentPoints > 0 ? /*#__PURE__*/jsxs("div", {
1643
2373
  className: styles$2.points,
1644
- children: ["".concat(currentPoints, " "), /*#__PURE__*/jsx(FormattedMessage, {
2374
+ children: [`${currentPoints} `, /*#__PURE__*/jsx(FormattedMessage, {
1645
2375
  id: "Xr1v8l",
1646
- defaultMessage: [{
1647
- "type": 0,
1648
- "value": "points gained"
1649
- }]
2376
+ defaultMessage: "points gained"
1650
2377
  })]
1651
2378
  }) : null, showReset ? /*#__PURE__*/jsx(Button$1, {
1652
2379
  className: styles$2.reset,
@@ -1656,16 +2383,20 @@ function QuizMultipleScreen(_ref) {
1656
2383
  }),
1657
2384
  onClick: onQuizReset
1658
2385
  }) : null, !isPlaceholder && hasHeader ? /*#__PURE__*/jsx("div", {
1659
- className: classNames([styles$2.header, _defineProperty({}, styles$2.disabled, scrolledBottom && !scrollingDisabled && hasScroll)]),
2386
+ className: classNames([styles$2.header, {
2387
+ [styles$2.disabled]: scrolledBottom && !scrollingDisabled && hasScroll
2388
+ }]),
1660
2389
  ref: headerRef,
1661
2390
  style: {
1662
2391
  paddingTop: spacing / 2,
1663
2392
  paddingLeft: spacing,
1664
2393
  paddingRight: spacing,
1665
2394
  paddingBottom: spacing,
1666
- transform: !isPreview ? "translate(0, ".concat(viewerTopHeight, "px)") : null
2395
+ transform: !isPreview ? `translate(0, ${viewerTopHeight}px)` : null
1667
2396
  },
1668
- children: /*#__PURE__*/jsx(Header, _objectSpread({}, header))
2397
+ children: /*#__PURE__*/jsx(Header, {
2398
+ ...header
2399
+ })
1669
2400
  }) : null, /*#__PURE__*/jsx(Scroll, {
1670
2401
  verticalAlign: verticalAlign,
1671
2402
  disabled: scrollingDisabled,
@@ -1679,66 +2410,70 @@ function QuizMultipleScreen(_ref) {
1679
2410
  position: 'absolute',
1680
2411
  inset: '0'
1681
2412
  },
1682
- children: contentTransitions(function (springStyle, item) {
1683
- var isActive = contentItems.some(function (ci) {
1684
- return ci.key === item.key;
1685
- });
2413
+ children: contentTransitions((springStyle, item_4) => {
2414
+ const isActive = contentItems.some(ci => ci.key === item_4.key);
1686
2415
  return /*#__PURE__*/jsx(animated.div, {
1687
- style: _objectSpread(_objectSpread({}, springStyle), !isActive ? {
1688
- position: 'absolute',
1689
- top: 0,
1690
- left: 0,
1691
- width: '100%',
1692
- minHeight: '100%',
1693
- zIndex: 0
1694
- } : {
1695
- position: 'relative',
1696
- zIndex: 1,
1697
- top: 0,
1698
- left: 0,
1699
- width: '100%',
1700
- minHeight: hasResult && currentAnsweredIndex !== null ? 0 : '100%'
1701
- }),
1702
- children: item.element
2416
+ style: {
2417
+ ...springStyle,
2418
+ ...(!isActive ? {
2419
+ position: 'absolute',
2420
+ top: 0,
2421
+ left: 0,
2422
+ width: '100%',
2423
+ minHeight: '100%',
2424
+ zIndex: 0
2425
+ } : {
2426
+ position: 'relative',
2427
+ zIndex: 1,
2428
+ top: 0,
2429
+ left: 0,
2430
+ width: '100%',
2431
+ minHeight: hasResult && currentAnsweredIndex !== null ? 0 : '100%'
2432
+ })
2433
+ },
2434
+ children: item_4.element
1703
2435
  });
1704
2436
  })
1705
2437
  })
1706
2438
  }), !isPlaceholder && hasFooter ? /*#__PURE__*/jsx("div", {
1707
2439
  ref: footerRef,
1708
- className: classNames([styles$2.footer, _defineProperty({}, styles$2.disabled, !scrolledBottom)]),
2440
+ className: classNames([styles$2.footer, {
2441
+ [styles$2.disabled]: !scrolledBottom
2442
+ }]),
1709
2443
  style: {
1710
2444
  paddingLeft: Math.max(spacing / 2, viewerBottomSidesWidth),
1711
2445
  paddingRight: Math.max(spacing / 2, viewerBottomSidesWidth),
1712
2446
  paddingTop: spacing / 2,
1713
2447
  paddingBottom: spacing / 2,
1714
- transform: !isPreview ? "translate(0, -".concat(viewerBottomHeight, "px)") : null
2448
+ transform: !isPreview ? `translate(0, -${viewerBottomHeight}px)` : null
1715
2449
  },
1716
- children: /*#__PURE__*/jsx(Footer, _objectSpread({}, footerProps))
1717
- }) : null]
1718
- }), !isPlaceholder ? bgTransitions(function (springStyle, item) {
1719
- return /*#__PURE__*/jsx(animated.div, {
1720
- style: _objectSpread(_objectSpread({}, springStyle), {}, {
1721
- position: 'absolute',
1722
- top: 0,
1723
- left: 0,
1724
- width: '100%',
1725
- height: '100%',
1726
- zIndex: item.key === bgItem.key ? 1 : 0
1727
- }),
1728
- children: /*#__PURE__*/jsx(Background, {
1729
- background: item.background,
1730
- width: width,
1731
- height: height,
1732
- resolution: resolution,
1733
- playing: item.key === bgItem.key && backgroundPlaying,
1734
- muted: muted,
1735
- shouldLoad: backgroundShouldLoad,
1736
- mediaRef: item.key === bgItem.key ? mergeRefs(mediaRef, customMediaRef) : null,
1737
- className: styles$2.background,
1738
- withoutVideo: isPreview
2450
+ children: /*#__PURE__*/jsx(Footer, {
2451
+ ...footerProps
1739
2452
  })
1740
- });
1741
- }) : null]
2453
+ }) : null]
2454
+ }), !isPlaceholder ? bgTransitions((springStyle_0, item_5) => /*#__PURE__*/jsx(animated.div, {
2455
+ style: {
2456
+ ...springStyle_0,
2457
+ position: 'absolute',
2458
+ top: 0,
2459
+ left: 0,
2460
+ width: '100%',
2461
+ height: '100%',
2462
+ zIndex: item_5.key === bgItem.key ? 1 : 0
2463
+ },
2464
+ children: /*#__PURE__*/jsx(Background, {
2465
+ background: item_5.background,
2466
+ width: width,
2467
+ height: height,
2468
+ resolution: resolution,
2469
+ playing: item_5.key === bgItem.key && backgroundPlaying,
2470
+ muted: muted,
2471
+ shouldLoad: backgroundShouldLoad,
2472
+ mediaRef: item_5.key === bgItem.key ? mergeRefs(mediaRef, customMediaRef) : null,
2473
+ className: styles$2.background,
2474
+ withoutVideo: isPreview
2475
+ })
2476
+ })) : null]
1742
2477
  });
1743
2478
  }
1744
2479
 
@@ -1748,19 +2483,13 @@ var definition = [{
1748
2483
  group: {
1749
2484
  label: defineMessage({
1750
2485
  id: "ZiWlL6",
1751
- defaultMessage: [{
1752
- "type": 0,
1753
- "value": "Questions"
1754
- }]
2486
+ defaultMessage: "Questions"
1755
2487
  }),
1756
2488
  order: 7
1757
2489
  },
1758
2490
  title: defineMessage({
1759
2491
  id: "zW7IVm",
1760
- defaultMessage: [{
1761
- "type": 0,
1762
- "value": "Quiz"
1763
- }]
2492
+ defaultMessage: "Quiz"
1764
2493
  }),
1765
2494
  component: QuizScreen,
1766
2495
  layouts: ['top', 'middle', 'bottom', 'split'],
@@ -1782,10 +2511,7 @@ var definition = [{
1782
2511
  },
1783
2512
  label: defineMessage({
1784
2513
  id: "hVE7TA",
1785
- defaultMessage: [{
1786
- "type": 0,
1787
- "value": "Question"
1788
- }]
2514
+ defaultMessage: "Question"
1789
2515
  })
1790
2516
  }, {
1791
2517
  name: 'answers',
@@ -1797,10 +2523,7 @@ var definition = [{
1797
2523
  },
1798
2524
  label: defineMessage({
1799
2525
  id: "KHWeV7",
1800
- defaultMessage: [{
1801
- "type": 0,
1802
- "value": "Answers"
1803
- }]
2526
+ defaultMessage: "Answers"
1804
2527
  })
1805
2528
  }, {
1806
2529
  name: 'keypadLayout',
@@ -1815,20 +2538,14 @@ var definition = [{
1815
2538
  },
1816
2539
  label: defineMessage({
1817
2540
  id: "FjuRaw",
1818
- defaultMessage: [{
1819
- "type": 0,
1820
- "value": "Keypad settings"
1821
- }]
2541
+ defaultMessage: "Keypad settings"
1822
2542
  })
1823
2543
  }, {
1824
2544
  name: 'withoutTrueFalse',
1825
2545
  type: 'toggle',
1826
2546
  label: defineMessage({
1827
2547
  id: "LFziCV",
1828
- defaultMessage: [{
1829
- "type": 0,
1830
- "value": "Without right/wrong icon"
1831
- }]
2548
+ defaultMessage: "Without right/wrong icon"
1832
2549
  })
1833
2550
  }, {
1834
2551
  name: 'result',
@@ -1838,110 +2555,77 @@ var definition = [{
1838
2555
  },
1839
2556
  label: defineMessage({
1840
2557
  id: "iQ5Uf7",
1841
- defaultMessage: [{
1842
- "type": 0,
1843
- "value": "Default feedback"
1844
- }]
2558
+ defaultMessage: "Default feedback"
1845
2559
  })
1846
2560
  }, {
1847
2561
  name: 'resultImage',
1848
2562
  type: 'visual',
1849
2563
  label: defineMessage({
1850
2564
  id: "yA4B6h",
1851
- defaultMessage: [{
1852
- "type": 0,
1853
- "value": "Result feedback image"
1854
- }]
2565
+ defaultMessage: "Result feedback image"
1855
2566
  })
1856
2567
  }, {
1857
2568
  type: 'fields',
1858
2569
  isList: true,
1859
2570
  label: defineMessage({
1860
2571
  id: "R9DB4a",
1861
- defaultMessage: [{
1862
- "type": 0,
1863
- "value": "Styles"
1864
- }]
2572
+ defaultMessage: "Styles"
1865
2573
  }),
1866
2574
  fields: [{
1867
2575
  name: 'buttonsLayout',
1868
2576
  type: 'button-layout',
1869
2577
  label: defineMessage({
1870
2578
  id: "8Dmlwh",
1871
- defaultMessage: [{
1872
- "type": 0,
1873
- "value": "Answer button layout"
1874
- }]
2579
+ defaultMessage: "Answer button layout"
1875
2580
  })
1876
2581
  }, {
1877
2582
  name: 'buttonsTextStyle',
1878
2583
  type: 'text-style-form',
1879
2584
  label: defineMessage({
1880
2585
  id: "gwPu/I",
1881
- defaultMessage: [{
1882
- "type": 0,
1883
- "value": "Buttons text"
1884
- }]
2586
+ defaultMessage: "Buttons text"
1885
2587
  })
1886
2588
  }, {
1887
2589
  name: 'buttonsStyle',
1888
2590
  type: 'box-style-form',
1889
2591
  label: defineMessage({
1890
2592
  id: "l5uLMd",
1891
- defaultMessage: [{
1892
- "type": 0,
1893
- "value": "Buttons"
1894
- }]
2593
+ defaultMessage: "Buttons"
1895
2594
  })
1896
2595
  }, {
1897
2596
  name: 'inactiveButtonsTextStyle',
1898
2597
  type: 'text-style-form',
1899
2598
  label: defineMessage({
1900
2599
  id: "my7Kox",
1901
- defaultMessage: [{
1902
- "type": 0,
1903
- "value": "Inactive buttons text"
1904
- }]
2600
+ defaultMessage: "Inactive buttons text"
1905
2601
  })
1906
2602
  }, {
1907
2603
  name: 'inactiveButtonsStyle',
1908
2604
  type: 'box-style-form',
1909
2605
  label: defineMessage({
1910
2606
  id: "xlFOg3",
1911
- defaultMessage: [{
1912
- "type": 0,
1913
- "value": "Inactive buttons"
1914
- }]
2607
+ defaultMessage: "Inactive buttons"
1915
2608
  })
1916
2609
  }, {
1917
2610
  name: 'feedbackTextStyle',
1918
2611
  type: 'text-style-form',
1919
2612
  label: defineMessage({
1920
2613
  id: "4w7K2K",
1921
- defaultMessage: [{
1922
- "type": 0,
1923
- "value": "Feedback text"
1924
- }]
2614
+ defaultMessage: "Feedback text"
1925
2615
  })
1926
2616
  }, {
1927
2617
  name: 'goodAnswerColor',
1928
2618
  type: 'color',
1929
2619
  label: defineMessage({
1930
2620
  id: "hZcXoa",
1931
- defaultMessage: [{
1932
- "type": 0,
1933
- "value": "Good answer icon color"
1934
- }]
2621
+ defaultMessage: "Good answer icon color"
1935
2622
  })
1936
2623
  }, {
1937
2624
  name: 'badAnswerColor',
1938
2625
  type: 'color',
1939
2626
  label: defineMessage({
1940
2627
  id: "NbTtNk",
1941
- defaultMessage: [{
1942
- "type": 0,
1943
- "value": "Bad answer icon color"
1944
- }]
2628
+ defaultMessage: "Bad answer icon color"
1945
2629
  })
1946
2630
  }]
1947
2631
  }, {
@@ -1949,20 +2633,14 @@ var definition = [{
1949
2633
  type: 'background',
1950
2634
  label: defineMessage({
1951
2635
  id: "+MPZRu",
1952
- defaultMessage: [{
1953
- "type": 0,
1954
- "value": "Background"
1955
- }]
2636
+ defaultMessage: "Background"
1956
2637
  })
1957
2638
  }, {
1958
2639
  name: 'header',
1959
2640
  type: 'header',
1960
2641
  label: defineMessage({
1961
2642
  id: "rhuDxI",
1962
- defaultMessage: [{
1963
- "type": 0,
1964
- "value": "Header"
1965
- }]
2643
+ defaultMessage: "Header"
1966
2644
  }),
1967
2645
  theme: {
1968
2646
  badge: {
@@ -1977,10 +2655,7 @@ var definition = [{
1977
2655
  type: 'footer',
1978
2656
  label: defineMessage({
1979
2657
  id: "g4nybp",
1980
- defaultMessage: [{
1981
- "type": 0,
1982
- "value": "Footer"
1983
- }]
2658
+ defaultMessage: "Footer"
1984
2659
  }),
1985
2660
  theme: {
1986
2661
  callToAction: {
@@ -1997,19 +2672,13 @@ var definition = [{
1997
2672
  group: {
1998
2673
  label: defineMessage({
1999
2674
  id: "ZiWlL6",
2000
- defaultMessage: [{
2001
- "type": 0,
2002
- "value": "Questions"
2003
- }]
2675
+ defaultMessage: "Questions"
2004
2676
  }),
2005
2677
  order: 7
2006
2678
  },
2007
2679
  title: defineMessage({
2008
2680
  id: "ACkeH6",
2009
- defaultMessage: [{
2010
- "type": 0,
2011
- "value": "Quiz with multiple questions"
2012
- }]
2681
+ defaultMessage: "Quiz with multiple questions"
2013
2682
  }),
2014
2683
  component: QuizMultipleScreen,
2015
2684
  layouts: ['top', 'middle', 'bottom', 'split'],
@@ -2017,10 +2686,7 @@ var definition = [{
2017
2686
  id: 'intro',
2018
2687
  label: defineMessage({
2019
2688
  id: "BgrRxZ",
2020
- defaultMessage: [{
2021
- "type": 0,
2022
- "value": "Intro"
2023
- }]
2689
+ defaultMessage: "Intro"
2024
2690
  }),
2025
2691
  fields: [{
2026
2692
  name: 'introLayout',
@@ -2029,10 +2695,7 @@ var definition = [{
2029
2695
  screenState: 'intro',
2030
2696
  label: defineMessage({
2031
2697
  id: "4iBXj2",
2032
- defaultMessage: [{
2033
- "type": 0,
2034
- "value": "Layout"
2035
- }]
2698
+ defaultMessage: "Layout"
2036
2699
  })
2037
2700
  }, {
2038
2701
  name: 'title',
@@ -2042,10 +2705,7 @@ var definition = [{
2042
2705
  },
2043
2706
  label: defineMessage({
2044
2707
  id: "+AEVbJ",
2045
- defaultMessage: [{
2046
- "type": 0,
2047
- "value": "Title"
2048
- }]
2708
+ defaultMessage: "Title"
2049
2709
  })
2050
2710
  }, {
2051
2711
  name: 'description',
@@ -2055,10 +2715,7 @@ var definition = [{
2055
2715
  },
2056
2716
  label: defineMessage({
2057
2717
  id: "ZCe0r4",
2058
- defaultMessage: [{
2059
- "type": 0,
2060
- "value": "Description"
2061
- }]
2718
+ defaultMessage: "Description"
2062
2719
  })
2063
2720
  }, {
2064
2721
  name: 'introButton',
@@ -2068,30 +2725,21 @@ var definition = [{
2068
2725
  },
2069
2726
  label: defineMessage({
2070
2727
  id: "i6bmbD",
2071
- defaultMessage: [{
2072
- "type": 0,
2073
- "value": "Button"
2074
- }]
2728
+ defaultMessage: "Button"
2075
2729
  })
2076
2730
  }, {
2077
2731
  name: 'introBackground',
2078
2732
  type: 'background',
2079
2733
  label: defineMessage({
2080
2734
  id: "cDj1mZ",
2081
- defaultMessage: [{
2082
- "type": 0,
2083
- "value": "Background"
2084
- }]
2735
+ defaultMessage: "Background"
2085
2736
  })
2086
2737
  }]
2087
2738
  }, {
2088
2739
  id: 'questions',
2089
2740
  label: defineMessage({
2090
2741
  id: "VMd1oG",
2091
- defaultMessage: [{
2092
- "type": 0,
2093
- "value": "Questions"
2094
- }]
2742
+ defaultMessage: "Questions"
2095
2743
  }),
2096
2744
  repeatable: true,
2097
2745
  fieldName: 'questions',
@@ -2103,10 +2751,7 @@ var definition = [{
2103
2751
  },
2104
2752
  label: defineMessage({
2105
2753
  id: "hVE7TA",
2106
- defaultMessage: [{
2107
- "type": 0,
2108
- "value": "Question"
2109
- }]
2754
+ defaultMessage: "Question"
2110
2755
  })
2111
2756
  }, {
2112
2757
  name: 'answers',
@@ -2118,10 +2763,7 @@ var definition = [{
2118
2763
  },
2119
2764
  label: defineMessage({
2120
2765
  id: "KHWeV7",
2121
- defaultMessage: [{
2122
- "type": 0,
2123
- "value": "Answers"
2124
- }]
2766
+ defaultMessage: "Answers"
2125
2767
  })
2126
2768
  }, {
2127
2769
  name: 'keypadLayout',
@@ -2136,10 +2778,7 @@ var definition = [{
2136
2778
  },
2137
2779
  label: defineMessage({
2138
2780
  id: "FjuRaw",
2139
- defaultMessage: [{
2140
- "type": 0,
2141
- "value": "Keypad settings"
2142
- }]
2781
+ defaultMessage: "Keypad settings"
2143
2782
  })
2144
2783
  },
2145
2784
  // {
@@ -2166,20 +2805,14 @@ var definition = [{
2166
2805
  type: 'background',
2167
2806
  label: defineMessage({
2168
2807
  id: "cDj1mZ",
2169
- defaultMessage: [{
2170
- "type": 0,
2171
- "value": "Background"
2172
- }]
2808
+ defaultMessage: "Background"
2173
2809
  })
2174
2810
  }]
2175
2811
  }, {
2176
2812
  id: 'results',
2177
2813
  label: defineMessage({
2178
2814
  id: "uiTxd7",
2179
- defaultMessage: [{
2180
- "type": 0,
2181
- "value": "Results"
2182
- }]
2815
+ defaultMessage: "Results"
2183
2816
  }),
2184
2817
  repeatable: true,
2185
2818
  fields: [{
@@ -2189,10 +2822,7 @@ var definition = [{
2189
2822
  screenState: 'results',
2190
2823
  label: defineMessage({
2191
2824
  id: "4iBXj2",
2192
- defaultMessage: [{
2193
- "type": 0,
2194
- "value": "Layout"
2195
- }]
2825
+ defaultMessage: "Layout"
2196
2826
  })
2197
2827
  }, {
2198
2828
  name: 'title',
@@ -2202,10 +2832,7 @@ var definition = [{
2202
2832
  },
2203
2833
  label: defineMessage({
2204
2834
  id: "+AEVbJ",
2205
- defaultMessage: [{
2206
- "type": 0,
2207
- "value": "Title"
2208
- }]
2835
+ defaultMessage: "Title"
2209
2836
  })
2210
2837
  }, {
2211
2838
  name: 'description',
@@ -2215,10 +2842,7 @@ var definition = [{
2215
2842
  },
2216
2843
  label: defineMessage({
2217
2844
  id: "ZCe0r4",
2218
- defaultMessage: [{
2219
- "type": 0,
2220
- "value": "Description"
2221
- }]
2845
+ defaultMessage: "Description"
2222
2846
  })
2223
2847
  }, {
2224
2848
  name: 'points',
@@ -2226,27 +2850,18 @@ var definition = [{
2226
2850
  isHorizontal: true,
2227
2851
  label: defineMessage({
2228
2852
  id: "jWAJW4",
2229
- defaultMessage: [{
2230
- "type": 0,
2231
- "value": "Points"
2232
- }]
2853
+ defaultMessage: "Points"
2233
2854
  }),
2234
2855
  help: defineMessage({
2235
2856
  id: "JoyIgA",
2236
- defaultMessage: [{
2237
- "type": 0,
2238
- "value": "Minimum points for this result"
2239
- }]
2857
+ defaultMessage: "Minimum points for this result"
2240
2858
  })
2241
2859
  }, {
2242
2860
  name: 'background',
2243
2861
  type: 'background',
2244
2862
  label: defineMessage({
2245
2863
  id: "cDj1mZ",
2246
- defaultMessage: [{
2247
- "type": 0,
2248
- "value": "Background"
2249
- }]
2864
+ defaultMessage: "Background"
2250
2865
  })
2251
2866
  }]
2252
2867
  }],
@@ -2256,19 +2871,13 @@ var definition = [{
2256
2871
  defaultValue: 'top',
2257
2872
  label: defineMessage({
2258
2873
  id: "OPxJx/",
2259
- defaultMessage: [{
2260
- "type": 0,
2261
- "value": "Layout"
2262
- }]
2874
+ defaultMessage: "Layout"
2263
2875
  })
2264
2876
  }, {
2265
2877
  type: 'fields',
2266
2878
  label: defineMessage({
2267
2879
  id: "LOknw0",
2268
- defaultMessage: [{
2269
- "type": 0,
2270
- "value": "Styles"
2271
- }]
2880
+ defaultMessage: "Styles"
2272
2881
  }),
2273
2882
  isList: true,
2274
2883
  fields: [{
@@ -2276,80 +2885,56 @@ var definition = [{
2276
2885
  type: 'box-style-form',
2277
2886
  label: defineMessage({
2278
2887
  id: "l5uLMd",
2279
- defaultMessage: [{
2280
- "type": 0,
2281
- "value": "Buttons"
2282
- }]
2888
+ defaultMessage: "Buttons"
2283
2889
  })
2284
2890
  }, {
2285
2891
  name: 'buttonsTextStyle',
2286
2892
  type: 'text-style-form',
2287
2893
  label: defineMessage({
2288
2894
  id: "gwPu/I",
2289
- defaultMessage: [{
2290
- "type": 0,
2291
- "value": "Buttons text"
2292
- }]
2895
+ defaultMessage: "Buttons text"
2293
2896
  })
2294
2897
  }, {
2295
2898
  name: 'inactiveButtonsTextStyle',
2296
2899
  type: 'text-style-form',
2297
2900
  label: defineMessage({
2298
2901
  id: "my7Kox",
2299
- defaultMessage: [{
2300
- "type": 0,
2301
- "value": "Inactive buttons text"
2302
- }]
2902
+ defaultMessage: "Inactive buttons text"
2303
2903
  })
2304
2904
  }, {
2305
2905
  name: 'inactiveButtonsStyle',
2306
2906
  type: 'box-style-form',
2307
2907
  label: defineMessage({
2308
2908
  id: "xlFOg3",
2309
- defaultMessage: [{
2310
- "type": 0,
2311
- "value": "Inactive buttons"
2312
- }]
2909
+ defaultMessage: "Inactive buttons"
2313
2910
  })
2314
2911
  }, {
2315
2912
  name: 'questionsHeadingStyle',
2316
2913
  type: 'text-style-form',
2317
2914
  label: defineMessage({
2318
2915
  id: "+FHxPO",
2319
- defaultMessage: [{
2320
- "type": 0,
2321
- "value": "Questions title"
2322
- }]
2916
+ defaultMessage: "Questions title"
2323
2917
  })
2324
2918
  }, {
2325
2919
  name: 'resultsHeadingStyle',
2326
2920
  type: 'text-style-form',
2327
2921
  label: defineMessage({
2328
2922
  id: "BnRW4y",
2329
- defaultMessage: [{
2330
- "type": 0,
2331
- "value": "Results title"
2332
- }]
2923
+ defaultMessage: "Results title"
2333
2924
  })
2334
2925
  }, {
2335
2926
  name: 'resultsTextStyle',
2336
2927
  type: 'text-style-form',
2337
2928
  label: defineMessage({
2338
2929
  id: "uDHTZn",
2339
- defaultMessage: [{
2340
- "type": 0,
2341
- "value": "Results description"
2342
- }]
2930
+ defaultMessage: "Results description"
2343
2931
  })
2344
2932
  }, {
2345
2933
  name: 'numbersTextStyle',
2346
2934
  type: 'text-style-form',
2347
2935
  label: defineMessage({
2348
2936
  id: "iltluX",
2349
- defaultMessage: [{
2350
- "type": 0,
2351
- "value": "Numbers text"
2352
- }]
2937
+ defaultMessage: "Numbers text"
2353
2938
  })
2354
2939
  }]
2355
2940
  }, {
@@ -2360,30 +2945,21 @@ var definition = [{
2360
2945
  },
2361
2946
  label: defineMessage({
2362
2947
  id: "Yu/PB5",
2363
- defaultMessage: [{
2364
- "type": 0,
2365
- "value": "Next button"
2366
- }]
2948
+ defaultMessage: "Next button"
2367
2949
  })
2368
2950
  }, {
2369
2951
  name: 'background',
2370
2952
  type: 'background',
2371
2953
  label: defineMessage({
2372
2954
  id: "cDj1mZ",
2373
- defaultMessage: [{
2374
- "type": 0,
2375
- "value": "Background"
2376
- }]
2955
+ defaultMessage: "Background"
2377
2956
  })
2378
2957
  }, {
2379
2958
  name: 'header',
2380
2959
  type: 'header',
2381
2960
  label: defineMessage({
2382
2961
  id: "rhuDxI",
2383
- defaultMessage: [{
2384
- "type": 0,
2385
- "value": "Header"
2386
- }]
2962
+ defaultMessage: "Header"
2387
2963
  }),
2388
2964
  theme: {
2389
2965
  badge: {
@@ -2398,10 +2974,7 @@ var definition = [{
2398
2974
  type: 'footer',
2399
2975
  label: defineMessage({
2400
2976
  id: "g4nybp",
2401
- defaultMessage: [{
2402
- "type": 0,
2403
- "value": "Footer"
2404
- }]
2977
+ defaultMessage: "Footer"
2405
2978
  }),
2406
2979
  theme: {
2407
2980
  callToAction: {