@gamelearn/arcade-components 1.13.0 → 1.15.0

package/dist/components/comic-component/components/ComicComponent.js

@@ -11,7 +11,7 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _useTimeout2 = _interopRequireDefault(require("../../../helpers/useTimeout"));
 
-var _useEkho2 = _interopRequireDefault(require("../../../helpers/useEkho"));
+var _useEkho = _interopRequireDefault(require("../../../helpers/useEkho"));
 
 var _Slide = _interopRequireDefault(require("./Slide"));
 
@@ -99,40 +99,41 @@ var ComicComponent = function ComicComponent(_ref) {
     goToPreviousSlide();
   };
 
-  var _useEkho = (0, _useEkho2.default)({
+  (0, _useEkho.default)({
     audioType: slides === null || slides === void 0 ? void 0 : (_slides$slideCount = slides[slideCount]) === null || _slides$slideCount === void 0 ? void 0 : _slides$slideCount.audioType,
     voice: slides === null || slides === void 0 ? void 0 : (_slides$slideCount2 = slides[slideCount]) === null || _slides$slideCount2 === void 0 ? void 0 : _slides$slideCount2.voice,
     text: slides === null || slides === void 0 ? void 0 : (_slides$slideCount3 = slides[slideCount]) === null || _slides$slideCount3 === void 0 ? void 0 : (_slides$slideCount3$v = _slides$slideCount3.vignettes[0].textData) === null || _slides$slideCount3$v === void 0 ? void 0 : _slides$slideCount3$v.text,
     audio: slides === null || slides === void 0 ? void 0 : (_slides$slideCount4 = slides[slideCount]) === null || _slides$slideCount4 === void 0 ? void 0 : _slides$slideCount4.audio,
     soundActions: soundActions,
-    emitEvent: emitEvent
-  }),
-      onFinish = _useEkho.onFinish;
+    emitEvent: emitEvent,
+    onFinish: function onFinish() {
+      var _slides$slideCount5;
 
+      if (automatic && (slides === null || slides === void 0 ? void 0 : (_slides$slideCount5 = slides[slideCount]) === null || _slides$slideCount5 === void 0 ? void 0 : _slides$slideCount5.audioType) !== 'none') {
+        goToNextSlide();
+      }
+    }
+  });
   (0, _react.useEffect)(function () {
     var slide = slides === null || slides === void 0 ? void 0 : slides[slideCount];
 
-    if (automatic) {
-      if (!Object.keys(slide.voice || {}).length) {
-        var _slide$vignettes$, _slide$vignettes$$tex;
+    if (automatic && ((slide === null || slide === void 0 ? void 0 : slide.audioType) === 'none' || !(slide !== null && slide !== void 0 && slide.audioType))) {
+      var _slide$vignettes$, _slide$vignettes$$tex;
 
-        var time = characterMs * ((slide === null || slide === void 0 ? void 0 : (_slide$vignettes$ = slide.vignettes[0]) === null || _slide$vignettes$ === void 0 ? void 0 : (_slide$vignettes$$tex = _slide$vignettes$.textData) === null || _slide$vignettes$$tex === void 0 ? void 0 : _slide$vignettes$$tex.text.length) || 0);
-        start(goToNextSlide, time < 1400 ? 1400 : time);
-      } else {
-        onFinish(goToNextSlide);
-      }
+      var time = characterMs * ((slide === null || slide === void 0 ? void 0 : (_slide$vignettes$ = slide.vignettes[0]) === null || _slide$vignettes$ === void 0 ? void 0 : (_slide$vignettes$$tex = _slide$vignettes$.textData) === null || _slide$vignettes$$tex === void 0 ? void 0 : _slide$vignettes$$tex.text.length) || 0);
+      start(goToNextSlide, time < 1400 ? 1400 : time);
     }
 
     return function () {
       stop();
     };
-  }, [automatic, goToNextSlide, onFinish, slideCount, slides, start, stop]);
+  }, [automatic, goToNextSlide, slideCount, slides, start, stop]);
   if (!(slides !== null && slides !== void 0 && slides.length)) return null;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "comic component growIn-animation"
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "comic--slider"
-  }, /*#__PURE__*/_react.default.createElement(_Slide.default, {
+  }, slides[slideCount] && /*#__PURE__*/_react.default.createElement(_Slide.default, {
     key: "comic page ".concat(slides[slideCount].slideOrder),
     slide: slides[slideCount],
     transition: slideTransition,

package/dist/components/conversational-pro-component/components/ConversationalProComponent.js

@@ -277,17 +277,23 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
     handleClickBack();
   };
 
+  var autoplayCond = automatic && !isDecision;
   (0, _useEkho.default)({
     audioType: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType,
     voice: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.voice,
     text: currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.text,
     audio: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audio,
     soundActions: soundActions,
-    emitEvent: emitEvent
+    emitEvent: emitEvent,
+    onFinish: function onFinish() {
+      if (autoplayCond && (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) !== 'none') {
+        handleClickNext();
+      }
+    }
   }); // Autoplay logic
 
   (0, _react.useEffect)(function () {
-    if (automatic && !isDecision) {
+    if (autoplayCond && (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none') {
       var _currentMessage$text;
 
       var time = characterMs * ((currentMessage === null || currentMessage === void 0 ? void 0 : (_currentMessage$text = currentMessage.text) === null || _currentMessage$text === void 0 ? void 0 : _currentMessage$text.length) || 0);
@@ -297,7 +303,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
     return function () {
       stop();
     };
-  }, [currentMessage, automatic, isDecision, start, stop, handleClickNext]);
+  }, [currentMessage, start, stop, handleClickNext, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType, autoplayCond]);
 
   var decisionPayload = _objectSpread(_objectSpread({}, currentLineData.payload), {}, {
     required: !isBranched,

package/dist/components/dialog-component/components/DialogComponent.js

@@ -437,7 +437,8 @@ var DialogComponent = function DialogComponent(_ref) {
         });
       }
     }
-  }, [actors, camera, currentLine, zoomInActor, getCurrentVisible, translate, getAvatarURL, loadEmotion, resetCameraView, isDecision, isVoiceOver]); // Sound logic
+  }, [actors, camera, currentLine, zoomInActor, getCurrentVisible, translate, getAvatarURL, loadEmotion, resetCameraView, isDecision, isVoiceOver]);
+  var autoPlayCond = automatic && currentMessage.show && !currentLine.decision; // Sound logic
 
   (0, _useEkho.default)({
     audioType: currentLine === null || currentLine === void 0 ? void 0 : currentLine.audioType,
@@ -445,11 +446,16 @@ var DialogComponent = function DialogComponent(_ref) {
     text: currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.text,
     audio: currentLine === null || currentLine === void 0 ? void 0 : currentLine.audio,
     soundActions: soundActions,
-    emitEvent: emitEvent
+    emitEvent: emitEvent,
+    onFinish: function onFinish() {
+      if (autoPlayCond && (currentLine === null || currentLine === void 0 ? void 0 : currentLine.audioType) !== 'none') {
+        nextLine();
+      }
+    }
   }); // Autoplay logic
 
   (0, _react.useEffect)(function () {
-    if (automatic && currentMessage.show && !currentLine.decision) {
+    if (autoPlayCond && (currentLine === null || currentLine === void 0 ? void 0 : currentLine.audioType) === 'none') {
       var _currentMessage$text;
 
       var time = characterMs * ((currentMessage === null || currentMessage === void 0 ? void 0 : (_currentMessage$text = currentMessage.text) === null || _currentMessage$text === void 0 ? void 0 : _currentMessage$text.length) || 0);
@@ -459,7 +465,7 @@ var DialogComponent = function DialogComponent(_ref) {
     return function () {
       stop();
     };
-  }, [currentMessage, nextLine, automatic, currentLine.decision, start, stop]); // Positioning logic
+  }, [currentMessage, nextLine, start, stop, currentLine === null || currentLine === void 0 ? void 0 : currentLine.audioType, autoPlayCond]); // Positioning logic
 
   var checkBubblePosition = (0, _react.useCallback)(function () {
     if (bubbleRef.current && currentLine.slots) {

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

@@ -15,6 +15,8 @@ var _feedbackComponent = _interopRequireDefault(require("../../feedback-componen
 
 var _utils = require("../utils");
 
+var _LangIsRtl = _interopRequireDefault(require("../../../helpers/LangIsRtl"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -416,7 +418,8 @@ var TextClickPuzzleComponent = function TextClickPuzzleComponent(_ref) {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "text-click__body"
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "text-click__scroll"
+    className: "text-click__scroll",
+    dir: (0, _LangIsRtl.default)() ? 'rtl' : 'auto'
   }, parsedText.current)))), showFrames && /*#__PURE__*/_react.default.createElement("div", {
     className: "text-click__paginator"
   }, /*#__PURE__*/_react.default.createElement("div", {

package/dist/components/text-click-puzzle-component/utils/index.js

@@ -46,6 +46,8 @@ var getRecursiveJSX = function getRecursiveJSX(jsx) {
 
 
     if (jsx.props['data-text-id']) {
+      props.dir = 'auto';
+
       props.onClick = function (e) {
         return onClick(e, props['data-text-id'] || -1);
       };
@@ -85,6 +87,7 @@ var getRecursiveJSX = function getRecursiveJSX(jsx) {
       return word !== '';
     }).map(function (word) {
       return /*#__PURE__*/_react.default.createElement("span", {
+        dir: "auto",
         key: word
       }, word);
     });

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

@@ -75,7 +75,10 @@ var PopupTextComponent = function PopupTextComponent(_ref) {
     className: "puzzle--webBuilder__select"
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "puzzle--webBuilder__select--label"
-  }, /*#__PURE__*/_react.default.createElement("span", null, translate('webbuilder.textSelect.title'))), /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    dir: "auto"
+  }, translate('webbuilder.textSelect.title'))), /*#__PURE__*/_react.default.createElement("div", {
+    dir: "auto",
     className: classDropDown,
     onClick: function onClick() {
       return toggleDropdown();

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

@@ -17,6 +17,7 @@ var FeedbackResult = function FeedbackResult(_ref) {
   var title = success ? translate('webbuilder.feedback.successTitle') : translate('webbuilder.feedback.failTitle');
   var desc = success ? translate('webbuilder.feedback.success') : translate('webbuilder.feedback.fail');
   return /*#__PURE__*/_react.default.createElement("div", {
+    dir: "auto",
     className: "puzzle--webBuilder__feedback bottom ".concat(success ? 'success' : 'failed'),
     style: success ? {
       zIndex: '11'

package/dist/components/web-builder-puzzle-component/components/WebBuilderBody/BankBody.js

@@ -60,6 +60,7 @@ var BankBody = function BankBody(_ref) {
       });
     }
   }) : null)), /*#__PURE__*/_react.default.createElement("div", {
+    dir: "auto",
     className: "bank--sidebar"
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "bank--form"

package/dist/components/web-builder-puzzle-component/components/WebBuilderBody/FacebookBody.js

@@ -25,7 +25,8 @@ var FacebookBody = function FacebookBody(_ref) {
   var home = showingReference ? usingTemplate.body.home : body.home;
   var mail = showingReference ? usingTemplate.body.mail : body.mail;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("ul", {
-    className: "facebook--sidebar"
+    className: "facebook--sidebar",
+    dir: "auto"
   }, /*#__PURE__*/_react.default.createElement("li", {
     className: "facebook--sidebar__item ".concat(work || showingReference ? 'selected' : '')
   }, /*#__PURE__*/_react.default.createElement("div", {

package/dist/components/web-builder-puzzle-component/components/WebBuilderPuzzleComponent.js

@@ -221,6 +221,11 @@ var WebBuilderPuzzleComponent = function WebBuilderPuzzleComponent(_ref) {
         exist = _checkCorrect.exist,
         equal = _checkCorrect.equal;
 
+    emitEvent({
+      type: 'hidePuzzleButtons',
+      payload: true
+    });
+
     if (exist && !equal) {
       if (showPublish) {
         setShowPublish(false);

package/dist/helpers/useEkho.js

@@ -23,7 +23,10 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
+var noop = function noop() {};
 /** Custom hook for use TTS and audio in the components */
+
+
 var useEkho = function useEkho(_ref) {
   var voice = _ref.voice,
       text = _ref.text,
@@ -32,7 +35,11 @@ var useEkho = function useEkho(_ref) {
       loop = _ref$loop === void 0 ? false : _ref$loop,
       audio = _ref.audio,
       soundActions = _ref.soundActions,
-      emitEvent = _ref.emitEvent;
+      emitEvent = _ref.emitEvent,
+      _ref$onFinish = _ref.onFinish,
+      onFinish = _ref$onFinish === void 0 ? noop : _ref$onFinish,
+      _ref$onStart = _ref.onStart,
+      onStart = _ref$onStart === void 0 ? noop : _ref$onStart;
 
   var _soundActions = _slicedToArray(soundActions, 2),
       playSound = _soundActions[0],
@@ -54,15 +61,7 @@ var useEkho = function useEkho(_ref) {
       type: 'translate',
       payload: id
     });
-  }, [emitEvent]);
-  var finishCallback = (0, _react.useRef)(function () {});
-  var startCallback = (0, _react.useRef)(function () {});
-  var onStartAudio = (0, _react.useCallback)(function (fn) {
-    startCallback.current = fn;
-  }, []);
-  var onFinishAudio = (0, _react.useCallback)(function (fn) {
-    finishCallback.current = fn;
-  }, []); // Setted when is mounted
+  }, [emitEvent]); // Setted when is mounted
 
   (0, _react.useEffect)(function () {
     setIsMounted(true);
@@ -101,12 +100,12 @@ var useEkho = function useEkho(_ref) {
       url: url,
       cc: cc
     };
-    startCallback.current({
+    onStart({
       url: url,
       cc: cc
     });
-    playSound(url, cc, loop, 0.5, finishCallback.current);
-  }, [playSound, loop]);
+    playSound(url, cc, loop, 0.5, onFinish);
+  }, [onStart, playSound, loop, onFinish]);
   var playSpeech = (0, _react.useCallback)( /*#__PURE__*/function () {
     var _ref3 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(payload) {
       var url;
@@ -159,10 +158,6 @@ var useEkho = function useEkho(_ref) {
       }
     }
   }, [getVoice, playSpeech, isMounted, voice, text, audioType, audio === null || audio === void 0 ? void 0 : audio.url, audio, setCurrentPlaying]);
-  return {
-    onStart: onStartAudio,
-    onFinish: onFinishAudio
-  };
 };
 
 var _default = useEkho;

package/package.json

@@ -2,7 +2,7 @@
   "name": "@gamelearn/arcade-components",
   "author": "Gamelearn",
   "license": "unlicense",
-  "version": "1.13.0",
+  "version": "1.15.0",
   "main": "dist/index.js",
   "files": [
     "dist",
@@ -13,7 +13,7 @@
     "url": "https://github.com/gamelearn/arcade-components"
   },
   "dependencies": {
-    "@gamelearn/arcade-styles": "0.11.1",
+    "@gamelearn/arcade-styles": "0.11.3",
     "@gamelearn/arcade-three-core": "1.1.15",
     "@react-three/drei": "8.8.1",
     "@react-three/fiber": "7.0.25",