@atlaskit/media-card 74.5.1 → 74.5.2

package/dist/cjs/card/ui/loadingRateLimited/styles.js

@@ -1,33 +1,24 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.warningIconWrapperStyles = exports.loadingRateLimitedTextWrapperStyles = exports.loadingRateLimitedContainerStyles = exports.errorWrapperStyles = exports.couldntLoadWrapperStyles = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = require("@emotion/react");
-
 var _styles = require("../progressBar/styles");
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-
 var loadingRateLimitedContainerStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n"])));
 exports.loadingRateLimitedContainerStyles = loadingRateLimitedContainerStyles;
 var warningIconWrapperStyles = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  justify-content: center;\n  display: flex;\n  /* Required to allow end users to select text in the error message */\n  cursor: auto;\n  user-select: text;\n  > svg {\n    width: 45px;\n  }\n"])));
 exports.warningIconWrapperStyles = warningIconWrapperStyles;
-
 var loadingRateLimitedTextWrapperStyles = function loadingRateLimitedTextWrapperStyles(_ref) {
   var breakpoint = _ref.breakpoint,
-      positionBottom = _ref.positionBottom;
+    positionBottom = _ref.positionBottom;
   return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  margin-top: 10px;\n  overflow: hidden;\n  color: ", ";\n  display: block;\n  width: 100%;\n  text-align: center;\n  ", "\n"])), "var(--ds-text-subtlest, ".concat(_colors.N300, ")"), (0, _styles.generateResponsiveStyles)(breakpoint, positionBottom, false, 1));
 };
-
 exports.loadingRateLimitedTextWrapperStyles = loadingRateLimitedTextWrapperStyles;
 loadingRateLimitedTextWrapperStyles.displayName = 'LoadingRateLimitedTextWrapper';
 var couldntLoadWrapperStyles = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 550;\n"])));

package/dist/cjs/card/ui/newFileExperience/newFileExperienceWrapper.js

@@ -4,31 +4,27 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.NewFileExperienceWrapper = void 0;
-
 var _react = require("@emotion/react");
-
 var _cardConstants = require("../../cardConstants");
-
 var _styles = require("./styles");
-
 var _components = require("@atlaskit/theme/components");
-
 /**@jsx jsx */
