@gamelearn/arcade-components 1.35.3 → 1.35.6

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 (5) hide show
  1. package/README.md +107 -107
  2. package/dist/components/conversational-pro-component/components/ConversationalProComponent.js +75 -31
  3. package/dist/components/conversational-pro-component/components/scene/Panel.js +3 -1
  4. package/dist/components/dialog-component/components/DialogComponent.js +81 -42
  5. package/package.json +114 -114
package/README.md CHANGED
@@ -1,107 +1,107 @@
1
- # Arcade Components
2
- > librería de componentes para Arcade (aka engine 2.0)
3
-
4
- [![NPM](https://img.shields.io/npm/v/arcade-components.svg)](https://www.npmjs.com/package/arcade-components) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
5
-
6
- ## Install
7
-
8
- ```bash
9
- yarn add @gamelearn/arcade-components
10
- ```
11
-
12
- ## Usage
13
- ##
14
-
15
- ```jsx
16
- import React, { Component } from 'react';
17
-
18
- import { Button } from 'arcade-components';
19
-
20
- export default class App extends Component {
21
- render() {
22
- return (
23
- <div>
24
- <Button>Enjoy</Button>
25
- </div>
26
- );
27
- }
28
- }
29
-
30
- ```
31
-
32
- ## Generar version hotfix para arcade/master-stg
33
-
34
- Para generar una version hotfix nos vamos al commit que desplego la version que utiliza actualmente arcade/master-stg y creamos una rama sobre ella.
35
-
36
- Generamos los cambios o hacemos cherrypick de ellos si ya estan creados y una vez terminemos con los cambios tendremos que cambiar la version del package.json a una tal que asi :
37
-
38
- `"version": "1.3.5-fix-1",`
39
-
40
- Habiendo cambiado ya la version para publicarla ejecutamos:
41
- * `npm run publish-hotfix`
42
-
43
- Una vez publicada en npm ir a la versión master de arcade y sustituir la versión de arcade-components.
44
-
45
- ## Available Scripts
46
-
47
- Para ver Storybook en local
48
-
49
- ### `yarn start`
50
-
51
- Para compilar la librería a dist
52
-
53
- ### `yarn compile`
54
-
55
- Para dejar a babel observando cambios y ejecuntando auto-compilación puedes pasarle --watch
56
-
57
- `yarn compile --watch`
58
-
59
- ### `yarn generate <componentName>`
60
-
61
- Para añadir un componente nuevo se recomienda usar el generador automático que hara el scaffolding básico de dicho componente, coge el nombre como primer parámetro y si lo llamas sin parámetro te lo preguntará por el prompt.
62
-
63
- `yarn generate`
64
-
65
- ## How to link arcade-components in other repos (WIP)
66
-
67
- Para trabajar con arcade-components en local si necesidad de subir a git ni a npm no podemos trabajar con `yarn link` ya que da un error con los hooks de react.
68
-
69
- Cómo solución alternativa podemos instalar `yalc` que permite publicar el paquete en local e importarlo desde `arcade`.
70
-
71
- ```bash
72
- yarn global add yalc
73
- ```
74
- Si teneis problemas instalándolo en global :
75
- yarn global add yalc --prefix /usr/local
76
-
77
- Para generar el paquete en el store local:
78
-
79
- ```bash
80
- yarn
81
- yarn compile
82
- yalc publish o yarn yalc publish
83
- ```
84
-
85
- Si queremos escuchar los cambios y que se vayan publicando en el store de yalc se puede hacer directamente con:
86
-
87
- ```bash
88
- yarn watch
89
- ```
90
-
91
- Después, en el repositorio de `arcade` tendremos que linkar el paquete generado de la siguiente forma:
92
-
93
- ```bash
94
- yalc link @gamelearn/arcade-components
95
- ```
96
-
97
- Y voilá, ya podremos trabajar con arcade y arcade-components en local sin publicar nada.
98
-
99
- Una vez terminemos de trabajar con el paquete linkado en `arcade`, no nos olvidemos de borrar el link:
100
-
101
- ```bash
102
- yalc remove --all
103
- ```
104
-
105
- ## License
106
-
107
- UNLICENSED © [gamelearn](https://github.com/gamelearn)
1
+ # Arcade Components
2
+ > librería de componentes para Arcade (aka engine 2.0)
3
+
4
+ [![NPM](https://img.shields.io/npm/v/arcade-components.svg)](https://www.npmjs.com/package/arcade-components) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
5
+
6
+ ## Install
7
+
8
+ ```bash
9
+ yarn add @gamelearn/arcade-components
10
+ ```
11
+
12
+ ## Usage
13
+ ##
14
+
15
+ ```jsx
16
+ import React, { Component } from 'react';
17
+
18
+ import { Button } from 'arcade-components';
19
+
20
+ export default class App extends Component {
21
+ render() {
22
+ return (
23
+ <div>
24
+ <Button>Enjoy</Button>
25
+ </div>
26
+ );
27
+ }
28
+ }
29
+
30
+ ```
31
+
32
+ ## Generar version hotfix para arcade/master-stg
33
+
34
+ Para generar una version hotfix nos vamos al commit que desplego la version que utiliza actualmente arcade/master-stg y creamos una rama sobre ella.
35
+
36
+ Generamos los cambios o hacemos cherrypick de ellos si ya estan creados y una vez terminemos con los cambios tendremos que cambiar la version del package.json a una tal que asi :
37
+
38
+ `"version": "1.3.5-fix-1",`
39
+
40
+ Habiendo cambiado ya la version para publicarla ejecutamos:
41
+ * `npm run publish-hotfix`
42
+
43
+ Una vez publicada en npm ir a la versión master de arcade y sustituir la versión de arcade-components.
44
+
45
+ ## Available Scripts
46
+
47
+ Para ver Storybook en local
48
+
49
+ ### `yarn start`
50
+
51
+ Para compilar la librería a dist
52
+
53
+ ### `yarn compile`
54
+
55
+ Para dejar a babel observando cambios y ejecuntando auto-compilación puedes pasarle --watch
56
+
57
+ `yarn compile --watch`
58
+
59
+ ### `yarn generate <componentName>`
60
+
61
+ Para añadir un componente nuevo se recomienda usar el generador automático que hara el scaffolding básico de dicho componente, coge el nombre como primer parámetro y si lo llamas sin parámetro te lo preguntará por el prompt.
62
+
63
+ `yarn generate`
64
+
65
+ ## How to link arcade-components in other repos (WIP)
66
+
67
+ Para trabajar con arcade-components en local si necesidad de subir a git ni a npm no podemos trabajar con `yarn link` ya que da un error con los hooks de react.
68
+
69
+ Cómo solución alternativa podemos instalar `yalc` que permite publicar el paquete en local e importarlo desde `arcade`.
70
+
71
+ ```bash
72
+ yarn global add yalc
73
+ ```
74
+ Si teneis problemas instalándolo en global :
75
+ yarn global add yalc --prefix /usr/local
76
+
77
+ Para generar el paquete en el store local:
78
+
79
+ ```bash
80
+ yarn
81
+ yarn compile
82
+ yalc publish o yarn yalc publish
83
+ ```
84
+
85
+ Si queremos escuchar los cambios y que se vayan publicando en el store de yalc se puede hacer directamente con:
86
+
87
+ ```bash
88
+ yarn watch
89
+ ```
90
+
91
+ Después, en el repositorio de `arcade` tendremos que linkar el paquete generado de la siguiente forma:
92
+
93
+ ```bash
94
+ yalc link @gamelearn/arcade-components
95
+ ```
96
+
97
+ Y voilá, ya podremos trabajar con arcade y arcade-components en local sin publicar nada.
98
+
99
+ Una vez terminemos de trabajar con el paquete linkado en `arcade`, no nos olvidemos de borrar el link:
100
+
101
+ ```bash
102
+ yalc remove --all
103
+ ```
104
+
105
+ ## License
106
+
107
+ UNLICENSED © [gamelearn](https://github.com/gamelearn)
package/dist/components/conversational-pro-component/components/ConversationalProComponent.js CHANGED
@@ -35,6 +35,14 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
35
35
 
36
36
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
37
37
 
38
+ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
39
+
40
+ function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
41
+
42
+ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
43
+
44
+ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
45
+
38
46
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
39
47
 
40
48
  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."); }
@@ -103,18 +111,42 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
103
111
  var backgroundImage = (background === null || background === void 0 ? void 0 : (_background$img = background.img) === null || _background$img === void 0 ? void 0 : _background$img.url) || null;
104
112
  var currentLineData = lines[currentLine];
105
113
  var voiceOverSlots = [];
114
+ var isBranched = !!edges;
115
+ var isVoiceOver = voiceOver || currentLineData.type === 'conversationalNarration';
116
+ var isDecision = decision || currentLineData.type === 'conversationalDecision';
106
117
  var voiceOver = currentLineData.voiceOver,
107
118
  decision = currentLineData.decision;
108
- var isBranched = !!edges;
119
+ var isFlex = currentLineData.flex;
109
120
 
110
- var _useState13 = (0, _react.useState)(false),
121
+ var _useState13 = (0, _react.useState)([]),
111
122
  _useState14 = _slicedToArray(_useState13, 2),
112
- previousLineWasDecision = _useState14[0],
113
- setPreviousLineWasDecision = _useState14[1];
123
+ edgesHistory = _useState14[0],
124
+ setEdgesHistory = _useState14[1];
125
+
126
+ var lastNodeId = (0, _react.useMemo)(function () {
127
+ return edgesHistory[edgesHistory.length - 1];
128
+ }, [edgesHistory]);
129
+ var findLastLineBranched = (0, _react.useCallback)(function () {
130
+ var lastEdge = edges.find(function (edge) {
131
+ return edge.fromId === lastNodeId;
132
+ });
133
+ var lastLine = lines.find(function (line) {
134
+ return line.id === lastEdge.fromId;
135
+ });
136
+ return lastLine;
137
+ }, [edges, lines, lastNodeId]);
138
+ var previousLineWasDecision = (0, _react.useCallback)(function () {
139
+ if (isBranched) {
140
+ // if we have edges, we need to check if the previous line was a decision
141
+ var _lastLine = findLastLineBranched();
114
142
 
115
- var isVoiceOver = voiceOver || currentLineData.type === 'conversationalNarration';
116
- var isDecision = decision || currentLineData.type === 'conversationalDecision';
117
- var isFlex = currentLineData.flex;
143
+ return _lastLine === null || _lastLine === void 0 ? void 0 : _lastLine.decision;
144
+ } // if there is no branching, the previous line is the previous one
145
+
146
+
147
+ var lastLine = lines[currentLine - 1] ? lines[currentLine - 1] : {};
148
+ return currentLine > 0 && (lastLine === null || lastLine === void 0 ? void 0 : lastLine.decision);
149
+ }, [isBranched, findLastLineBranched, lines, currentLine]);
118
150
  var translate = (0, _react.useCallback)(function (id) {
119
151
  return emitEvent({
120
152
  type: 'translate',
@@ -141,12 +173,19 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
141
173
  }, [currentLineData, isVoiceOver]);
142
174
  var currentMessage = (0, _react.useMemo)(function () {
143
175
  return !isDecision ? getCurrentMessage() : {};
144
- }, [getCurrentMessage, isDecision]); // Recupera la antigua linea de la conversacion para conservar los personajes en voice-over
176
+ }, [getCurrentMessage, isDecision]);
177
+ var listProps = {
178
+ characters: currentCharacters,
179
+ lodSettings: lodSettings,
180
+ actors: actors,
181
+ currentMessage: currentMessage || {},
182
+ slots: !isVoiceOver ? currentLineData.slots : voiceOverSlots,
183
+ flex: isFlex
184
+ }; // Recupera la antigua linea de la conversacion para conservar los personajes en voice-over
145
185
 
146
186
  var leftWithSlots = lines.slice(0, currentLine + 1).reverse().find(function (line) {
147
187
  return line.slots;
148
188
  });
149
- var lastLine = lines[currentLine - 1] ? lines[currentLine - 1] : {};
150
189
  var hasCharacters = !isDecision && ((_currentLineData$slot = currentLineData.slots) === null || _currentLineData$slot === void 0 ? void 0 : _currentLineData$slot.filter(function (slot) {
151
190
  return slot.uid;
152
191
  }).length);
@@ -209,14 +248,6 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
209
248
  }
210
249
  }
211
250
 
212
- var listProps = {
213
- characters: currentCharacters,
214
- lodSettings: lodSettings,
215
- actors: actors,
216
- currentMessage: currentMessage || {},
217
- slots: !isVoiceOver ? currentLineData.slots : voiceOverSlots,
218
- flex: isFlex
219
- };
220
251
  var finishConversation = (0, _react.useCallback)(function () {
221
252
  emitEvent({
222
253
  type: 'success'
@@ -250,12 +281,20 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
250
281
  var handleBranchDirection = (0, _react.useCallback)(function () {
251
282
  var forward = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
252
283
  var keys = forward ? ['fromId', 'toId'] : ['toId', 'fromId'];
253
- var foundEdge = edges.find(function (edge) {
284
+ var foundEdges = edges.filter(function (edge) {
254
285
  return edge[keys[0]] === currentLineData.id;
255
286
  });
287
+ var foundEdge = foundEdges.length === 1 ? foundEdges[0] : foundEdges.find(function (edge) {
288
+ return edge[keys[1]] === lastNodeId;
289
+ });
256
290
 
257
291
  if (!(foundEdge !== null && foundEdge !== void 0 && foundEdge[keys[0]])) {
258
292
  return;
293
+ } // if going backwards, we need to remove the last node from the history
294
+
295
+
296
+ if (!forward) {
297
+ setEdgesHistory(edgesHistory.slice(0, -1));
259
298
  }
260
299
 
261
300
  var destination = lines.findIndex(function (line) {
@@ -267,11 +306,11 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
267
306
  } else {
268
307
  finishConversation();
269
308
  }
270
- }, [currentLineData.id, edges, finishConversation, lines]);
309
+ }, [currentLineData.id, edges, edgesHistory, finishConversation, lastNodeId, lines]);
271
310
  var handleClickNext = (0, _react.useCallback)(function (choice, reset) {
272
311
  var isLast = false;
273
312
  setTTsStart(false);
274
- setPreviousLineWasDecision(currentLineData.decision);
313
+ setEdgesHistory([].concat(_toConsumableArray(edgesHistory), [currentLineData.id]));
275
314
  setStarted(false);
276
315
  setAudioFailed(false);
277
316
 
@@ -297,7 +336,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
297
336
  if (!isLast) {
298
337
  setStarted(true);
299
338
  }
300
- }, [currentLine, currentLineData.decision, finishConversation, handleBranchDirection, handleDecisionBranch, isBranched, lines.length]);
339
+ }, [currentLine, currentLineData.decision, currentLineData.id, finishConversation, handleBranchDirection, handleDecisionBranch, isBranched, lines.length, edgesHistory]);
301
340
 
302
341
  var handleClickBack = function handleClickBack() {
303
342
  setStarted(false);
@@ -313,7 +352,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
313
352
  setStarted(true);
314
353
  };
315
354
 
316
- var isEndNode = function isEndNode() {
355
+ var isEndNode = (0, _react.useCallback)(function () {
317
356
  if (isBranched) {
318
357
  return currentLineData && currentLineData.type !== 'conversationalDecision' && !edges.find(function (edge) {
319
358
  return edge.fromId === currentLineData.id;
@@ -321,7 +360,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
321
360
  }
322
361
 
323
362
  return currentLine === lines.length - 1;
324
- };
363
+ }, [currentLine, currentLineData, edges, isBranched, lines.length]);
325
364
 
326
365
  var manualClickNext = function manualClickNext() {
327
366
  playSound('click-ui');
@@ -341,7 +380,7 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
341
380
  };
342
381
 
343
382
  var autoplayCond = automatic && !isDecision;
344
- var disableBackButton = currentLine === 0 || previousLineWasDecision || currentLine > 0 && (lastLine === null || lastLine === void 0 ? void 0 : lastLine.decision);
383
+ var disableBackButton = currentLine === 0 || previousLineWasDecision();
345
384
  (0, _useEkho.default)({
346
385
  audioType: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType,
347
386
  volume: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioVolume,
@@ -352,7 +391,9 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
352
391
  soundActions: soundActions,
353
392
  emitEvent: emitEvent,
354
393
  onStart: function onStart() {
355
- if (currentMessage.emotion.includes('think')) return;
394
+ var _currentMessage$emoti;
395
+
396
+ if (currentMessage !== null && currentMessage !== void 0 && (_currentMessage$emoti = currentMessage.emotion) !== null && _currentMessage$emoti !== void 0 && _currentMessage$emoti.includes('think')) return;
356
397
  setTTsStart(true);
357
398
  },
358
399
  onError: function onError() {
@@ -367,25 +408,28 @@ var ConversationProViewer = function ConversationProViewer(_ref) {
367
408
  }
368
409
  });
369
410
  (0, _react.useEffect)(function () {
370
- var _currentMessage$emoti;
411
+ var _currentMessage$emoti2;
371
412
 
372
- if ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' && !((_currentMessage$emoti = currentMessage.emotion) !== null && _currentMessage$emoti !== void 0 && _currentMessage$emoti.includes('think'))) {
413
+ if ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' && !(currentMessage !== null && currentMessage !== void 0 && (_currentMessage$emoti2 = currentMessage.emotion) !== null && _currentMessage$emoti2 !== void 0 && _currentMessage$emoti2.includes('think'))) {
373
414
  setTTsStart(true);
374
415
  }
375
- }, [currentLineData, currentMessage.emotion]); // Autoplay logic
416
+ }, [currentLineData, currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.emotion]); // Autoplay logic
376
417
 
377
418
  (0, _react.useEffect)(function () {
378
419
  if (autoplayCond && ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' || audioFailed)) {
379
420
  var _currentMessage$text;
380
421
 
381
- 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);
382
- start(handleClickNext, time < minMs ? minMs : time);
422
+ 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); // if it's not last node
423
+
424
+ if (!isEndNode()) {
425
+ start(handleClickNext, time < minMs ? minMs : time);
426
+ }
383
427
  }
384
428
 
385
429
  return function () {
386
430
  stop();
387
431
  };
388
- }, [currentMessage, start, stop, handleClickNext, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType, autoplayCond, audioFailed, lines]); // Calculate start node
432
+ }, [currentMessage, start, stop, handleClickNext, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType, autoplayCond, audioFailed, lines, isEndNode]); // Calculate start node
389
433
 
390
434
  (0, _react.useEffect)(function () {
391
435
  if (isBranched && !mounted) {
package/dist/components/conversational-pro-component/components/scene/Panel.js CHANGED
@@ -152,7 +152,9 @@ function Panel(_ref) {
152
152
  fov: 35,
153
153
  focus: 10,
154
154
  ref: cameraRef,
155
- position: defaultCamPos
155
+ position: defaultCamPos,
156
+ makeDefault: true,
157
+ defaultCamera: true
156
158
  }), /*#__PURE__*/_react.default.createElement(_LightSet.default, null));
157
159
  }
158
160
 
package/dist/components/dialog-component/components/DialogComponent.js CHANGED
@@ -79,7 +79,7 @@ var maxCharacterToSwitch = 70;
79
79
  raycast.firstHitOnly = true;
80
80
 
81
81
  var DialogComponent = function DialogComponent(_ref) {
82
- var _currentLine$slots;
82
+ var _currentLineData$slot;
83
83
 
84
84
  var emitEvent = _ref.emitEvent,
85
85
  lines = _ref.lines,
@@ -146,23 +146,23 @@ var DialogComponent = function DialogComponent(_ref) {
146
146
  setAnimationRunning = _useState12[1];
147
147
 
148
148
  var animationTarget = (0, _react.useRef)(new _three.Object3D());
149
- var currentLine = lines[line];
149
+ var currentLineData = lines[line];
150
150
  var lastLine = lines[line - 1];
151
151
  var lastSet = (0, _react.useRef)(false);
152
152
  var isBranched = !!edges;
153
153
 
154
- var _ref2 = currentLine || {},
154
+ var _ref2 = currentLineData || {},
155
155
  voiceOver = _ref2.voiceOver,
156
156
  decision = _ref2.decision;
157
157
 
158
- var talkingCharacter = currentLine === null || currentLine === void 0 ? void 0 : (_currentLine$slots = currentLine.slots) === null || _currentLine$slots === void 0 ? void 0 : _currentLine$slots.find(function (slot) {
158
+ var talkingCharacter = currentLineData === null || currentLineData === void 0 ? void 0 : (_currentLineData$slot = currentLineData.slots) === null || _currentLineData$slot === void 0 ? void 0 : _currentLineData$slot.find(function (slot) {
159
159
  return slot.talking;
160
160
  });
161
- var autoPlayCond = automatic && !(currentLine !== null && currentLine !== void 0 && currentLine.decision);
162
- var audio = Object.keys((currentLine === null || currentLine === void 0 ? void 0 : currentLine.audio) || {}).length;
163
- var voice = Object.keys((currentLine === null || currentLine === void 0 ? void 0 : currentLine.voice) || {}).length;
164
- var isVoiceOver = voiceOver || (currentLine === null || currentLine === void 0 ? void 0 : currentLine.type) === 'conversationalNarration';
165
- var isDecision = decision || (currentLine === null || currentLine === void 0 ? void 0 : currentLine.type) === 'conversationalDecision';
161
+ var autoPlayCond = automatic && !(currentLineData !== null && currentLineData !== void 0 && currentLineData.decision);
162
+ var audio = Object.keys((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audio) || {}).length;
163
+ var voice = Object.keys((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.voice) || {}).length;
164
+ var isVoiceOver = voiceOver || (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.type) === 'conversationalNarration';
165
+ var isDecision = decision || (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.type) === 'conversationalDecision';
166
166
 
167
167
  var _useState13 = (0, _react.useState)({
168
168
  text: '',
@@ -200,11 +200,36 @@ var DialogComponent = function DialogComponent(_ref) {
200
200
  });
201
201
  }, [emitEvent]);
202
202
 
203
- var _useState15 = (0, _react.useState)(false),
203
+ var _useState15 = (0, _react.useState)([]),
204
204
  _useState16 = _slicedToArray(_useState15, 2),
205
- previousLineWasDecision = _useState16[0],
206
- setPreviousLineWasDecision = _useState16[1];
205
+ edgesHistory = _useState16[0],
206
+ setEdgesHistory = _useState16[1];
207
+
208
+ var lastNodeId = (0, _react.useMemo)(function () {
209
+ return edgesHistory[edgesHistory.length - 1];
210
+ }, [edgesHistory]);
211
+ var findLastLineBranched = (0, _react.useCallback)(function () {
212
+ var lastEdge = edges.find(function (edge) {
213
+ return edge.fromId === lastNodeId;
214
+ });
215
+ var lastLine = lines.find(function (line) {
216
+ return line.id === lastEdge.fromId;
217
+ });
218
+ return lastLine;
219
+ }, [edges, lines, lastNodeId]);
220
+ var previousLineWasDecision = (0, _react.useCallback)(function () {
221
+ if (isBranched) {
222
+ // if we have edges, we need to check if the previous line was a decision
223
+ var _lastLine = findLastLineBranched();
207
224
 
225
+ return _lastLine === null || _lastLine === void 0 ? void 0 : _lastLine.decision;
226
+ } else {
227
+ // if there is no branching, the previous line is the previous one
228
+ var _lastLine2 = lines[currentLineData - 1] ? lines[currentLineData - 1] : {};
229
+
230
+ return currentLineData > 0 && (_lastLine2 === null || _lastLine2 === void 0 ? void 0 : _lastLine2.decision);
231
+ }
232
+ }, [currentLineData, isBranched, lines, lastNodeId, edges]);
208
233
  var getCurrentVisible = (0, _react.useCallback)(function (uid) {
209
234
  if (!uid) return null;
210
235
  var object;
@@ -255,7 +280,7 @@ var DialogComponent = function DialogComponent(_ref) {
255
280
  }, [loader]); // Force default animation without transition
256
281
 
257
282
  var executeDefaultAnimation = function executeDefaultAnimation(element) {
258
- if (element.uid === talkingCharacter.uid) return;
283
+ if (!talkingCharacter || element.uid === talkingCharacter.uid) return;
259
284
 
260
285
  if (element.userData.mixer && element.userData.defaultAnim) {
261
286
  var mixer = element.userData.mixer;
@@ -324,12 +349,20 @@ var DialogComponent = function DialogComponent(_ref) {
324
349
  var handleBranchDirection = (0, _react.useCallback)(function () {
325
350
  var forward = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
326
351
  var keys = forward ? ['fromId', 'toId'] : ['toId', 'fromId'];
327
- var foundEdge = edges.find(function (edge) {
328
- return edge[keys[0]] === (currentLine === null || currentLine === void 0 ? void 0 : currentLine.id);
352
+ var foundEdges = edges.filter(function (edge) {
353
+ return edge[keys[0]] === currentLineData.id;
354
+ });
355
+ var foundEdge = foundEdges.length === 1 ? foundEdges[0] : foundEdges.find(function (edge) {
356
+ return edge[keys[1]] === lastNodeId;
329
357
  });
330
358
 
331
359
  if (!(foundEdge !== null && foundEdge !== void 0 && foundEdge[keys[0]])) {
332
360
  return;
361
+ } // if going backwards remove last edge from history
362
+
363
+
364
+ if (!forward) {
365
+ setEdgesHistory(edgesHistory.slice(0, edgesHistory.length - 1));
333
366
  }
334
367
 
335
368
  var destination = lines.findIndex(function (l) {
@@ -344,11 +377,11 @@ var DialogComponent = function DialogComponent(_ref) {
344
377
  } else {
345
378
  finishConversation();
346
379
  }
347
- }, [currentLine === null || currentLine === void 0 ? void 0 : currentLine.id, edges, finishConversation, lines]);
380
+ }, [currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.id, edges, finishConversation, lines]);
348
381
  var handleDecisionBranch = (0, _react.useCallback)(function (choice, reset) {
349
382
  var currentId = [3, 2, 1][choice.id];
350
383
  var optionsEdges = edges.filter(function (edge) {
351
- return edge.fromId === (currentLine === null || currentLine === void 0 ? void 0 : currentLine.id);
384
+ return edge.fromId === (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.id);
352
385
  });
353
386
  var currentEdge = optionsEdges.find(function (edge) {
354
387
  return parseInt(edge.fromPointIndex) === currentId;
@@ -369,14 +402,14 @@ var DialogComponent = function DialogComponent(_ref) {
369
402
  } else {
370
403
  finishConversation();
371
404
  }
372
- }, [currentLine === null || currentLine === void 0 ? void 0 : currentLine.id, edges, finishConversation, lines]);
405
+ }, [currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.id, edges, finishConversation, lines]);
373
406
  var backLine = (0, _react.useCallback)(function () {
374
407
  restTalkingAnimation();
375
408
  setAudioFailed(false);
376
409
 
377
410
  if (isBranched) {
378
411
  handleBranchDirection(false);
379
- } else if (lastLine && !(lastLine !== null && lastLine !== void 0 && lastLine.decision) || lastLine.type && !lastLine.type !== 'conversationalDecision') {
412
+ } else if (previousLineWasDecision()) {
380
413
  setCurrentMessage({
381
414
  show: false
382
415
  });
@@ -385,7 +418,7 @@ var DialogComponent = function DialogComponent(_ref) {
385
418
  }, [handleBranchDirection, isBranched, lastLine, line]);
386
419
  var nextLine = (0, _react.useCallback)(function (choice, reset) {
387
420
  restTalkingAnimation();
388
- setPreviousLineWasDecision(currentLine.decision);
421
+ setEdgesHistory([].concat(_toConsumableArray(edgesHistory), [currentLineData.id]));
389
422
  setAudioFailed(false);
390
423
 
391
424
  if (isBranched) {
@@ -399,10 +432,10 @@ var DialogComponent = function DialogComponent(_ref) {
399
432
  show: false
400
433
  });
401
434
  changeLine(line + 1);
402
- } else if (currentLine.decision) {
435
+ } else if (currentLineData.decision) {
403
436
  finishConversation();
404
437
  }
405
- }, [currentLine === null || currentLine === void 0 ? void 0 : currentLine.decision, isBranched, line, lines.length, handleDecisionBranch, handleBranchDirection, finishConversation]);
438
+ }, [currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.decision, isBranched, line, lines.length, handleDecisionBranch, handleBranchDirection, finishConversation]);
406
439
 
407
440
  var manualBackLine = function manualBackLine() {
408
441
  setAutomatic(false);
@@ -411,8 +444,8 @@ var DialogComponent = function DialogComponent(_ref) {
411
444
 
412
445
  var isEndNode = function isEndNode() {
413
446
  if (isBranched) {
414
- return currentLine && currentLine.type !== 'conversationalDecision' && !edges.find(function (edge) {
415
- return edge.fromId === currentLine.id;
447
+ return currentLineData && currentLineData.type !== 'conversationalDecision' && !edges.find(function (edge) {
448
+ return edge.fromId === currentLineData.id;
416
449
  });
417
450
  }
418
451
 
@@ -421,6 +454,7 @@ var DialogComponent = function DialogComponent(_ref) {
421
454
 
422
455
  var manualNextLine = function manualNextLine() {
423
456
  if (isEndNode()) {
457
+ startTalking(false);
424
458
  finishConversation();
425
459
  } else {
426
460
  setAutomatic(false);
@@ -486,8 +520,8 @@ var DialogComponent = function DialogComponent(_ref) {
486
520
  } else if (isVoiceOver) {
487
521
  resetCameraView();
488
522
  setCurrentMessage({
489
- text: currentLine === null || currentLine === void 0 ? void 0 : currentLine.text,
490
- name: (currentLine === null || currentLine === void 0 ? void 0 : currentLine.alias) || (currentLine === null || currentLine === void 0 ? void 0 : currentLine.name) || "[ ".concat(translate('storylines.misc.voiceOver'), " ]"),
523
+ text: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.text,
524
+ name: (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.alias) || (currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.name) || "[ ".concat(translate('storylines.misc.voiceOver'), " ]"),
491
525
  left: false,
492
526
  inScene: false,
493
527
  voiceOver: true,
@@ -497,7 +531,7 @@ var DialogComponent = function DialogComponent(_ref) {
497
531
  show: true
498
532
  });
499
533
  } else if (!lastSet.current) {
500
- var slottedCharacters = currentLine === null || currentLine === void 0 ? void 0 : currentLine.slots.filter(function (slot) {
534
+ var slottedCharacters = currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.slots.filter(function (slot) {
501
535
  return slot.uid && !slot.talking;
502
536
  });
503
537
  var currentParticipants = [].concat(_toConsumableArray(slottedCharacters.map(function (slot) {
@@ -541,7 +575,7 @@ var DialogComponent = function DialogComponent(_ref) {
541
575
  element.userData.defaultAnim = action.getClip();
542
576
  }
543
577
 
544
- if ((currentLine === null || currentLine === void 0 ? void 0 : currentLine.audioType) === 'none' && talkingCharacter.emotion !== 'thinkful') {
578
+ if ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' && talkingCharacter.emotion !== 'thinkful') {
545
579
  startTalking(true);
546
580
  }
547
581
 
@@ -594,19 +628,21 @@ var DialogComponent = function DialogComponent(_ref) {
594
628
  });
595
629
  }
596
630
  }
597
- }, [actors, camera, currentLine, zoomInActor, getCurrentVisible, translate, getAvatarURL, loadEmotion, resetCameraView, isDecision, isVoiceOver, charactersInvolved]); // Sound logic
631
+ }, [actors, camera, currentLineData, zoomInActor, getCurrentVisible, translate, getAvatarURL, loadEmotion, resetCameraView, isDecision, isVoiceOver, charactersInvolved]); // Sound logic
598
632
 
599
633
  var stopEkho = (0, _useEkho.default)({
600
- audioType: currentLine === null || currentLine === void 0 ? void 0 : currentLine.audioType,
601
- volume: currentLine === null || currentLine === void 0 ? void 0 : currentLine.audioVolume,
602
- voice: currentLine === null || currentLine === void 0 ? void 0 : currentLine.voice,
634
+ audioType: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType,
635
+ volume: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioVolume,
636
+ voice: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.voice,
603
637
  started: currentMessage.show,
604
638
  text: currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.text,
605
- audio: currentLine === null || currentLine === void 0 ? void 0 : currentLine.audio,
639
+ audio: currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audio,
606
640
  soundActions: soundActions,
607
641
  emitEvent: emitEvent,
608
642
  onStart: function onStart() {
609
- if (talkingCharacter.emotion.includes('think')) return;
643
+ var _talkingCharacter$emo;
644
+
645
+ if (talkingCharacter !== null && talkingCharacter !== void 0 && (_talkingCharacter$emo = talkingCharacter.emotion) !== null && _talkingCharacter$emo !== void 0 && _talkingCharacter$emo.includes('think')) return;
610
646
  startTalking(true);
611
647
  },
612
648
  onError: function onError() {
@@ -628,23 +664,26 @@ var DialogComponent = function DialogComponent(_ref) {
628
664
  }, [line, stopEkho]); // Autoplay logic
629
665
 
630
666
  (0, _react.useEffect)(function () {
631
- if (autoPlayCond && currentMessage.show && ((currentLine === null || currentLine === void 0 ? void 0 : currentLine.audioType) === 'none' || audioFailed)) {
667
+ if (autoPlayCond && currentMessage.show && ((currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType) === 'none' || audioFailed)) {
632
668
  var _currentMessage$text;
633
669
 
634
- 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);
635
- start(nextLine, time < minMs ? minMs : time);
670
+ 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); // if it's not last node
671
+
672
+ if (!isEndNode()) {
673
+ start(nextLine, time < minMs ? minMs : time);
674
+ }
636
675
  }
637
676
 
638
677
  return function () {
639
678
  stop();
640
679
  };
641
- }, [currentMessage, nextLine, start, stop, currentLine === null || currentLine === void 0 ? void 0 : currentLine.audioType, autoPlayCond, audio, voice, audioFailed]); // Positioning Bubble Message logic
680
+ }, [currentMessage, nextLine, start, stop, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.audioType, autoPlayCond, audio, voice, audioFailed]); // Positioning Bubble Message logic
642
681
 
643
682
  var checkBubbleBounds = (0, _react.useCallback)(function (group, bubble) {
644
683
  groupRef.current = group === null || group === void 0 ? void 0 : group.current;
645
684
  bubbleRef.current = bubble === null || bubble === void 0 ? void 0 : bubble.current;
646
685
 
647
- if (currentLine !== null && currentLine !== void 0 && currentLine.slots && currentMessage.show && bubble !== null && bubble !== void 0 && bubble.current) {
686
+ if (currentLineData !== null && currentLineData !== void 0 && currentLineData.slots && currentMessage.show && bubble !== null && bubble !== void 0 && bubble.current) {
648
687
  var bubbleRect = bubble.current.getBoundingClientRect();
649
688
  var x = bubbleRect.x + bubbleRect.width;
650
689
  var y = bubbleRect.y - bubbleRect.height;
@@ -684,7 +723,7 @@ var DialogComponent = function DialogComponent(_ref) {
684
723
  bubble.current.parentNode.style.transform = '';
685
724
  }
686
725
  }
687
- }, [camera.quaternion, currentLine === null || currentLine === void 0 ? void 0 : currentLine.slots, currentMessage.inScene, getAvatarURL]);
726
+ }, [camera.quaternion, currentLineData === null || currentLineData === void 0 ? void 0 : currentLineData.slots, currentMessage.inScene, getAvatarURL]);
688
727
  (0, _react.useEffect)(function () {
689
728
  if (animationRunning) {
690
729
  var cam = camera;
@@ -755,10 +794,10 @@ var DialogComponent = function DialogComponent(_ref) {
755
794
  height: '100vh',
756
795
  position: 'static'
757
796
  };
758
- var disableBackButton = line === 0 || previousLineWasDecision || line > 0 && (lastLine === null || lastLine === void 0 ? void 0 : lastLine.decision);
797
+ var disableBackButton = line === 0 || previousLineWasDecision();
759
798
 
760
799
  if (isDecision) {
761
- var decisionPayload = _objectSpread(_objectSpread({}, currentLine.payload), {}, {
800
+ var decisionPayload = _objectSpread(_objectSpread({}, currentLineData.payload), {}, {
762
801
  inheritProps: {
763
802
  slots: [],
764
803
  disableBackground: true
package/package.json CHANGED
@@ -1,114 +1,114 @@
1
- {
2
- "name": "@gamelearn/arcade-components",
3
- "author": "Gamelearn",
4
- "license": "unlicense",
5
- "version": "1.35.3",
6
- "main": "dist/index.js",
7
- "files": [
8
- "dist",
9
- "README.md"
10
- ],
11
- "repository": {
12
- "type": "git",
13
- "url": "https://github.com/gamelearn/arcade-components"
14
- },
15
- "dependencies": {
16
- "@babel/runtime": "^7.18.6",
17
- "@gamelearn/arcade-styles": "0.15.8",
18
- "@gamelearn/arcade-three-core": "1.17.1",
19
- "@react-three/drei": "9.4.3",
20
- "@react-three/fiber": "8.0.17",
21
- "@testing-library/jest-dom": "^5.16.4",
22
- "@testing-library/react": "^13.1.1",
23
- "@testing-library/user-event": "13.5.0",
24
- "global": "^4.4.0",
25
- "gsap": "^3.10.1",
26
- "hls.js": "0.12.4",
27
- "html-react-parser": "^1.4.0",
28
- "interactjs": "^1.10.11",
29
- "konva": "^7.2.5",
30
- "prop-types": "15.7.2",
31
- "react-konva": "^18.1.0",
32
- "react-konva-utils": "^0.3.0",
33
- "react-pdf": "5.2.0",
34
- "react-promise-suspense": "0.3.3",
35
- "react-typist": "^2.0.5",
36
- "three": "0.139.2",
37
- "web-vitals": "0.2.4"
38
- },
39
- "scripts": {
40
- "start": "npm run storybook",
41
- "clean": "rimraf dist",
42
- "watch": "npx nodemon -e js --ignore dist --exec \"yarn compile && yalc push --changed\"",
43
- "compile": "npm run clean && cross-env NODE_ENV=production babel src -d dist --ignore src/**/*.stories.js,src/**/*.test.js,src/setupTests.js",
44
- "test": "react-scripts test --watchAll=false",
45
- "test:watch": "react-scripts test",
46
- "eject": "react-scripts eject",
47
- "storybook": "start-storybook -p 6006 -s public",
48
- "build-storybook": "build-storybook -o build",
49
- "generate": "plop",
50
- "lint": "npx eslint src --ext js,json",
51
- "lint:fix": "npx eslint src --ext js,json --fix",
52
- "lint:quiet": "npx eslint src --ext js,json --quiet",
53
- "publish-hotfix": "yarn compile && npm publish && npm run version-tag",
54
- "version-tag": "P_VER=$(cat package.json | grep version | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$P_VER && git push origin v$P_VER"
55
- },
56
- "browserslist": {
57
- "production": [
58
- ">0.2%",
59
- "not dead",
60
- "not op_mini all"
61
- ],
62
- "development": [
63
- "last 1 chrome version",
64
- "last 1 firefox version",
65
- "last 1 safari version"
66
- ]
67
- },
68
- "devDependencies": {
69
- "@babel/cli": "7.12.10",
70
- "@babel/eslint-parser": "^7.15.8",
71
- "@babel/preset-env": "7.12.11",
72
- "@babel/preset-react": "7.12.10",
73
- "@gamelearn/version": "^1.3.1",
74
- "@react-three/test-renderer": "6.0.6",
75
- "@storybook/addon-actions": "6.1.11",
76
- "@storybook/addon-essentials": "6.1.11",
77
- "@storybook/addon-links": "6.1.11",
78
- "@storybook/addons": "^6.3.8",
79
- "@storybook/node-logger": "6.1.11",
80
- "@storybook/preset-create-react-app": "3.1.5",
81
- "@storybook/react": "6.1.11",
82
- "@storybook/theming": "^6.3.8",
83
- "babel-loader": "8.1.0",
84
- "cross-env": "7.0.3",
85
- "eslint-config-airbnb": "^18.2.1",
86
- "eslint-config-prettier": "^8.3.0",
87
- "eslint-plugin-json-format": "^2.0.1",
88
- "eslint-plugin-prettier": "^4.0.0",
89
- "husky": "4.3.0",
90
- "nodemon": "^2.0.13",
91
- "plop": "^2.7.4",
92
- "prettier": "^2.5.0",
93
- "react": "18.0.0",
94
- "react-dom": "18.0.0",
95
- "react-scripts": "4.0.1",
96
- "rimraf": "3.0.2"
97
- },
98
- "jest": {
99
- "transformIgnorePatterns": [
100
- "node_modules/(?!(three)/)"
101
- ],
102
- "moduleNameMapper": {
103
- "^react-pdf$": "react-pdf/dist/umd/entry.jest",
104
- "^react-konva-utils$": "react-pdf/dist/umd/entry.jest"
105
- }
106
- },
107
- "husky": {
108
- "hooks": {
109
- "prepare-commit-msg": "bash node_modules/@gamelearn/version/scripts/update_version.sh -p hooks.config ${HUSKY_GIT_PARAMS}",
110
- "post-commit": "bash node_modules/@gamelearn/version/scripts/after_version_update.sh -p hooks.config",
111
- "post-merge": "bash node_modules/@gamelearn/version/scripts/after_version_update.sh -p hooks.config"
112
- }
113
- }
114
- }
1
+ {
2
+ "name": "@gamelearn/arcade-components",
3
+ "author": "Gamelearn",
4
+ "license": "unlicense",
5
+ "version": "1.35.6",
6
+ "main": "dist/index.js",
7
+ "files": [
8
+ "dist",
9
+ "README.md"
10
+ ],
11
+ "repository": {
12
+ "type": "git",
13
+ "url": "https://github.com/gamelearn/arcade-components"
14
+ },
15
+ "dependencies": {
16
+ "@babel/runtime": "^7.18.6",
17
+ "@gamelearn/arcade-styles": "0.15.8",
18
+ "@gamelearn/arcade-three-core": "1.17.1",
19
+ "@react-three/drei": "9.4.3",
20
+ "@react-three/fiber": "8.0.17",
21
+ "@testing-library/jest-dom": "^5.16.4",
22
+ "@testing-library/react": "^13.1.1",
23
+ "@testing-library/user-event": "13.5.0",
24
+ "global": "^4.4.0",
25
+ "gsap": "^3.10.1",
26
+ "hls.js": "0.12.4",
27
+ "html-react-parser": "^1.4.0",
28
+ "interactjs": "^1.10.11",
29
+ "konva": "^7.2.5",
30
+ "prop-types": "15.7.2",
31
+ "react-konva": "^18.1.0",
32
+ "react-konva-utils": "^0.3.0",
33
+ "react-pdf": "5.2.0",
34
+ "react-promise-suspense": "0.3.3",
35
+ "react-typist": "^2.0.5",
36
+ "three": "0.139.2",
37
+ "web-vitals": "0.2.4"
38
+ },
39
+ "scripts": {
40
+ "start": "npm run storybook",
41
+ "clean": "rimraf dist",
42
+ "watch": "npx nodemon -e js --ignore dist --exec \"yarn compile && yalc push --changed\"",
43
+ "compile": "npm run clean && cross-env NODE_ENV=production babel src -d dist --ignore src/**/*.stories.js,src/**/*.test.js,src/setupTests.js",
44
+ "test": "react-scripts test --watchAll=false",
45
+ "test:watch": "react-scripts test",
46
+ "eject": "react-scripts eject",
47
+ "storybook": "start-storybook -p 6006 -s public",
48
+ "build-storybook": "build-storybook -o build",
49
+ "generate": "plop",
50
+ "lint": "npx eslint src --ext js,json",
51
+ "lint:fix": "npx eslint src --ext js,json --fix",
52
+ "lint:quiet": "npx eslint src --ext js,json --quiet",
53
+ "publish-hotfix": "yarn compile && npm publish && npm run version-tag",
54
+ "version-tag": "P_VER=$(cat package.json | grep version | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$P_VER && git push origin v$P_VER"
55
+ },
56
+ "browserslist": {
57
+ "production": [
58
+ ">0.2%",
59
+ "not dead",
60
+ "not op_mini all"
61
+ ],
62
+ "development": [
63
+ "last 1 chrome version",
64
+ "last 1 firefox version",
65
+ "last 1 safari version"
66
+ ]
67
+ },
68
+ "devDependencies": {
69
+ "@babel/cli": "7.12.10",
70
+ "@babel/eslint-parser": "^7.15.8",
71
+ "@babel/preset-env": "7.12.11",
72
+ "@babel/preset-react": "7.12.10",
73
+ "@gamelearn/version": "^1.3.1",
74
+ "@react-three/test-renderer": "6.0.6",
75
+ "@storybook/addon-actions": "6.1.11",
76
+ "@storybook/addon-essentials": "6.1.11",
77
+ "@storybook/addon-links": "6.1.11",
78
+ "@storybook/addons": "^6.3.8",
79
+ "@storybook/node-logger": "6.1.11",
80
+ "@storybook/preset-create-react-app": "3.1.5",
81
+ "@storybook/react": "6.1.11",
82
+ "@storybook/theming": "^6.3.8",
83
+ "babel-loader": "8.1.0",
84
+ "cross-env": "7.0.3",
85
+ "eslint-config-airbnb": "^18.2.1",
86
+ "eslint-config-prettier": "^8.3.0",
87
+ "eslint-plugin-json-format": "^2.0.1",
88
+ "eslint-plugin-prettier": "^4.0.0",
89
+ "husky": "4.3.0",
90
+ "nodemon": "^2.0.13",
91
+ "plop": "^2.7.4",
92
+ "prettier": "^2.5.0",
93
+ "react": "18.0.0",
94
+ "react-dom": "18.0.0",
95
+ "react-scripts": "4.0.1",
96
+ "rimraf": "3.0.2"
97
+ },
98
+ "jest": {
99
+ "transformIgnorePatterns": [
100
+ "node_modules/(?!(three)/)"
101
+ ],
102
+ "moduleNameMapper": {
103
+ "^react-pdf$": "react-pdf/dist/umd/entry.jest",
104
+ "^react-konva-utils$": "react-pdf/dist/umd/entry.jest"
105
+ }
106
+ },
107
+ "husky": {
108
+ "hooks": {
109
+ "prepare-commit-msg": "bash node_modules/@gamelearn/version/scripts/update_version.sh -p hooks.config ${HUSKY_GIT_PARAMS}",
110
+ "post-commit": "bash node_modules/@gamelearn/version/scripts/after_version_update.sh -p hooks.config",
111
+ "post-merge": "bash node_modules/@gamelearn/version/scripts/after_version_update.sh -p hooks.config"
112
+ }
113
+ }
114
+ }