@atlaskit/media-ui 25.0.1 → 25.0.2

package/dist/cjs/MediaInlineCard/ErroredView/index.js

@@ -21,7 +21,7 @@ var _Icon = require("../Icon");
 var _styled = require("../styled");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-var MediaInlineCardErroredView = /*#__PURE__*/function (_React$Component) {
+var MediaInlineCardErroredView = exports.MediaInlineCardErroredView = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(MediaInlineCardErroredView, _React$Component);
   var _super = _createSuper(MediaInlineCardErroredView);
   function MediaInlineCardErroredView() {
@@ -62,5 +62,4 @@ var MediaInlineCardErroredView = /*#__PURE__*/function (_React$Component) {
     }
   }]);
   return MediaInlineCardErroredView;
-}(_react.default.Component);
-exports.MediaInlineCardErroredView = MediaInlineCardErroredView;
+}(_react.default.Component);

package/dist/cjs/MediaInlineCard/Frame/index.js

@@ -16,7 +16,7 @@ var _react = _interopRequireDefault(require("react"));
 var _styled = require("./styled");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-var Frame = /*#__PURE__*/function (_React$Component) {
+var Frame = exports.Frame = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(Frame, _React$Component);
   var _super = _createSuper(Frame);
   function Frame() {
@@ -72,5 +72,4 @@ var Frame = /*#__PURE__*/function (_React$Component) {
     }
   }]);
   return Frame;
-}(_react.default.Component);
-exports.Frame = Frame;
+}(_react.default.Component);

package/dist/cjs/MediaInlineCard/Frame/styled.js

@@ -33,7 +33,7 @@ var isSelected = function isSelected(_ref) {
 // NB: `padding` consistent with @mentions.
 // NB: `display: inline` required for `box-decoration-break` to work.
 // NB: `box-decoration-break` required for retaining properties (border-radius) on wrap.
-var Wrapper = _styled.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  line-height: 16px;\n  padding: ", " ", "\n    ", " ", ";\n  box-decoration-break: clone;\n  display: inline;\n  border-radius: ", "px;\n  color: ", ";\n  background-color: ", ";\n  ", ";\n  transition: 0.1s all ease-in-out;\n  -moz-user-select: none;\n  cursor: pointer;\n\n  &:hover {\n    background-color: ", ";\n  }\n"])), "var(--ds-space-025, 2px)", "var(--ds-space-050, 4px)", "var(--ds-space-025, 2px)", "var(--ds-space-050, 4px)", (0, _constants.borderRadius)(), (0, _components.themed)({
+var Wrapper = exports.Wrapper = _styled.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  line-height: 16px;\n  padding: ", " ", "\n    ", " ", ";\n  box-decoration-break: clone;\n  display: inline;\n  border-radius: ", "px;\n  color: ", ";\n  background-color: ", ";\n  ", ";\n  transition: 0.1s all ease-in-out;\n  -moz-user-select: none;\n  cursor: pointer;\n\n  &:hover {\n    background-color: ", ";\n  }\n"])), "var(--ds-space-025, 2px)", "var(--ds-space-050, 4px)", "var(--ds-space-025, 2px)", "var(--ds-space-050, 4px)", (0, _constants.borderRadius)(), (0, _components.themed)({
   light: "var(--ds-text, ".concat(_colors.N900, ")"),
   dark: "var(--ds-text, ".concat(_colors.DN600, ")")
 }), (0, _components.themed)({
@@ -44,5 +44,4 @@ var Wrapper = _styled.default.span(_templateObject || (_templateObject = (0, _ta
 }, (0, _components.themed)({
   light: "var(--ds-background-neutral-hovered, ".concat(_colors.N40A, ")"),
   dark: "var(--ds-background-neutral-hovered, ".concat(_colors.DN60, ")")
-}));
-exports.Wrapper = Wrapper;
+}));

package/dist/cjs/MediaInlineCard/Icon.js

@@ -13,11 +13,9 @@ var _templateObject, _templateObject2;
 // Current rationale: vertically positioned at the top of
 // the smart card container (when set to 0). Offset this
 // to position it with appropriate whitespace from the top.
-var Icon = _styled.default.img(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 14px;\n  width: 14px;\n  margin-right: ", ";\n  border-radius: 2px;\n  user-select: none;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n"])), "var(--ds-space-050, 4px)");
+var Icon = exports.Icon = _styled.default.img(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 14px;\n  width: 14px;\n  margin-right: ", ";\n  border-radius: 2px;\n  user-select: none;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n"])), "var(--ds-space-050, 4px)");
 
 // Used for 'untrue' icons which claim to be 16x16 but
 // are less than that in height/width.
 // TODO: Replace this override with proper AtlasKit solution.
-exports.Icon = Icon;
-var AKIconWrapper = _styled.default.span(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  margin-right: ", ";\n"])), "var(--ds-space-negative-025, -2px)");
-exports.AKIconWrapper = AKIconWrapper;
+var AKIconWrapper = exports.AKIconWrapper = _styled.default.span(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  margin-right: ", ";\n"])), "var(--ds-space-negative-025, -2px)");

package/dist/cjs/MediaInlineCard/IconAndTitleLayout/index.js

@@ -17,7 +17,7 @@ var _styled = require("./styled");
 var _link = _interopRequireDefault(require("@atlaskit/icon/glyph/link"));
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
+var IconAndTitleLayout = exports.IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(IconAndTitleLayout, _React$Component);
   var _super = _createSuper(IconAndTitleLayout);
   function IconAndTitleLayout() {
@@ -102,5 +102,4 @@ var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
     }
   }]);
   return IconAndTitleLayout;
-}(_react.default.Component);
-exports.IconAndTitleLayout = IconAndTitleLayout;
+}(_react.default.Component);

