@gamelearn/arcade-components 0.20.5 → 0.20.6

package/dist/components/pattern-component/components/PatternComponent.js

@@ -9,11 +9,27 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
 var PatternComponent = function PatternComponent(_ref) {
   var img = _ref.img,
       name = _ref.name,
       viewed = _ref.viewed,
-      emitEvent = _ref.emitEvent;
+      emitEvent = _ref.emitEvent,
+      soundActions = _ref.soundActions;
+
+  var _soundActions = _slicedToArray(soundActions, 1),
+      play = _soundActions[0];
 
   if (!img) {
     return null;
@@ -22,6 +38,7 @@ var PatternComponent = function PatternComponent(_ref) {
   var imgUrl = img.url;
 
   var close = function close() {
+    play('click-ui');
     emitEvent({
       type: 'emitSavePattern',
       payload: {

package/dist/components/pdf-component/components/PdfComponent.js

@@ -35,6 +35,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 var PdfComponent = function PdfComponent(_ref) {
   var emitEvent = _ref.emitEvent,
+      soundActions = _ref.soundActions,
       documentType = _ref.documentType,
       name = _ref.name,
       required = _ref.required,
@@ -42,7 +43,7 @@ var PdfComponent = function PdfComponent(_ref) {
       visible = _ref.visible,
       documentId = _ref.documentId,
       documentId_labelId = _ref.documentId_labelId,
-      props = _objectWithoutProperties(_ref, ["emitEvent", "documentType", "name", "required", "viewed", "visible", "documentId", "documentId_labelId"]);
+      props = _objectWithoutProperties(_ref, ["emitEvent", "soundActions", "documentType", "name", "required", "viewed", "visible", "documentId", "documentId_labelId"]);
 
   var translate = function translate(id) {
     return emitEvent({
@@ -51,6 +52,9 @@ var PdfComponent = function PdfComponent(_ref) {
     });
   };
 
+  var _soundActions = _slicedToArray(soundActions, 1),
+      play = _soundActions[0];
+
   var documentFile = props.document;
 
   var _ref2 = documentFile || '',
@@ -112,10 +116,14 @@ var PdfComponent = function PdfComponent(_ref) {
   }, /*#__PURE__*/_react.default.createElement("button", {
     type: "button",
     className: "gat--btn__round",
-    onClick: emitFinish
+    onClick: function onClick() {
+      emitFinish();
+      play('click-ui');
+    }
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: "icon-close"
   }))), url && /*#__PURE__*/_react.default.createElement(_PdfVisor.default, {
+    soundActions: soundActions,
     emitNumberOfPages: function emitNumberOfPages(e) {
       return readNumberOfPages(e);
     },

package/dist/components/pdf-component/components/PdfVisor.js

@@ -35,7 +35,8 @@ var PdfVisor = function PdfVisor(_ref) {
   var url = _ref.url,
       endPdf = _ref.endPdf,
       emitNumberOfPages = _ref.emitNumberOfPages,
-      translate = _ref.translate;
+      translate = _ref.translate,
+      soundActions = _ref.soundActions;
   var scrollElement = (0, _react.useRef)();
 
   var _useState = (0, _react.useState)(1),
@@ -54,6 +55,10 @@ var PdfVisor = function PdfVisor(_ref) {
       setCurrentPage = _useState6[1];
 
   var scale = (0, _deviceDetection.DeviceDetection)() ? 1 : 2;
+
+  var _soundActions = _slicedToArray(soundActions, 1),
+      play = _soundActions[0];
+
   var handleLoadSucess = (0, _react.useCallback)(function (pdf) {
     if (pdf.numPages) {
       emitNumberOfPages(pdf.numPages);
@@ -87,6 +92,7 @@ var PdfVisor = function PdfVisor(_ref) {
   };
 
   var turnPage = function turnPage(value) {
+    play('click-ui');
     scrollElement.current.scrollTo(0, 0);
     setOverlay(false);
     setCurrentPage(currentPage + value);

package/dist/components/rewards-component/components/RewardsComponent.js

@@ -37,7 +37,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 var RewardsComponent = function RewardsComponent(_ref) {
   var rewards = _ref.rewards,
-      emitEvent = _ref.emitEvent;
+      emitEvent = _ref.emitEvent,
+      soundActions = _ref.soundActions;
   var carouselRef = (0, _react.useRef)();
   var indicators = emitEvent({
     type: 'loadIndicators'
@@ -69,6 +70,10 @@ var RewardsComponent = function RewardsComponent(_ref) {
     return reward.type !== 'grade';
   });
   var rewardsUnified = [];
+
+  var _soundActions = _slicedToArray(soundActions, 1),
+      play = _soundActions[0];
+
   var displayingItems = 4;
 
   var getIndicator = function getIndicator(element) {
@@ -110,6 +115,7 @@ var RewardsComponent = function RewardsComponent(_ref) {
 
   var onClickPrev = function onClickPrev() {
     if (offset - 1 < 0) return;
+    play('click-ui');
     setOffset(offset - 1);
     var nextSize = Object.values(rewardsSize.current)[offset - 1];
     setRightAmount(null);
@@ -118,6 +124,7 @@ var RewardsComponent = function RewardsComponent(_ref) {
 
   var onClickNext = function onClickNext() {
     if (offset + displayingItems >= totalItems) return;
+    play('click-ui');
     setRightAmount(offset + displayingItems === totalItems - 1 ? 0 : null);
     setOffset(offset + 1);
     var nextSize = Object.values(rewardsSize.current)[offset];

package/dist/components/survey-component/components/SurveyComponent.js

@@ -58,7 +58,8 @@ var PAGES = [{
 }];
 
 var SurveyComponent = function SurveyComponent(_ref) {
-  var emitEvent = _ref.emitEvent;
+  var emitEvent = _ref.emitEvent,
+      soundActions = _ref.soundActions;
 
   var _useState = (0, _react.useState)(INIT_SURVEY),
       _useState2 = _slicedToArray(_useState, 2),
@@ -80,6 +81,9 @@ var SurveyComponent = function SurveyComponent(_ref) {
       finished = _useState8[0],
       finish = _useState8[1];
 
+  var _soundActions = _slicedToArray(soundActions, 1),
+      play = _soundActions[0];
+
   var translate = function translate(id, values) {
     return emitEvent({
       type: 'translate',
@@ -89,6 +93,8 @@ var SurveyComponent = function SurveyComponent(_ref) {
   };
 
   var changePage = function changePage() {
+    play('click-ui');
+
     if (page + 1 >= PAGES.length) {
       finish(true);
     } else {
@@ -137,6 +143,7 @@ var SurveyComponent = function SurveyComponent(_ref) {
     type: "button",
     disabled: disabled,
     onClick: function onClick() {
+      play('click-ui');
       emitEvent({
         type: 'saveSurvey',
         payload: survey

package/dist/components/terminal-puzzle-component/components/TerminalPuzzleComponent.js

@@ -101,6 +101,7 @@ var TerminalPuzzleComponent = function TerminalPuzzleComponent(_ref) {
     };
   }, [items]);
   var selectItem = (0, _react.useCallback)(function (item) {
+    playSound('click-ui');
     selectFile(item);
     setBreadcrumb([].concat(_toConsumableArray(breadcrumb), [item]));
 
@@ -111,7 +112,7 @@ var TerminalPuzzleComponent = function TerminalPuzzleComponent(_ref) {
       });
       disableExit(true);
     }
-  }, [breadcrumb, disableExit, emitEvent]);
+  }, [breadcrumb, disableExit, emitEvent, playSound]);
   (0, _react.useEffect)(function () {
     selectFile(initFile);
     setBreadcrumb([initFile]);
@@ -132,6 +133,7 @@ var TerminalPuzzleComponent = function TerminalPuzzleComponent(_ref) {
   };
 
   var closeFolder = function closeFolder() {
+    playSound('click-ui');
     var initItem = breadcrumb[0];
     selectFile(initItem);
     setBreadcrumb([initItem]);
@@ -162,6 +164,7 @@ var TerminalPuzzleComponent = function TerminalPuzzleComponent(_ref) {
     file: file,
     translate: translate
   })) : /*#__PURE__*/_react.default.createElement(_Visor.default, {
+    soundActions: soundActions,
     backFile: backFile,
     resolvePuzzle: resolvePuzzle,
     info: info,

package/dist/components/terminal-puzzle-component/components/Visor/index.js

@@ -43,27 +43,31 @@ var Visor = function Visor(_ref) {
       info = _ref.info,
       resolvePuzzle = _ref.resolvePuzzle,
       backFile = _ref.backFile,
-      translate = _ref.translate;
+      translate = _ref.translate,
+      soundActions = _ref.soundActions;
   var fileId = file.fileId;
   var url = ((_file$document = file.document) === null || _file$document === void 0 ? void 0 : _file$document.url) || '';
   var COMPONENTS = {
     image: {
       component: _Image.default,
       props: _objectSpread(_objectSpread({}, file), {}, {
-        url: url
+        url: url,
+        soundActions: soundActions
       })
     },
     video: {
       component: _videoVisor.default,
       props: _objectSpread(_objectSpread({}, file), {}, {
         url: url,
-        endVideo: resolvePuzzle
+        endVideo: resolvePuzzle,
+        soundActions: soundActions
       })
     },
     embedded_video: {
       component: _videoVisor.default,
       props: _objectSpread(_objectSpread({}, file), {}, {
-        url: url
+        url: url,
+        soundActions: soundActions
       })
     },
     pdf: {
@@ -71,6 +75,7 @@ var Visor = function Visor(_ref) {
       props: _objectSpread(_objectSpread({}, file), {}, {
         url: url,
         translate: translate,
+        soundActions: soundActions,
         emitNumberOfPages: function emitNumberOfPages() {},
         endPdf: function endPdf() {}
       })
@@ -80,6 +85,7 @@ var Visor = function Visor(_ref) {
       props: _objectSpread(_objectSpread({}, file), {}, {
         url: url,
         translate: translate,
+        soundActions: soundActions,
         emitNumberOfPages: function emitNumberOfPages() {},
         endPdf: function endPdf() {}
       })

package/dist/components/test-component/components/Container.js

@@ -44,7 +44,8 @@ var Container = function Container(_ref) {
       answerPage = _ref.answerPage,
       updateForm = _ref.updateForm,
       disabled = _ref.disabled,
-      translate = _ref.translate;
+      translate = _ref.translate,
+      soundActions = _ref.soundActions;
 
   var _useState = (0, _react.useState)(0),
       _useState2 = _slicedToArray(_useState, 2),
@@ -57,6 +58,10 @@ var Container = function Container(_ref) {
       setFeedback = _useState4[1];
 
   var qid = questions[currentQuestionId].id;
+
+  var _soundActions = _slicedToArray(soundActions, 1),
+      play = _soundActions[0];
+
   (0, _react.useEffect)(function () {
     if (time >= 0 && !disabled) {
       var timeout = setInterval(function () {
@@ -76,6 +81,8 @@ var Container = function Container(_ref) {
   }, [disabled, feedback, saveInterval, setTime, time]);
 
   var nextPage = function nextPage() {
+    play('click-ui');
+
     if (answered) {
       if (result[qid].feedback && !disabled) {
         setFeedback(true);
@@ -127,7 +134,7 @@ var Container = function Container(_ref) {
     className: "test--timer ".concat(time < 10 ? 'test--timer--finalseconds' : '')
   }, /*#__PURE__*/_react.default.createElement("div", {
     id: "test-time"
-  }, minutes < 10 ? "0".concat(minutes) : minutes, " :", ' ', seconds < 10 ? "0".concat(seconds) : seconds)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)), /*#__PURE__*/_react.default.createElement(_Questions.default, {
+  }, minutes < 10 ? "0".concat(minutes) : minutes, " : ", seconds < 10 ? "0".concat(seconds) : seconds)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)), /*#__PURE__*/_react.default.createElement(_Questions.default, {
     key: questions[currentQuestionId].id,
     result: result,
     disabled: disabled,
@@ -149,7 +156,11 @@ var Container = function Container(_ref) {
   })) : /*#__PURE__*/_react.default.createElement("button", {
     id: "finish-button",
     onClick: function onClick() {
-      return answered ? finishTest() : null;
+      play('click-ui');
+
+      if (answered) {
+        finishTest();
+      }
     },
     type: "button",
     className: "gat--btn__navigation ".concat(!answered ? 'disabled' : '')

package/dist/components/text-click-puzzle-component/components/TextClickPuzzleComponent.js

@@ -261,7 +261,8 @@ var TextClickPuzzleComponent = function TextClickPuzzleComponent(_ref) {
     });
     var specificWrongFeedback = (_list$currentSlide2 = list[currentSlide]) === null || _list$currentSlide2 === void 0 ? void 0 : (_list$currentSlide2$s = _list$currentSlide2.specificFeedbacks) === null || _list$currentSlide2$s === void 0 ? void 0 : _list$currentSlide2$s.wrongFeedbacks.find(function (fb) {
       return fb.id === id;
-    }); // si va en orden
+    });
+    playSound('click-ui'); // si va en orden
 
     if (list[currentSlide].hasClickOrder) {
       // y lo has hecho bien
@@ -315,7 +316,7 @@ var TextClickPuzzleComponent = function TextClickPuzzleComponent(_ref) {
 
         }
     }
-  }, [list, currentSlide, orderCounter, handleCorrectClick, emitEvent, translate, handleIncorrectClick]);
+  }, [list, currentSlide, orderCounter, handleCorrectClick, emitEvent, translate, handleIncorrectClick, playSound]);
   var recursiveStuff = (0, _react.useCallback)(function (jsx) {
     return (0, _utils.getRecursiveJSX)(jsx, 0, list[currentSlide], onClickMark);
   }, [currentSlide, list, onClickMark]);

package/dist/components/url-component/components/UrlComponent.js

@@ -34,7 +34,8 @@ var UrlComponent = function UrlComponent(_ref) {
       text = _ref.text,
       text_labelId = _ref.text_labelId,
       viewed = _ref.viewed,
-      documentType = _ref.documentType;
+      documentType = _ref.documentType,
+      soundActions = _ref.soundActions;
   var item = {
     documentType: documentType,
     name: name_labelId,
@@ -43,7 +44,11 @@ var UrlComponent = function UrlComponent(_ref) {
     type: 'url'
   };
 
+  var _soundActions = _slicedToArray(soundActions, 1),
+      play = _soundActions[0];
+
   var close = function close() {
+    play('click-ui');
     emitEvent({
       type: 'finishMedia',
       payload: item
@@ -86,6 +91,7 @@ var UrlComponent = function UrlComponent(_ref) {
     target: "_blank",
     rel: "noopener noreferrer",
     onClick: function onClick() {
+      play('click-ui');
       setClicked(true);
     }
   }, link)))));

package/dist/components/video-component/components/VideoComponent.js

@@ -23,6 +23,7 @@ var VideoComponent = function VideoComponent(_ref) {
       documentType = _ref.documentType,
       document = _ref.document,
       documentId_labelId = _ref.documentId_labelId,
+      soundActions = _ref.soundActions,
       required = _ref.required,
       viewed = _ref.viewed,
       visible = _ref.visible,
@@ -61,6 +62,7 @@ var VideoComponent = function VideoComponent(_ref) {
   return /*#__PURE__*/_react.default.createElement(_videoVisor.default, {
     backgroundImage: img === null || img === void 0 ? void 0 : img.url,
     url: url,
+    soundActions: soundActions,
     documentType: documentType,
     required: required,
     viewed: viewed,

package/dist/components/video-visor/components/VideoControllers/ControlButtons.js

@@ -7,8 +7,6 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var ControlButtons = function ControlButtons(_ref) {
@@ -28,9 +26,5 @@ ControlButtons.defaultProps = {
   paused: false,
   pauseVideo: function pauseVideo() {}
 };
-ControlButtons.propTypes = {
-  paused: _propTypes.default.bool,
-  pauseVideo: _propTypes.default.func
-};
 var _default = ControlButtons;
 exports.default = _default;

package/dist/components/video-visor/components/VideoControllers/FinishedVideoButtons.js

@@ -7,8 +7,6 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var FinishedVideoButtons = function FinishedVideoButtons(_ref) {
@@ -37,9 +35,5 @@ FinishedVideoButtons.defaultProps = {
   restart: function restart() {},
   finished: false
 };
-FinishedVideoButtons.propTypes = {
-  restart: _propTypes.default.func,
-  finished: _propTypes.default.bool
-};
 var _default = FinishedVideoButtons;
 exports.default = _default;

package/dist/components/video-visor/components/VideoControllers/PlayInitButton.js

@@ -7,8 +7,6 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var PlayInitButton = function PlayInitButton(_ref) {
@@ -37,10 +35,5 @@ PlayInitButton.defaultProps = {
   finished: false,
   paused: false
 };
-PlayInitButton.propTypes = {
-  play: _propTypes.default.func,
-  finished: _propTypes.default.bool,
-  paused: _propTypes.default.bool
-};
 var _default = PlayInitButton;
 exports.default = _default;

package/dist/components/video-visor/components/VideoControllers/SkipButton.js

@@ -7,8 +7,6 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 var skipButton = function skipButton(_ref) {
@@ -34,11 +32,5 @@ skipButton.defaultProps = {
   finished: false,
   skip: function skip() {}
 };
-skipButton.propTypes = {
-  mandatory: _propTypes.default.bool,
-  viewed: _propTypes.default.bool,
-  finished: _propTypes.default.bool,
-  skip: _propTypes.default.func
-};
 var _default = skipButton;
 exports.default = _default;

package/dist/components/video-visor/components/VideoVisor.js

@@ -33,7 +33,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "und
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-var defaultBgImageForAudio = "https://min.gamelearn.io/css-resources/gamelearn/resources/bgAudioPiece.jpg";
+var defaultBgImageForAudio = 'https://min.gamelearn.io/css-resources/gamelearn/resources/bgAudioPiece.jpg';
 
 var VideoVisor = function VideoVisor(_ref) {
   var documentType = _ref.documentType,
@@ -41,8 +41,12 @@ var VideoVisor = function VideoVisor(_ref) {
       required = _ref.required,
       viewed = _ref.viewed,
       backgroundImage = _ref.backgroundImage,
+      soundActions = _ref.soundActions,
       endVideo = _ref.endVideo;
 
+  var _soundActions = _slicedToArray(soundActions, 1),
+      playSound = _soundActions[0];
+
   var _useState = (0, _react.useState)(0),
       _useState2 = _slicedToArray(_useState, 2),
       duration = _useState2[0],
@@ -93,8 +97,8 @@ var VideoVisor = function VideoVisor(_ref) {
     },
     src: url,
     style: {
-      height: "100%",
-      width: "100%"
+      height: '100%',
+      width: '100%'
     }
   };
 
@@ -105,7 +109,7 @@ var VideoVisor = function VideoVisor(_ref) {
     setIsFinish(true);
     hideControls(false);
 
-    if (documentType !== "document" && documentType !== "lesson") {
+    if (documentType !== 'document' && documentType !== 'lesson') {
       endVideo();
     }
   };
@@ -161,6 +165,8 @@ var VideoVisor = function VideoVisor(_ref) {
   };
 
   var pause = function pause() {
+    playSound('click-ui');
+
     if (paused) {
       videoPlayer.play();
       setIsFinish(false);
@@ -183,6 +189,7 @@ var VideoVisor = function VideoVisor(_ref) {
   };
 
   var mute = function mute() {
+    playSound('click-ui');
     videoPlayer.muted = !videoPlayer.muted;
   };
 
@@ -215,12 +222,12 @@ var VideoVisor = function VideoVisor(_ref) {
   };
 
   var audioBackgroundImage = backgroundImage || defaultBgImageForAudio;
-  var CoverOrContain = audioBackgroundImage === defaultBgImageForAudio ? "cover" : "contain";
+  var CoverOrContain = audioBackgroundImage === defaultBgImageForAudio ? 'cover' : 'contain';
   var configForAudio = {
     backgroundImage: "url(\"".concat(audioBackgroundImage, "\")"),
     backgroundSize: CoverOrContain,
-    backgroundRepeat: "no-repeat",
-    backgroundPosition: "center center"
+    backgroundRepeat: 'no-repeat',
+    backgroundPosition: 'center center'
   };
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "video",
@@ -250,7 +257,8 @@ var VideoVisor = function VideoVisor(_ref) {
       return handleHideControls();
     },
     onClick: function onClick() {
-      return handleHideControls();
+      handleHideControls();
+      playSound('click-ui');
     },
     onCanPlayThrough: onCanPlay,
     onWaiting: onWaiting,
@@ -275,7 +283,10 @@ var VideoVisor = function VideoVisor(_ref) {
     className: "position--absolute right top z-index1"
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "gat--btn__round",
-    onClick: endVideo
+    onClick: function onClick() {
+      playSound('click-ui');
+      endVideo();
+    }
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: "icon-close"
   }))), /*#__PURE__*/_react.default.createElement("iframe", _extends({
@@ -285,10 +296,10 @@ var VideoVisor = function VideoVisor(_ref) {
 };
 
 VideoVisor.defaultProps = {
-  url: "",
-  name: "",
+  url: '',
+  name: '',
   backgroundImage: null,
-  documentType: "",
+  documentType: '',
   required: false,
   viewed: false,
   endVideo: function endVideo() {}

package/dist/components/web-builder-puzzle-component/Popups/PopupColorComponent/index.js

@@ -33,7 +33,11 @@ var PopupColorComponent = function PopupColorComponent(_ref) {
   var colors = _ref.colors,
       onSave = _ref.onSave,
       closingAction = _ref.closingAction,
-      translate = _ref.translate;
+      translate = _ref.translate,
+      soundActions = _ref.soundActions;
+
+  var _soundActions = _slicedToArray(soundActions, 1),
+      playSound = _soundActions[0];
 
   var _useState = (0, _react.useState)(),
       _useState2 = _slicedToArray(_useState, 2),
@@ -80,6 +84,7 @@ var PopupColorComponent = function PopupColorComponent(_ref) {
     type: "button",
     className: "gat--btn gat--btn__primary ".concat(disabled ? 'disabled' : ''),
     onClick: !disabled ? function () {
+      playSound('click-ui');
       onSave(selected);
     } : null
   }, translate('webbuilder.save')))));

package/dist/components/web-builder-puzzle-component/Popups/PopupImageComponent/index.js

@@ -9,8 +9,6 @@ exports.default = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _resourcePath = _interopRequireDefault(require("../../Templates/resourcePath"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -35,7 +33,11 @@ var PopupImageComponent = function PopupImageComponent(_ref) {
   var images = _ref.images,
       onSave = _ref.onSave,
       closingAction = _ref.closingAction,
-      translate = _ref.translate;
+      translate = _ref.translate,
+      soundActions = _ref.soundActions;
+
+  var _soundActions = _slicedToArray(soundActions, 1),
+      playSound = _soundActions[0];
 
   var _useState = (0, _react.useState)(),
       _useState2 = _slicedToArray(_useState, 2),
@@ -91,6 +93,7 @@ var PopupImageComponent = function PopupImageComponent(_ref) {
     type: "button",
     className: "gat--btn gat--btn__primary ".concat(disabled ? 'disabled' : ''),
     onClick: !disabled ? function () {
+      playSound('click-ui');
       onSave(selected.src);
     } : null
   }, translate('webbuilder.open'))))));
@@ -101,13 +104,5 @@ PopupImageComponent.defaultProps = {
   onSave: function onSave() {},
   images: []
 };
-PopupImageComponent.propTypes = {
-  closingAction: _propTypes.default.func,
-  onSave: _propTypes.default.func,
-  images: _propTypes.default.arrayOf(_propTypes.default.shape({
-    name: _propTypes.default.string,
-    src: _propTypes.default.string
-  }))
-};
 var _default = PopupImageComponent;
 exports.default = _default;

package/dist/components/web-builder-puzzle-component/Popups/PopupTextComponent/index.js

@@ -29,7 +29,11 @@ var PopupTextComponent = function PopupTextComponent(_ref) {
   var closingAction = _ref.closingAction,
       onSave = _ref.onSave,
       options = _ref.options,
-      translate = _ref.translate;
+      translate = _ref.translate,
+      soundActions = _ref.soundActions;
+
+  var _soundActions = _slicedToArray(soundActions, 1),
+      playSound = _soundActions[0];
 
   var _useState = (0, _react.useState)(''),
       _useState2 = _slicedToArray(_useState, 2),
@@ -113,6 +117,7 @@ var PopupTextComponent = function PopupTextComponent(_ref) {
     className: "gat--btn gat--btn__primary ".concat(disabled ? 'disabled' : ''),
     disabled: disabled,
     onClick: function onClick() {
+      playSound('click-ui');
       onSave(selected);
     }
   }, translate('webbuilder.save')))));