@atlaskit/media-card 81.10.11 → 81.10.13

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

@@ -1,75 +1 @@
-import { akEditorSelectedBoxShadow } from '@atlaskit/editor-shared-styles/consts';
-import { getCSSUnitValue } from '../../utils/getCSSUnitValue';
-import { getDefaultCardDimensions } from '../../utils/cardDimensions';
-import { tickBoxClassName, tickboxFixedStyles } from './tickBox/styles';
-import { fixedPlayButtonStyles, playButtonClassName } from './playButton/styles';
-import { Breakpoint, responsiveSettings } from './common';
-const breakpointSizes = [[Breakpoint.SMALL, 599], [Breakpoint.LARGE, Infinity]];
-export const calcBreakpointSize = (wrapperWidth = 0) => {
-  const [breakpoint] = breakpointSizes.find(([_breakpoint, limit]) => wrapperWidth <= limit) || [Breakpoint.SMALL];
-  return breakpoint;
-};
-export const generateResponsiveStyles = (breakpoint = Breakpoint.SMALL) => {
-  const setting = responsiveSettings[breakpoint];
-  return `
-    font-size: ${setting.fontSize}px;
-    line-height: ${setting.lineHeight}px;
-  `;
-};
-export const getWrapperDimensions = (dimensions, appearance) => {
-  const {
-    width,
-    height
-  } = dimensions || {};
-  const {
-    width: defaultWidth,
-    height: defaultHeight
-  } = getDefaultCardDimensions(appearance);
-  return `
-	/* If container doesn't exists, it will fallback to this */
-	width: ${getCSSUnitValue(width || defaultWidth)};
-
-    max-width: 100%;
-    height: ${getCSSUnitValue(height || defaultHeight)};
-    max-height: 100%;
-  `;
-};
-
-// 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
-export const getWrapperShadow = (disableOverlay, selected) => {
-  const withOverlayShadow = !disableOverlay ? `${"var(--ds-shadow-raised, 0px 1px 1px #1E1F2140, 0px 0px 1px #1E1F214f)"}` : '';
-  const selectedShadow = selected ? akEditorSelectedBoxShadow : '';
-  const shadow = [selectedShadow, withOverlayShadow].filter(Boolean).join(', ');
-  return shadow ? `box-shadow: ${shadow};` : '';
-};
-export const getCursorStyle = cursor => !!cursor ? `cursor: ${cursor};` : '';
-export const getClickablePlayButtonStyles = isPlayButtonClickable => {
-  if (!isPlayButtonClickable) {
-    return '';
-  }
-  return `
-    &:hover .${playButtonClassName} {
-      ${fixedPlayButtonStyles}
-    }
-  `;
-};
-export const getSelectableTickBoxStyles = isTickBoxSelectable => {
-  if (!isTickBoxSelectable) {
-    return '';
-  }
-  return `
-    &:hover .${tickBoxClassName} {
-      ${tickboxFixedStyles}
-    }
-  `;
-};
-const defaultTransitionDuration = '.3s';
-export const transition = (propertyName = 'all') => `
-  transition: ${propertyName} ${defaultTransitionDuration};
-`;
-const hexToRgb = hex => {
-  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
-  return result ? `${parseInt(result[1], 16)},${parseInt(result[2], 16)},${parseInt(result[3], 16)}` : null;
-};
-export const rgba = (hex, opacity) => `rgba(${hexToRgb(hex)}, ${opacity})`;
+export const defaultTransitionDuration = '.3s';

package/dist/es2019/card/ui/tickBox/tickBoxWrapper-compiled.js

@@ -1,4 +1,4 @@
-/* tickBoxWrapper-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* tickBoxWrapper-compiled.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./tickBoxWrapper-compiled.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/es2019/card/ui/titleBox/ErrorMessageWrapper.js

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ErrorMessageWrapper as CompiledErrorMessageWrapper } from './titleBoxComponents-compiled';
+export const ErrorMessageWrapper = props => /*#__PURE__*/React.createElement(CompiledErrorMessageWrapper, props);