package/dist/cjs/MediaInlineCard/IconAndTitleLayout/styled.js

@@ -9,10 +9,9 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
 // TODO: remove this override behaviour for @atlaskit/icon-object
-var IconObjectOverrides = "\n  & > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    line-height: 14px;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+var IconObjectOverrides = exports.IconObjectOverrides = "\n  & > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    line-height: 14px;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
 // TODO: remove this override behaviour for @atlaskit/icon
-exports.IconObjectOverrides = IconObjectOverrides;
-var IconOverrides = "\n  & > * > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+var IconOverrides = exports.IconOverrides = "\n  & > * > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
 
 // Wraps all icons represented in Inline Links. Icons have three sources/types:
 // - JSON-LD: from the generator.icon property coming back from ORS.
@@ -20,33 +19,24 @@ var IconOverrides = "\n  & > * > span {\n    height: 16px;\n    width: 14px;\n
 // - @atlaskit/icon-object: for object icons, e.g. repository, branch, etc.
 // NB: the first set of overrides style icons imported from @atlaskit/icon-object correctly.
 // NB: the second set of overrides style icons imported from @atlaskit/icon correctly.
-exports.IconOverrides = IconOverrides;
-var IconWrapper = _styled.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  user-select: none;\n  ", "\n  ", "\n"])), IconOverrides, IconObjectOverrides);
+var IconWrapper = exports.IconWrapper = _styled.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  user-select: none;\n  ", "\n  ", "\n"])), IconOverrides, IconObjectOverrides);
 
 // Wraps all emoji in Inline Links similar to icon