+
 var NewFileExperienceWrapper = function NewFileExperienceWrapper(props) {
   var testId = props.testId,
-      dimensions = props.dimensions,
-      appearance = props.appearance,
-      onClick = props.onClick,
-      onMouseEnter = props.onMouseEnter,
-      innerRef = props.innerRef,
-      breakpoint = props.breakpoint,
-      mediaCardCursor = props.mediaCardCursor,
-      disableOverlay = props.disableOverlay,
-      selected = props.selected,
-      displayBackground = props.displayBackground,
-      isPlayButtonClickable = props.isPlayButtonClickable,
-      isTickBoxSelectable = props.isTickBoxSelectable,
-      shouldDisplayTooltip = props.shouldDisplayTooltip;
+    dimensions = props.dimensions,
+    appearance = props.appearance,
+    onClick = props.onClick,
+    onMouseEnter = props.onMouseEnter,
+    innerRef = props.innerRef,
+    breakpoint = props.breakpoint,
+    mediaCardCursor = props.mediaCardCursor,
+    disableOverlay = props.disableOverlay,
+    selected = props.selected,
+    displayBackground = props.displayBackground,
+    isPlayButtonClickable = props.isPlayButtonClickable,
+    isTickBoxSelectable = props.isTickBoxSelectable,
+    shouldDisplayTooltip = props.shouldDisplayTooltip;
   var theme = (0, _components.useGlobalTheme)();
   return (0, _react.jsx)("div", {
     id: "newFileExperienceWrapper",
@@ -52,5 +48,4 @@ var NewFileExperienceWrapper = function NewFileExperienceWrapper(props) {
     onMouseEnter: onMouseEnter
   }, props.children);
 };
-
 exports.NewFileExperienceWrapper = NewFileExperienceWrapper;

package/dist/cjs/card/ui/newFileExperience/styles.js

@@ -1,50 +1,35 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.newFileExperienceWrapperStyles = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = require("@emotion/react");
-
 var _constants = require("@atlaskit/theme/constants");
-
 var _mediaUi = require("@atlaskit/media-ui");
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _selection = require("@atlaskit/editor-shared-styles/selection");
-
 var _components = require("@atlaskit/theme/components");
-
 var _styles = require("../../styles");
-
 var _styles2 = require("../blanket/styles");
-
 var _styles3 = require("../actionsBar/styles");
-
 var _styles4 = require("../styles");
-
 var _templateObject;
-
 var BACKGROUND_COLOR_DARK = '#22272C';
-
 var newFileExperienceWrapperStyles = function newFileExperienceWrapperStyles(_ref) {
   var breakpoint = _ref.breakpoint,
-      dimensions = _ref.dimensions,
-      appearance = _ref.appearance,
-      disableOverlay = _ref.disableOverlay,
-      displayBackground = _ref.displayBackground,
-      selected = _ref.selected,
-      isPlayButtonClickable = _ref.isPlayButtonClickable,
-      isTickBoxSelectable = _ref.isTickBoxSelectable,
-      shouldDisplayTooltip = _ref.shouldDisplayTooltip,
-      mediaCardCursor = _ref.mediaCardCursor,
-      theme = _ref.theme;
+    dimensions = _ref.dimensions,
+    appearance = _ref.appearance,
+    disableOverlay = _ref.disableOverlay,
+    displayBackground = _ref.displayBackground,
+    selected = _ref.selected,
+    isPlayButtonClickable = _ref.isPlayButtonClickable,
+    isTickBoxSelectable = _ref.isTickBoxSelectable,
+    shouldDisplayTooltip = _ref.shouldDisplayTooltip,
+    mediaCardCursor = _ref.mediaCardCursor,
+    theme = _ref.theme;
   return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  box-sizing: border-box;\n  * {\n    box-sizing: border-box;\n  }\n  position: relative;\n  font-family: ", ";\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", ";\n  ", "\n\n  /* We use classnames from here exceptionally to be able to handle styles when the Card is on hover */\n  ", "\n  ", "\n  &:hover .", " {\n    ", "\n  }\n  &:hover .", " {\n    ", "\n  }\n\n  /* Tooltip does not support percentage dimensions. We enforce them here */\n  ", "\n"])), (0, _styles.transition)(), (0, _constants.fontFamily)(), (0, _styles4.getWrapperDimensions)(dimensions, appearance), displayBackground && "background: ".concat((0, _components.themed)({
     light: "var(--ds-background-neutral, ".concat(_colors.N20, ")"),
     dark: "var(--ds-background-neutral, ".concat(BACKGROUND_COLOR_DARK, ")")
@@ -52,6 +37,5 @@ var newFileExperienceWrapperStyles = function newFileExperienceWrapperStyles(_re
     theme: theme
   }), ";"), _mediaUi.borderRadius, (0, _styles4.getCursorStyle)(mediaCardCursor), (0, _styles4.getWrapperShadow)(disableOverlay, selected), (0, _styles4.generateResponsiveStyles)(breakpoint), _selection.hideNativeBrowserTextSelectionStyles, (0, _styles4.getClickablePlayButtonStyles)(isPlayButtonClickable), (0, _styles4.getSelectableTickBoxStyles)(isTickBoxSelectable), _styles2.blanketClassName, _styles2.fixedBlanketStyles, _styles3.actionsBarClassName, _styles3.fixedActionBarStyles, shouldDisplayTooltip && "> div { width: 100%; height: 100%; }");
 };
-
 exports.newFileExperienceWrapperStyles = newFileExperienceWrapperStyles;
 newFileExperienceWrapperStyles.displayName = 'NewFileExperienceWrapper';

package/dist/cjs/card/ui/playButton/playButton.js

@@ -1,25 +1,18 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PlayButton = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _vidPlay = _interopRequireDefault(require("@atlaskit/icon/glyph/vid-play"));
-
 var _playButtonWrapper = require("./playButtonWrapper");
-
 var _playButtonBackground = require("./playButtonBackground");
-
 var PlayButton = function PlayButton() {
   return /*#__PURE__*/_react.default.createElement(_playButtonWrapper.PlayButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_playButtonBackground.PlayButtonBackground, null), /*#__PURE__*/_react.default.createElement(_vidPlay.default, {
     label: "play",
     size: "large"
   }));
 };
-
 exports.PlayButton = PlayButton;

