@micromag/viewer 0.2.376 → 0.2.380

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.js +27 -7
  2. package/lib/index.js +27 -7
  3. package/package.json +8 -8
package/es/index.js CHANGED
@@ -41,7 +41,8 @@ var propTypes$8 = {
41
41
  onPrevious: PropTypes.func,
42
42
  onNext: PropTypes.func,
43
43
  onEnableInteraction: PropTypes.func,
44
- onDisableInteraction: PropTypes.func
44
+ onDisableInteraction: PropTypes.func,
45
+ getMediaRef: PropTypes.func
45
46
  };
46
47
  var defaultProps$8 = {
47
48
  screen: null,
@@ -51,7 +52,8 @@ var defaultProps$8 = {
51
52
  onPrevious: null,
52
53
  onNext: null,
53
54
  onEnableInteraction: null,
54
- onDisableInteraction: null
55
+ onDisableInteraction: null,
56
+ getMediaRef: null
55
57
  };
56
58
 
57
59
  var ViewerScreen = function ViewerScreen(_ref) {
@@ -64,7 +66,8 @@ var ViewerScreen = function ViewerScreen(_ref) {
64
66
  onPrevious = _ref.onPrevious,
65
67
  onNext = _ref.onNext,
66
68
  onEnableInteraction = _ref.onEnableInteraction,
67
- onDisableInteraction = _ref.onDisableInteraction;
69
+ onDisableInteraction = _ref.onDisableInteraction,
70
+ getMediaRef = _ref.getMediaRef;
68
71
  return screen !== null ? /*#__PURE__*/React.createElement("div", {
69
72
  className: classNames([styles$6.container, (_ref2 = {}, _defineProperty(_ref2, styles$6.active, active), _defineProperty(_ref2, styles$6.current, current), _ref2)]),
70
73
  "aria-hidden": current ? null : 'true'
@@ -76,7 +79,8 @@ var ViewerScreen = function ViewerScreen(_ref) {
76
79
  onPrevious: onPrevious,
77
80
  onNext: onNext,
78
81
  onEnableInteraction: onEnableInteraction,
79
- onDisableInteraction: onDisableInteraction
82
+ onDisableInteraction: onDisableInteraction,
83
+ getMediaRef: getMediaRef
80
84
  })) : null;
81
85
  };
82
86
 
@@ -773,6 +777,7 @@ var propTypes$2 = {
773
777
  onInteraction: PropTypes.func,
774
778
  onEnd: PropTypes.func,
775
779
  onViewModeChange: PropTypes.func,
780
+ currentMedia: PropTypes$1.ref,
776
781
  className: PropTypes.string
777
782
  };
778
783
  var defaultProps$2 = {
@@ -797,6 +802,7 @@ var defaultProps$2 = {
797
802
  onInteraction: null,
798
803
  onEnd: null,
799
804
  onViewModeChange: null,
805
+ currentMedia: null,
800
806
  className: null
801
807
  };
802
808
 
@@ -824,6 +830,7 @@ var Viewer = function Viewer(_ref) {
824
830
  onInteraction = _ref.onInteraction,
825
831
  onEnd = _ref.onEnd,
826
832
  onViewModeChange = _ref.onViewModeChange,
833
+ currentMedia = _ref.currentMedia,
827
834
  className = _ref.className;
828
835
  var intl = useIntl();
829
836
  var parsedStory = useParsedStory(story, {
@@ -892,7 +899,7 @@ var Viewer = function Viewer(_ref) {
892
899
  menuOverScreen = _ref5$menuOverScreen === void 0 ? false : _ref5$menuOverScreen;
893
900
 
894
901
  var hasSize = screenWidth > 0 && screenHeight > 0;
895
- var ready = hasSize; // && fontsLoaded;
902
+ var ready = hasSize; // && fontsLoaded;
896
903
 
897
904
  useEffect(function () {
898
905
  if (ready && onViewModeChange !== null) {
@@ -917,19 +924,29 @@ var Viewer = function Viewer(_ref) {
917
924
 
918
925
  var _ref7 = menuPreviewContainerRect || {},
919
926
  _ref7$height = _ref7.height,
920
- menuPreviewContainerHeight = _ref7$height === void 0 ? 0 : _ref7$height; // Screen index
927
+ menuPreviewContainerHeight = _ref7$height === void 0 ? 0 : _ref7$height;
921
928
 
929
+ var screensMediaRef = useRef([]); // Screen index
922
930
 
923
931
  var screenIndex = useMemo(function () {
924
932
  return Math.max(0, screens.findIndex(function (it) {
925
933
  return String(it.id) === String(screenId);
926
934
  }));
927
935
  }, [screenId, screens]);
936
+
937
+ if (currentMedia !== null) {
938
+ currentMedia.current = screensMediaRef.current[screenIndex];
939
+ }
940
+
928
941
  var changeIndex = useCallback(function (index) {
929
942
  if (index === screenIndex) {
930
943
  return;
931
944
  }
932
945
 
946
+ if (currentMedia !== null) {
947
+ currentMedia.current = screensMediaRef.current[index];
948
+ }
949
+
933
950
  if (onScreenChange !== null) {
934
951
  onScreenChange(screens[index], index);
935
952
  }
@@ -1346,7 +1363,10 @@ var Viewer = function Viewer(_ref) {
1346
1363
  onPrevious: onScreenPrevious,
1347
1364
  onNext: onScreenNext,
1348
1365
  onEnableInteraction: onEnableInteraction,
1349
- onDisableInteraction: onDisableInteraction
1366
+ onDisableInteraction: onDisableInteraction,
1367
+ getMediaRef: function getMediaRef(mediaRef) {
1368
+ screensMediaRef.current[i] = mediaRef;
1369
+ }
1350
1370
  });
1351
1371
  var key = "screen-viewer-".concat(scr.id || '', "-").concat(i + 1);
1352
1372
  var screenTransform = landscape ? "translateX(calc(".concat((screenWidth + landscapeScreenMargin) * (i - screenIndex), "px - 50%)) scale(").concat(current ? 1 : 0.9, ")") : "translateX(".concat(current ? 0 : '100%', ")");
package/lib/index.js CHANGED
@@ -58,7 +58,8 @@ var propTypes$8 = {
58
58
  onPrevious: PropTypes__default["default"].func,
59
59
  onNext: PropTypes__default["default"].func,
60
60
  onEnableInteraction: PropTypes__default["default"].func,
61
- onDisableInteraction: PropTypes__default["default"].func
61
+ onDisableInteraction: PropTypes__default["default"].func,
62
+ getMediaRef: PropTypes__default["default"].func
62
63
  };
63
64
  var defaultProps$8 = {
64
65
  screen: null,
@@ -68,7 +69,8 @@ var defaultProps$8 = {
68
69
  onPrevious: null,
69
70
  onNext: null,
70
71
  onEnableInteraction: null,
71
- onDisableInteraction: null
72
+ onDisableInteraction: null,
73
+ getMediaRef: null
72
74
  };
73
75
 
74
76
  var ViewerScreen = function ViewerScreen(_ref) {
@@ -81,7 +83,8 @@ var ViewerScreen = function ViewerScreen(_ref) {
81
83
  onPrevious = _ref.onPrevious,
82
84
  onNext = _ref.onNext,
83
85
  onEnableInteraction = _ref.onEnableInteraction,
84
- onDisableInteraction = _ref.onDisableInteraction;
86
+ onDisableInteraction = _ref.onDisableInteraction,
87
+ getMediaRef = _ref.getMediaRef;
85
88
  return screen !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
86
89
  className: classNames__default["default"]([styles$6.container, (_ref2 = {}, _defineProperty__default["default"](_ref2, styles$6.active, active), _defineProperty__default["default"](_ref2, styles$6.current, current), _ref2)]),
87
90
  "aria-hidden": current ? null : 'true'
@@ -93,7 +96,8 @@ var ViewerScreen = function ViewerScreen(_ref) {
93
96
  onPrevious: onPrevious,
94
97
  onNext: onNext,
95
98
  onEnableInteraction: onEnableInteraction,
96
- onDisableInteraction: onDisableInteraction
99
+ onDisableInteraction: onDisableInteraction,
100
+ getMediaRef: getMediaRef
97
101
  })) : null;
98
102
  };
99
103
 
@@ -790,6 +794,7 @@ var propTypes$2 = {
790
794
  onInteraction: PropTypes__default["default"].func,
791
795
  onEnd: PropTypes__default["default"].func,
792
796
  onViewModeChange: PropTypes__default["default"].func,
797
+ currentMedia: core.PropTypes.ref,
793
798
  className: PropTypes__default["default"].string
794
799
  };
795
800
  var defaultProps$2 = {
@@ -814,6 +819,7 @@ var defaultProps$2 = {
814
819
  onInteraction: null,
815
820
  onEnd: null,
816
821
  onViewModeChange: null,
822
+ currentMedia: null,
817
823
  className: null
818
824
  };
819
825
 
@@ -841,6 +847,7 @@ var Viewer = function Viewer(_ref) {
841
847
  onInteraction = _ref.onInteraction,
842
848
  onEnd = _ref.onEnd,
843
849
  onViewModeChange = _ref.onViewModeChange,
850
+ currentMedia = _ref.currentMedia,
844
851
  className = _ref.className;
845
852
  var intl = reactIntl.useIntl();
846
853
  var parsedStory = hooks.useParsedStory(story, {
@@ -909,7 +916,7 @@ var Viewer = function Viewer(_ref) {
909
916
  menuOverScreen = _ref5$menuOverScreen === void 0 ? false : _ref5$menuOverScreen;
910
917
 
911
918
  var hasSize = screenWidth > 0 && screenHeight > 0;
912
- var ready = hasSize; // && fontsLoaded;
919
+ var ready = hasSize; // && fontsLoaded;
913
920
 
914
921
  React.useEffect(function () {
915
922
  if (ready && onViewModeChange !== null) {
@@ -934,19 +941,29 @@ var Viewer = function Viewer(_ref) {
934
941
 
935
942
  var _ref7 = menuPreviewContainerRect || {},
936
943
  _ref7$height = _ref7.height,
937
- menuPreviewContainerHeight = _ref7$height === void 0 ? 0 : _ref7$height; // Screen index
944
+ menuPreviewContainerHeight = _ref7$height === void 0 ? 0 : _ref7$height;
938
945
 
946
+ var screensMediaRef = React.useRef([]); // Screen index
939
947
 
940
948
  var screenIndex = React.useMemo(function () {
941
949
  return Math.max(0, screens.findIndex(function (it) {
942
950
  return String(it.id) === String(screenId);
943
951
  }));
944
952
  }, [screenId, screens]);
953
+
954
+ if (currentMedia !== null) {
955
+ currentMedia.current = screensMediaRef.current[screenIndex];
956
+ }
957
+
945
958
  var changeIndex = React.useCallback(function (index) {
946
959
  if (index === screenIndex) {
947
960
  return;
948
961
  }
949
962
 
963
+ if (currentMedia !== null) {
964
+ currentMedia.current = screensMediaRef.current[index];
965
+ }
966
+
950
967
  if (onScreenChange !== null) {
951
968
  onScreenChange(screens[index], index);
952
969
  }
@@ -1363,7 +1380,10 @@ var Viewer = function Viewer(_ref) {
1363
1380
  onPrevious: onScreenPrevious,
1364
1381
  onNext: onScreenNext,
1365
1382
  onEnableInteraction: onEnableInteraction,
1366
- onDisableInteraction: onDisableInteraction
1383
+ onDisableInteraction: onDisableInteraction,
1384
+ getMediaRef: function getMediaRef(mediaRef) {
1385
+ screensMediaRef.current[i] = mediaRef;
1386
+ }
1367
1387
  });
1368
1388
  var key = "screen-viewer-".concat(scr.id || '', "-").concat(i + 1);
1369
1389
  var screenTransform = landscape ? "translateX(calc(".concat((screenWidth + landscapeScreenMargin) * (i - screenIndex), "px - 50%)) scale(").concat(current ? 1 : 0.9, ")") : "translateX(".concat(current ? 0 : '100%', ")");
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/viewer",
3
- "version": "0.2.376",
3
+ "version": "0.2.380",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -55,12 +55,12 @@
55
55
  "@fortawesome/fontawesome-svg-core": "^1.2.32",
56
56
  "@fortawesome/free-solid-svg-icons": "^5.15.1",
57
57
  "@fortawesome/react-fontawesome": "^0.1.13",
58
- "@micromag/core": "^0.2.375",
59
- "@micromag/element-scroll": "^0.2.375",
60
- "@micromag/elements": "^0.2.375",
61
- "@micromag/fields": "^0.2.376",
62
- "@micromag/intl": "^0.2.375",
63
- "@micromag/screens": "^0.2.375",
58
+ "@micromag/core": "^0.2.379",
59
+ "@micromag/element-scroll": "^0.2.379",
60
+ "@micromag/elements": "^0.2.379",
61
+ "@micromag/fields": "^0.2.379",
62
+ "@micromag/intl": "^0.2.379",
63
+ "@micromag/screens": "^0.2.379",
64
64
  "@react-spring/core": "^9.1.1",
65
65
  "@react-spring/web": "^9.1.1",
66
66
  "classnames": "^2.2.6",
@@ -76,5 +76,5 @@
76
76
  "publishConfig": {
77
77
  "access": "public"
78
78
  },
79
- "gitHead": "e35dba9df9d8146d6169e0c8aa0a2c8677171fa6"
79
+ "gitHead": "857ac6e0c89d8edc0f1f9781c093e51d65757f34"
80
80
  }