-exports.IconWrapper = IconWrapper;
-var EmojiWrapper = _styled.default.span(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n  margin-right: ", ";\n  user-select: none;\n  ", "\n  ", "\n"])), "var(--ds-space-025, 2px)", IconOverrides, IconObjectOverrides);
+var EmojiWrapper = exports.EmojiWrapper = _styled.default.span(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n  margin-right: ", ";\n  user-select: none;\n  ", "\n  ", "\n"])), "var(--ds-space-025, 2px)", IconOverrides, IconObjectOverrides);
 
 // The main 'wrapping' element, title of the content.
 // NB: `white-space` adds little whitespace before wrapping.
 // NB: `word-break` line breaks as soon as an overflow takes place.
-exports.EmojiWrapper = EmojiWrapper;
-var IconTitleWrapper = _styled.default.span(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  white-space: pre-wrap;\n  word-break: break-all;\n"])));
+var IconTitleWrapper = exports.IconTitleWrapper = _styled.default.span(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  white-space: pre-wrap;\n  word-break: break-all;\n"])));
 
 // TODO: Replace overrides with proper AtlasKit solution.
-exports.IconTitleWrapper = IconTitleWrapper;
-var LozengeWrapper = _styled.default.span(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n  vertical-align: 1px;\n  & > span {\n    margin-left: ", ";\n    padding: ", " 0 ", " 0;\n  }\n"])), "var(--ds-space-050, 4px)", "var(--ds-space-025, 2px)", "var(--ds-space-025, 2px)");
+var LozengeWrapper = exports.LozengeWrapper = _styled.default.span(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n  vertical-align: 1px;\n  & > span {\n    margin-left: ", ";\n    padding: ", " 0 ", " 0;\n  }\n"])), "var(--ds-space-050, 4px)", "var(--ds-space-025, 2px)", "var(--ds-space-025, 2px)");
 // TODO: Replace overrides with proper AtlasKit solution.
-exports.LozengeWrapper = LozengeWrapper;
-var LozengeBlockWrapper = _styled.default.span(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  & > span {\n    margin-left: ", ";\n    padding: ", " 0 ", " 0;\n  }\n"])), "var(--ds-space-050, 4px)", "var(--ds-space-025, 2px)", "var(--ds-space-025, 2px)");
-exports.LozengeBlockWrapper = LozengeBlockWrapper;
-var RightIconPositionWrapper = _styled.default.span(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  margin-left: ", ";\n  margin-right: ", ";\n  position: relative;\n  display: inline-block;\n"])), "var(--ds-space-025, 2px)", "var(--ds-space-050, 4px)");
+var LozengeBlockWrapper = exports.LozengeBlockWrapper = _styled.default.span(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  & > span {\n    margin-left: ", ";\n    padding: ", " 0 ", " 0;\n  }\n"])), "var(--ds-space-050, 4px)", "var(--ds-space-025, 2px)", "var(--ds-space-025, 2px)");
+var RightIconPositionWrapper = exports.RightIconPositionWrapper = _styled.default.span(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  margin-left: ", ";\n  margin-right: ", ";\n  position: relative;\n  display: inline-block;\n"])), "var(--ds-space-025, 2px)", "var(--ds-space-050, 4px)");
 
 // The following components are used to absolutely position icons in the vertical center.
 // - IconPositionWrapper: the `relative` parent which has no height in itself.
 // - IconEmptyWrapper: the child which forces `IconPositionWrapper` to have a height.
-exports.RightIconPositionWrapper = RightIconPositionWrapper;
-var IconPositionWrapper = _styled.default.span(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  margin-right: ", ";\n  position: relative;\n  display: inline-block;\n"])), "var(--ds-space-050, 4px)");
-exports.IconPositionWrapper = IconPositionWrapper;
-var IconEmptyWrapper = _styled.default.span(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  width: 14px;\n  height: 100%;\n  display: inline-block;\n  opacity: 0;\n"])));
-exports.IconEmptyWrapper = IconEmptyWrapper;
+var IconPositionWrapper = exports.IconPositionWrapper = _styled.default.span(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  margin-right: ", ";\n  position: relative;\n  display: inline-block;\n"])), "var(--ds-space-050, 4px)");
+var IconEmptyWrapper = exports.IconEmptyWrapper = _styled.default.span(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  width: 14px;\n  height: 100%;\n  display: inline-block;\n  opacity: 0;\n"])));

package/dist/cjs/MediaInlineCard/LoadedView/index.js

@@ -15,7 +15,7 @@ var _Frame = require("../Frame");
 var _IconAndTitleLayout = require("../IconAndTitleLayout");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-var MediaInlineCardLoadedView = /*#__PURE__*/function (_React$Component) {
+var MediaInlineCardLoadedView = exports.MediaInlineCardLoadedView = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(MediaInlineCardLoadedView, _React$Component);
   var _super = _createSuper(MediaInlineCardLoadedView);
   function MediaInlineCardLoadedView() {
@@ -46,5 +46,4 @@ var MediaInlineCardLoadedView = /*#__PURE__*/function (_React$Component) {
     }
   }]);
   return MediaInlineCardLoadedView;
-}(_react.default.Component);
-exports.MediaInlineCardLoadedView = MediaInlineCardLoadedView;
+}(_react.default.Component);

package/dist/cjs/MediaInlineCard/LoadingView/index.js

@@ -18,7 +18,7 @@ var _styled = require("./styled");
 var _styled2 = require("../IconAndTitleLayout/styled");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-var MediaInlineCardLoadingView = /*#__PURE__*/function (_React$Component) {
+var MediaInlineCardLoadingView = exports.MediaInlineCardLoadingView = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(MediaInlineCardLoadingView, _React$Component);
   var _super = _createSuper(MediaInlineCardLoadingView);
   function MediaInlineCardLoadingView() {
@@ -61,5 +61,4 @@ var MediaInlineCardLoadingView = /*#__PURE__*/function (_React$Component) {
     }
   }]);
   return MediaInlineCardLoadingView;
-}(_react.default.Component);
-exports.MediaInlineCardLoadingView = MediaInlineCardLoadingView;
+}(_react.default.Component);

package/dist/cjs/MediaInlineCard/LoadingView/styled.js

@@ -9,5 +9,4 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _styled2 = require("../IconAndTitleLayout/styled");
 var _templateObject;
-var SpinnerWrapper = (0, _styled.default)(_styled2.IconTitleWrapper)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  vertical-align: baseline;\n  margin-left: ", ";\n"])), "var(--ds-space-025, 2px)");
-exports.SpinnerWrapper = SpinnerWrapper;
+var SpinnerWrapper = exports.SpinnerWrapper = (0, _styled.default)(_styled2.IconTitleWrapper)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  vertical-align: baseline;\n  margin-left: ", ";\n"])), "var(--ds-space-025, 2px)");

package/dist/cjs/MediaInlineCard/styled.js

@@ -9,5 +9,4 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _colors = require("@atlaskit/theme/colors");
 var _templateObject;
-var NoLinkAppearance = _styled.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n"])), "var(--ds-text-subtlest, ".concat(_colors.N200, ")"));
-exports.NoLinkAppearance = NoLinkAppearance;
+var NoLinkAppearance = exports.NoLinkAppearance = _styled.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n"])), "var(--ds-text-subtlest, ".concat(_colors.N200, ")"));

package/dist/cjs/camera.js

@@ -12,7 +12,7 @@ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/cl
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-var Vector2 = /*#__PURE__*/function () {
+var Vector2 = exports.Vector2 = /*#__PURE__*/function () {
   function Vector2(x, y) {
     (0, _classCallCheck2.default)(this, Vector2);
     this.x = x;
@@ -66,8 +66,7 @@ var Vector2 = /*#__PURE__*/function () {
   }]);
   return Vector2;
 }();
-exports.Vector2 = Vector2;
-var Rectangle = /*#__PURE__*/function () {
+var Rectangle = exports.Rectangle = /*#__PURE__*/function () {
   function Rectangle(width, height) {
     (0, _classCallCheck2.default)(this, Rectangle);
     this.width = width;
@@ -145,8 +144,7 @@ var Rectangle = /*#__PURE__*/function () {
   }]);
   return Rectangle;
 }();
-exports.Rectangle = Rectangle;
-var Bounds = /*#__PURE__*/function (_Rectangle) {
+var Bounds = exports.Bounds = /*#__PURE__*/function (_Rectangle) {
   (0, _inherits2.default)(Bounds, _Rectangle);
   var _super = _createSuper(Bounds);
   function Bounds(x, y, width, height) {
@@ -257,8 +255,7 @@ var Bounds = /*#__PURE__*/function (_Rectangle) {
   }]);
   return Bounds;
 }(Rectangle);
-exports.Bounds = Bounds;
-var Camera = /*#__PURE__*/function () {
+var Camera = exports.Camera = /*#__PURE__*/function () {
   function Camera(viewport, originalImg) {
     (0, _classCallCheck2.default)(this, Camera);
     this.viewport = viewport;
@@ -300,5 +297,4 @@ var Camera = /*#__PURE__*/function () {
     }
   }]);
   return Camera;
-}();
-exports.Camera = Camera;
+}();

package/dist/cjs/classNames.js

@@ -4,5 +4,4 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.hideControlsClassName = void 0;
-var hideControlsClassName = 'mvng-hide-controls';
-exports.hideControlsClassName = hideControlsClassName;
+var hideControlsClassName = exports.hideControlsClassName = 'mvng-hide-controls';

package/dist/cjs/customMediaPlayer/analytics/events/screen/customMediaPlayer.js

@@ -9,7 +9,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _playbackAttributes = require("../../utils/playbackAttributes");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var createCustomMediaPlayerScreenEvent = function createCustomMediaPlayerScreenEvent(type, playbackState, fileId) {
+var createCustomMediaPlayerScreenEvent = exports.createCustomMediaPlayerScreenEvent = function createCustomMediaPlayerScreenEvent(type, playbackState, fileId) {
   return {
     eventType: 'screen',
     actionSubject: 'customMediaPlayerScreen',
@@ -24,5 +24,4 @@ var createCustomMediaPlayerScreenEvent = function createCustomMediaPlayerScreenE
       }
     })
   };
-};
-exports.createCustomMediaPlayerScreenEvent = createCustomMediaPlayerScreenEvent;
+};

package/dist/cjs/customMediaPlayer/analytics/events/track/playCount.js

@@ -9,7 +9,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _playbackAttributes = require("../../utils/playbackAttributes");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var createFirstPlayedTrackEvent = function createFirstPlayedTrackEvent(type, playbackState, fileId) {
+var createFirstPlayedTrackEvent = exports.createFirstPlayedTrackEvent = function createFirstPlayedTrackEvent(type, playbackState, fileId) {
   return {
     eventType: 'track',
     action: 'firstPlayed',
@@ -24,5 +24,4 @@ var createFirstPlayedTrackEvent = function createFirstPlayedTrackEvent(type, pla
       }
     })
   };
-};
-exports.createFirstPlayedTrackEvent = createFirstPlayedTrackEvent;
+};

package/dist/cjs/customMediaPlayer/analytics/events/track/played.js

@@ -9,7 +9,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _playbackAttributes = require("../../utils/playbackAttributes");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var createPlayedTrackEvent = function createPlayedTrackEvent(type, playbackState, fileId) {
+var createPlayedTrackEvent = exports.createPlayedTrackEvent = function createPlayedTrackEvent(type, playbackState, fileId) {
   return {
     eventType: 'track',
     action: 'played',
@@ -24,5 +24,4 @@ var createPlayedTrackEvent = function createPlayedTrackEvent(type, playbackState
       }
     })
   };
-};
-exports.createPlayedTrackEvent = createPlayedTrackEvent;
+};