package/dist/cjs/card/ui/playButton/playButtonBackground.js

@@ -4,17 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PlayButtonBackground = void 0;
-
 var _react = require("@emotion/react");
-
 var _styles = require("./styles");
-
 /**@jsx jsx */
+
 var PlayButtonBackground = function PlayButtonBackground() {
   return (0, _react.jsx)("div", {
     css: _styles.backgroundStyles,
     className: _styles.bkgClassName
   });
 };
-
 exports.PlayButtonBackground = PlayButtonBackground;

package/dist/cjs/card/ui/playButton/playButtonWrapper.js

@@ -4,17 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PlayButtonWrapper = void 0;
-
 var _react = require("@emotion/react");
-
 var _styles = require("./styles");
-
 /**@jsx jsx */
+
 var PlayButtonWrapper = function PlayButtonWrapper(props) {
   return (0, _react.jsx)("div", {
     css: _styles.playButtonWrapperStyles,
     className: _styles.playButtonClassName
   }, props.children);
 };
-
 exports.PlayButtonWrapper = PlayButtonWrapper;

package/dist/cjs/card/ui/playButton/styles.js

@@ -1,20 +1,14 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.playButtonWrapperStyles = exports.playButtonClassName = exports.fixedPlayButtonStyles = exports.bkgClassName = exports.backgroundStyles = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = require("@emotion/react");
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _templateObject, _templateObject2;
-
 var playButtonClassName = 'media-card-play-button';
 exports.playButtonClassName = playButtonClassName;
 var bkgClassName = 'play-icon-background';

package/dist/cjs/card/ui/progressBar/progressBar.js

@@ -1,32 +1,25 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getNormalizedProgress = exports.ProgressBar = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styledBar = require("./styledBar");
-
 var _common = require("../common");
-
 var getNormalizedProgress = function getNormalizedProgress(progress) {
   return Math.min(1, Math.max(0, progress || 0)) * 100;
 };
-
 exports.getNormalizedProgress = getNormalizedProgress;
