@atlaskit/media-ui 28.2.1 → 28.2.3

package/dist/esm/customMediaPlayer/mediaPlayer/mediaPlayerBase.js

@@ -151,13 +151,22 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
       }
     });
     _defineProperty(_this, "onTimeChanged", function () {
+      var _this$props$onTimeCha, _this$props3;
       _this.createAndFireUIEvent('timeRangeNavigate', 'time');
+      (_this$props$onTimeCha = (_this$props3 = _this.props).onTimeChanged) === null || _this$props$onTimeCha === void 0 || _this$props$onTimeCha.call(_this$props3);
     });
     _defineProperty(_this, "onVolumeChanged", function () {
       _this.createAndFireUIEvent('volumeRangeNavigate', 'volume');
     });
+    _defineProperty(_this, "getDefaultTime", function () {
+      return _this.timeSaver.defaultTime;
+    });
     _defineProperty(_this, "onCurrentTimeChange", function (currentTime, duration) {
-      if (duration - currentTime > MINIMUM_DURATION_BEFORE_SAVING_TIME) {
+      // We rely on the saved time when switching to the new source URL
+      // so we need to save it irrespective of elapsed time or video length
+      if (fg('platform_media_resume_video_on_token_expiry')) {
+        _this.timeSaver.defaultTime = currentTime;
+      } else if (duration - currentTime > MINIMUM_DURATION_BEFORE_SAVING_TIME) {
         _this.timeSaver.defaultTime = currentTime;
       } else {
         _this.timeSaver.defaultTime = 0;
@@ -171,11 +180,11 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
       }, formatDuration(currentTime), " / ", formatDuration(duration));
     });
     _defineProperty(_this, "renderHDButton", function () {
-      var _this$props3 = _this.props,
-        type = _this$props3.type,
-        isHDAvailable = _this$props3.isHDAvailable,
-        isHDActive = _this$props3.isHDActive,
-        onHDToggleClick = _this$props3.onHDToggleClick;
+      var _this$props4 = _this.props,
+        type = _this$props4.type,
+        isHDAvailable = _this$props4.isHDAvailable,
+        isHDActive = _this$props4.isHDActive,
+        onHDToggleClick = _this$props4.onHDToggleClick;
       if (type === 'audio' || !isHDAvailable) {
         return;
       }
@@ -257,9 +266,9 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
       }
     });
     _defineProperty(_this, "renderFullScreenButton", function () {
-      var _this$props4 = _this.props,
-        formatMessage = _this$props4.intl.formatMessage,
-        type = _this$props4.type;
+      var _this$props5 = _this.props,
+        formatMessage = _this$props5.intl.formatMessage,
+        type = _this$props5.type;
       if (type === 'audio') {
         return;
       }
@@ -385,9 +394,11 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
       }));
     });
     _defineProperty(_this, "pause", function () {
+      var _this$props$onPause, _this$props6;
       if (_this.actions) {
         _this.actions.pause();
       }
+      (_this$props$onPause = (_this$props6 = _this.props).onPause) === null || _this$props$onPause === void 0 || _this$props$onPause.call(_this$props6);
     });
     _defineProperty(_this, "play", function () {
       var onFirstPlay = _this.props.onFirstPlay;
@@ -424,13 +435,13 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
       };
     });
     _defineProperty(_this, "onViewed", function (videoState) {
-      var _this$props5 = _this.props,
-        createAnalyticsEvent = _this$props5.createAnalyticsEvent,
-        identifier = _this$props5.identifier,
-        isAutoPlay = _this$props5.isAutoPlay,
-        isHDAvailable = _this$props5.isHDAvailable,
-        isHDActive = _this$props5.isHDActive,
-        type = _this$props5.type;
+      var _this$props7 = _this.props,
+        createAnalyticsEvent = _this$props7.createAnalyticsEvent,
+        identifier = _this$props7.identifier,
+        isAutoPlay = _this$props7.isAutoPlay,
+        isHDAvailable = _this$props7.isHDAvailable,
+        isHDActive = _this$props7.isHDActive,
+        type = _this$props7.type;
       var _this$state2 = _this.state,
         isFullScreenEnabled = _this$state2.isFullScreenEnabled,
         playerSize = _this$state2.playerSize,
@@ -516,9 +527,9 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps, prevState) {
       var _prevTextTracks$capti, _textTracks$captions2;
-      var _this$props6 = this.props,
-        intl = _this$props6.intl,
-        textTracks = _this$props6.textTracks;
+      var _this$props8 = this.props,
+        intl = _this$props8.intl,
+        textTracks = _this$props8.textTracks;
       var prevIntl = prevProps.intl,
         prevTextTracks = prevProps.textTracks;
       var didLocaleChange = prevIntl.locale !== intl.locale;
@@ -544,14 +555,14 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
   }, {
     key: "componentDidMount",
     value: function componentDidMount() {
-      var _this$props7 = this.props,
-        type = _this$props7.type,
-        identifier = _this$props7.identifier,
-        isAutoPlay = _this$props7.isAutoPlay,
-        isHDAvailable = _this$props7.isHDAvailable,
-        isHDActive = _this$props7.isHDActive,
-        onFirstPlay = _this$props7.onFirstPlay,
-        createAnalyticsEvent = _this$props7.createAnalyticsEvent;
+      var _this$props9 = this.props,
+        type = _this$props9.type,
+        identifier = _this$props9.identifier,
+        isAutoPlay = _this$props9.isAutoPlay,
+        isHDAvailable = _this$props9.isHDAvailable,
+        isHDActive = _this$props9.isHDActive,
+        onFirstPlay = _this$props9.onFirstPlay,
+        createAnalyticsEvent = _this$props9.createAnalyticsEvent;
       var _this$state4 = this.state,
         isFullScreenEnabled = _this$state4.isFullScreenEnabled,
         playerSize = _this$state4.playerSize,
@@ -569,12 +580,14 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
       }
       simultaneousPlayManager.subscribe(this);
       if (isAutoPlay) {
+        var _this$props$onPlay, _this$props0;
         simultaneousPlayManager.pauseOthers(this);
         if (onFirstPlay) {
           this.fireFirstPlayedTrackEvent();
           this.wasPlayedOnce = true;
           onFirstPlay();
         }
+        (_this$props$onPlay = (_this$props0 = this.props).onPlay) === null || _this$props$onPlay === void 0 || _this$props$onPlay.call(_this$props0);
       }
     }
   }, {
@@ -584,8 +597,8 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
         this.videoWrapperRef.current.removeEventListener('fullscreenchange', this.onFullScreenChange);
       }
       if (this.state.isFullScreenEnabled) {
-        var _this$props$onFullscr2, _this$props8;
-        (_this$props$onFullscr2 = (_this$props8 = this.props).onFullscreenChange) === null || _this$props$onFullscr2 === void 0 || _this$props$onFullscr2.call(_this$props8, false);
+        var _this$props$onFullscr2, _this$props1;
+        (_this$props$onFullscr2 = (_this$props1 = this.props).onFullscreenChange) === null || _this$props$onFullscr2 === void 0 || _this$props$onFullscr2.call(_this$props1, false);
       }
       simultaneousPlayManager.unsubscribe(this);
     }
