@micromag/screen-survey 0.3.682 → 0.3.693

package/es/index.js

@@ -6,6 +6,7 @@ import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import { faRedo } from '@fortawesome/free-solid-svg-icons/faRedo';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import classNames from 'classnames';
+import DOMPurify from 'dompurify';
 import isNumber from 'lodash/isNumber';
 import PropTypes from 'prop-types';
 import React, { useState, useMemo, useCallback, useEffect } from 'react';
@@ -229,7 +230,7 @@ var SurveyScreen = function SurveyScreen(_ref) {
   var onAnswerClick = useCallback(function (answerIndex) {
     if (userAnswerIndex === null) {
       setUserAnswerIndex(answerIndex);
-      var answer = answers[answerIndex];
+      var answer = answers !== null ? answers[answerIndex] : null;
       submitQuiz({
         choice: answer.label.body || answerIndex,
         value: 1
@@ -269,9 +270,7 @@ var SurveyScreen = function SurveyScreen(_ref) {
     setInputFocused(false);
   }, [setInputFocused]);
   var onTextInputChange = useCallback(function (e) {
-    var _ref11 = e.target || {},
-      _ref11$value = _ref11.value,
-      value = _ref11$value === void 0 ? null : _ref11$value;
+    var value = DOMPurify.sanitize(e.currentTarget.value || '');
     setTextInput(value !== '' ? value : null);
   }, [setTextInput]);
   var onSubmitSuggestion = useCallback(function (e) {
@@ -284,7 +283,7 @@ var SurveyScreen = function SurveyScreen(_ref) {
       });
       setUserAnswerIndex('input');
       setInputFocused(false);
-      trackScreenEvent('click_answer', "Answer: ".concat(textInput), {
+      trackScreenEvent('click_answer', "Answer input: ".concat(textInput), {
         textInput: textInput,
         answerIndex: null,
         answerType: 'custom'
@@ -312,8 +311,8 @@ var SurveyScreen = function SurveyScreen(_ref) {
     _useState8 = _slicedToArray(_useState7, 2),
     scrolledBottom = _useState8[0],
     setScrolledBottom = _useState8[1];
-  var onScrolledBottom = useCallback(function (_ref12) {
-    var initial = _ref12.initial;
+  var onScrolledBottom = useCallback(function (_ref11) {
+    var initial = _ref11.initial;
     if (initial) {
       trackScreenEvent('scroll', 'Screen');
     }
@@ -326,9 +325,9 @@ var SurveyScreen = function SurveyScreen(_ref) {
     _useState10 = _slicedToArray(_useState9, 2),
     hasScroll = _useState10[0],
     setHasScroll = _useState10[1];
-  var onScrollHeightChange = useCallback(function (_ref13) {
-    var _ref13$canScroll = _ref13.canScroll,
-      canScroll = _ref13$canScroll === void 0 ? false : _ref13$canScroll;
+  var onScrollHeightChange = useCallback(function (_ref12) {
+    var _ref12$canScroll = _ref12.canScroll,
+      canScroll = _ref12$canScroll === void 0 ? false : _ref12$canScroll;
     setHasScroll(canScroll);
   }, [setHasScroll]);
 
@@ -360,19 +359,19 @@ var SurveyScreen = function SurveyScreen(_ref) {
   var finalTransitionDuration = useMemo(function () {
     return showInstantAnswer ? 0 : "".concat(resultTransitionDuration, "ms");
   }, [showInstantAnswer, resultTransitionDuration]);
-  var _ref14 = resultsStyle || {},
-    _ref14$barColor = _ref14.barColor,
-    resultsBarColor = _ref14$barColor === void 0 ? null : _ref14$barColor,
-    _ref14$textColor = _ref14.textColor,
-    resultsTextColor = _ref14$textColor === void 0 ? null : _ref14$textColor,
-    _ref14$percentageText = _ref14.percentageTextStyle,
-    resultsPercentageTextStyle = _ref14$percentageText === void 0 ? null : _ref14$percentageText;
+  var _ref13 = resultsStyle || {},
+    _ref13$barColor = _ref13.barColor,
+    resultsBarColor = _ref13$barColor === void 0 ? null : _ref13$barColor,
+    _ref13$textColor = _ref13.textColor,
+    resultsTextColor = _ref13$textColor === void 0 ? null : _ref13$textColor,
+    _ref13$percentageText = _ref13.percentageTextStyle,
+    resultsPercentageTextStyle = _ref13$percentageText === void 0 ? null : _ref13$percentageText;
   var finalResult = useMemo(function () {
     var defaultResult = hasDefaultResult ? result : null;
-    var answer = userAnswerIndex !== null ? answers[userAnswerIndex] : null;
-    var _ref15 = answer || {},
-      _ref15$result = _ref15.result,
-      answerResult = _ref15$result === void 0 ? null : _ref15$result;
+    var answer = answers !== null && userAnswerIndex !== null ? answers[userAnswerIndex] : null;
+    var _ref14 = answer || {},
+      _ref14$result = _ref14.result,
+      answerResult = _ref14$result === void 0 ? null : _ref14$result;
     return answerResult || defaultResult;
   }, [hasDefaultResult, result, answers, userAnswerIndex]);
   var showReset = isEdit && userAnswerIndex !== null;
@@ -383,43 +382,43 @@ var SurveyScreen = function SurveyScreen(_ref) {
     className: styles.items
   }, (isPlaceholder ? _toConsumableArray(new Array(3)) : answers).map(function (answer, answerIndex) {
     var hasAnswer = answer !== null;
-    var _ref16 = answer || {},
-      _ref16$label = _ref16.label,
-      label = _ref16$label === void 0 ? null : _ref16$label,
-      _ref16$buttonStyle = _ref16.buttonStyle,
-      answerButtonStyle = _ref16$buttonStyle === void 0 ? null : _ref16$buttonStyle,
-      _ref16$textStyle = _ref16.textStyle,
-      answerButtonTextStyle = _ref16$textStyle === void 0 ? null : _ref16$textStyle,
-      _ref16$resultStyle = _ref16.resultStyle,
-      answerResultStyle = _ref16$resultStyle === void 0 ? null : _ref16$resultStyle;
-    var _ref17 = answerResultStyle || {},
-      _ref17$barColor = _ref17.barColor,
-      answerResultBarColor = _ref17$barColor === void 0 ? null : _ref17$barColor,
-      answerResultTextColor = _ref17.textColor,
-      _ref17$percentageText = _ref17.percentageTextStyle,
-      answerResultPercentageTextStyle = _ref17$percentageText === void 0 ? null : _ref17$percentageText;
-    var _ref18 = label || {},
-      _ref18$body = _ref18.body,
-      body = _ref18$body === void 0 ? null : _ref18$body;
-    var _ref19 = body !== null ? quizAnswersComputed[body] || {} : {},
-      _ref19$percent = _ref19.percent,
-      percent = _ref19$percent === void 0 ? 0 : _ref19$percent,
-      _ref19$count = _ref19.count,
-      count = _ref19$count === void 0 ? 0 : _ref19$count;
-    var _ref20 = label || {},
-      _ref20$textStyle = _ref20.textStyle,
-      textStyle = _ref20$textStyle === void 0 ? null : _ref20$textStyle;
-    var _ref21 = textStyle || {},
-      _ref21$color = _ref21.color,
-      labelColor = _ref21$color === void 0 ? null : _ref21$color;
+    var _ref15 = answer || {},
+      _ref15$label = _ref15.label,
+      label = _ref15$label === void 0 ? null : _ref15$label,
+      _ref15$buttonStyle = _ref15.buttonStyle,
+      answerButtonStyle = _ref15$buttonStyle === void 0 ? null : _ref15$buttonStyle,
+      _ref15$textStyle = _ref15.textStyle,
+      answerButtonTextStyle = _ref15$textStyle === void 0 ? null : _ref15$textStyle,
+      _ref15$resultStyle = _ref15.resultStyle,
+      answerResultStyle = _ref15$resultStyle === void 0 ? null : _ref15$resultStyle;
+    var _ref16 = answerResultStyle || {},
+      _ref16$barColor = _ref16.barColor,
+      answerResultBarColor = _ref16$barColor === void 0 ? null : _ref16$barColor,
+      answerResultTextColor = _ref16.textColor,
+      _ref16$percentageText = _ref16.percentageTextStyle,
+      answerResultPercentageTextStyle = _ref16$percentageText === void 0 ? null : _ref16$percentageText;
+    var _ref17 = label || {},
+      _ref17$body = _ref17.body,
+      body = _ref17$body === void 0 ? null : _ref17$body;
+    var _ref18 = body !== null ? quizAnswersComputed[body] || {} : {},
+      _ref18$percent = _ref18.percent,
+      percent = _ref18$percent === void 0 ? 0 : _ref18$percent,
+      _ref18$count = _ref18.count,
+      count = _ref18$count === void 0 ? 0 : _ref18$count;
+    var _ref19 = label || {},
+      _ref19$textStyle = _ref19.textStyle,
+      textStyle = _ref19$textStyle === void 0 ? null : _ref19$textStyle;
+    var _ref20 = textStyle || {},
+      _ref20$color = _ref20.color,
+      labelColor = _ref20$color === void 0 ? null : _ref20$color;
     var hasAnswerLabel = isTextFilled(label);
     var userAnswer = userAnswerIndex === answerIndex;
     var buttonStyles = _objectSpread(_objectSpread(_objectSpread({}, buttonsStyle), answerButtonStyle), answered ? {
       textAlign: 'left'
     } : null);
-    var _ref22 = buttonStyles || {},
-      _ref22$borderRadius = _ref22.borderRadius,
-      answerResultBorderRadius = _ref22$borderRadius === void 0 ? null : _ref22$borderRadius;
+    var _ref21 = buttonStyles || {},
+      _ref21$borderRadius = _ref21.borderRadius,
+      answerResultBorderRadius = _ref21$borderRadius === void 0 ? null : _ref21$borderRadius;
     var finalBarBorderRadius = answerResultBorderRadius !== null && isNumber(answerResultBorderRadius) && answerResultBorderRadius > 2 ? answerResultBorderRadius - 2 : answerResultBorderRadius;
     return /*#__PURE__*/React.createElement("div", {
       key: "answer-".concat(answerIndex + 1),

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/screen-survey",
-    "version": "0.3.682",
+    "version": "0.3.693",
     "private": false,
     "description": "",
     "keywords": [
@@ -74,9 +74,10 @@
         "@micromag/element-layout": "^0.3.679",
         "@micromag/element-scroll": "^0.3.679",
         "@micromag/element-text": "^0.3.679",
-        "@micromag/element-text-input": "^0.3.679",
+        "@micromag/element-text-input": "^0.3.683",
         "@micromag/transforms": "^0.3.679",
         "classnames": "^2.2.6",
+        "dompurify": "^3.2.6",
         "lodash": "^4.17.21",
         "prop-types": "^15.7.2",
         "react-intl": "^6.6.4",
@@ -86,5 +87,5 @@
         "access": "public",
         "registry": "https://registry.npmjs.org/"
     },
-    "gitHead": "ff77a57d44913b0e5afa373445ae9f014799e183"
+    "gitHead": "662297219d49d234efcc13ad507529d0ebff5427"
 }