@micromag/screen-quiz 0.4.70 → 0.4.71

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 (3) hide show
  1. package/es/index.d.ts +5 -2
  2. package/es/index.js +7 -3
  3. package/package.json +16 -16
package/es/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import { ForwardedRef } from 'react';
2
3
  import { TextElement, QuizAnswer, ImageElement, VisualElement, ButtonLayout, BoxStyle, TextStyle, Color, BackgroundElement, Header, Footer, Transitions } from '@micromag/core';
3
4
 
4
5
  interface QuizScreenProps {
@@ -32,9 +33,10 @@ interface QuizScreenProps {
32
33
  transitions?: Transitions | null;
33
34
  transitionStagger?: number;
34
35
  type?: string | null;
36
+ mediaRef?: ForwardedRef<HTMLMediaElement> | null;
35
37
  className?: string | null;
36
38
  }
37
- declare function QuizScreen({ id, layout, keypadLayout, question, answers, result, resultImage, buttonsLayout, buttonsStyle, inactiveButtonsStyle, buttonsTextStyle, inactiveButtonsTextStyle, feedbackTextStyle, numbersTextStyle, goodAnswerColor, badAnswerColor, withoutTrueFalse, spacing, header, footer, background, current, preload, ready, transitions, transitionStagger, type, className, }: QuizScreenProps): react_jsx_runtime.JSX.Element;
39
+ declare function QuizScreen({ id, layout, keypadLayout, question, answers, result, resultImage, buttonsLayout, buttonsStyle, inactiveButtonsStyle, buttonsTextStyle, inactiveButtonsTextStyle, feedbackTextStyle, numbersTextStyle, goodAnswerColor, badAnswerColor, withoutTrueFalse, spacing, header, footer, background, current, preload, ready, transitions, transitionStagger, type, mediaRef: customMediaRef, className, }: QuizScreenProps): react_jsx_runtime.JSX.Element;
38
40
 
39
41
  interface QuizMultipleScreenProps {
40
42
  id?: string | null;
@@ -73,9 +75,10 @@ interface QuizMultipleScreenProps {
73
75
  transitions?: Transitions | null;
74
76
  transitionStagger?: number;
75
77
  type?: string | null;
78
+ mediaRef?: ForwardedRef<HTMLMediaElement> | null;
76
79
  className?: string | null;
77
80
  }
78
- declare function QuizMultipleScreen({ id, layout, introLayout, title, description, questions, results, buttonsStyle, inactiveButtonsStyle, buttonsTextStyle, inactiveButtonsTextStyle, questionsHeadingStyle, resultsHeadingStyle, resultsTextStyle, feedbackTextStyle, numbersTextStyle, goodAnswerColor, badAnswerColor, spacing, background, introBackground, introButton, nextButton, header, footer, current, active, transitions, transitionStagger, type, className, }: QuizMultipleScreenProps): react_jsx_runtime.JSX.Element;
81
+ declare function QuizMultipleScreen({ id, layout, introLayout, title, description, questions, results, buttonsStyle, inactiveButtonsStyle, buttonsTextStyle, inactiveButtonsTextStyle, questionsHeadingStyle, resultsHeadingStyle, resultsTextStyle, feedbackTextStyle, numbersTextStyle, goodAnswerColor, badAnswerColor, spacing, background, introBackground, introButton, nextButton, header, footer, current, active, transitions, transitionStagger, type, mediaRef: customMediaRef, className, }: QuizMultipleScreenProps): react_jsx_runtime.JSX.Element;
79
82
 
80
83
  declare const _default: ({
81
84
  id: string;
package/es/index.js CHANGED
@@ -9,7 +9,7 @@ import { useState, useEffect, useRef, useMemo, useCallback } from 'react';
9
9
  import { ScreenElement, Transitions, Button } from '@micromag/core/components';
10
10
  import { useScreenRenderContext, useScreenSize, useViewerContext, useViewerWebView, usePlaybackContext, usePlaybackMediaRef, useScreenState } from '@micromag/core/contexts';
11
11
  import { useTrackScreenEvent, useDimensionObserver } from '@micromag/core/hooks';
12
- import { isTextFilled, isImageFilled, getStyleFromColor, isHeaderFilled, isFooterFilled, getFooterProps } from '@micromag/core/utils';
12
+ import { isTextFilled, isImageFilled, getStyleFromColor, isHeaderFilled, isFooterFilled, getFooterProps, mergeRefs } from '@micromag/core/utils';
13
13
  import { useQuizCreate } from '@micromag/data';
14
14
  import Background from '@micromag/element-background';
15
15
  import Container from '@micromag/element-container';
@@ -675,6 +675,8 @@ function QuizScreen(_ref) {
675
675
  transitionStagger = _ref$transitionStagge === void 0 ? 100 : _ref$transitionStagge,
676
676
  _ref$type = _ref.type,
677
677
  type = _ref$type === void 0 ? null : _ref$type,
678
+ _ref$mediaRef = _ref.mediaRef,
679
+ customMediaRef = _ref$mediaRef === void 0 ? null : _ref$mediaRef,
678
680
  _ref$className = _ref.className,
679
681
  className = _ref$className === void 0 ? null : _ref$className;
680
682
  var screenId = id || 'screen-id';
@@ -906,7 +908,7 @@ function QuizScreen(_ref) {
906
908
  playing: backgroundPlaying,
907
909
  muted: muted,
908
910
  shouldLoad: mediaShouldLoad,
909
- mediaRef: mediaRef,
911
+ mediaRef: mergeRefs(mediaRef, customMediaRef),
910
912
  withoutVideo: isPreview,
911
913
  className: styles$2.background
912
914
  }) : null]
@@ -1141,6 +1143,8 @@ function QuizMultipleScreen(_ref) {
1141
1143
  transitionStagger = _ref$transitionStagge === void 0 ? 100 : _ref$transitionStagge,
1142
1144
  _ref$type = _ref.type,
1143
1145
  type = _ref$type === void 0 ? null : _ref$type,
1146
+ _ref$mediaRef = _ref.mediaRef,
1147
+ customMediaRef = _ref$mediaRef === void 0 ? null : _ref$mediaRef,
1144
1148
  _ref$className = _ref.className,
1145
1149
  className = _ref$className === void 0 ? null : _ref$className;
1146
1150
  var screenId = id || 'screen-id';
@@ -1729,7 +1733,7 @@ function QuizMultipleScreen(_ref) {
1729
1733
  playing: item.key === bgItem.key && backgroundPlaying,
1730
1734
  muted: muted,
1731
1735
  shouldLoad: backgroundShouldLoad,
1732
- mediaRef: item.key === bgItem.key ? mediaRef : null,
1736
+ mediaRef: item.key === bgItem.key ? mergeRefs(mediaRef, customMediaRef) : null,
1733
1737
  className: styles$2.background,
1734
1738
  withoutVideo: isPreview
1735
1739
  })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-quiz",
3
- "version": "0.4.70",
3
+ "version": "0.4.71",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [
@@ -64,20 +64,20 @@
64
64
  "@fortawesome/fontawesome-svg-core": "^7.2.0",
65
65
  "@fortawesome/free-solid-svg-icons": "^7.2.0",
66
66
  "@fortawesome/react-fontawesome": "^3.2.0",
67
- "@micromag/core": "^0.4.69",
68
- "@micromag/data": "^0.4.69",
69
- "@micromag/element-background": "^0.4.70",
70
- "@micromag/element-button": "^0.4.70",
71
- "@micromag/element-container": "^0.4.69",
72
- "@micromag/element-footer": "^0.4.70",
73
- "@micromag/element-header": "^0.4.69",
74
- "@micromag/element-heading": "^0.4.69",
75
- "@micromag/element-keypad": "^0.4.69",
76
- "@micromag/element-layout": "^0.4.69",
77
- "@micromag/element-scroll": "^0.4.69",
78
- "@micromag/element-text": "^0.4.69",
79
- "@micromag/element-visual": "^0.4.70",
80
- "@micromag/transforms": "^0.4.69",
67
+ "@micromag/core": "^0.4.71",
68
+ "@micromag/data": "^0.4.71",
69
+ "@micromag/element-background": "^0.4.71",
70
+ "@micromag/element-button": "^0.4.71",
71
+ "@micromag/element-container": "^0.4.71",
72
+ "@micromag/element-footer": "^0.4.71",
73
+ "@micromag/element-header": "^0.4.71",
74
+ "@micromag/element-heading": "^0.4.71",
75
+ "@micromag/element-keypad": "^0.4.71",
76
+ "@micromag/element-layout": "^0.4.71",
77
+ "@micromag/element-scroll": "^0.4.71",
78
+ "@micromag/element-text": "^0.4.71",
79
+ "@micromag/element-visual": "^0.4.71",
80
+ "@micromag/transforms": "^0.4.71",
81
81
  "@react-spring/core": "^10.0.3",
82
82
  "@react-spring/web": "^10.0.3",
83
83
  "classnames": "^2.2.6",
@@ -89,6 +89,6 @@
89
89
  "access": "public",
90
90
  "registry": "https://registry.npmjs.org/"
91
91
  },
92
- "gitHead": "4f76a8f1ad594be2aadb4a593da5455da8afc8b6",
92
+ "gitHead": "9101554bc5761e32b4a002a10d26800608c69773",
93
93
  "types": "es/index.d.ts"
94
94
  }