package/dist/es2019/card/ui/titleBox/TitleBoxFooter.js

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TitleBoxFooter as CompiledTitleBoxFooter } from './titleBoxComponents-compiled';
+export const TitleBoxFooter = props => /*#__PURE__*/React.createElement(CompiledTitleBoxFooter, props);

package/dist/es2019/card/ui/titleBox/TitleBoxHeader.js

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TitleBoxHeader as CompiledTitleBoxHeader } from './titleBoxComponents-compiled';
+export const TitleBoxHeader = props => /*#__PURE__*/React.createElement(CompiledTitleBoxHeader, props);

package/dist/es2019/card/ui/titleBox/TitleBoxIcon.js

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TitleBoxIcon as CompiledTitleBoxIcon } from './titleBoxComponents-compiled';
+export const TitleBoxIcon = props => /*#__PURE__*/React.createElement(CompiledTitleBoxIcon, props);

package/dist/es2019/card/ui/titleBox/TitleBoxWrapper.js

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TitleBoxWrapper as CompiledTitleBoxWrapper } from './titleBoxComponents-compiled';
+export const TitleBoxWrapper = props => /*#__PURE__*/React.createElement(CompiledTitleBoxWrapper, props);

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

@@ -1,11 +1,12 @@
-/* failedTitleBox.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* failedTitleBox.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./failedTitleBox.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
 import EditorWarningIcon from '@atlaskit/icon/core/status-warning';
 import { messages } from '@atlaskit/media-ui/messages';
-import { ErrorMessageWrapper, TitleBoxWrapper } from './titleBoxComponents';
+import { ErrorMessageWrapper } from './ErrorMessageWrapper';
+import { TitleBoxWrapper } from './TitleBoxWrapper';
 const errorMessageWrapperStyles = null;
 export const FailedTitleBox = ({
   breakpoint,

package/dist/es2019/card/ui/titleBox/styles.js

@@ -1,55 +1,7 @@
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
-import { responsiveSettings, getTitleBoxHeight, Breakpoint } from '../common';
-const generateResponsiveStyles = (breakpoint = Breakpoint.SMALL) => {
-  const setting = responsiveSettings[breakpoint];
-  const verticalPadding = setting.titleBox.verticalPadding;
-  const horizontalPadding = setting.titleBox.horizontalPadding;
-  const height = getTitleBoxHeight(breakpoint);
-  return `height: ${height}px;
-    padding: ${verticalPadding}px ${horizontalPadding}px;`;
-};
-export const titleBoxWrapperStyles = ({
-  breakpoint,
-  display = 'flex'
-}) => css({
-  position: 'absolute',
-  bottom: 0,
-  width: '100%',
-  backgroundColor: "var(--ds-surface, #FFFFFF)",
-  color: "var(--ds-text, #292A2E)",
-  cursor: 'inherit',
-  pointerEvents: 'none',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  display,
-  flexDirection: 'column',
-  justifyContent: 'center'
-},
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-generateResponsiveStyles(breakpoint));
-titleBoxWrapperStyles.displayName = 'TitleBoxWrapper';
-const infoStyles = `white-space: nowrap;overflow: hidden;`;
-const iconOverlapStyles = `padding-right: 10px;`;
-export const titleBoxHeaderStyles = ({
-  hasIconOverlap
-}) => css({
-  fontWeight: "var(--ds-font-weight-semibold, 600)"
-},
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-infoStyles,
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-hasIconOverlap && iconOverlapStyles);
-titleBoxHeaderStyles.displayName = 'FailedTitleBoxHeader';
-export const titleBoxFooterStyles = ({
-  hasIconOverlap
-}) => css({
-  textOverflow: 'ellipsis'
-},
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-infoStyles,
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-hasIconOverlap && iconOverlapStyles);
-titleBoxFooterStyles.displayName = 'TitleBoxFooter';
+import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+export const infoStyles = `white-space: nowrap;overflow: hidden;`;
+export const iconOverlapStyles = `padding-right: 10px;`;
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export const titleBoxIconStyles = css({

package/dist/es2019/card/ui/titleBox/titleBox.js

@@ -1,9 +1,12 @@
 import React from 'react';
 import { injectIntl } from 'react-intl';
 import LockFilledIcon from '@atlaskit/icon/core/lock-locked';
-import { Truncate } from '@atlaskit/media-ui/truncateText/truncate';
 import { formatDate } from '@atlaskit/media-ui/formatDate';
-import { TitleBoxWrapper, TitleBoxFooter, TitleBoxHeader, TitleBoxIcon } from './titleBoxComponents';
+import { Truncate } from '@atlaskit/media-ui/truncateText/truncate';
+import { TitleBoxFooter } from './TitleBoxFooter';
+import { TitleBoxHeader } from './TitleBoxHeader';
+import { TitleBoxIcon } from './TitleBoxIcon';
+import { TitleBoxWrapper } from './TitleBoxWrapper';
 const placeholderText = ' ';
 const isValidTimestamp = timeStamp => new Date(timeStamp).getTime() > 0;
 export const TitleBox = injectIntl(({

package/dist/es2019/card/ui/titleBox/titleBoxComponents-compiled.js

@@ -1,8 +1,8 @@
-/* titleBoxComponents-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* titleBoxComponents-compiled.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./titleBoxComponents-compiled.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-import { rgba } from '../styles';
+import { rgba } from '../rgba';
 const smallLineHeight = 14;
 const smallVerticalPadding = 4;
 const smallHorizontalPadding = 8;
@@ -39,6 +39,8 @@ TitleBoxWrapper.displayName = 'TitleBoxWrapper';
 const infoStyles = null;
 const iconOverlapStyle = null;
 const titleBoxHeaderStyles = null;
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports -- Retain shared module-local Compiled styles across title-box components.
 export const TitleBoxHeader = props => {
   const {
     hasIconOverlap
@@ -53,6 +55,8 @@ export const TitleBoxHeader = props => {
 };
 TitleBoxHeader.displayName = 'FailedTitleBoxHeader';
 const titleBoxFooterStyles = null;
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports -- Retain shared module-local Compiled styles across title-box components.
 export const TitleBoxFooter = props => {
   const {
     hasIconOverlap,
@@ -69,6 +73,8 @@ export const TitleBoxFooter = props => {
 };
 TitleBoxFooter.displayName = 'TitleBoxFooter';
 const titleBoxIconStyles = null;
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports -- Retain shared module-local Compiled styles across title-box components.
 export const TitleBoxIcon = props => {
   return /*#__PURE__*/React.createElement("div", {
     id: "titleBoxIcon",
@@ -77,6 +83,8 @@ export const TitleBoxIcon = props => {
   }, props.children);
 };
 const errorMessageWrapperStyles = null;
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports -- Retain shared module-local Compiled styles across title-box components.
 export const ErrorMessageWrapper = props => {
   // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   return /*#__PURE__*/React.createElement("div", {

package/dist/es2019/card/ui/titleBox/titleBoxFooterStyles.js

@@ -0,0 +1,14 @@
+import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+const infoStyles = `white-space: nowrap;overflow: hidden;`;
+const iconOverlapStyles = `padding-right: 10px;`;
+export const titleBoxFooterStyles = ({
+  hasIconOverlap
+}) => css({
+  textOverflow: 'ellipsis'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+infoStyles,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+hasIconOverlap && iconOverlapStyles);
+titleBoxFooterStyles.displayName = 'TitleBoxFooter';

package/dist/es2019/card/ui/titleBox/titleBoxHeaderStyles.js

@@ -0,0 +1,14 @@
+import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+const infoStyles = `white-space: nowrap;overflow: hidden;`;
+const iconOverlapStyles = `padding-right: 10px;`;
+export const titleBoxHeaderStyles = ({
+  hasIconOverlap
+}) => css({
+  fontWeight: "var(--ds-font-weight-semibold, 600)"
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+infoStyles,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+hasIconOverlap && iconOverlapStyles);
+titleBoxHeaderStyles.displayName = 'FailedTitleBoxHeader';

package/dist/es2019/card/ui/titleBox/titleBoxWrapperStyles.js

@@ -0,0 +1,30 @@
+import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+import { responsiveSettings, getTitleBoxHeight, Breakpoint } from '../common';
+const generateResponsiveStyles = (breakpoint = Breakpoint.SMALL) => {
+  const setting = responsiveSettings[breakpoint];
+  const verticalPadding = setting.titleBox.verticalPadding;
+  const horizontalPadding = setting.titleBox.horizontalPadding;
+  const height = getTitleBoxHeight(breakpoint);
+  return `height: ${height}px;
+    padding: ${verticalPadding}px ${horizontalPadding}px;`;
+};
+export const titleBoxWrapperStyles = ({
+  breakpoint,
+  display = 'flex'
+}) => css({
+  position: 'absolute',
+  bottom: 0,
+  width: '100%',
+  backgroundColor: "var(--ds-surface, #FFFFFF)",
+  color: "var(--ds-text, #292A2E)",
+  cursor: 'inherit',
+  pointerEvents: 'none',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  display,
+  flexDirection: 'column',
+  justifyContent: 'center'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+generateResponsiveStyles(breakpoint));
+titleBoxWrapperStyles.displayName = 'TitleBoxWrapper';

package/dist/es2019/card/ui/transition.js

@@ -0,0 +1,4 @@
+import { defaultTransitionDuration } from './styles';
+export const transition = (propertyName = 'all') => `
+  transition: ${propertyName} ${defaultTransitionDuration};
+`;

package/dist/es2019/card/ui/unhandledErrorCard/unhandledErrorCard-compiled.js

@@ -1,10 +1,10 @@
-/* unhandledErrorCard-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* unhandledErrorCard-compiled.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./unhandledErrorCard-compiled.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { Component } from 'react';
 import WarningIcon from '@atlaskit/icon/core/status-warning';
-import { defaultImageCardDimensions } from '../../../utils';
+import { defaultImageCardDimensions } from '../../../utils/cardDimensions';
 import { ContentLoadingErrorMessage } from './contentLoadingErrorMessage';
 const isPercentage = value => /^\d+(\.\d+)?%$/.test(value);
 const shouldShowText = ({

package/dist/es2019/card/ui/wrapper/imageContainer-compiled.js

@@ -1,4 +1,4 @@
-/* imageContainer-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* imageContainer-compiled.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./imageContainer-compiled.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/es2019/card/ui/wrapper/styles.js

@@ -1,11 +1,18 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
-import { borderRadius } from '@atlaskit/media-ui/mixins';
+
+import { css } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 import { hideNativeBrowserTextSelectionStyles } from '@atlaskit/editor-shared-styles/selection';
-import { transition } from '../styles';
-import { fixedBlanketStyles, blanketClassName } from '../blanket/styles';
+import { borderRadius } from '@atlaskit/media-ui/mixins';
 import { fixedActionBarStyles, actionsBarClassName } from '../actionsBar/styles';
-import { generateResponsiveStyles, getClickablePlayButtonStyles, getCursorStyle, getSelectableTickBoxStyles, getWrapperDimensions, getWrapperShadow } from '../styles';
+import { fixedBlanketStyles, blanketClassName } from '../blanket/styles';
+import { generateResponsiveStyles } from '../generateResponsiveStyles';
+import { getClickablePlayButtonStyles } from '../getClickablePlayButtonStyles';
+import { getCursorStyle } from '../getCursorStyle';
+import { getSelectableTickBoxStyles } from '../getSelectableTickBoxStyles';
+import { getWrapperDimensions } from '../getWrapperDimensions';
+import { getWrapperShadow } from '../getWrapperShadow';
+import { transition } from '../transition';
 export const wrapperStyles = ({
   breakpoint,
   dimensions,

package/dist/es2019/card/ui/wrapper/wrapper-compiled.js

@@ -1,4 +1,4 @@
-/* wrapper-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* wrapper-compiled.tsx generated by @compiled/babel-plugin v3.0.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./wrapper-compiled.compiled.css";
 import * as React from 'react';

package/dist/es2019/card/useBreakpoint.js

@@ -1,7 +1,8 @@
 import { useMemo } from 'react';
-import { calcBreakpointSize } from './ui/styles';
-import { getElementDimension, isValidPercentageUnit, defaultImageCardDimensions } from '../utils';
-
+import { defaultImageCardDimensions } from '../utils/cardDimensions';
+import { getElementDimension } from '../utils/getElementDimension';
+import { isValidPercentageUnit } from '../utils/isValidPercentageUnit';
+import { calcBreakpointSize } from './ui/calcBreakpointSize';
 // Hook to calculate the breakpoint based on the width of the element
 export const useBreakpoint = (dimensionWidth = 0, divRef) => {
   const breakpoint = useMemo(() => {

package/dist/es2019/ensureMediaCardError.js

@@ -0,0 +1,15 @@
+import { MediaCardError } from './MediaCardError';
+import { isMediaCardError } from './isMediaCardError';
+
+// In a try/catch statement, the error caught is the type of unknown.
+// We can use this helper to ensure that the error handled is the type of MediaCardError if unsure
+// If updatePrimaryReason is true, if it's a MediaCardError already, it will update it's primary reason
+export const ensureMediaCardError = (primaryReason, error, updatePrimaryReason) => {
+  if (isMediaCardError(error)) {
+    if (updatePrimaryReason && error.primaryReason !== primaryReason) {
+      return new MediaCardError(primaryReason, error.secondaryError);
+    }
+    return error;
+  }
+  return new MediaCardError(primaryReason, error);
+};

package/dist/es2019/errors.js

@@ -1,85 +1,54 @@
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required -- VOLTC-139 tracks removal of these deprecated re-export shims. */
+
 /**
- * Primary reason is logged through Data Portal.
- * Make sure all the values are whitelisted in Measure -> Event Regitry -> "mediaCardRender failed" event
+ * @deprecated Use `import { MediaCardError } from '@atlaskit/media-card/media-card-error'` instead.
  */
-
-export class MediaCardError extends Error {
-  constructor(primaryReason, secondaryError) {
-    super(primaryReason);
-    // https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-2.html#support-for-newtarget
-    this.primaryReason = primaryReason;
-    this.secondaryError = secondaryError;
-    Object.setPrototypeOf(this, new.target.prototype);
-
-    // https://v8.dev/docs/stack-trace-api
-    if ('captureStackTrace' in Error) {
-      Error.captureStackTrace(this, new.target);
-    }
-  }
-}
-export class LocalPreviewError extends MediaCardError {
-  constructor(primaryReason, secondaryError) {
-    super(primaryReason, secondaryError);
-    this.primaryReason = primaryReason;
-    this.secondaryError = secondaryError;
-  }
-}
-export class RemotePreviewError extends MediaCardError {
-  constructor(primaryReason, secondaryError) {
-    super(primaryReason, secondaryError);
-    this.primaryReason = primaryReason;
-    this.secondaryError = secondaryError;
-  }
-}
-export class SsrPreviewError extends MediaCardError {
-  constructor(primaryReason, secondaryError) {
-    super(primaryReason, secondaryError);
-    this.primaryReason = primaryReason;
-    this.secondaryError = secondaryError;
-  }
-}
-export const getImageLoadPrimaryReason = source => {
-  switch (source) {
-    case 'cache-remote':
-      return 'cache-remote-uri';
-    case 'cache-local':
-      return 'cache-local-uri';
-    case 'external':
-      return 'external-uri';
-    case 'local':
-      return 'local-uri';
-    case 'remote':
-      return 'remote-uri';
-    // This fail reason will come from a bug, most likely.
-    default:
-      return `unknown-uri`;
-  }
-};
-export class ImageLoadError extends MediaCardError {
-  constructor(source) {
-    super(getImageLoadPrimaryReason(source));
-  }
-}
-export function isMediaCardError(err) {
-  return err instanceof MediaCardError;
-}
-export const isLocalPreviewError = err => err instanceof LocalPreviewError;
-export const isRemotePreviewError = err => err instanceof RemotePreviewError;
-export const isUnsupportedLocalPreviewError = err => isMediaCardError(err) && err.primaryReason === 'local-preview-unsupported';
-export function isImageLoadError(err) {
-  return err instanceof ImageLoadError;
-}
-
-// In a try/catch statement, the error caught is the type of unknown.
-// We can use this helper to ensure that the error handled is the type of MediaCardError if unsure
-// If updatePrimaryReason is true, if it's a MediaCardError already, it will update it's primary reason
-export const ensureMediaCardError = (primaryReason, error, updatePrimaryReason) => {
-  if (isMediaCardError(error)) {
-    if (updatePrimaryReason && error.primaryReason !== primaryReason) {
-      return new MediaCardError(primaryReason, error.secondaryError);
-    }
-    return error;
-  }
-  return new MediaCardError(primaryReason, error);
-};
-export const isUploadError = error => error && error.primaryReason === 'upload';
+export { MediaCardError } from './MediaCardError';
+/**
+ * @deprecated Use `import { LocalPreviewError } from '@atlaskit/media-card/local-preview-error'` instead.
+ */
+export { LocalPreviewError } from './LocalPreviewError';
+/**
+ * @deprecated Use `import { RemotePreviewError } from '@atlaskit/media-card/remote-preview-error'` instead.
+ */
+export { RemotePreviewError } from './RemotePreviewError';
+/**
+ * @deprecated Use `import { SsrPreviewError } from '@atlaskit/media-card/ssr-preview-error'` instead.
+ */
+export { SsrPreviewError } from './SsrPreviewError';
+/**
+ * @deprecated Use `import { getImageLoadPrimaryReason } from '@atlaskit/media-card/get-image-load-primary-reason'` instead.
+ */
+export { getImageLoadPrimaryReason } from './getImageLoadPrimaryReason';
+/**
+ * @deprecated Use `import { ImageLoadError } from '@atlaskit/media-card/image-load-error'` instead.
+ */
+export { ImageLoadError } from './ImageLoadError';
+/**
+ * @deprecated Use `import { isMediaCardError } from '@atlaskit/media-card/is-media-card-error'` instead.
+ */
+export { isMediaCardError } from './isMediaCardError';
+/**
+ * @deprecated Use `import { isLocalPreviewError } from '@atlaskit/media-card/is-local-preview-error'` instead.
+ */
+export { isLocalPreviewError } from './isLocalPreviewError';
+/**
+ * @deprecated Use `import { isRemotePreviewError } from '@atlaskit/media-card/is-remote-preview-error'` instead.
+ */
+export { isRemotePreviewError } from './isRemotePreviewError';
+/**
+ * @deprecated Use `import { isUnsupportedLocalPreviewError } from '@atlaskit/media-card/is-unsupported-local-preview-error'` instead.
+ */
+export { isUnsupportedLocalPreviewError } from './isUnsupportedLocalPreviewError';
+/**
+ * @deprecated Use `import { isImageLoadError } from '@atlaskit/media-card/is-image-load-error'` instead.
+ */
+export { isImageLoadError } from './isImageLoadError';
+/**
+ * @deprecated Use `import { ensureMediaCardError } from '@atlaskit/media-card/ensure-media-card-error'` instead.
+ */
+export { ensureMediaCardError } from './ensureMediaCardError';
+/**
+ * @deprecated Use `import { isUploadError } from '@atlaskit/media-card/is-upload-error'` instead.
+ */
+export { isUploadError } from './isUploadError';

package/dist/es2019/getImageLoadPrimaryReason.js

@@ -0,0 +1,17 @@
+export const getImageLoadPrimaryReason = source => {
+  switch (source) {
+    case 'cache-remote':
+      return 'cache-remote-uri';
+    case 'cache-local':
+      return 'cache-local-uri';
+    case 'external':
+      return 'external-uri';
+    case 'local':
+      return 'local-uri';
+    case 'remote':
+      return 'remote-uri';
+    // This fail reason will come from a bug, most likely.
+    default:
+      return `unknown-uri`;
+  }
+};

package/dist/es2019/index.js

@@ -2,9 +2,12 @@
  * Entry Point: @atlaskit/media-card
  */
 
-export { Card, CardSync } from './card';
-export { MediaInlineCard, fireFailedMediaInlineEvent, fireSucceededMediaInlineEvent } from './inline';
-export { MediaCardError } from './errors';
+export { default as Card } from './card/cardLoader';
+export { default as CardSync } from './card/cardSync';
+export { default as MediaInlineCard } from './inline/loader';
+export { fireFailedOperationalEvent as fireFailedMediaInlineEvent } from './inline/fireFailedOperationalEvent';
+export { fireSucceededOperationalEvent as fireSucceededMediaInlineEvent } from './inline/fireSucceededOperationalEvent';
+export { MediaCardError } from './MediaCardError';
 export { CardPlaceholder } from './utils/lightCards/cardPlaceholder';
 export { CardLoading } from './utils/lightCards/cardLoading';
 export { CardError } from './utils/lightCards/cardError';

package/dist/es2019/inline/fireFailedOperationalEvent.js

@@ -0,0 +1,10 @@
+import { MediaCardError } from '../MediaCardError';
+import { fireMediaCardEvent } from '../utils/analytics/fireMediaCardEvent';
+import { getErrorStatusPayload } from './getErrorStatusPayload';
+import { getFailedProcessingStatusPayload } from './getFailedProcessingStatusPayload';
+export const fireFailedOperationalEvent = (fileState, error = new MediaCardError('missing-error-data'), failReason, createAnalyticsEvent) => {
+  // Extract processingFailReason from fileState if available
+  const processingFailReason = (fileState === null || fileState === void 0 ? void 0 : fileState.status) === 'failed-processing' ? fileState.failReason : undefined;
+  const payload = failReason ? getFailedProcessingStatusPayload((fileState === null || fileState === void 0 ? void 0 : fileState.id) || 'unknown-id', fileState, processingFailReason) : getErrorStatusPayload((fileState === null || fileState === void 0 ? void 0 : fileState.id) || 'unknown-id', error, fileState);
+  fireMediaCardEvent(payload, createAnalyticsEvent);
+};

package/dist/es2019/inline/fireSucceededOperationalEvent.js

@@ -0,0 +1,6 @@
+import { fireMediaCardEvent } from '../utils/analytics/fireMediaCardEvent';
+import { getSucceededStatusPayload } from './getSucceededStatusPayload';
+export const fireSucceededOperationalEvent = (fileState, createAnalyticsEvent) => {
+  const payload = getSucceededStatusPayload(fileState);
+  fireMediaCardEvent(payload, createAnalyticsEvent);
+};

package/dist/es2019/inline/getErrorStatusPayload.js

@@ -0,0 +1,16 @@
+import { extractErrorInfo } from '../utils/analytics/extractErrorInfo';
+export const getErrorStatusPayload = (fileId, error, fileState) => {
+  return {
+    eventType: 'operational',
+    action: 'failed',
+    actionSubject: 'mediaInlineRender',
+    attributes: {
+      status: 'fail',
+      fileAttributes: {
+        fileId,
+        fileStatus: fileState === null || fileState === void 0 ? void 0 : fileState.status
+      },
+      ...extractErrorInfo(error)
+    }
+  };
+};

package/dist/es2019/inline/getFailedProcessingStatusPayload.js

@@ -0,0 +1,17 @@
+export const getFailedProcessingStatusPayload = (fileId, fileState, processingFailReason) => {
+  return {
+    eventType: 'operational',
+    action: 'failed',
+    actionSubject: 'mediaInlineRender',
+    attributes: {
+      status: 'fail',
+      fileAttributes: {
+        fileId,
+        fileStatus: fileState === null || fileState === void 0 ? void 0 : fileState.status
+      },
+      failReason: 'failed-processing',
+      // 'not-available' is used for cases before processingFailReason implementation (backward compatibility)
+      processingFailReason: processingFailReason || 'not-available'
+    }
+  };
+};