@@ -601,13 +614,13 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
   }, {
     key: "createAndFireUIEvent",
     value: function createAndFireUIEvent(eventType, actionSubjectId) {
-      var _this$props9 = this.props,
-        type = _this$props9.type,
-        identifier = _this$props9.identifier,
-        isHDActive = _this$props9.isHDActive,
-        isHDAvailable = _this$props9.isHDAvailable,
-        isAutoPlay = _this$props9.isAutoPlay,
-        createAnalyticsEvent = _this$props9.createAnalyticsEvent;
+      var _this$props10 = this.props,
+        type = _this$props10.type,
+        identifier = _this$props10.identifier,
+        isHDActive = _this$props10.isHDActive,
+        isHDAvailable = _this$props10.isHDAvailable,
+        isAutoPlay = _this$props10.isAutoPlay,
+        createAnalyticsEvent = _this$props10.createAnalyticsEvent;
       var _this$state5 = this.state,
         isFullScreenEnabled = _this$state5.isFullScreenEnabled,
         playerSize = _this$state5.playerSize,
@@ -654,21 +667,21 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
     key: "render",
     value: function render() {
       var _this2 = this;
-      var _this$props10 = this.props,
-        type = _this$props10.type,
-        src = _this$props10.src,
-        isAutoPlay = _this$props10.isAutoPlay,
-        onCanPlay = _this$props10.onCanPlay,
-        onError = _this$props10.onError,
-        poster = _this$props10.poster,
-        videoControlsWrapperRef = _this$props10.videoControlsWrapperRef,
-        textTracks = _this$props10.textTracks,
-        areControlsVisible = _this$props10.areControlsVisible,
-        identifier = _this$props10.identifier,
-        _this$props10$mediaSe = _this$props10.mediaSettings,
-        _this$props10$mediaSe2 = _this$props10$mediaSe === void 0 ? {} : _this$props10$mediaSe,
-        _this$props10$mediaSe3 = _this$props10$mediaSe2.canUpdateVideoCaptions,
-        canUpdateVideoCaptions = _this$props10$mediaSe3 === void 0 ? false : _this$props10$mediaSe3;
+      var _this$props11 = this.props,
+        type = _this$props11.type,
+        src = _this$props11.src,
+        isAutoPlay = _this$props11.isAutoPlay,
+        onCanPlay = _this$props11.onCanPlay,
+        onError = _this$props11.onError,
+        poster = _this$props11.poster,
+        videoControlsWrapperRef = _this$props11.videoControlsWrapperRef,
+        textTracks = _this$props11.textTracks,
+        areControlsVisible = _this$props11.areControlsVisible,
+        identifier = _this$props11.identifier,
+        _this$props11$mediaSe = _this$props11.mediaSettings,
+        _this$props11$mediaSe2 = _this$props11$mediaSe === void 0 ? {} : _this$props11$mediaSe,
+        _this$props11$mediaSe3 = _this$props11$mediaSe2.canUpdateVideoCaptions,
+        canUpdateVideoCaptions = _this$props11$mediaSe3 === void 0 ? false : _this$props11$mediaSe3;
       var _this$state6 = this.state,
         areCaptionsEnabled = _this$state6.areCaptionsEnabled,
         isArtifactUploaderOpen = _this$state6.isArtifactUploaderOpen;
@@ -681,7 +694,7 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
         src: src,
         autoPlay: isAutoPlay,
         onCanPlay: onCanPlay,
-        defaultTime: this.timeSaver.defaultTime,
+        defaultTime: this.getDefaultTime,
         onTimeChange: this.onCurrentTimeChange,
         onError: onError,
         poster: poster,
@@ -703,14 +716,18 @@ var _MediaPlayerBase = /*#__PURE__*/function (_Component) {
         var isMediumPlayer = playerSize === 'medium';
         var defaultSkipAmount = 10;
         var skipBackward = function skipBackward() {
+          var _this2$props$onTimeCh, _this2$props;
           var skipAmount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultSkipAmount;
           var newTime = videoState.currentTime - skipAmount;
           actions.navigate(Math.max(newTime, 0));
+          (_this2$props$onTimeCh = (_this2$props = _this2.props).onTimeChanged) === null || _this2$props$onTimeCh === void 0 || _this2$props$onTimeCh.call(_this2$props);
         };
         var skipForward = function skipForward() {
+          var _this2$props$onTimeCh2, _this2$props2;
           var skipAmount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultSkipAmount;
           var newTime = videoState.currentTime + skipAmount;
           actions.navigate(Math.min(newTime, videoState.duration));
+          (_this2$props$onTimeCh2 = (_this2$props2 = _this2.props).onTimeChanged) === null || _this2$props$onTimeCh2 === void 0 || _this2$props$onTimeCh2.call(_this2$props2);
         };
         var shortcuts = _this2.renderShortcuts({
           togglePlayPauseAction: isPlaying ? _this2.pause : _this2.play,

package/dist/esm/customMediaPlayer/react-video-renderer/video.js

@@ -48,7 +48,7 @@ export var Video = /*#__PURE__*/function (_Component) {
     _defineProperty(_this, "onLoadedData", function () {
       var defaultTime = _this.props.defaultTime;
       if (_this.currentElement) {
-        _this.currentElement.currentTime = defaultTime;
+        _this.currentElement.currentTime = defaultTime();
       }
     });
     _defineProperty(_this, "onVolumeChange", function (event) {
@@ -310,7 +310,9 @@ export var Video = /*#__PURE__*/function (_Component) {
   }]);
 }(Component);
 _defineProperty(Video, "defaultProps", {
-  defaultTime: 0,
+  defaultTime: function defaultTime() {
+    return 0;
+  },
   sourceType: 'video',
   autoPlay: false,
   controls: false,

package/dist/esm/customMediaPlayer/styled-compiled.js

@@ -10,12 +10,12 @@ var _excluded = ["showSlider", "children"],
   _excluded7 = ["children"],
   _excluded8 = ["children"],
   _excluded9 = ["children"],
-  _excluded10 = ["children", "controlsHidden"],
+  _excluded0 = ["children", "controlsHidden"],
+  _excluded1 = ["isMuted", "children"],
+  _excluded10 = ["children"],
   _excluded11 = ["isMuted", "children"],
-  _excluded12 = ["children"],
-  _excluded13 = ["isMuted", "children"],
-  _excluded14 = ["isDragging", "timeLineThumbIsHover", "timeLineThumbIsFocus", "children"],
-  _excluded15 = ["children"];
+  _excluded12 = ["isDragging", "timeLineThumbIsHover", "timeLineThumbIsFocus", "children"],
+  _excluded13 = ["children"];
 import "./styled-compiled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
@@ -106,10 +106,10 @@ export var RightControls = function RightControls(_ref9) {
 };
 var controlsWrapperStyles = null;
 var hiddenControlsWrapperStyles = null;
-export var ControlsWrapper = /*#__PURE__*/forwardRef(function (_ref10, ref) {
-  var children = _ref10.children,
-    controlsHidden = _ref10.controlsHidden,
-    props = _objectWithoutProperties(_ref10, _excluded10);
+export var ControlsWrapper = /*#__PURE__*/forwardRef(function (_ref0, ref) {
+  var children = _ref0.children,
+    controlsHidden = _ref0.controlsHidden,
+    props = _objectWithoutProperties(_ref0, _excluded0);
   return /*#__PURE__*/React.createElement("div", _extends({
     ref: ref
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
@@ -119,28 +119,28 @@ export var ControlsWrapper = /*#__PURE__*/forwardRef(function (_ref10, ref) {
 });
 var volumeToggleWrapperStyles = null;
 var mutedVolumeToggleWrapperStyles = null;
-export var VolumeToggleWrapper = function VolumeToggleWrapper(_ref11) {
-  var isMuted = _ref11.isMuted,
-    children = _ref11.children,
-    props = _objectWithoutProperties(_ref11, _excluded11);
+export var VolumeToggleWrapper = function VolumeToggleWrapper(_ref1) {
+  var isMuted = _ref1.isMuted,
+    children = _ref1.children,
+    props = _objectWithoutProperties(_ref1, _excluded1);
   return /*#__PURE__*/React.createElement("div", _extends({}, props, {
     className: ax(["_kqswh2mm _2hwxw1gv _14hp1j2z", isMuted && "_d32vqb75"])
   }), children);
 };
 var volumeTimeRangeWrapperStyles = null;
-export var VolumeTimeRangeWrapper = function VolumeTimeRangeWrapper(_ref12) {
-  var children = _ref12.children,
-    props = _objectWithoutProperties(_ref12, _excluded12);
+export var VolumeTimeRangeWrapper = function VolumeTimeRangeWrapper(_ref10) {
+  var children = _ref10.children,
+    props = _objectWithoutProperties(_ref10, _excluded10);
   return /*#__PURE__*/React.createElement("div", _extends({}, props, {
     className: ax(["_1bsb1osq _2hwxv47k"])
   }), children);
 };
 var mutedIndicatorStyles = null;
 var isMutedStyles = null;
-export var MutedIndicator = function MutedIndicator(_ref13) {
-  var isMuted = _ref13.isMuted,
-    children = _ref13.children,
-    props = _objectWithoutProperties(_ref13, _excluded13);
+export var MutedIndicator = function MutedIndicator(_ref11) {
+  var isMuted = _ref11.isMuted,
+    children = _ref11.children,
+    props = _objectWithoutProperties(_ref11, _excluded11);
   return /*#__PURE__*/React.createElement("div", _extends({}, props, {
     className: ax(["_bfhk18rw _1bsb1pa9 _4t3iyh40 _kqswstnw _154iu2gc _1ltvu2gc _1pbycs5v _t9ec17wz _tzy4idpf _lcxvglyw", isMuted && "_tzy4kb7n"])
   }), children);
@@ -150,21 +150,21 @@ var currentTimeToolTipDraggingStyles = null;
 var currentTimeToolTipNotDraggingStyles = null;
 var currentTimeTooltipThumbHoveredStyles = null;
 var currentTimeTooltipThumbFocusedStyles = null;
-export var CurrentTimeTooltip = function CurrentTimeTooltip(_ref14) {
-  var isDragging = _ref14.isDragging,
-    timeLineThumbIsHover = _ref14.timeLineThumbIsHover,
-    timeLineThumbIsFocus = _ref14.timeLineThumbIsFocus,
-    children = _ref14.children,
-    props = _objectWithoutProperties(_ref14, _excluded14);
+export var CurrentTimeTooltip = function CurrentTimeTooltip(_ref12) {
+  var isDragging = _ref12.isDragging,
+    timeLineThumbIsHover = _ref12.timeLineThumbIsHover,
+    timeLineThumbIsFocus = _ref12.timeLineThumbIsFocus,
+    children = _ref12.children,
+    props = _objectWithoutProperties(_ref12, _excluded12);
   return /*#__PURE__*/React.createElement("div", _extends({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: ax(["_11c8dcr7 _2rko1b66 _v564g17y _kqswstnw _uiztglyw _154iukr8 _bfhk39qu _syaz1pcz _ca0q1b66 _u5f3u2gc _n3td1b66 _19bvu2gc _1ltv1ssb _t9eczr6s _1nmz16rz", isDragging && "_tzy4kb7n", !isDragging && "_tzy4idpf", timeLineThumbIsHover && "_tzy4kb7n", timeLineThumbIsFocus && "_tzy4kb7n", "current-time-tooltip"])
   }, props), children);
 };
 var timeRangeWrapperStyles = null;
-export var TimeRangeWrapper = /*#__PURE__*/forwardRef(function (_ref15, ref) {
-  var children = _ref15.children,
-    props = _objectWithoutProperties(_ref15, _excluded15);
+export var TimeRangeWrapper = /*#__PURE__*/forwardRef(function (_ref13, ref) {
+  var children = _ref13.children,
+    props = _objectWithoutProperties(_ref13, _excluded13);
   return /*#__PURE__*/React.createElement("div", _extends({
     ref: ref
   }, props, {

package/dist/esm/customMediaPlayer/volumeRange.js

@@ -128,7 +128,8 @@ var VolumeRange = function VolumeRange(props) {
   return fg('platform_media_compiled') ? /*#__PURE__*/React.createElement(CompiledTimeRangeWrapper, {
     onMouseDown: onThumbMouseDown,
     onKeyDown: onThumbKeyDown,
-    ref: wrapperElement
+    ref: wrapperElement,
+    "data-testid": "volume-range"
   }, /*#__PURE__*/React.createElement(Range, {
     tabIndex: 0,
     step: 1,
@@ -148,7 +149,8 @@ var VolumeRange = function VolumeRange(props) {
     showAsActive: isAlwaysActive,
     onMouseDown: onThumbMouseDown,
     onKeyDown: onThumbKeyDown,
-    ref: wrapperElement
+    ref: wrapperElement,
+    "data-testid": "volume-range"
   }, /*#__PURE__*/React.createElement(Range, {
     tabIndex: 0,
     step: 1,

package/dist/esm/mediaImage/index.js

@@ -3,6 +3,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { forwardRef, useCallback, useRef, useState } from 'react';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { VcMediaWrapperProps } from '@atlaskit/react-ufo/vc-media';
+import UFOCustomData from '@atlaskit/react-ufo/custom-data';
 import { ImageComponent } from './styled';
 import { getCssFromImageOrientation, isRotated } from '../imageMetaData';
 import { useMergeRefs } from 'use-callback-ref';
@@ -355,7 +356,11 @@ export var MediaImage = /*#__PURE__*/forwardRef(function (_ref, ref) {
     var transform = getCssFromImageOrientation(previewOrientation);
     style.transform += " ".concat(transform);
   }
-  return /*#__PURE__*/React.createElement(ImageComponent, _extends({
+  return /*#__PURE__*/React.createElement(React.Fragment, null, fg('platform_media_add_ufo_custom_data') ? /*#__PURE__*/React.createElement(UFOCustomData, {
+    data: {
+      hasMediaComponent: true
+    }
+  }) : null, /*#__PURE__*/React.createElement(ImageComponent, _extends({
     loading: loading,
     "data-testid": "media-image",
     "data-vc": "media-image",
@@ -369,5 +374,5 @@ export var MediaImage = /*#__PURE__*/forwardRef(function (_ref, ref) {
     imageRef: mergedRef,
     src: dataURI,
     crossOrigin: crossOrigin
-  }, fg('platform_exclude_media_offender_from_vc') && VcMediaWrapperProps));
+  }, fg('platform_exclude_media_offender_from_vc') && VcMediaWrapperProps)));
 });

package/dist/types/customMediaPlayer/index-compiled.d.ts

@@ -16,6 +16,9 @@ export interface CustomMediaPlayerProps extends WithPlaybackProps, WithShowContr
     readonly lastWatchTimeConfig?: TimeSaverConfig;
     readonly onCanPlay?: () => void;
     readonly onError?: () => void;
+    readonly onPlay?: () => void;
+    readonly onPause?: () => void;
+    readonly onTimeChanged?: () => void;
     readonly onDownloadClick?: () => void;
     readonly onFirstPlay?: () => void;
     readonly onFullscreenChange?: (fullscreen: boolean) => void;
@@ -42,6 +45,7 @@ export declare class CustomMediaPlayerBase extends Component<CustomMediaPlayerPr
     private onFullScreenChange;
     private onTimeChanged;
     private onVolumeChanged;
+    private getDefaultTime;
     private onCurrentTimeChange;
     private renderCurrentTime;
     private renderHDButton;

package/dist/types/customMediaPlayer/index-emotion.d.ts

@@ -19,6 +19,7 @@ export declare class CustomMediaPlayerBase extends Component<CustomMediaPlayerPr
     private onTimeChanged;
     private onVolumeChanged;
     private onCurrentTimeChange;
+    private getDefaultTime;
     private renderCurrentTime;
     private renderHDButton;
     private onPlaybackSpeedChange;

package/dist/types/customMediaPlayer/mediaPlayer/mediaPlayerBase.d.ts

@@ -17,6 +17,9 @@ export interface MediaPlayerBaseProps extends WithPlaybackProps, WithShowControl
     readonly isShortcutEnabled?: boolean;
     readonly lastWatchTimeConfig?: TimeSaverConfig;
     readonly onCanPlay?: () => void;
+    readonly onPlay?: () => void;
+    readonly onPause?: () => void;
+    readonly onTimeChanged?: () => void;
     readonly onError?: () => void;
     readonly onDownloadClick?: () => void;
     readonly onFirstPlay?: () => void;

package/dist/types/customMediaPlayer/react-video-renderer/video.d.ts

@@ -36,7 +36,12 @@ export type RenderCallback = (reactElement: ReactElement<SourceElement>, state:
 export interface VideoProps {
     src: string;
     children: RenderCallback;
-    defaultTime: number;
+    /**
+     * `defaultTime` is a getter function to ensure we're always
+     * getting the latest value from TimeSaver even if a render hasn't
+     * occurred to provide the latest value from the parent component.
+     */
+    defaultTime: () => number;
     sourceType: 'video' | 'audio';
     controls: boolean;
     autoPlay: boolean;
@@ -68,7 +73,7 @@ export declare class Video extends Component<VideoProps, VideoComponentState> {
     hasCanPlayTriggered: boolean;
     state: VideoComponentState;
     static defaultProps: {
-        defaultTime: number;
+        defaultTime: () => number;
         sourceType: string;
         autoPlay: boolean;
         controls: boolean;

package/dist/types-ts4.5/customMediaPlayer/index-compiled.d.ts

@@ -16,6 +16,9 @@ export interface CustomMediaPlayerProps extends WithPlaybackProps, WithShowContr
     readonly lastWatchTimeConfig?: TimeSaverConfig;
     readonly onCanPlay?: () => void;
     readonly onError?: () => void;
+    readonly onPlay?: () => void;
+    readonly onPause?: () => void;
+    readonly onTimeChanged?: () => void;
     readonly onDownloadClick?: () => void;
     readonly onFirstPlay?: () => void;
     readonly onFullscreenChange?: (fullscreen: boolean) => void;
@@ -42,6 +45,7 @@ export declare class CustomMediaPlayerBase extends Component<CustomMediaPlayerPr
     private onFullScreenChange;
     private onTimeChanged;
     private onVolumeChanged;
+    private getDefaultTime;
     private onCurrentTimeChange;
     private renderCurrentTime;
     private renderHDButton;

package/dist/types-ts4.5/customMediaPlayer/index-emotion.d.ts

@@ -19,6 +19,7 @@ export declare class CustomMediaPlayerBase extends Component<CustomMediaPlayerPr
     private onTimeChanged;
     private onVolumeChanged;
     private onCurrentTimeChange;
+    private getDefaultTime;
     private renderCurrentTime;
     private renderHDButton;
     private onPlaybackSpeedChange;

package/dist/types-ts4.5/customMediaPlayer/mediaPlayer/mediaPlayerBase.d.ts

@@ -17,6 +17,9 @@ export interface MediaPlayerBaseProps extends WithPlaybackProps, WithShowControl
     readonly isShortcutEnabled?: boolean;
     readonly lastWatchTimeConfig?: TimeSaverConfig;
     readonly onCanPlay?: () => void;
+    readonly onPlay?: () => void;
+    readonly onPause?: () => void;
+    readonly onTimeChanged?: () => void;
     readonly onError?: () => void;
     readonly onDownloadClick?: () => void;
     readonly onFirstPlay?: () => void;

package/dist/types-ts4.5/customMediaPlayer/react-video-renderer/video.d.ts

@@ -36,7 +36,12 @@ export type RenderCallback = (reactElement: ReactElement<SourceElement>, state:
 export interface VideoProps {
     src: string;
     children: RenderCallback;
-    defaultTime: number;
+    /**
+     * `defaultTime` is a getter function to ensure we're always
+     * getting the latest value from TimeSaver even if a render hasn't
+     * occurred to provide the latest value from the parent component.
+     */
+    defaultTime: () => number;
     sourceType: 'video' | 'audio';
     controls: boolean;
     autoPlay: boolean;
@@ -68,7 +73,7 @@ export declare class Video extends Component<VideoProps, VideoComponentState> {
     hasCanPlayTriggered: boolean;
     state: VideoComponentState;
     static defaultProps: {
-        defaultTime: number;
+        defaultTime: () => number;
         sourceType: string;
         autoPlay: boolean;
         controls: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/media-ui",
-	"version": "28.2.1",
+	"version": "28.2.3",
 	"description": "Includes common components and utilities used by other media packages",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -30,9 +30,9 @@
 		"@atlaskit/css": "^0.10.0",
 		"@atlaskit/dropdown-menu": "^16.0.0",
 		"@atlaskit/form": "^12.0.0",
-		"@atlaskit/icon": "^26.1.0",
+		"@atlaskit/icon": "^26.4.0",
 		"@atlaskit/icon-file-type": "^7.0.0",
-		"@atlaskit/icon-lab": "^4.13.0",
+		"@atlaskit/icon-lab": "^4.17.0",
 		"@atlaskit/legacy-custom-icons": "^0.22.0",
 		"@atlaskit/locale": "^3.0.0",
 		"@atlaskit/media-client": "^33.3.0",
@@ -48,7 +48,7 @@
 		"@atlaskit/spinner": "^18.0.0",
 		"@atlaskit/theme": "^18.0.0",
 		"@atlaskit/tokens": "^4.9.0",
-		"@atlaskit/tooltip": "^20.0.0",
+		"@atlaskit/tooltip": "^20.2.0",
 		"@atlaskit/width-detector": "^5.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.3",
@@ -95,8 +95,14 @@
 		"platform_media_compiled": {
 			"type": "boolean"
 		},
+		"platform_media_add_ufo_custom_data": {
+			"type": "boolean"
+		},
 		"platform_exclude_media_offender_from_vc": {
 			"type": "boolean"
+		},
+		"platform_media_resume_video_on_token_expiry": {
+			"type": "boolean"
 		}
 	},
 	"techstack": {