@micromag/viewer 0.3.540 → 0.3.547

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 +30 -48
  2. package/package.json +11 -12
  3. package/lib/index.js +0 -4125
package/es/index.js CHANGED
@@ -16,7 +16,7 @@ import classNames from 'classnames';
16
16
  import { Helmet } from 'react-helmet';
17
17
  import { useIntl, FormattedMessage } from 'react-intl';
18
18
  import EventEmitter from 'wolfy87-eventemitter';
19
- import { Label, CloseIcon, ScreenPreview, Screen, ArrowIcon, Button as Button$2, PlayIcon, Spinner, UnmuteIcon, MuteIcon, PauseIcon, Meta, FontFaces } from '@micromag/core/components';
19
+ import { Label, CloseIcon, ScreenPreview, Screen, ArrowIcon, Button as Button$1, PlayIcon, Spinner, UnmuteIcon, MuteIcon, PauseIcon, Meta, FontFaces } from '@micromag/core/components';
20
20
  import { useDimensionObserver, useTrackEvent, useDragProgress, useMediaProgress, useMediaReady, useMediaState, useParsedStory, useLoadedFonts, useTrackScreenView, useScreenSizeFromElement, useFullscreen } from '@micromag/core/hooks';
21
21
  import { getStyleFromColor, easings, getStyleFromText, getColorAsString, getDeviceScreens } from '@micromag/core/utils';
22
22
  import { ShareIncentive } from '@micromag/elements/all';
@@ -363,7 +363,6 @@ var Button = function Button(_ref) {
363
363
  };
364
364
  Button.propTypes = propTypes$n;
365
365
  Button.defaultProps = defaultProps$n;
366
- var Button$1 = Button;
367
366
 
368
367
  var styles$f = {"container":"micromag-viewer-buttons-icon-button-container","label":"micromag-viewer-buttons-icon-button-label","icon":"micromag-viewer-buttons-icon-button-icon"};
369
368
 