-
 var ProgressBar = function ProgressBar(_ref) {
   var progress = _ref.progress,
-      _ref$breakpoint = _ref.breakpoint,
-      breakpoint = _ref$breakpoint === void 0 ? _common.Breakpoint.SMALL : _ref$breakpoint,
-      _ref$positionBottom = _ref.positionBottom,
-      positionBottom = _ref$positionBottom === void 0 ? false : _ref$positionBottom,
-      _ref$showOnTop = _ref.showOnTop,
-      showOnTop = _ref$showOnTop === void 0 ? false : _ref$showOnTop;
+    _ref$breakpoint = _ref.breakpoint,
+    breakpoint = _ref$breakpoint === void 0 ? _common.Breakpoint.SMALL : _ref$breakpoint,
+    _ref$positionBottom = _ref.positionBottom,
+    positionBottom = _ref$positionBottom === void 0 ? false : _ref$positionBottom,
+    _ref$showOnTop = _ref.showOnTop,
+    showOnTop = _ref$showOnTop === void 0 ? false : _ref$showOnTop;
   return /*#__PURE__*/_react.default.createElement(_styledBar.StyledBar, {
     progress: getNormalizedProgress(progress),
     breakpoint: breakpoint,
@@ -34,5 +27,4 @@ var ProgressBar = function ProgressBar(_ref) {
     showOnTop: showOnTop
   });
 };
-
 exports.ProgressBar = ProgressBar;

package/dist/cjs/card/ui/progressBar/styledBar.js

@@ -4,17 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.StyledBar = void 0;
-
 var _react = require("@emotion/react");
-
 var _styles = require("./styles");
-
 /**@jsx jsx */
+
 var StyledBar = function StyledBar(props) {
   var progress = props.progress,
-      breakpoint = props.breakpoint,
-      positionBottom = props.positionBottom,
-      showOnTop = props.showOnTop;
+    breakpoint = props.breakpoint,
+    positionBottom = props.positionBottom,
+    showOnTop = props.showOnTop;
   return (0, _react.jsx)("div", {
     id: "styledBar",
     css: (0, _styles.styledBarStyles)({
@@ -25,5 +23,4 @@ var StyledBar = function StyledBar(props) {
     })
   });
 };
-
 exports.StyledBar = StyledBar;

package/dist/cjs/card/ui/progressBar/styles.js

@@ -1,31 +1,21 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.generateResponsiveStyles = generateResponsiveStyles;
 exports.styledBarStyles = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = require("@emotion/react");
-
 var _mediaUi = require("@atlaskit/media-ui");
-
 var _mixins = require("../../styles/mixins");
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _common = require("../common");
-
 var _templateObject;
-
 var height = 3;
 var padding = 1;
 var width = 95; // %
-
 var left = (100 - width) / 2; // %
 
 var smallSizeSettings = {
@@ -34,7 +24,6 @@ var smallSizeSettings = {
 var largeSizeSettings = {
   marginBottom: 12
 };
-
 function generateResponsiveStyles(breakpoint, positionBottom, showOnTop) {
   var multiplier = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
   var setting = breakpoint === _common.Breakpoint.SMALL ? smallSizeSettings : largeSizeSettings;
@@ -42,22 +31,19 @@ function generateResponsiveStyles(breakpoint, positionBottom, showOnTop) {
   var marginBottom = setting.marginBottom * multiplier + (positionBottom ? marginPositionBottom : (0, _common.getTitleBoxHeight)(breakpoint));
   return "\n    ".concat(showOnTop ? 'top' : 'bottom', ": ").concat(marginBottom, "px\n  ");
 }
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-
 
+/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 var getStyledBarStylesBasedOnProps = function getStyledBarStylesBasedOnProps(_ref) {
   var progress = _ref.progress,
-      breakpoint = _ref.breakpoint,
-      positionBottom = _ref.positionBottom,
-      showOnTop = _ref.showOnTop;
+    breakpoint = _ref.breakpoint,
+    positionBottom = _ref.positionBottom,
+    showOnTop = _ref.showOnTop;
   return "\n".concat(_mediaUi.borderRadius, "\noverflow: hidden;\nposition: absolute;\nwidth: ").concat(width, "%;\nleft: ").concat(left, "%;\nbackground-color: ").concat((0, _mixins.rgba)(_colors.N0, 0.8), ";\nheight: ").concat(height + padding * 2, "px;\npadding: ").concat(padding, "px;\nbox-sizing: border-box;\n\n::before {\n  content: '';\n  width: ").concat(progress, "%;\n  height: 100%;\n  background-color: #44546F;\n  ").concat(_mediaUi.borderRadius, "\n  display: block;\n}\n").concat(generateResponsiveStyles(breakpoint, positionBottom, showOnTop), "\n");
 };
 /* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
 
-
 var styledBarStyles = function styledBarStyles(props) {
   return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    ", "\n  "])), getStyledBarStylesBasedOnProps(props));
 };
-
 exports.styledBarStyles = styledBarStyles;
 styledBarStyles.displayName = 'StyledProgressBar';

package/dist/cjs/card/ui/styles.js

@@ -1,113 +1,79 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getWrapperShadow = exports.getWrapperDimensions = exports.getSelectableTickBoxStyles = exports.getCursorStyle = exports.getClickablePlayButtonStyles = exports.generateResponsiveStyles = exports.cardImageContainerStyles = exports.calcBreakpointSize = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = require("@emotion/react");
-
 var _mediaUi = require("@atlaskit/media-ui");
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _consts = require("@atlaskit/editor-shared-styles/consts");
-
 var _getCSSUnitValue = require("../../utils/getCSSUnitValue");
-
 var _cardDimensions = require("../../utils/cardDimensions");
-
 var _styles = require("./tickBox/styles");
-
 var _styles2 = require("./playButton/styles");
-
 var _common = require("./common");
-
 var _templateObject;
-
 var breakpointSizes = [[_common.Breakpoint.SMALL, 599], [_common.Breakpoint.LARGE, Infinity]];
-
 var calcBreakpointSize = function calcBreakpointSize() {
   var wrapperWidth = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-
   var _ref = breakpointSizes.find(function (_ref3) {
-    var _ref4 = (0, _slicedToArray2.default)(_ref3, 2),
+      var _ref4 = (0, _slicedToArray2.default)(_ref3, 2),
         _breakpoint = _ref4[0],
         limit = _ref4[1];
-
-    return wrapperWidth <= limit;
-  }) || [_common.Breakpoint.SMALL],
-      _ref2 = (0, _slicedToArray2.default)(_ref, 1),
-      breakpoint = _ref2[0];
-
+      return wrapperWidth <= limit;
+    }) || [_common.Breakpoint.SMALL],
+    _ref2 = (0, _slicedToArray2.default)(_ref, 1),
+    breakpoint = _ref2[0];
   return breakpoint;
 };
-
 exports.calcBreakpointSize = calcBreakpointSize;
-
 var generateResponsiveStyles = function generateResponsiveStyles() {
   var breakpoint = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _common.Breakpoint.SMALL;
   var setting = _common.responsiveSettings[breakpoint];
   return "\n    font-size: ".concat(setting.fontSize, "px;\n    line-height: ").concat(setting.lineHeight, "px;\n  ");
 };
-
 exports.generateResponsiveStyles = generateResponsiveStyles;
-
 var getWrapperDimensions = function getWrapperDimensions(dimensions, appearance) {
   var _ref5 = dimensions || {},
-      width = _ref5.width,
-      height = _ref5.height;
-
+    width = _ref5.width,
+    height = _ref5.height;
   var _getDefaultCardDimens = (0, _cardDimensions.getDefaultCardDimensions)(appearance),
-      defaultWidth = _getDefaultCardDimens.width,
-      defaultHeight = _getDefaultCardDimens.height;
-
+    defaultWidth = _getDefaultCardDimens.width,
+    defaultHeight = _getDefaultCardDimens.height;
   return "\n    width: ".concat((0, _getCSSUnitValue.getCSSUnitValue)(width || defaultWidth), ";\n    max-width: 100%;\n    height: ").concat((0, _getCSSUnitValue.getCSSUnitValue)(height || defaultHeight), ";\n    max-height: 100%;\n  ");
-}; // This is a trick to simulate the blue border without affecting the dimensions.
-// CSS outline has no 'radius', therefore we can't achieve the same effect with it
-
+};
 
+// This is a trick to simulate the blue border without affecting the dimensions.
+// CSS outline has no 'radius', therefore we can't achieve the same effect with it
 exports.getWrapperDimensions = getWrapperDimensions;
-
 var getWrapperShadow = function getWrapperShadow(disableOverlay, selected) {
   var withOverlayShadow = !disableOverlay ? "".concat("var(--ds-shadow-raised, ".concat("0 1px 1px ".concat(_colors.N60A, ", 0 0 1px 0 ").concat(_colors.N60A), ")")) : '';
   var selectedShadow = selected ? _consts.akEditorSelectedBoxShadow : '';
   var shadow = [selectedShadow, withOverlayShadow].filter(Boolean).join(', ');
   return shadow ? "box-shadow: ".concat(shadow, ";") : '';
 };
-
 exports.getWrapperShadow = getWrapperShadow;
-
 var getCursorStyle = function getCursorStyle(cursor) {
   return !!cursor ? "cursor: ".concat(cursor, ";") : '';
 };
-
 exports.getCursorStyle = getCursorStyle;
-
 var getClickablePlayButtonStyles = function getClickablePlayButtonStyles(isPlayButtonClickable) {
   if (!isPlayButtonClickable) {
     return '';
   }
-
   return "\n    &:hover .".concat(_styles2.playButtonClassName, " {\n      ").concat(_styles2.fixedPlayButtonStyles, "\n    }\n  ");
 };
-
 exports.getClickablePlayButtonStyles = getClickablePlayButtonStyles;
-
 var getSelectableTickBoxStyles = function getSelectableTickBoxStyles(isTickBoxSelectable) {
   if (!isTickBoxSelectable) {
     return '';
   }
-
   return "\n    &:hover .".concat(_styles.tickBoxClassName, " {\n      ").concat(_styles.tickboxFixedStyles, "\n    }\n  ");
 };
-
 exports.getSelectableTickBoxStyles = getSelectableTickBoxStyles;
 var cardImageContainerStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  max-width: 100%;\n  width: 100%;\n  height: 100%;\n  max-height: 100%;\n  overflow: hidden;\n  ", "\n"])), _mediaUi.borderRadius);
 exports.cardImageContainerStyles = cardImageContainerStyles;

package/dist/cjs/card/ui/tickBox/styles.js

@@ -1,36 +1,25 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.wrapperStyles = exports.tickboxFixedStyles = exports.tickBoxClassName = exports.getSelectedStyles = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = require("@emotion/react");
-
 var _styles = require("../../styles");
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _templateObject;
-
 var tickBoxClassName = 'media-card-tickbox';
 exports.tickBoxClassName = tickBoxClassName;
 var tickboxFixedStyles = "\n  background-color: ".concat("var(--ds-background-input, ".concat(_colors.N0, ")"), ";\n  color: ", "var(--ds-icon-subtle, ".concat(_colors.N100, ")"), ";\n");
 exports.tickboxFixedStyles = tickboxFixedStyles;
-
 var getSelectedStyles = function getSelectedStyles(selected) {
   return selected ? "background-color: ".concat("var(--ds-icon-information, ".concat(_colors.B200, ")"), ";\n      color: ", "var(--ds-icon-inverse, white)", ";") : "";
 };
-
 exports.getSelectedStyles = getSelectedStyles;
-
 var wrapperStyles = function wrapperStyles(selected) {
   return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  font-size: 14px;\n  width: 14px;\n  height: 14px;\n  position: absolute;\n  top: 7px;\n  left: 7px;\n  border-radius: 20px;\n  color: transparent;\n  /* Enforce dimensions and position of \"tick\" icon */\n  span {\n    display: block;\n    svg {\n      height: 14px;\n    }\n  }\n  ", "\n"])), (0, _styles.transition)(), getSelectedStyles(selected));
 };
-
 exports.wrapperStyles = wrapperStyles;
 wrapperStyles.displayName = 'TickBoxWrapper';

package/dist/cjs/card/ui/tickBox/tickBox.js

@@ -1,18 +1,13 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TickBox = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _check = _interopRequireDefault(require("@atlaskit/icon/glyph/check"));
-
 var _tickBoxWrapper = require("./tickBoxWrapper");
-
 var TickBox = function TickBox(_ref) {
   var selected = _ref.selected;
   return /*#__PURE__*/_react.default.createElement(_tickBoxWrapper.TickBoxWrapper, {
@@ -21,5 +16,4 @@ var TickBox = function TickBox(_ref) {
     label: "tick"
   }));
 };
-
 exports.TickBox = TickBox;

package/dist/cjs/card/ui/tickBox/tickBoxWrapper.js

@@ -4,12 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TickBoxWrapper = void 0;
-
 var _react = require("@emotion/react");
-
 var _styles = require("./styles");
-
 /**@jsx jsx */
+
 var TickBoxWrapper = function TickBoxWrapper(props) {
   return (0, _react.jsx)("div", {
     id: "tickBoxWrapper",
@@ -17,5 +15,4 @@ var TickBoxWrapper = function TickBoxWrapper(props) {
     className: _styles.tickBoxClassName
   }, props.children);
 };
-
 exports.TickBoxWrapper = TickBoxWrapper;

package/dist/cjs/card/ui/titleBox/failedTitleBox.js

@@ -1,28 +1,20 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FailedTitleBox = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _reactIntlNext = require("react-intl-next");
-
 var _warning = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/warning"));
-
 var _mediaUi = require("@atlaskit/media-ui");
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _titleBoxComponents = require("./titleBoxComponents");
-
 var FailedTitleBox = function FailedTitleBox(_ref) {
   var breakpoint = _ref.breakpoint,
-      _ref$customMessage = _ref.customMessage,
-      customMessage = _ref$customMessage === void 0 ? _mediaUi.messages.failed_to_load : _ref$customMessage;
+    _ref$customMessage = _ref.customMessage,
+    customMessage = _ref$customMessage === void 0 ? _mediaUi.messages.failed_to_load : _ref$customMessage;
   return /*#__PURE__*/_react.default.createElement(_titleBoxComponents.TitleBoxWrapper, {
     breakpoint: breakpoint
   }, /*#__PURE__*/_react.default.createElement(_titleBoxComponents.ErrorMessageWrapper, null, /*#__PURE__*/_react.default.createElement(_warning.default, {
@@ -31,5 +23,4 @@ var FailedTitleBox = function FailedTitleBox(_ref) {
     primaryColor: "var(--ds-text-danger, ".concat(_colors.R300, ")")
   }), /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, customMessage))));
 };
-
 exports.FailedTitleBox = FailedTitleBox;