@micromag/screen-survey 0.2.333 → 0.2.353

package/es/index.js

@@ -383,11 +383,12 @@ var SurveyScreen = function SurveyScreen(_ref) {
   return /*#__PURE__*/React.createElement("div", {
     className: classNames([styles.container, (_ref11 = {}, _defineProperty(_ref11, className, className !== null), _defineProperty(_ref11, styles.answered, answered), _defineProperty(_ref11, styles.isPlaceholder, isPlaceholder), _ref11)]),
     "data-screen-ready": ready
-  }, !isPlaceholder ? /*#__PURE__*/React.createElement(Background, Object.assign({}, background, {
+  }, !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
+    background: background,
     width: width,
     height: height,
     playing: backgroundPlaying
-  })) : null, /*#__PURE__*/React.createElement(Container, {
+  }) : null, /*#__PURE__*/React.createElement(Container, {
     width: width,
     height: height
   }, /*#__PURE__*/React.createElement(Layout, {
@@ -486,5 +487,4 @@ var definition = {
   }]
 };
 
-export default definition;
-export { SurveyScreen };
+export { SurveyScreen, definition as default };

package/lib/index.js

@@ -44,20 +44,20 @@ var CallToAction__default = /*#__PURE__*/_interopDefaultLegacy(CallToAction);
 var styles = {"container":"micromag-screen-survey-container","disabled":"micromag-screen-survey-disabled","hidden":"micromag-screen-survey-hidden","placeholder":"micromag-screen-survey-placeholder","content":"micromag-screen-survey-content","emptyAnswer":"micromag-screen-survey-emptyAnswer","emptyQuestion":"micromag-screen-survey-emptyQuestion","question":"micromag-screen-survey-question","answers":"micromag-screen-survey-answers","items":"micromag-screen-survey-items","item":"micromag-screen-survey-item","placeholderAnswer":"micromag-screen-survey-placeholderAnswer","itemContent":"micromag-screen-survey-itemContent","resultContainer":"micromag-screen-survey-resultContainer","resultContent":"micromag-screen-survey-resultContent","result":"micromag-screen-survey-result","resultLabel":"micromag-screen-survey-resultLabel","itemInner":"micromag-screen-survey-itemInner","button":"micromag-screen-survey-button","itemLabel":"micromag-screen-survey-itemLabel","answered":"micromag-screen-survey-answered","isPlaceholder":"micromag-screen-survey-isPlaceholder","layout":"micromag-screen-survey-layout"};
 
 var propTypes = {
-  id: PropTypes__default['default'].string,
-  layout: PropTypes__default['default'].oneOf(['top', 'middle', 'bottom', 'split']),
+  id: PropTypes__default["default"].string,
+  layout: PropTypes__default["default"].oneOf(['top', 'middle', 'bottom', 'split']),
   question: core.PropTypes.textElement,
   answers: core.PropTypes.answers,
-  spacing: PropTypes__default['default'].number,
+  spacing: PropTypes__default["default"].number,
   background: core.PropTypes.backgroundElement,
   callToAction: core.PropTypes.callToAction,
-  withPercentLabels: PropTypes__default['default'].bool,
-  current: PropTypes__default['default'].bool,
+  withPercentLabels: PropTypes__default["default"].bool,
+  current: PropTypes__default["default"].bool,
   transitions: core.PropTypes.transitions,
-  transitionStagger: PropTypes__default['default'].number,
-  resultTransitionDuration: PropTypes__default['default'].number,
-  type: PropTypes__default['default'].string,
-  className: PropTypes__default['default'].string
+  transitionStagger: PropTypes__default["default"].number,
+  resultTransitionDuration: PropTypes__default["default"].number,
+  type: PropTypes__default["default"].string,
+  className: PropTypes__default["default"].string
 };
 var defaultProps = {
   id: null,
@@ -132,7 +132,7 @@ var SurveyScreen = function SurveyScreen(_ref) {
   var showInstantAnswer = isStatic || isCapture;
 
   var _useState = React.useState(showInstantAnswer ? -1 : null),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
+      _useState2 = _slicedToArray__default["default"](_useState, 2),
       userAnswerIndex = _useState2[0],
       setUserAnswerIndex = _useState2[1];
 
@@ -161,7 +161,7 @@ var SurveyScreen = function SurveyScreen(_ref) {
       var countWithUser = i === userAnswerIndex ? count + 1 : count;
 
       if (body !== null) {
-        return _objectSpread__default['default'](_objectSpread__default['default']({}, answersTotal), {}, _defineProperty__default['default']({}, body, {
+        return _objectSpread__default["default"](_objectSpread__default["default"]({}, answersTotal), {}, _defineProperty__default["default"]({}, body, {
           percent: total > 0 ? countWithUser / total * 100 : 0,
           count: countWithUser
         }));
@@ -174,7 +174,7 @@ var SurveyScreen = function SurveyScreen(_ref) {
     }) : [];
     var evenlySplit = utils.getLargestRemainderRound(quizAnswersPct, 100);
     return Object.keys(computed).reduce(function (acc, key, i) {
-      return _objectSpread__default['default'](_objectSpread__default['default']({}, acc), {}, _defineProperty__default['default']({}, key, _objectSpread__default['default'](_objectSpread__default['default']({}, computed[key]), {}, {
+      return _objectSpread__default["default"](_objectSpread__default["default"]({}, acc), {}, _defineProperty__default["default"]({}, key, _objectSpread__default["default"](_objectSpread__default["default"]({}, computed[key]), {}, {
         percent: evenlySplit[i]
       })));
     }, {});
@@ -206,10 +206,10 @@ var SurveyScreen = function SurveyScreen(_ref) {
     }
   }, [isEdit, current, userAnswerIndex, setUserAnswerIndex]); // Question
 
-  var items = [/*#__PURE__*/React__default['default'].createElement(components.ScreenElement, {
+  var items = [/*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
     key: "question",
     placeholder: "title",
-    emptyLabel: /*#__PURE__*/React__default['default'].createElement(reactIntl.FormattedMessage, {
+    emptyLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
       id: "e1I+KU",
       defaultMessage: [{
         "type": 0,
@@ -218,16 +218,16 @@ var SurveyScreen = function SurveyScreen(_ref) {
     }),
     emptyClassName: styles.emptyQuestion,
     isEmpty: !hasQuestion
-  }, hasQuestion ? /*#__PURE__*/React__default['default'].createElement(components.Transitions, {
+  }, hasQuestion ? /*#__PURE__*/React__default["default"].createElement(components.Transitions, {
     transitions: transitions,
     playing: transitionPlaying,
     disabled: transitionDisabled
-  }, /*#__PURE__*/React__default['default'].createElement(Heading__default['default'], Object.assign({}, question, {
+  }, /*#__PURE__*/React__default["default"].createElement(Heading__default["default"], Object.assign({}, question, {
     className: styles.question
   }))) : null)];
 
   if (isSplitted || !isPlaceholder && hasCallToAction && isMiddleLayout) {
-    items.push( /*#__PURE__*/React__default['default'].createElement(Layout.Spacer, {
+    items.push( /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
       key: "spacer"
     }));
   } // Answer
@@ -237,14 +237,14 @@ var SurveyScreen = function SurveyScreen(_ref) {
   var labelsRefs = React.useRef([]);
 
   var _useState3 = React.useState(null),
-      _useState4 = _slicedToArray__default['default'](_useState3, 2),
+      _useState4 = _slicedToArray__default["default"](_useState3, 2),
       buttonMaxWidth = _useState4[0],
       setButtonMaxWidth = _useState4[1];
 
   var finalTransitionDuration = showInstantAnswer ? 0 : "".concat(resultTransitionDuration, "ms");
 
   var _useState5 = React.useState(false),
-      _useState6 = _slicedToArray__default['default'](_useState5, 2),
+      _useState6 = _slicedToArray__default["default"](_useState5, 2),
       ready = _useState6[0],
       setReady = _useState6[1];
 
@@ -268,12 +268,12 @@ var SurveyScreen = function SurveyScreen(_ref) {
     });
     setReady(true);
   }, [answers, width, height, setButtonMaxWidth, finalTransitionDuration, isPlaceholder]);
-  items.push( /*#__PURE__*/React__default['default'].createElement("div", {
+  items.push( /*#__PURE__*/React__default["default"].createElement("div", {
     key: "answers",
     className: styles.answers
-  }, answers !== null || isPlaceholder ? /*#__PURE__*/React__default['default'].createElement("div", {
+  }, answers !== null || isPlaceholder ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: styles.items
-  }, (isPlaceholder ? _toConsumableArray__default['default'](new Array(3)) : answers).map(function (answer, answerIndex) {
+  }, (isPlaceholder ? _toConsumableArray__default["default"](new Array(3)) : answers).map(function (answer, answerIndex) {
     var hasAnswer = answer !== null;
 
     var _ref6 = answer || {},
@@ -298,16 +298,16 @@ var SurveyScreen = function SurveyScreen(_ref) {
 
     var hasAnswerLabel = utils.isTextFilled(label);
     var userAnswer = userAnswerIndex === answerIndex;
-    return /*#__PURE__*/React__default['default'].createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       key: "answer-".concat(answerIndex),
-      className: classNames__default['default']([styles.item, {// [styles.userAnswer]: userAnswer,
+      className: classNames__default["default"]([styles.item, {// [styles.userAnswer]: userAnswer,
       }])
-    }, /*#__PURE__*/React__default['default'].createElement(components.ScreenElement, {
+    }, /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
       placeholder: "surveyAnswer",
       placeholderProps: {
         className: styles.placeholderAnswer
       },
-      emptyLabel: /*#__PURE__*/React__default['default'].createElement(reactIntl.FormattedMessage, {
+      emptyLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
         id: "+Ok+7S",
         defaultMessage: [{
           "type": 0,
@@ -316,20 +316,20 @@ var SurveyScreen = function SurveyScreen(_ref) {
       }),
       emptyClassName: styles.emptyAnswer,
       isEmpty: !hasAnswerLabel
-    }, hasAnswer ? /*#__PURE__*/React__default['default'].createElement(components.Transitions, {
+    }, hasAnswer ? /*#__PURE__*/React__default["default"].createElement(components.Transitions, {
       transitions: transitions,
       playing: transitionPlaying,
       delay: (answerIndex + 1) * transitionStagger,
       disabled: transitionDisabled
-    }, /*#__PURE__*/React__default['default'].createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: styles.itemContent
-    }, /*#__PURE__*/React__default['default'].createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: styles.itemInner,
       style: {
         width: answered ? buttonMaxWidth : null,
         transitionDuration: finalTransitionDuration
       }
-    }, /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
+    }, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
       className: styles.button,
       onClick: function onClick() {
         return onAnswerClick(answerIndex);
@@ -344,35 +344,35 @@ var SurveyScreen = function SurveyScreen(_ref) {
         borderStyle: 'solid',
         borderColor: labelColor
       } : null
-    }, /*#__PURE__*/React__default['default'].createElement("span", {
+    }, /*#__PURE__*/React__default["default"].createElement("span", {
       className: styles.itemLabel,
       ref: function ref(el) {
         labelsRefs.current[answerIndex] = el;
       }
-    }, /*#__PURE__*/React__default['default'].createElement(Text__default['default'], Object.assign({}, label, {
-      textStyle: _objectSpread__default['default'](_objectSpread__default['default']({}, textStyle), {}, {
+    }, /*#__PURE__*/React__default["default"].createElement(Text__default["default"], Object.assign({}, label, {
+      textStyle: _objectSpread__default["default"](_objectSpread__default["default"]({}, textStyle), {}, {
         color: userAnswer || !answered ? labelColor : null
       }),
       inline: true,
       className: styles.itemText
-    }))))), /*#__PURE__*/React__default['default'].createElement("div", {
+    }))))), /*#__PURE__*/React__default["default"].createElement("div", {
       className: styles.resultContainer,
       style: {
         transitionDuration: finalTransitionDuration
       }
-    }, /*#__PURE__*/React__default['default'].createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: styles.resultContent,
       style: {
         transitionDelay: finalTransitionDuration,
         transitionDuration: finalTransitionDuration
       }
-    }, /*#__PURE__*/React__default['default'].createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: styles.result,
       style: {
         width: "".concat(percent, "%"),
         backgroundColor: userAnswer ? labelColor : null
       }
-    }, withPercentLabels ? /*#__PURE__*/React__default['default'].createElement("div", {
+    }, withPercentLabels ? /*#__PURE__*/React__default["default"].createElement("div", {
       className: styles.resultLabel,
       style: {
         color: userAnswer ? labelColor : null
@@ -382,18 +382,18 @@ var SurveyScreen = function SurveyScreen(_ref) {
 
   if (!isPlaceholder && hasCallToAction) {
     if (isTopLayout || isMiddleLayout) {
-      items.push( /*#__PURE__*/React__default['default'].createElement(Layout.Spacer, {
+      items.push( /*#__PURE__*/React__default["default"].createElement(Layout.Spacer, {
         key: "spacer-cta-bottom"
       }));
     }
 
-    items.push( /*#__PURE__*/React__default['default'].createElement("div", {
+    items.push( /*#__PURE__*/React__default["default"].createElement("div", {
       style: {
         margin: -spacing,
         marginTop: 0
       },
       key: "call-to-action"
-    }, /*#__PURE__*/React__default['default'].createElement(CallToAction__default['default'], {
+    }, /*#__PURE__*/React__default["default"].createElement(CallToAction__default["default"], {
       callToAction: callToAction,
       disabled: !answered,
       animationDisabled: isPreview,
@@ -401,17 +401,18 @@ var SurveyScreen = function SurveyScreen(_ref) {
     })));
   }
 
-  return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classNames__default['default']([styles.container, (_ref11 = {}, _defineProperty__default['default'](_ref11, className, className !== null), _defineProperty__default['default'](_ref11, styles.answered, answered), _defineProperty__default['default'](_ref11, styles.isPlaceholder, isPlaceholder), _ref11)]),
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames__default["default"]([styles.container, (_ref11 = {}, _defineProperty__default["default"](_ref11, className, className !== null), _defineProperty__default["default"](_ref11, styles.answered, answered), _defineProperty__default["default"](_ref11, styles.isPlaceholder, isPlaceholder), _ref11)]),
     "data-screen-ready": ready
-  }, !isPlaceholder ? /*#__PURE__*/React__default['default'].createElement(Background__default['default'], Object.assign({}, background, {
+  }, !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
+    background: background,
     width: width,
     height: height,
     playing: backgroundPlaying
-  })) : null, /*#__PURE__*/React__default['default'].createElement(Container__default['default'], {
+  }) : null, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
     width: width,
     height: height
-  }, /*#__PURE__*/React__default['default'].createElement(Layout__default['default'], {
+  }, /*#__PURE__*/React__default["default"].createElement(Layout__default["default"], {
     className: styles.layout,
     fullscreen: true,
     verticalAlign: verticalAlign,
@@ -508,4 +509,4 @@ var definition = {
 };
 
 exports.SurveyScreen = SurveyScreen;
-exports.default = definition;
+exports["default"] = definition;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/screen-survey",
-    "version": "0.2.333",
+    "version": "0.2.353",
     "description": "",
     "keywords": [
         "javascript"
@@ -40,25 +40,25 @@
         "prepare": "../../scripts/prepare-package.sh"
     },
     "devDependencies": {
-        "react": "^16.8.0",
-        "react-dom": "^16.8.0"
+        "react": "^16.8.0 || ^17.0.0",
+        "react-dom": "^16.8.0 || ^17.0.0"
     },
     "peerDependencies": {
-        "react": "^16.8.0",
-        "react-dom": "^16.8.0"
+        "react": "^16.8.0 || ^17.0.0",
+        "react-dom": "^16.8.0 || ^17.0.0"
     },
     "dependencies": {
         "@babel/runtime": "^7.13.10",
-        "@micromag/core": "^0.2.330",
-        "@micromag/data": "^0.2.330",
-        "@micromag/element-background": "^0.2.333",
-        "@micromag/element-button": "^0.2.330",
-        "@micromag/element-call-to-action": "^0.2.330",
-        "@micromag/element-container": "^0.2.330",
-        "@micromag/element-heading": "^0.2.330",
-        "@micromag/element-layout": "^0.2.330",
-        "@micromag/element-text": "^0.2.330",
-        "@micromag/transforms": "^0.2.330",
+        "@micromag/core": "^0.2.353",
+        "@micromag/data": "^0.2.353",
+        "@micromag/element-background": "^0.2.353",
+        "@micromag/element-button": "^0.2.353",
+        "@micromag/element-call-to-action": "^0.2.353",
+        "@micromag/element-container": "^0.2.353",
+        "@micromag/element-heading": "^0.2.353",
+        "@micromag/element-layout": "^0.2.353",
+        "@micromag/element-text": "^0.2.353",
+        "@micromag/transforms": "^0.2.353",
         "classnames": "^2.2.6",
         "lodash": "^4.17.20",
         "prop-types": "^15.7.2",
@@ -68,5 +68,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "f4cc0b72ff60c80cd5628963a7e5ad82edf6acba"
+    "gitHead": "2fa5d38251980ca054d584adcb07e9fbe703299f"
 }