@@ -380,7 +379,7 @@ var IconButton = function IconButton(_ref) {
380
379
  var iconClassName = _ref.iconClassName,
381
380
  className = _ref.className,
382
381
  props = _objectWithoutProperties(_ref, _excluded$9);
383
- return /*#__PURE__*/React.createElement(Button$1, Object.assign({
382
+ return /*#__PURE__*/React.createElement(Button, Object.assign({
384
383
  className: classNames([styles$f.container, _defineProperty({}, className, className !== null)]),
385
384
  labelClassName: styles$f.label,
386
385
  iconClassName: classNames([styles$f.icon, _defineProperty({}, iconClassName, iconClassName !== null)])
@@ -388,7 +387,6 @@ var IconButton = function IconButton(_ref) {
388
387
  };
389
388
  IconButton.propTypes = propTypes$m;
390
389
  IconButton.defaultProps = defaultProps$m;
391
- var IconButton$1 = IconButton;
392
390
 
393
391
  var _excluded$8 = ["single", "className"];
394
392
  var propTypes$l = {
@@ -404,7 +402,7 @@ var CloseMenuButton = function CloseMenuButton(_ref) {
404
402
  className = _ref.className,
405
403
  props = _objectWithoutProperties(_ref, _excluded$8);
406
404
  var intl = useIntl();
407
- return /*#__PURE__*/React.createElement(IconButton$1, Object.assign({
405
+ return /*#__PURE__*/React.createElement(IconButton, Object.assign({
408
406
  className: classNames([_defineProperty({}, className, className !== null)]),
409
407
  label: intl.formatMessage({
410
408
  id: "dIvwcD",
@@ -447,7 +445,6 @@ var CloseMenuButton = function CloseMenuButton(_ref) {
447
445
  };
448
446
  CloseMenuButton.propTypes = propTypes$l;
449
447
  CloseMenuButton.defaultProps = defaultProps$l;
450
- var CloseMenuButton$1 = CloseMenuButton;
451
448
 
452
449
  var _excluded$7 = ["className", "iconClassName"];
453
450
  var propTypes$k = {
@@ -463,7 +460,7 @@ var MenuButton = function MenuButton(_ref) {
463
460
  _ref.iconClassName;
464
461
  var props = _objectWithoutProperties(_ref, _excluded$7);
465
462
  var intl = useIntl();
466
- return /*#__PURE__*/React.createElement(IconButton$1, Object.assign({
463
+ return /*#__PURE__*/React.createElement(IconButton, Object.assign({
467
464
  className: classNames([_defineProperty({}, className, className !== null)]),
468
465
  label: intl.formatMessage({
469
466
  id: "F/gl4b",
@@ -500,7 +497,6 @@ var MenuButton = function MenuButton(_ref) {
500
497
  };
501
498
  MenuButton.propTypes = propTypes$k;
502
499
  MenuButton.defaultProps = defaultProps$k;
503
- var MenuButton$1 = MenuButton;
504
500
 
505
501
  var _excluded$6 = ["className"];
506
502
  var propTypes$j = {
@@ -513,7 +509,7 @@ var ShareButton = function ShareButton(_ref) {
513
509
  var className = _ref.className,
514
510
  props = _objectWithoutProperties(_ref, _excluded$6);
515
511
  var intl = useIntl();
516
- return /*#__PURE__*/React.createElement(IconButton$1, Object.assign({
512
+ return /*#__PURE__*/React.createElement(IconButton, Object.assign({
517
513
  className: classNames([_defineProperty({}, className, className !== null)]),
518
514
  label: intl.formatMessage({
519
515
  id: "7tw6U2",
@@ -544,7 +540,6 @@ var ShareButton = function ShareButton(_ref) {
544
540
  };
545
541
  ShareButton.propTypes = propTypes$j;
546
542
  ShareButton.defaultProps = defaultProps$j;
547
- var ShareButton$1 = ShareButton;
548
543
 
549
544
  var styles$e = {"container":"micromag-viewer-buttons-toggle-button-container","normal":"micromag-viewer-buttons-toggle-button-normal","toggled":"micromag-viewer-buttons-toggle-button-toggled"};
550
545
 
@@ -590,7 +585,6 @@ var ToggleButton = function ToggleButton(_ref) {
590
585
  };
591
586
  ToggleButton.propTypes = propTypes$i;
592
587
  ToggleButton.defaultProps = defaultProps$i;
593
- var ToggleButton$1 = ToggleButton;
594
588
 
595
589
  var styles$d = {"backdrop":"micromag-viewer-menus-menu-container-backdrop","heightContainer":"micromag-viewer-menus-menu-container-heightContainer","container":"micromag-viewer-menus-menu-container-container"};
596
590
 
@@ -649,7 +643,6 @@ var ViewerMenuContainer = function ViewerMenuContainer(_ref) {
649
643
  };
650
644
  ViewerMenuContainer.propTypes = propTypes$h;
651
645
  ViewerMenuContainer.defaultProps = defaultProps$h;
652
- var MenuContainer = ViewerMenuContainer;
653
646
 
654
647
  var styles$c = {"button":"micromag-viewer-menus-menu-dot-button","progress":"micromag-viewer-menus-menu-dot-progress","container":"micromag-viewer-menus-menu-dot-container","vertical":"micromag-viewer-menus-menu-dot-vertical","dot":"micromag-viewer-menus-menu-dot-dot","subDot":"micromag-viewer-menus-menu-dot-subDot","dots":"micromag-viewer-menus-menu-dot-dots","outlineBounce":"micromag-viewer-menus-menu-dot-outlineBounce"};
655
648
 
@@ -741,7 +734,6 @@ var ViewerMenuDot = function ViewerMenuDot(_ref) {
741
734
  };
742
735
  ViewerMenuDot.propTypes = propTypes$g;
743
736
  ViewerMenuDot.defaultProps = defaultProps$g;
744
- var MenuDot = ViewerMenuDot;
745
737
 
746
738
  var styles$b = {"container":"micromag-viewer-menus-menu-dots-container","closeButton":"micromag-viewer-menus-menu-dots-closeButton","items":"micromag-viewer-menus-menu-dots-items","item":"micromag-viewer-menus-menu-dots-item","buttons":"micromag-viewer-menus-menu-dots-buttons","vertical":"micromag-viewer-menus-menu-dots-vertical"};
747
739
 
@@ -834,7 +826,7 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
834
826
  count = _ref6$count === void 0 ? 1 : _ref6$count,
835
827
  _ref6$subIndex = _ref6.subIndex,
836
828
  subIndex = _ref6$subIndex === void 0 ? 0 : _ref6$subIndex;
837
- return /*#__PURE__*/React.createElement(MenuDot, {
829
+ return /*#__PURE__*/React.createElement(ViewerMenuDot, {
838
830
  key: "item-".concat(index + 1),
839
831
  current: current,
840
832
  active: index <= currentIndex,
@@ -879,7 +871,6 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
879
871
  };
880
872
  ViewerMenuDots.propTypes = propTypes$f;
881
873
  ViewerMenuDots.defaultProps = defaultProps$f;
882
- var MenuDots = ViewerMenuDots;
883
874
 
884
875
  var propTypes$e = {
885
876
  className: PropTypes.string
@@ -904,7 +895,6 @@ var StackIcon = function StackIcon(_ref) {
904
895
  };
905
896
  StackIcon.propTypes = propTypes$e;
906
897
  StackIcon.defaultProps = defaultProps$e;
907
- var StackIcon$1 = StackIcon;
908
898
 
909
899
  var styles$a = {"button":"micromag-viewer-menus-menu-screen-button","container":"micromag-viewer-menus-menu-screen-container","isCurrent":"micromag-viewer-menus-menu-screen-isCurrent","inner":"micromag-viewer-menus-menu-screen-inner","subScreenBadge":"micromag-viewer-menus-menu-screen-subScreenBadge","subScreenCount":"micromag-viewer-menus-menu-screen-subScreenCount","subScreenIcon":"micromag-viewer-menus-menu-screen-subScreenIcon","screen":"micromag-viewer-menus-menu-screen-screen","pulse":"micromag-viewer-menus-menu-screen-pulse"};
910
900
 
@@ -984,7 +974,7 @@ var ViewerMenuScreen = function ViewerMenuScreen(_ref) {
984
974
  className: styles$a.subScreenBadge
985
975
  }, /*#__PURE__*/React.createElement("span", {
986
976
  className: styles$a.subScreenCount
987
- }, count), /*#__PURE__*/React.createElement(StackIcon$1, {
977
+ }, count), /*#__PURE__*/React.createElement(StackIcon, {
988
978
  className: styles$a.subScreenIcon
989
979
  })) : null, screenWidth > 0 && screenHeight > 0 ? /*#__PURE__*/React.createElement(ScreenPreview, {
990
980
  className: styles$a.screen,
@@ -998,7 +988,6 @@ var ViewerMenuScreen = function ViewerMenuScreen(_ref) {
998
988
  };
999
989
  ViewerMenuScreen.propTypes = propTypes$d;
1000
990
  ViewerMenuScreen.defaultProps = defaultProps$d;
1001
- var MenuScreen = ViewerMenuScreen;
1002
991
 
1003
992
  var styles$9 = {"scroll":"micromag-viewer-menus-menu-preview-scroll","container":"micromag-viewer-menus-menu-preview-container","disabled":"micromag-viewer-menus-menu-preview-disabled","screenButton":"micromag-viewer-menus-menu-preview-screenButton","content":"micromag-viewer-menus-menu-preview-content","buttons":"micromag-viewer-menus-menu-preview-buttons","organisation":"micromag-viewer-menus-menu-preview-organisation","icon":"micromag-viewer-menus-menu-preview-icon","titleContainer":"micromag-viewer-menus-menu-preview-titleContainer","headerContainer":"micromag-viewer-menus-menu-preview-headerContainer","badge":"micromag-viewer-menus-menu-preview-badge","title":"micromag-viewer-menus-menu-preview-title","nav":"micromag-viewer-menus-menu-preview-nav","items":"micromag-viewer-menus-menu-preview-items","item":"micromag-viewer-menus-menu-preview-item","inner":"micromag-viewer-menus-menu-preview-inner","frame":"micromag-viewer-menus-menu-preview-frame","screen":"micromag-viewer-menus-menu-preview-screen","intro":"micromag-viewer-menus-menu-preview-intro"};
1004
993
 
@@ -1164,7 +1153,7 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
1164
1153
  style: {
1165
1154
  paddingBottom: "".concat(screenHeight / screenWidth * 100, "%")
1166
1155
  }
1167
- }, screenMounted ? /*#__PURE__*/React.createElement(MenuScreen, {
1156
+ }, screenMounted ? /*#__PURE__*/React.createElement(ViewerMenuScreen, {
1168
1157
  className: styles$9.screen,
1169
1158
  item: item,
1170
1159
  index: index,
@@ -1176,7 +1165,6 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
1176
1165
  };
1177
1166
  ViewerMenuPreview.propTypes = propTypes$c;
1178
1167
  ViewerMenuPreview.defaultProps = defaultProps$c;
1179
- var MenuPreview = ViewerMenuPreview;
1180
1168
 
1181
1169
  var styles$8 = {"container":"micromag-viewer-partials-micromag-preview-container","cover":"micromag-viewer-partials-micromag-preview-cover","info":"micromag-viewer-partials-micromag-preview-info","url":"micromag-viewer-partials-micromag-preview-url","title":"micromag-viewer-partials-micromag-preview-title"};
1182
1170
 
@@ -1219,7 +1207,6 @@ var MicromagPreview = function MicromagPreview(_ref) {
1219
1207
  };
1220
1208
  MicromagPreview.propTypes = propTypes$b;
1221
1209
  MicromagPreview.defaultProps = defaultProps$b;
1222
- var MicromagPreview$1 = MicromagPreview;
1223
1210
 
1224
1211
  var styles$7 = {"scroll":"micromag-viewer-menus-menu-share-scroll","container":"micromag-viewer-menus-menu-share-container","disabled":"micromag-viewer-menus-menu-share-disabled","button":"micromag-viewer-menus-menu-share-button","content":"micromag-viewer-menus-menu-share-content","inner":"micromag-viewer-menus-menu-share-inner","organisation":"micromag-viewer-menus-menu-share-organisation","icon":"micromag-viewer-menus-menu-share-icon","header":"micromag-viewer-menus-menu-share-header","mode":"micromag-viewer-menus-menu-share-mode","bump":"micromag-viewer-menus-menu-share-bump","options":"micromag-viewer-menus-menu-share-options"};
1225
1212
 
@@ -1321,7 +1308,7 @@ var ViewerMenuShare = function ViewerMenuShare(_ref) {
1321
1308
  }
1322
1309
  }, /*#__PURE__*/React.createElement("div", {
1323
1310
  className: styles$7.header
1324
- }, /*#__PURE__*/React.createElement(MicromagPreview$1, {
1311
+ }, /*#__PURE__*/React.createElement(MicromagPreview, {
1325
1312
  className: styles$7.preview,
1326
1313
  screen: shareCurrentScreen ? currentScreen : coverScreen,
1327
1314
  title: title,
@@ -1355,7 +1342,6 @@ var ViewerMenuShare = function ViewerMenuShare(_ref) {
1355
1342
  };
1356
1343
  ViewerMenuShare.propTypes = propTypes$a;
1357
1344
  ViewerMenuShare.defaultProps = defaultProps$a;
1358
- var MenuShare = ViewerMenuShare;
1359
1345
 
1360
1346
  var styles$6 = {"container":"micromag-viewer-container","screenContainer":"micromag-viewer-screenContainer","screensFrame":"micromag-viewer-screensFrame","menuShare":"micromag-viewer-menuShare","menuPreview":"micromag-viewer-menuPreview","menuContainer":"micromag-viewer-menuContainer","landscape":"micromag-viewer-landscape","hideMenu":"micromag-viewer-hideMenu","menuNavContainer":"micromag-viewer-menuNavContainer","menuTopContainer":"micromag-viewer-menuTopContainer","dots":"micromag-viewer-dots","disableMenu":"micromag-viewer-disableMenu","content":"micromag-viewer-content","withoutGestures":"micromag-viewer-withoutGestures","ariaAnnouncement":"micromag-viewer-ariaAnnouncement","accessibilityLinks":"micromag-viewer-accessibilityLinks","accessibilityButton":"micromag-viewer-accessibilityButton","disabled":"micromag-viewer-disabled","tooltip":"micromag-viewer-tooltip","fadeMenu":"micromag-viewer-fadeMenu","withShadow":"micromag-viewer-withShadow","isOpened":"micromag-viewer-isOpened","menuItem":"micromag-viewer-menuItem","menuButton":"micromag-viewer-menuButton","slidingButton":"micromag-viewer-slidingButton","screensMenuButtonToggled":"micromag-viewer-screensMenuButtonToggled","navButton":"micromag-viewer-navButton","previous":"micromag-viewer-previous","next":"micromag-viewer-next","screen":"micromag-viewer-screen","current":"micromag-viewer-current","playbackControls":"micromag-viewer-playbackControls","arrowHint":"micromag-viewer-arrowHint","webView":"micromag-viewer-webView","shareIncentiveContainer":"micromag-viewer-shareIncentiveContainer","shareIncentive":"micromag-viewer-shareIncentive","shareIncentiveVisible":"micromag-viewer-shareIncentiveVisible"};
1361
1347
 
@@ -1697,9 +1683,9 @@ var ViewerMenu = function ViewerMenu(_ref) {
1697
1683
  ref: navContainerRef
1698
1684
  }, !withoutShareMenu || afterShareMenuButton !== null ? /*#__PURE__*/React.createElement("div", Object.assign({
1699
1685
  className: styles$6.menuItem
1700
- }, bindShareDrag()), !withoutShareMenu ? /*#__PURE__*/React.createElement(ToggleButton$1, {
1686
+ }, bindShareDrag()), !withoutShareMenu ? /*#__PURE__*/React.createElement(ToggleButton, {
1701
1687
  className: styles$6.slidingButton,
1702
- button: /*#__PURE__*/React.createElement(ShareButton$1, {
1688
+ button: /*#__PURE__*/React.createElement(ShareButton, {
1703
1689
  className: styles$6.menuButton,
1704
1690
  onClick: onOpenShare,
1705
1691
  theme: menuTheme,
@@ -1710,7 +1696,7 @@ var ViewerMenu = function ViewerMenu(_ref) {
1710
1696
  group: "share",
1711
1697
  disabled: !shareOpened,
1712
1698
  returnFocus: true
1713
- }, /*#__PURE__*/React.createElement(CloseMenuButton$1, {
1699
+ }, /*#__PURE__*/React.createElement(CloseMenuButton, {
1714
1700
  className: styles$6.menuButton,
1715
1701
  onClick: onCloseShare,
1716
1702
  theme: menuTheme,
@@ -1721,9 +1707,9 @@ var ViewerMenu = function ViewerMenu(_ref) {
1721
1707
  progressSpring: shareOpenedProgress
1722
1708
  }) : null, afterShareMenuButton) : null, !withoutScreensMenu || beforeScreensMenuButton !== null ? /*#__PURE__*/React.createElement("div", Object.assign({
1723
1709
  className: styles$6.menuItem
1724
- }, bindMenuDrag()), beforeScreensMenuButton, !withoutScreensMenu ? /*#__PURE__*/React.createElement(ToggleButton$1, {
1710
+ }, bindMenuDrag()), beforeScreensMenuButton, !withoutScreensMenu ? /*#__PURE__*/React.createElement(ToggleButton, {
1725
1711
  className: styles$6.slidingButton,
1726
- button: /*#__PURE__*/React.createElement(MenuButton$1, {
1712
+ button: /*#__PURE__*/React.createElement(MenuButton, {
1727
1713
  className: styles$6.menuButton,
1728
1714
  iconClassName: styles$6.menuButtonIcon,
1729
1715
  onClick: onOpenMenu,
@@ -1734,7 +1720,7 @@ var ViewerMenu = function ViewerMenu(_ref) {
1734
1720
  group: "screens",
1735
1721
  disabled: !menuOpened,
1736
1722
  returnFocus: true
1737
- }, /*#__PURE__*/React.createElement(CloseMenuButton$1, {
1723
+ }, /*#__PURE__*/React.createElement(CloseMenuButton, {
1738
1724
  className: styles$6.menuButton,
1739
1725
  onClick: onCloseMenu,
1740
1726
  theme: menuTheme,
@@ -1743,7 +1729,7 @@ var ViewerMenu = function ViewerMenu(_ref) {
1743
1729
  })),
1744
1730
  progressSpring: menuOpenedProgress,
1745
1731
  toggledButtonClassName: styles$6.screensMenuButtonToggled
1746
- }) : null) : null), /*#__PURE__*/React.createElement(MenuDots, Object.assign({}, menuTheme, {
1732
+ }) : null) : null), /*#__PURE__*/React.createElement(ViewerMenuDots, Object.assign({}, menuTheme, {
1747
1733
  direction: "horizontal",
1748
1734
  items: items,
1749
1735
  onClickDot: onClickScreen,
@@ -1755,7 +1741,7 @@ var ViewerMenu = function ViewerMenu(_ref) {
1755
1741
  withoutShareMenu: withoutShareMenu,
1756
1742
  onClose: onClickCloseViewer,
1757
1743
  className: styles$6.dots
1758
- }))), /*#__PURE__*/React.createElement(MenuContainer, {
1744
+ }))), /*#__PURE__*/React.createElement(ViewerMenuContainer, {
1759
1745
  className: styles$6.menuContainer,
1760
1746
  progressSpring: shareOpenedProgress,
1761
1747
  theme: viewerTheme
@@ -1763,7 +1749,7 @@ var ViewerMenu = function ViewerMenu(_ref) {
1763
1749
  group: "share",
1764
1750
  disabled: !shareOpened,
1765
1751
  returnFocus: true
1766
- }, /*#__PURE__*/React.createElement(MenuShare, {
1752
+ }, /*#__PURE__*/React.createElement(ViewerMenuShare, {
1767
1753
  viewerTheme: viewerTheme,
1768
1754
  className: styles$6.menuShare,
1769
1755
  title: title,
@@ -1776,7 +1762,7 @@ var ViewerMenu = function ViewerMenu(_ref) {
1776
1762
  shareUrl: shareUrl,
1777
1763
  onShare: onShare,
1778
1764
  onClose: onCloseShare
1779
- })) : null), /*#__PURE__*/React.createElement(MenuContainer, {
1765
+ })) : null), /*#__PURE__*/React.createElement(ViewerMenuContainer, {
1780
1766
  className: styles$6.menuContainer,
1781
1767
  progressSpring: menuOpenedProgress,
1782
1768
  theme: viewerTheme
@@ -1784,7 +1770,7 @@ var ViewerMenu = function ViewerMenu(_ref) {
1784
1770
  group: "screens",
1785
1771
  disabled: !menuOpened,
1786
1772
  returnFocus: true
1787
- }, /*#__PURE__*/React.createElement(MenuPreview, {
1773
+ }, /*#__PURE__*/React.createElement(ViewerMenuPreview, {
1788
1774
  viewerTheme: viewerTheme,
1789
1775
  header: previewHeader,
1790
1776
  footer: previewFooter,
@@ -1910,7 +1896,7 @@ var NavigationButton = function NavigationButton(_ref) {
1910
1896
  _onClick = _ref.onClick,
1911
1897
  className = _ref.className,
1912
1898
  props = _objectWithoutProperties(_ref, _excluded$3);
1913
- return /*#__PURE__*/React.createElement(IconButton$1, Object.assign({
1899
+ return /*#__PURE__*/React.createElement(IconButton, Object.assign({
1914
1900
  className: classNames([styles$4.container, styles$4[direction], _defineProperty({}, className, className !== null)]),
1915
1901
  onClick: function onClick(e) {
1916
1902
  e.stopPropagation();
@@ -1931,7 +1917,6 @@ var NavigationButton = function NavigationButton(_ref) {
1931
1917
  };
1932
1918
  NavigationButton.propTypes = propTypes$7;
1933
1919
  NavigationButton.defaultProps = defaultProps$7;
1934
- var NavigationButton$1 = NavigationButton;
1935
1920
 
1936
1921
  var styles$3 = {"container":"micromag-viewer-partials-arrow-hint-container","inner":"micromag-viewer-partials-arrow-hint-inner","shadowFade":"micromag-viewer-partials-arrow-hint-shadowFade","arrow":"micromag-viewer-partials-arrow-hint-arrow","panX":"micromag-viewer-partials-arrow-hint-panX"};
1937
1922
 
@@ -1953,7 +1938,6 @@ var ArrowHint = function ArrowHint(_ref) {
1953
1938
  };
1954
1939
  ArrowHint.propTypes = propTypes$6;
1955
1940
  ArrowHint.defaultProps = defaultProps$6;
1956
- var ArrowHint$1 = ArrowHint;
1957
1941
 
1958
1942
  var styles$2 = {"track":"micromag-viewer-partials-seek-bar-track","progress":"micromag-viewer-partials-seek-bar-progress","inner":"micromag-viewer-partials-seek-bar-inner","progressBarContainer":"micromag-viewer-partials-seek-bar-progressBarContainer","progressBar":"micromag-viewer-partials-seek-bar-progressBar","playHead":"micromag-viewer-partials-seek-bar-playHead","withSeekHead":"micromag-viewer-partials-seek-bar-withSeekHead","scrubbedTime":"micromag-viewer-partials-seek-bar-scrubbedTime","showTimestamp":"micromag-viewer-partials-seek-bar-showTimestamp"};
1959
1943
 
@@ -2181,7 +2165,6 @@ var SeekBar = function SeekBar(_ref3) {
2181
2165
  };
2182
2166
  SeekBar.propTypes = propTypes$5;
2183
2167
  SeekBar.defaultProps = defaultProps$5;
2184
- var SeekBar$1 = SeekBar;
2185
2168
 
2186
2169
  var styles$1 = {"suggest":"micromag-viewer-partials-playback-controls-suggest","playPauseButton":"micromag-viewer-partials-playback-controls-playPauseButton","muteButton":"micromag-viewer-partials-playback-controls-muteButton","container":"micromag-viewer-partials-playback-controls-container","icon":"micromag-viewer-partials-playback-controls-icon","offset":"micromag-viewer-partials-playback-controls-offset","spinner":"micromag-viewer-partials-playback-controls-spinner","withPlayPause":"micromag-viewer-partials-playback-controls-withPlayPause","withSuggestPlay":"micromag-viewer-partials-playback-controls-withSuggestPlay","isCollapsed":"micromag-viewer-partials-playback-controls-isCollapsed","loading":"micromag-viewer-partials-playback-controls-loading","hidden":"micromag-viewer-partials-playback-controls-hidden","notPlaying":"micromag-viewer-partials-playback-controls-notPlaying","isMuted":"micromag-viewer-partials-playback-controls-isMuted","withMute":"micromag-viewer-partials-playback-controls-withMute","withSeekBar":"micromag-viewer-partials-playback-controls-withSeekBar","seekBar":"micromag-viewer-partials-playback-controls-seekBar","withSeekBarOnly":"micromag-viewer-partials-playback-controls-withSeekBarOnly"};
2187
2170
 
@@ -2354,7 +2337,7 @@ function PlaybackControls(_ref) {
2354
2337
  });
2355
2338
  return /*#__PURE__*/React.createElement("div", {
2356
2339
  className: classNames([styles$1.container, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, className, className !== null), styles$1.withPlayPause, controlsVisible && controls && (!seekBarOnly || !playing)), styles$1.withSuggestPlay, controlsSuggestPlay), styles$1.withMute, hasMedia || controls), styles$1.withSeekBar, controls), styles$1.withSeekBarOnly, seekBarOnly), styles$1.isCollapsed, isCollapsed), styles$1.isMuted, muted), collapsedClassName, collapsedClassName !== null && isCollapsed)])
2357
- }, controlsSuggestPlay && !finalShowLoading ? /*#__PURE__*/React.createElement(Button$2, {
2340
+ }, controlsSuggestPlay && !finalShowLoading ? /*#__PURE__*/React.createElement(Button$1, {
2358
2341
  className: classNames([styles$1.suggest]),
2359
2342
  style: {
2360
2343
  color: color
@@ -2373,7 +2356,7 @@ function PlaybackControls(_ref) {
2373
2356
  }]
2374
2357
  }),
2375
2358
  withoutBootstrapStyles: true
2376
- }) : null, /*#__PURE__*/React.createElement(Button$2, {
2359
+ }) : null, /*#__PURE__*/React.createElement(Button$1, {
2377
2360
  className: classNames([styles$1.playPauseButton, _defineProperty(_defineProperty({}, styles$1.hidden, !controlsVisible || controlsSuggestPlay && !controls), styles$1.loading, finalShowLoading)]),
2378
2361
  style: {
2379
2362
  color: color
@@ -2399,7 +2382,7 @@ function PlaybackControls(_ref) {
2399
2382
  }]
2400
2383
  }),
2401
2384
  withoutBootstrapStyles: true
2402
- }), /*#__PURE__*/React.createElement(SeekBar$1, {
2385
+ }), /*#__PURE__*/React.createElement(SeekBar, {
2403
2386
  className: styles$1.seekBar,
2404
2387
  media: mediaElement,
2405
2388
  playing: playing,
@@ -2412,7 +2395,7 @@ function PlaybackControls(_ref) {
2412
2395
  withSeekHead: !isCollapsed && !seekBarOnly,
2413
2396
  backgroundColor: color,
2414
2397
  progressColor: progressColor
2415
- }), /*#__PURE__*/React.createElement(Button$2, {
2398
+ }), /*#__PURE__*/React.createElement(Button$1, {
2416
2399
  className: styles$1.muteButton,
2417
2400
  style: {
2418
2401
  color: color
@@ -3237,7 +3220,7 @@ var Viewer = function Viewer(_ref) {
3237
3220
  }]
3238
3221
  }),
3239
3222
  className: styles$6.accessibilityLinks
3240
- }, /*#__PURE__*/React.createElement(Button$1, {
3223
+ }, /*#__PURE__*/React.createElement(Button, {
3241
3224
  onClick: onClickSkipToPlaybackControls,
3242
3225
  "aria-disabled": withoutPlaybackControls || !playbackcontrolsVisible,
3243
3226
  "aria-describedby": "disabledReason",
@@ -3287,7 +3270,7 @@ var Viewer = function Viewer(_ref) {
3287
3270
  refDots: menuDotsContainerRef
3288
3271
  }) : null, ready || withoutScreensTransforms ? /*#__PURE__*/React.createElement("div", Object.assign({
3289
3272
  className: styles$6.content
3290
- }, dragContentBind()), !withoutNavigationArrow && !withNeighborScreens && !navigationDisabled && screenIndex > 0 && screens.length > 1 ? /*#__PURE__*/React.createElement(NavigationButton$1, {
3273
+ }, dragContentBind()), !withoutNavigationArrow && !withNeighborScreens && !navigationDisabled && screenIndex > 0 && screens.length > 1 ? /*#__PURE__*/React.createElement(NavigationButton, {
3291
3274
  direction: "previous",
3292
3275
  className: classNames([styles$6.navButton, styles$6.previous]),
3293
3276
  onClick: gotoPreviousScreen,
@@ -3332,7 +3315,7 @@ var Viewer = function Viewer(_ref) {
3332
3315
  height: screenHeight,
3333
3316
  scale: screenScale
3334
3317
  }) : null);
3335
- })), !withoutNavigationArrow && !withNeighborScreens && !navigationDisabled && screenIndex < screens.length - 1 ? /*#__PURE__*/React.createElement(NavigationButton$1, {
3318
+ })), !withoutNavigationArrow && !withNeighborScreens && !navigationDisabled && screenIndex < screens.length - 1 ? /*#__PURE__*/React.createElement(NavigationButton, {
3336
3319
  direction: "next",
3337
3320
  className: classNames([styles$6.navButton, styles$6.next]),
3338
3321
  onClick: gotoNextScreen,
@@ -3349,7 +3332,7 @@ var Viewer = function Viewer(_ref) {
3349
3332
  ref: playbackControlsContainerRef
3350
3333
  }, /*#__PURE__*/React.createElement(PlaybackControls, {
3351
3334
  className: styles$6.controls
3352
- })) : null, withNavigationHint && !withNeighborScreens && !navigationDisabled && screenIndex === 0 && !hasInteracted ? /*#__PURE__*/React.createElement(ArrowHint$1, {
3335
+ })) : null, withNavigationHint && !withNeighborScreens && !navigationDisabled && screenIndex === 0 && !hasInteracted ? /*#__PURE__*/React.createElement(ArrowHint, {
3353
3336
  className: styles$6.arrowHint
3354
3337
  }) : null) : null, /*#__PURE__*/React.createElement("div", {
3355
3338
  className: classNames([styles$6.shareIncentiveContainer, _defineProperty({}, styles$6.shareIncentiveVisible, hasShareIncentive && shareIncentiveVisible)]),
@@ -3428,7 +3411,6 @@ var ViewerRoutes = function ViewerRoutes(_ref) {
3428
3411
  };
3429
3412
  ViewerRoutes.propTypes = propTypes$1;
3430
3413
  ViewerRoutes.defaultProps = defaultProps$1;
3431
- var ViewerRoutes$1 = ViewerRoutes;
3432
3414
 
3433
3415
  var home = "/";
3434
3416
  var screen = "/:screen";
@@ -3534,7 +3516,7 @@ var ViewerContainer = function ViewerContainer(_ref) {
3534
3516
  }, withoutRouter ? /*#__PURE__*/React.createElement(Viewer$1, Object.assign({
3535
3517
  story: story,
3536
3518
  basePath: basePath
3537
- }, otherProps)) : /*#__PURE__*/React.createElement(ViewerRoutes$1, Object.assign({
3519
+ }, otherProps)) : /*#__PURE__*/React.createElement(ViewerRoutes, Object.assign({
3538
3520
  story: story,
3539
3521
  basePath: basePath,
3540
3522
  pathWithIndex: pathWithIndex
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/viewer",
3
- "version": "0.3.540",
3
+ "version": "0.3.547",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [
@@ -30,12 +30,11 @@
30
30
  }
31
31
  ],
32
32
  "license": "ISC",
33
- "main": "lib/index.js",
33
+ "type": "module",
34
34
  "module": "es/index.js",
35
35
  "style": "assets/css/styles.css",
36
36
  "exports": {
37
37
  ".": {
38
- "require": "./lib/index.js",
39
38
  "import": "./es/index.js"
40
39
  },
41
40
  "./scss/styles": "./scss/styles.scss",
@@ -65,14 +64,14 @@
65
64
  "dependencies": {
66
65
  "@babel/runtime": "^7.13.10",
67
66
  "@folklore/routes": "^0.2.27",
68
- "@micromag/core": "^0.3.531",
69
- "@micromag/element-badge": "^0.3.531",
70
- "@micromag/element-scroll": "^0.3.531",
71
- "@micromag/element-share-options": "^0.3.531",
72
- "@micromag/element-webview": "^0.3.531",
73
- "@micromag/elements": "^0.3.531",
74
- "@micromag/intl": "^0.3.540",
75
- "@micromag/screens": "^0.3.531",
67
+ "@micromag/core": "^0.3.547",
68
+ "@micromag/element-badge": "^0.3.547",
69
+ "@micromag/element-scroll": "^0.3.547",
70
+ "@micromag/element-share-options": "^0.3.547",
71
+ "@micromag/element-webview": "^0.3.547",
72
+ "@micromag/elements": "^0.3.547",
73
+ "@micromag/intl": "^0.3.547",
74
+ "@micromag/screens": "^0.3.547",
76
75
  "@react-spring/core": "^9.6.1",
77
76
  "@react-spring/web": "^9.6.1",
78
77
  "@use-gesture/react": "^10.3.0",
@@ -92,5 +91,5 @@
92
91
  "access": "public",
93
92
  "registry": "https://registry.npmjs.org/"
94
93
  },
95
- "gitHead": "e29e691314fedb1f950c6d82f407954e225d813b"
94
+ "gitHead": "3c2f5904ce61fcfa61f673c38c2a5ec56e9e2b07"
96
95
  }