package/dist/cjs/customMediaPlayer/analytics/utils/analytics.js

@@ -16,7 +16,6 @@ function fireAnalyticsEvent(payload, createAnalyticsEvent) {
 }
 
 // can be used inside withAnalyticsEvents() hook
-var createAndFireMediaCustomMediaPlayerEvent = function createAndFireMediaCustomMediaPlayerEvent(payload) {
+var createAndFireMediaCustomMediaPlayerEvent = exports.createAndFireMediaCustomMediaPlayerEvent = function createAndFireMediaCustomMediaPlayerEvent(payload) {
   return (0, _analyticsNext.createAndFireEvent)(_mediaCommon.ANALYTICS_MEDIA_CHANNEL)(payload);
-};
-exports.createAndFireMediaCustomMediaPlayerEvent = createAndFireMediaCustomMediaPlayerEvent;
+};

package/dist/cjs/customMediaPlayer/fullscreen.js

@@ -8,7 +8,7 @@ var capitalize = function capitalize(text) {
   return text.charAt(0).toUpperCase() + text.slice(1);
 };
 var browserPrefixes = ['', 'moz', 'webkit', 'ms'];
-var findVendorSpecificProp = function findVendorSpecificProp(object, propNames) {
+var findVendorSpecificProp = exports.findVendorSpecificProp = function findVendorSpecificProp(object, propNames) {
   if (!Array.isArray(propNames)) {
     propNames = [propNames];
   }
@@ -25,8 +25,7 @@ var findVendorSpecificProp = function findVendorSpecificProp(object, propNames)
     }
   }
 };
-exports.findVendorSpecificProp = findVendorSpecificProp;
-var requestFullscreen = function requestFullscreen(element) {
+var requestFullscreen = exports.requestFullscreen = function requestFullscreen(element) {
   var requestFullscreenProp = findVendorSpecificProp(element, [
   // The order here is important! Other way will make webkitRequestFullScreen to be picked up in chrome for example.
   'requestFullscreen', 'requestFullScreen']);
@@ -34,8 +33,7 @@ var requestFullscreen = function requestFullscreen(element) {
     element[requestFullscreenProp]();
   }
 };
-exports.requestFullscreen = requestFullscreen;
-var exitFullscreen = function exitFullscreen() {
+var exitFullscreen = exports.exitFullscreen = function exitFullscreen() {
   var exitFullScreenProp = findVendorSpecificProp(document, [
   // The order here is important! Other way will make webkitExitFullScreen to be picked up in chrome for example.
   'exitFullscreen', 'exitFullScreen']);
@@ -43,16 +41,13 @@ var exitFullscreen = function exitFullscreen() {
     document[exitFullScreenProp]();
   }
 };
-exports.exitFullscreen = exitFullscreen;
-var getFullscreenElement = function getFullscreenElement() {
+var getFullscreenElement = exports.getFullscreenElement = function getFullscreenElement() {
   return findVendorSpecificProp(document, ['fullScreenElement', 'fullscreenElement']);
 };
-exports.getFullscreenElement = getFullscreenElement;
-var toggleFullscreen = function toggleFullscreen(element) {
+var toggleFullscreen = exports.toggleFullscreen = function toggleFullscreen(element) {
   if (getFullscreenElement()) {
     exitFullscreen();
   } else if (element) {
     requestFullscreen(element);
   }
-};
-exports.toggleFullscreen = toggleFullscreen;
+};

package/dist/cjs/customMediaPlayer/getControlsWrapperClassName.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getControlsWrapperClassName = void 0;
 var _classNames = require("../classNames");
-var getControlsWrapperClassName = function getControlsWrapperClassName(wasPlayedOnce) {
+var getControlsWrapperClassName = exports.getControlsWrapperClassName = function getControlsWrapperClassName(wasPlayedOnce) {
   return !wasPlayedOnce ? '' : _classNames.hideControlsClassName;
-};
-exports.getControlsWrapperClassName = getControlsWrapperClassName;
+};

package/dist/cjs/customMediaPlayer/index.js

@@ -51,12 +51,12 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */ // Keep media player components used in media-viewer to use static colors from the new color palette to
 // support the hybrid theming in media viewer https://product-fabric.atlassian.net/browse/DSP-6067
 var packageName = "@atlaskit/media-ui";
-var packageVersion = "25.0.1";
+var packageVersion = "25.0.2";
 var MEDIUM_VIDEO_MAX_WIDTH = 400;
 var SMALL_VIDEO_MAX_WIDTH = 160;
 var MINIMUM_DURATION_BEFORE_SAVING_TIME = 60;
 var VIEWED_TRACKING_SECS = 2;
-var CustomMediaPlayerBase = /*#__PURE__*/function (_Component) {
+var CustomMediaPlayerBase = exports.CustomMediaPlayerBase = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(CustomMediaPlayerBase, _Component);
   var _super = _createSuper(CustomMediaPlayerBase);
   function CustomMediaPlayerBase() {
@@ -113,7 +113,7 @@ var CustomMediaPlayerBase = /*#__PURE__*/function (_Component) {
       var isFullScreenEnabled = !!(0, _fullscreen.getFullscreenElement)();
       if (currentFullScreenMode !== isFullScreenEnabled) {
         var _this$props$onFullscr, _this$props2;
-        (_this$props$onFullscr = (_this$props2 = _this.props).onFullscreenChange) === null || _this$props$onFullscr === void 0 ? void 0 : _this$props$onFullscr.call(_this$props2, isFullScreenEnabled);
+        (_this$props$onFullscr = (_this$props2 = _this.props).onFullscreenChange) === null || _this$props$onFullscr === void 0 || _this$props$onFullscr.call(_this$props2, isFullScreenEnabled);
         _this.setState({
           isFullScreenEnabled: isFullScreenEnabled
         });
@@ -469,7 +469,7 @@ var CustomMediaPlayerBase = /*#__PURE__*/function (_Component) {
       }
       if (this.state.isFullScreenEnabled) {
         var _this$props$onFullscr2, _this$props7;
-        (_this$props$onFullscr2 = (_this$props7 = this.props).onFullscreenChange) === null || _this$props$onFullscr2 === void 0 ? void 0 : _this$props$onFullscr2.call(_this$props7, false);
+        (_this$props$onFullscr2 = (_this$props7 = this.props).onFullscreenChange) === null || _this$props$onFullscr2 === void 0 || _this$props$onFullscr2.call(_this$props7, false);
       }
       _simultaneousPlayManager.default.unsubscribe(this);
     }
@@ -606,11 +606,9 @@ var CustomMediaPlayerBase = /*#__PURE__*/function (_Component) {
   }]);
   return CustomMediaPlayerBase;
 }(_react.Component);
-exports.CustomMediaPlayerBase = CustomMediaPlayerBase;
-var CustomMediaPlayer = (0, _mediaCommon.withMediaAnalyticsContext)({
+var CustomMediaPlayer = exports.CustomMediaPlayer = (0, _mediaCommon.withMediaAnalyticsContext)({
   packageVersion: packageVersion,
   packageName: packageName,
   componentName: 'customMediaPlayer',
   component: 'customMediaPlayer'
-})((0, _analyticsNext.withAnalyticsEvents)()((0, _reactIntlNext.injectIntl)(CustomMediaPlayerBase)));
-exports.CustomMediaPlayer = CustomMediaPlayer;
+})((0, _analyticsNext.withAnalyticsEvents)()((0, _reactIntlNext.injectIntl)(CustomMediaPlayerBase)));

package/dist/cjs/customMediaPlayer/playPauseBlanket.js

@@ -8,6 +8,5 @@ exports.PlayPauseBlanket = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _templateObject;
-var PlayPauseBlanket = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n"])));
-exports.PlayPauseBlanket = PlayPauseBlanket;
+var PlayPauseBlanket = exports.PlayPauseBlanket = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n"])));
 PlayPauseBlanket.displayName = 'PlayPauseBlanket';

package/dist/cjs/customMediaPlayer/playbackSpeedControls.js

@@ -28,7 +28,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */ // Keep PlaybackSpeedControls to use static colors from the new color palette to support the hybrid
 // theming in media viewer https://product-fabric.atlassian.net/browse/DSP-6067
-var PlaybackSpeedControls = /*#__PURE__*/function (_Component) {
+var PlaybackSpeedControls = exports.PlaybackSpeedControls = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(PlaybackSpeedControls, _Component);
   var _super = _createSuper(PlaybackSpeedControls);
   function PlaybackSpeedControls() {
@@ -188,6 +188,4 @@ var PlaybackSpeedControls = /*#__PURE__*/function (_Component) {
   }]);
   return PlaybackSpeedControls;
 }(_react.Component);
-exports.PlaybackSpeedControls = PlaybackSpeedControls;
-var _default = (0, _reactIntlNext.injectIntl)(PlaybackSpeedControls);
-exports.default = _default;
+var _default = exports.default = (0, _reactIntlNext.injectIntl)(PlaybackSpeedControls);

package/dist/cjs/customMediaPlayer/simultaneousPlayManager.js

@@ -14,7 +14,7 @@ var removePlayer = function removePlayer(player) {
     players.splice(playerIndex, 1);
   }
 };
-var _default = {
+var _default = exports.default = {
   pauseOthers: function pauseOthers(player) {
     players.forEach(function (otherPlayer) {
       if (otherPlayer !== player) {
@@ -30,5 +30,4 @@ var _default = {
   unsubscribe: function unsubscribe(player) {
     removePlayer(player);
   }
-};
-exports.default = _default;
+};

package/dist/cjs/customMediaPlayer/styled.js

@@ -10,69 +10,50 @@ var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _colors = require("@atlaskit/theme/colors");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18;
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-var CustomVideoWrapper = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 100%;\n  user-select: none;\n"])));
-exports.CustomVideoWrapper = CustomVideoWrapper;
-var VideoWrapper = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
+var CustomVideoWrapper = exports.CustomVideoWrapper = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 100%;\n  user-select: none;\n"])));
+var VideoWrapper = exports.VideoWrapper = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
 
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-exports.VideoWrapper = VideoWrapper;
-var TimebarWrapper = _styled.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  color: white;\n  position: absolute;\n  width: 100%;\n  bottom: 10px;\n"])));
-exports.TimebarWrapper = TimebarWrapper;
+var TimebarWrapper = exports.TimebarWrapper = _styled.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  color: white;\n  position: absolute;\n  width: 100%;\n  bottom: 10px;\n"])));
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-var VolumeWrapper = _styled.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  width: 35px;\n  overflow: hidden;\n  transition: width 0.3s;\n  align-items: center;\n  bottom: 0px;\n  left: 43px;\n\n  ", "\n"])), function (props) {
+var VolumeWrapper = exports.VolumeWrapper = _styled.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  width: 35px;\n  overflow: hidden;\n  transition: width 0.3s;\n  align-items: center;\n  bottom: 0px;\n  left: 43px;\n\n  ", "\n"])), function (props) {
   return props.showSlider ? "\n    &:hover,\n    &:active {\n      width: 150px;\n      transition: width 0.3s ease-out;\n    }\n  " : '';
 });
 
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-exports.VolumeWrapper = VolumeWrapper;
-var TimeWrapper = _styled.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0 ", " 10px ", ";\n  margin-bottom: 44px;\n"])), "var(--ds-space-250, 20px)", "var(--ds-space-250, 20px)");
+var TimeWrapper = exports.TimeWrapper = _styled.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0 ", " 10px ", ";\n  margin-bottom: 44px;\n"])), "var(--ds-space-250, 20px)", "var(--ds-space-250, 20px)");
 
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-exports.TimeWrapper = TimeWrapper;
-var CurrentTime = _styled.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  color: #c7d1db;\n  user-select: none;\n  margin-right: 10px;\n  white-space: nowrap;\n"])));
-exports.CurrentTime = CurrentTime;
-var TimeLine = _styled.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 2px;\n  transition-delay: 1s;\n  transition: all 0.1s;\n  background-color: #596773;\n  border-radius: 5px;\n  position: relative;\n"])));
-exports.TimeLine = TimeLine;
-var CurrentTimeLine = _styled.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: #05c;\n  border-radius: inherit;\n  height: inherit;\n  position: absolute;\n  top: 0;\n  max-width: 100%;\n"])));
-exports.CurrentTimeLine = CurrentTimeLine;
-var Thumb = _styled.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  pointer-events: none;\n  width: 14px;\n  height: 14px;\n  border-radius: 100%;\n  background-color: white;\n  border: 1px solid #666;\n  position: absolute;\n  right: 0;\n  top: 50%;\n\n  transform: translate(7px, -50%) scale(0);\n  transition: all 0.1s;\n  transition-delay: 1s;\n\n  &:hover .current-time-tooltip {\n    opacity: 1;\n  }\n"])));
-exports.Thumb = Thumb;
-var BufferedTime = _styled.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: #8696a7;\n  height: inherit;\n  border-radius: inherit;\n  width: 0;\n"])));
+var CurrentTime = exports.CurrentTime = _styled.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  color: #c7d1db;\n  user-select: none;\n  margin-right: 10px;\n  white-space: nowrap;\n"])));
+var TimeLine = exports.TimeLine = _styled.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 2px;\n  transition-delay: 1s;\n  transition: all 0.1s;\n  background-color: #596773;\n  border-radius: 5px;\n  position: relative;\n"])));
+var CurrentTimeLine = exports.CurrentTimeLine = _styled.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: #05c;\n  border-radius: inherit;\n  height: inherit;\n  position: absolute;\n  top: 0;\n  max-width: 100%;\n"])));
+var Thumb = exports.Thumb = _styled.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  pointer-events: none;\n  width: 14px;\n  height: 14px;\n  border-radius: 100%;\n  background-color: white;\n  border: 1px solid #666;\n  position: absolute;\n  right: 0;\n  top: 50%;\n\n  transform: translate(7px, -50%) scale(0);\n  transition: all 0.1s;\n  transition-delay: 1s;\n\n  &:hover .current-time-tooltip {\n    opacity: 1;\n  }\n"])));
+var BufferedTime = exports.BufferedTime = _styled.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: #8696a7;\n  height: inherit;\n  border-radius: inherit;\n  width: 0;\n"])));
 
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-exports.BufferedTime = BufferedTime;
-var LeftControls = _styled.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  margin-left: 10px;\n"])));
+var LeftControls = exports.LeftControls = _styled.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  margin-left: 10px;\n"])));
 
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-exports.LeftControls = LeftControls;
-var RightControls = _styled.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  margin-right: 10px;\n  color: '#c7d1db';\n"])));
-exports.RightControls = RightControls;
-var ControlsWrapper = _styled.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: auto;\n  background: linear-gradient(to top, #101214, rgba(14, 22, 36, 0));\n  position: absolute;\n"])));
+var RightControls = exports.RightControls = _styled.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  margin-right: 10px;\n  color: '#c7d1db';\n"])));
+var ControlsWrapper = exports.ControlsWrapper = _styled.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: auto;\n  background: linear-gradient(to top, #101214, rgba(14, 22, 36, 0));\n  position: absolute;\n"])));
 
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-exports.ControlsWrapper = ControlsWrapper;
-var VolumeToggleWrapper = _styled.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  margin-right: 13px;\n\n  button {\n    width: 36px !important;\n    color: ", ";\n  }\n"])), function (_ref) {
+var VolumeToggleWrapper = exports.VolumeToggleWrapper = _styled.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  margin-right: 13px;\n\n  button {\n    width: 36px !important;\n    color: ", ";\n  }\n"])), function (_ref) {
   var isMuted = _ref.isMuted;
   return isMuted ? "#EF5C48 !important;" : '';
 });
-exports.VolumeToggleWrapper = VolumeToggleWrapper;
-var VolumeTimeRangeWrapper = _styled.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  margin-right: ", ";\n"])), "var(--ds-space-250, 20px)");
+var VolumeTimeRangeWrapper = exports.VolumeTimeRangeWrapper = _styled.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  margin-right: ", ";\n"])), "var(--ds-space-250, 20px)");
 
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-exports.VolumeTimeRangeWrapper = VolumeTimeRangeWrapper;
-var MutedIndicator = _styled.default.div(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n  width: 29px;\n  height: 2px;\n  position: absolute;\n  top: 10px;\n  left: 9px;\n  z-index: 2;\n  background: ", ";\n  transform: rotate(32deg) translateY(10px);\n  opacity: 0;\n  pointer-events: none;\n\n  ", ";\n"])), _colors.R300, function (props) {
+var MutedIndicator = exports.MutedIndicator = _styled.default.div(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n  width: 29px;\n  height: 2px;\n  position: absolute;\n  top: 10px;\n  left: 9px;\n  z-index: 2;\n  background: ", ";\n  transform: rotate(32deg) translateY(10px);\n  opacity: 0;\n  pointer-events: none;\n\n  ", ";\n"])), _colors.R300, function (props) {
   return props.isMuted ? "\n    opacity: 1;\n  " : '';
 });
-exports.MutedIndicator = MutedIndicator;
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-var CurrentTimeTooltip = _styled.default.div(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  user-select: none;\n  top: -28px;\n  background-color: #182c4c;\n  color: #eff1f3;\n  font-size: 12px;\n  padding: 3px 7px;\n  border-radius: 3px;\n  left: 50%;\n  transform: translateX(-50%);\n  opacity: ", ";\n  transition: opacity 0.3s;\n  word-break: keep-all;\n"])), function (props) {
+var CurrentTimeTooltip = exports.CurrentTimeTooltip = _styled.default.div(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  user-select: none;\n  top: -28px;\n  background-color: #182c4c;\n  color: #eff1f3;\n  font-size: 12px;\n  padding: 3px 7px;\n  border-radius: 3px;\n  left: 50%;\n  transform: translateX(-50%);\n  opacity: ", ";\n  transition: opacity 0.3s;\n  word-break: keep-all;\n"])), function (props) {
   return props.isDragging ? '1' : '0';
 });
-exports.CurrentTimeTooltip = CurrentTimeTooltip;
-var TimeRangeWrapper = _styled.default.div(function (_ref2) {
+var TimeRangeWrapper = exports.TimeRangeWrapper = _styled.default.div(function (_ref2) {
   var showAsActive = _ref2.showAsActive;
   return "\n  display: flex;\n  align-items: center;\n  height: 22px;\n\n  cursor: pointer;\n  width: 100%;\n\n  &:hover ".concat(TimeLine, " {\n    height: 4px;\n    transition: all 0.1s;\n  }\n\n  &:hover ").concat(Thumb, " {\n    transition: all 0.1s;\n    transform: translate(7px, -50%) scale(1);\n  }\n\n  ").concat(TimeLine, " {\n    transition-delay: 1s;\n    ").concat(showAsActive ? 'height: 4px;' : '', "\n  }\n  ").concat(Thumb, " {\n    ").concat(showAsActive ? 'transform: translate(7px, -50%) scale(1);' : '', "\n  }\n");
 });
-exports.TimeRangeWrapper = TimeRangeWrapper;
-var SpinnerWrapper = _styled.default.div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n"])));
-exports.SpinnerWrapper = SpinnerWrapper;
+var SpinnerWrapper = exports.SpinnerWrapper = _styled.default.div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n"])));

package/dist/cjs/customMediaPlayer/timeRange.js

@@ -20,7 +20,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-var TimeRange = /*#__PURE__*/function (_Component) {
+var TimeRange = exports.TimeRange = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(TimeRange, _Component);
   var _super = _createSuper(TimeRange);
   function TimeRange() {
@@ -162,7 +162,6 @@ var TimeRange = /*#__PURE__*/function (_Component) {
   }]);
   return TimeRange;
 }(_react.Component);
-exports.TimeRange = TimeRange;
 (0, _defineProperty2.default)(TimeRange, "defaultProps", {
   disableThumbTooltip: false,
   isAlwaysActive: false