@atlaskit/media-card 77.4.7 → 77.4.9

package/dist/esm/utils/getDataURIDimension.js

@@ -3,6 +3,13 @@ import { getElementDimension } from './getElementDimension';
 import { defaultImageCardDimensions } from './cardDimensions';
 import { isValidPercentageUnit } from './isValidPercentageUnit';
 import { containsPixelUnit } from './containsPixelUnit';
+
+/**
+ * ************************************************
+ * For Card v1
+ * ************************************************
+ */
+
 export var getDataURIDimension = function getDataURIDimension(dimension, options) {
   var retinaFactor = isRetina() ? 2 : 1;
   var dimensionValue = options.dimensions && options.dimensions[dimension] || '';
@@ -24,4 +31,35 @@ export var getRequestedDimensions = function getRequestedDimensions(options) {
     width: width,
     height: height
   };
+};
+
+/**
+ * ************************************************
+ * For Card v2
+ * ************************************************
+ */
+
+// Same as getDataURIDimension but without Retina factor
+export var resolveCardPreviewDimension = function resolveCardPreviewDimension(dimensionName, _ref) {
+  var dimensions = _ref.dimensions,
+    element = _ref.element;
+  var dimensionValue = (dimensions === null || dimensions === void 0 ? void 0 : dimensions[dimensionName]) || '';
+  if (isValidPercentageUnit(dimensionValue) && element) {
+    return getElementDimension(element, dimensionName);
+  }
+  if (typeof dimensionValue === 'number') {
+    return dimensionValue;
+  }
+  if (containsPixelUnit("".concat(dimensionValue))) {
+    return parseInt("".concat(dimensionValue), 10);
+  }
+  return defaultImageCardDimensions[dimensionName];
+};
+export var resolveCardPreviewDimensions = function resolveCardPreviewDimensions(options) {
+  var width = resolveCardPreviewDimension('width', options);
+  var height = resolveCardPreviewDimension('height', options);
+  return {
+    width: width,
+    height: height
+  };
 };

package/dist/esm/utils/lightCards/lightCardWrappers.js

@@ -2,13 +2,10 @@ import _extends from "@babel/runtime/helpers/extends";
 /**@jsx jsx */
 import { jsx } from '@emotion/react';
 import { wrapperStyles } from './styles';
-import { useGlobalTheme } from '@atlaskit/theme/components';
 export var Wrapper = function Wrapper(props) {
-  var theme = useGlobalTheme();
   return jsx("div", _extends({
     css: wrapperStyles({
-      dimensions: props.dimensions,
-      theme: theme
+      dimensions: props.dimensions
     })
   }, props), props.children);
 };

package/dist/esm/utils/lightCards/styles.js

@@ -2,20 +2,8 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 var _templateObject;
 import { css } from '@emotion/react';
 import { center, borderRadius } from '@atlaskit/media-ui';
-import { themed } from '@atlaskit/theme/components';
-import { N20, DN50, N50, DN100 } from '@atlaskit/theme/colors';
+import { N20, N50 } from '@atlaskit/theme/colors';
 export var wrapperStyles = function wrapperStyles(_ref) {
-  var dimensions = _ref.dimensions,
-    theme = _ref.theme;
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n  background: ", ";\n  color: ", ";\n  ", "\n  max-height: 100%;\n  max-width: 100%;\n  width: ", ";\n  height: ", ";\n"])), center, themed({
-    light: "var(--ds-background-neutral, ".concat(N20, ")"),
-    dark: "var(--ds-background-neutral, ".concat(DN50, ")")
-  })({
-    theme: theme
-  }), themed({
-    light: "var(--ds-icon, ".concat(N50, ")"),
-    dark: "var(--ds-icon, ".concat(DN100, ")")
-  })({
-    theme: theme
-  }), borderRadius, dimensions.width, dimensions.height);
+  var dimensions = _ref.dimensions;
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n  background: ", ";\n  color: ", ";\n  ", "\n  max-height: 100%;\n  max-width: 100%;\n  width: ", ";\n  height: ", ";\n"])), center, "var(--ds-background-neutral, ".concat(N20, ")"), "var(--ds-icon, ".concat(N50, ")"), borderRadius, dimensions.width, dimensions.height);
 };

package/dist/esm/utils/ufoExperiences.js

@@ -7,7 +7,7 @@ import { extractErrorInfo, getRenderErrorRequestMetadata } from './analytics';
 import { MediaCardError } from '../errors';
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 var packageName = "@atlaskit/media-card";
-var packageVersion = "77.4.7";
+var packageVersion = "77.4.9";
 var concurrentExperience;
 var getExperience = function getExperience(id) {
   if (!concurrentExperience) {

package/dist/types/card/ui/titleBox/styles.d.ts

@@ -1,6 +1,6 @@
 import { TitleBoxFooterProps, TitleBoxHeaderProps, TitleBoxWrapperProps } from './types';
 export declare const titleBoxWrapperStyles: {
-    ({ breakpoint, titleBoxBgColor, theme, }: TitleBoxWrapperProps): import("@emotion/react").SerializedStyles;
+    ({ breakpoint, titleBoxBgColor, }: TitleBoxWrapperProps): import("@emotion/react").SerializedStyles;
     displayName: string;
 };
 export declare const titleBoxHeaderStyles: {

package/dist/types/card/ui/titleBox/types.d.ts

@@ -2,7 +2,6 @@
 import { MessageDescriptor } from 'react-intl-next';
 import { Breakpoint } from '../common';
 import { TitleBoxIcon as TitleBoxIconType } from '../../../types';
-import { GlobalThemeTokens } from '@atlaskit/theme/components';
 export type TitleBoxProps = {
     name: string;
     breakpoint: Breakpoint;
@@ -17,7 +16,6 @@ export type TitleBoxWrapperProps = {
     breakpoint: Breakpoint;
     titleBoxBgColor?: string;
     children?: JSX.Element | JSX.Element[] | any;
-    theme?: GlobalThemeTokens;
 };
 export type TitleBoxFooterProps = {
     hasIconOverlap: boolean;

package/dist/types/card/ui/wrapper/styles.d.ts

@@ -1,5 +1,5 @@
 import { WrapperProps } from './types';
 export declare const wrapperStyles: {
-    ({ breakpoint, dimensions, appearance, disableOverlay, displayBackground, selected, isPlayButtonClickable, isTickBoxSelectable, shouldDisplayTooltip, mediaCardCursor, theme, }: WrapperProps): import("@emotion/react").SerializedStyles;
+    ({ breakpoint, dimensions, appearance, disableOverlay, displayBackground, selected, isPlayButtonClickable, isTickBoxSelectable, shouldDisplayTooltip, mediaCardCursor, }: WrapperProps): import("@emotion/react").SerializedStyles;
     displayName: string;
 };

package/dist/types/card/ui/wrapper/types.d.ts

@@ -3,7 +3,6 @@ import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { CardDimensions, CardAppearance } from '../../../types';
 import { Breakpoint } from '../common';
 import { MediaCardCursor } from '../../../types';
-import { GlobalThemeTokens } from '@atlaskit/theme/components';
 export interface WrapperProps {
     testId?: string;
     breakpoint: Breakpoint;
@@ -21,5 +20,4 @@ export interface WrapperProps {
     shouldDisplayTooltip: boolean;
     innerRef?: RefObject<HTMLDivElement>;
     children?: JSX.Element;
-    theme?: GlobalThemeTokens;
 }

package/dist/types/card/v2/cardViewV2.d.ts

@@ -2,11 +2,22 @@
 import { jsx } from '@emotion/react';
 import React, { MouseEvent } from 'react';
 import { MessageDescriptor } from 'react-intl-next';
-import { MediaItemType, FileDetails } from '@atlaskit/media-client';
+import { MediaItemType, FileDetails, ImageResizeMode } from '@atlaskit/media-client';
 import { WithAnalyticsEventsProps, UIAnalyticsEvent } from '@atlaskit/analytics-next';
-import { SharedCardProps, CardStatus, CardPreview, MediaCardCursor } from '../../types';
+import { CardStatus, CardPreview, MediaCardCursor, CardDimensions, TitleBoxIcon } from '../../types';
+import { CardAction } from '../actions';
 import { MediaCardError } from '../../errors';
-export interface CardViewV2OwnProps extends SharedCardProps {
+export interface CardViewV2Props {
+    readonly disableOverlay?: boolean;
+    readonly resizeMode?: ImageResizeMode;
+    readonly dimensions: CardDimensions;
+    readonly actions?: Array<CardAction>;
+    readonly selectable?: boolean;
+    readonly selected?: boolean;
+    readonly alt?: string;
+    readonly testId?: string;
+    readonly titleBoxBgColor?: string;
+    readonly titleBoxIcon?: TitleBoxIcon;
     readonly status: CardStatus;
     readonly mediaItemType: MediaItemType;
     readonly mediaCardCursor?: MediaCardCursor;
@@ -25,7 +36,7 @@ export interface CardViewV2OwnProps extends SharedCardProps {
     disableAnimation?: boolean;
     shouldHideTooltip?: boolean;
 }
-export type CardViewV2Props = CardViewV2OwnProps & WithAnalyticsEventsProps;
+export type CardViewV2BaseProps = CardViewV2Props & WithAnalyticsEventsProps;
 export interface RenderConfigByStatusV2 {
     renderTypeIcon?: boolean;
     iconMessage?: JSX.Element;
@@ -40,5 +51,5 @@ export interface RenderConfigByStatusV2 {
     renderTickBox?: boolean;
     customTitleMessage?: MessageDescriptor;
 }
-export declare const CardViewV2Base: ({ innerRef, onImageLoad, onImageError, dimensions, appearance, onClick, onMouseEnter, testId, metadata, status, selected, selectable, cardPreview, mediaCardCursor, shouldHideTooltip, progress, alt, resizeMode, onDisplayImage, nativeLazyLoad, forceSyncDisplay, actions, disableOverlay, titleBoxBgColor, titleBoxIcon, error, disableAnimation, }: CardViewV2Props) => jsx.JSX.Element;
-export declare const CardViewV2: React.ForwardRefExoticComponent<Omit<CardViewV2Props, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;
+export declare const CardViewV2Base: ({ innerRef, onImageLoad, onImageError, dimensions, onClick, onMouseEnter, testId, metadata, status, selected, selectable, cardPreview, mediaCardCursor, shouldHideTooltip, progress, alt, resizeMode, onDisplayImage, nativeLazyLoad, forceSyncDisplay, actions, disableOverlay, titleBoxBgColor, titleBoxIcon, error, disableAnimation, }: CardViewV2BaseProps) => jsx.JSX.Element;
+export declare const CardViewV2: React.ForwardRefExoticComponent<Omit<CardViewV2BaseProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;

package/dist/types/card/v2/fileCard.d.ts

@@ -1,19 +1,53 @@
 /// <reference types="react" />
 import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-import { FileIdentifier, Identifier, MediaClient } from '@atlaskit/media-client';
-import { SSR } from '@atlaskit/media-common';
-import { CardEventProps, SharedCardProps } from '../../types';
-export interface FileCardProps extends SharedCardProps, CardEventProps {
-    readonly mediaClient: MediaClient;
+import { FileIdentifier, Identifier, ImageResizeMode } from '@atlaskit/media-client';
+import { MediaFeatureFlags, NumericalCardDimensions, SSR } from '@atlaskit/media-common';
+import { CardAppearance, CardDimensions, CardEventProps, TitleBoxIcon } from '../../types';
+import { CardAction } from '../actions';
+export interface FileCardProps extends CardEventProps {
+    /** Overlay the media file. */
+    readonly disableOverlay?: boolean;
+    /** Resize the media to 'crop' | 'fit' | 'full-fit' | 'stretchy-fit'. */
+    readonly resizeMode?: ImageResizeMode;
+    readonly featureFlags?: MediaFeatureFlags;
+    /** Sets meida card appearance */
+    readonly appearance?: CardAppearance;
+    /** Custom media card dimension like width and height. */
+    readonly dimensions?: CardDimensions;
+    /** Original media card dimension like width and height. */
+    readonly originalDimensions?: NumericalCardDimensions;
+    /** Array of additional media card actions. */
+    readonly actions?: Array<CardAction>;
+    /** Enable media card selectable. */
+    readonly selectable?: boolean;
+    /** Renders media card as selected, if selected is true. */
+    readonly selected?: boolean;
+    /** Alternate text for an media card. */
+    readonly alt?: string;
+    /** ID for testing the media card. */
+    readonly testId?: string;
+    /** Sets the title box background color. */
+    readonly titleBoxBgColor?: string;
+    /** Sets the title box icon. */
+    readonly titleBoxIcon?: TitleBoxIcon;
+    /** Instance of file identifier. */
     readonly identifier: FileIdentifier;
+    /** Lazy loads the media file. */
     readonly isLazy?: boolean;
+    /** Uses the inline player for media file. */
     readonly useInlinePlayer?: boolean;
+    /** Uses media MediaViewer to preview the media file. */
     readonly shouldOpenMediaViewer?: boolean;
+    /** Media file list to display in Media Viewer. */
     readonly mediaViewerItems?: Identifier[];
+    /** Retrieve auth based on a given context. */
     readonly contextId?: string;
+    /** Enables the download button for media file. */
     readonly shouldEnableDownloadButton?: boolean;
+    /** Server-Side-Rendering modes are "server" and "client" */
     readonly ssr?: SSR;
+    /** Disable tooltip for the card */
     readonly shouldHideTooltip?: boolean;
 }
 export type FileCardBaseProps = FileCardProps & WithAnalyticsEventsProps;
-export declare const FileCard: ({ appearance, resizeMode, isLazy, disableOverlay, featureFlags, identifier, ssr, mediaClient, dimensions, originalDimensions, contextId, alt, actions, shouldEnableDownloadButton, useInlinePlayer, shouldOpenMediaViewer, onFullscreenChange, selectable, selected, testId, titleBoxBgColor, titleBoxIcon, shouldHideTooltip, mediaViewerItems, onClick, onMouseEnter, createAnalyticsEvent, }: FileCardBaseProps) => JSX.Element;
+export declare const FileCard: ({ appearance, resizeMode, isLazy, disableOverlay, featureFlags, identifier, ssr, dimensions, originalDimensions, contextId, alt, actions, shouldEnableDownloadButton, useInlinePlayer, shouldOpenMediaViewer, onFullscreenChange, selectable, selected, testId, titleBoxBgColor, titleBoxIcon, shouldHideTooltip, mediaViewerItems, onClick, onMouseEnter, createAnalyticsEvent, }: FileCardBaseProps) => JSX.Element;

package/dist/types/card/v2/useFilePreview.d.ts

@@ -1,20 +1,16 @@
 /// <reference types="react" />
-import { FileIdentifier, ImageResizeMode, MediaBlobUrlAttrs, MediaClient } from '@atlaskit/media-client';
+import { FileIdentifier, ImageResizeMode, MediaBlobUrlAttrs } from '@atlaskit/media-client';
 import { MediaTraceContext, NumericalCardDimensions, SSR } from '@atlaskit/media-common';
 import { MediaCardError } from '../../errors';
-import { CardDimensions, CardPreview } from '../../types';
+import { CardPreview } from '../../types';
 import { SSRStatus } from '../../utils/analytics';
 export interface UseFilePreviewParams {
     /** Instance of file identifier. */
     readonly identifier: FileIdentifier;
-    /** Instance of MediaClient. */
-    readonly mediaClient: MediaClient;
     /** Resize the media to 'crop' | 'fit' | 'full-fit' | 'stretchy-fit' */
     readonly resizeMode?: ImageResizeMode;
-    /** Custom media card dimension like width and height. */
-    readonly dimensions?: CardDimensions;
-    /** Dimensions to be requested to the server */
-    readonly requestedDimensions: NumericalCardDimensions;
+    /** Dimensions to be requested to the server. Will be scaled x2 in Retina Displays */
+    readonly dimensions?: Partial<NumericalCardDimensions>;
     /** Server-Side-Rendering modes are "server" and "client" */
     readonly ssr?: SSR;
     /** Attributes to attach to the created Blob Url */
@@ -26,7 +22,7 @@ export interface UseFilePreviewParams {
     /** Do not fetch a remote preview. Helpful for lazy loading */
     readonly skipRemote?: boolean;
 }
-export declare const useFilePreview: ({ resizeMode, identifier, ssr, mediaClient, dimensions, requestedDimensions, traceContext, previewDidRender, skipRemote, mediaBlobUrlAttrs, }: UseFilePreviewParams) => {
+export declare const useFilePreview: ({ resizeMode, identifier, ssr, dimensions, traceContext, previewDidRender, skipRemote, mediaBlobUrlAttrs, }: UseFilePreviewParams) => {
     cardPreview: CardPreview | undefined;
     error: MediaCardError | undefined;
     nonCriticalError: MediaCardError | undefined;

package/dist/types/utils/getDataURIDimension.d.ts

@@ -1,9 +1,26 @@
 import { CardDimensions } from '../types';
 import { ElementDimension } from './getElementDimension';
 import { NumericalCardDimensions } from '@atlaskit/media-common';
+/**
+ * ************************************************
+ * For Card v1
+ * ************************************************
+ */
 export type getDataURIDimensionOptions = {
     element?: Element | null;
     dimensions?: CardDimensions;
 };
 export declare const getDataURIDimension: (dimension: ElementDimension, options: getDataURIDimensionOptions) => number;
 export declare const getRequestedDimensions: (options: getDataURIDimensionOptions) => NumericalCardDimensions;
+/**
+ * ************************************************
+ * For Card v2
+ * ************************************************
+ */
+type ResolveCardDimensionOptions = {
+    element?: Element | null;
+    dimensions?: CardDimensions;
+};
+export declare const resolveCardPreviewDimension: (dimensionName: ElementDimension, { dimensions, element }: ResolveCardDimensionOptions) => number;
+export declare const resolveCardPreviewDimensions: (options: ResolveCardDimensionOptions) => NumericalCardDimensions;
+export {};

package/dist/types/utils/globalScope/globalScope.d.ts

@@ -11,5 +11,5 @@ export type MediaGlobalScope = {
 export declare function getMediaGlobalScope(globalScope?: any): MediaGlobalScope;
 export declare function getMediaCardSSR(globalScope?: any): MediaCardSsr;
 export declare const getKey: ({ id, collectionName, occurrenceKey }: FileIdentifier) => string;
-export declare const storeDataURI: (key: string, dataURI?: string, dimensions?: NumericalCardDimensions, error?: MediaCardErrorInfo, globalScope?: any) => void;
-export declare const generateScriptProps: (identifier: FileIdentifier, dataURI?: string, dimensions?: NumericalCardDimensions, error?: MediaCardErrorInfo) => React.ScriptHTMLAttributes<HTMLScriptElement>;
+export declare const storeDataURI: (key: string, dataURI?: string, dimensions?: Partial<NumericalCardDimensions>, error?: MediaCardErrorInfo, globalScope?: any) => void;
+export declare const generateScriptProps: (identifier: FileIdentifier, dataURI?: string, dimensions?: Partial<NumericalCardDimensions>, error?: MediaCardErrorInfo) => React.ScriptHTMLAttributes<HTMLScriptElement>;

package/dist/types/utils/globalScope/types.d.ts

@@ -2,7 +2,7 @@ import { NumericalCardDimensions } from '@atlaskit/media-common';
 import { MediaCardErrorInfo } from '../../utils/analytics';
 export type MediaCardSsrData = {
     dataURI?: string;
-    dimensions?: NumericalCardDimensions;
+    dimensions?: Partial<NumericalCardDimensions>;
     error?: MediaCardErrorInfo;
 };
 export type MediaCardSsr = Record<string, MediaCardSsrData>;

package/dist/types/utils/lightCards/styles.d.ts

@@ -1,2 +1,2 @@
 import { WrapperProps } from './types';
-export declare const wrapperStyles: ({ dimensions, theme }: WrapperProps) => import("@emotion/react").SerializedStyles;
+export declare const wrapperStyles: ({ dimensions }: WrapperProps) => import("@emotion/react").SerializedStyles;

package/dist/types/utils/lightCards/types.d.ts

@@ -1,7 +1,6 @@
 /// <reference types="react" />
 import { CardDimensions } from '../../types';
 import { MediaFeatureFlags } from '@atlaskit/media-common';
-import { GlobalThemeTokens } from '@atlaskit/theme/components';
 export interface StaticCardProps {
     dimensions?: CardDimensions;
     testId?: string;
@@ -11,5 +10,4 @@ export interface WrapperProps {
     dimensions: CardDimensions;
     testId?: string;
     children?: JSX.Element;
-    theme?: GlobalThemeTokens;
 }

package/dist/types-ts4.5/card/ui/titleBox/styles.d.ts

@@ -1,6 +1,6 @@
 import { TitleBoxFooterProps, TitleBoxHeaderProps, TitleBoxWrapperProps } from './types';
 export declare const titleBoxWrapperStyles: {
-    ({ breakpoint, titleBoxBgColor, theme, }: TitleBoxWrapperProps): import("@emotion/react").SerializedStyles;
+    ({ breakpoint, titleBoxBgColor, }: TitleBoxWrapperProps): import("@emotion/react").SerializedStyles;
     displayName: string;
 };
 export declare const titleBoxHeaderStyles: {

package/dist/types-ts4.5/card/ui/titleBox/types.d.ts

@@ -2,7 +2,6 @@
 import { MessageDescriptor } from 'react-intl-next';
 import { Breakpoint } from '../common';
 import { TitleBoxIcon as TitleBoxIconType } from '../../../types';
-import { GlobalThemeTokens } from '@atlaskit/theme/components';
 export type TitleBoxProps = {
     name: string;
     breakpoint: Breakpoint;
@@ -17,7 +16,6 @@ export type TitleBoxWrapperProps = {
     breakpoint: Breakpoint;
     titleBoxBgColor?: string;
     children?: JSX.Element | JSX.Element[] | any;
-    theme?: GlobalThemeTokens;
 };
 export type TitleBoxFooterProps = {
     hasIconOverlap: boolean;

package/dist/types-ts4.5/card/ui/wrapper/styles.d.ts

@@ -1,5 +1,5 @@
 import { WrapperProps } from './types';
 export declare const wrapperStyles: {
-    ({ breakpoint, dimensions, appearance, disableOverlay, displayBackground, selected, isPlayButtonClickable, isTickBoxSelectable, shouldDisplayTooltip, mediaCardCursor, theme, }: WrapperProps): import("@emotion/react").SerializedStyles;
+    ({ breakpoint, dimensions, appearance, disableOverlay, displayBackground, selected, isPlayButtonClickable, isTickBoxSelectable, shouldDisplayTooltip, mediaCardCursor, }: WrapperProps): import("@emotion/react").SerializedStyles;
     displayName: string;
 };

package/dist/types-ts4.5/card/ui/wrapper/types.d.ts

@@ -3,7 +3,6 @@ import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { CardDimensions, CardAppearance } from '../../../types';
 import { Breakpoint } from '../common';
 import { MediaCardCursor } from '../../../types';
-import { GlobalThemeTokens } from '@atlaskit/theme/components';
 export interface WrapperProps {
     testId?: string;
     breakpoint: Breakpoint;
@@ -21,5 +20,4 @@ export interface WrapperProps {
     shouldDisplayTooltip: boolean;
     innerRef?: RefObject<HTMLDivElement>;
     children?: JSX.Element;
-    theme?: GlobalThemeTokens;
 }

package/dist/types-ts4.5/card/v2/cardViewV2.d.ts

@@ -2,11 +2,22 @@
 import { jsx } from '@emotion/react';
 import React, { MouseEvent } from 'react';
 import { MessageDescriptor } from 'react-intl-next';
-import { MediaItemType, FileDetails } from '@atlaskit/media-client';
+import { MediaItemType, FileDetails, ImageResizeMode } from '@atlaskit/media-client';
 import { WithAnalyticsEventsProps, UIAnalyticsEvent } from '@atlaskit/analytics-next';
-import { SharedCardProps, CardStatus, CardPreview, MediaCardCursor } from '../../types';
+import { CardStatus, CardPreview, MediaCardCursor, CardDimensions, TitleBoxIcon } from '../../types';
+import { CardAction } from '../actions';
 import { MediaCardError } from '../../errors';
-export interface CardViewV2OwnProps extends SharedCardProps {
+export interface CardViewV2Props {
+    readonly disableOverlay?: boolean;
+    readonly resizeMode?: ImageResizeMode;
+    readonly dimensions: CardDimensions;
+    readonly actions?: Array<CardAction>;
+    readonly selectable?: boolean;
+    readonly selected?: boolean;
+    readonly alt?: string;
+    readonly testId?: string;
+    readonly titleBoxBgColor?: string;
+    readonly titleBoxIcon?: TitleBoxIcon;
     readonly status: CardStatus;
     readonly mediaItemType: MediaItemType;
     readonly mediaCardCursor?: MediaCardCursor;
@@ -25,7 +36,7 @@ export interface CardViewV2OwnProps extends SharedCardProps {
     disableAnimation?: boolean;
     shouldHideTooltip?: boolean;
 }
-export type CardViewV2Props = CardViewV2OwnProps & WithAnalyticsEventsProps;
+export type CardViewV2BaseProps = CardViewV2Props & WithAnalyticsEventsProps;
 export interface RenderConfigByStatusV2 {
     renderTypeIcon?: boolean;
     iconMessage?: JSX.Element;
@@ -40,5 +51,5 @@ export interface RenderConfigByStatusV2 {
     renderTickBox?: boolean;
     customTitleMessage?: MessageDescriptor;
 }
-export declare const CardViewV2Base: ({ innerRef, onImageLoad, onImageError, dimensions, appearance, onClick, onMouseEnter, testId, metadata, status, selected, selectable, cardPreview, mediaCardCursor, shouldHideTooltip, progress, alt, resizeMode, onDisplayImage, nativeLazyLoad, forceSyncDisplay, actions, disableOverlay, titleBoxBgColor, titleBoxIcon, error, disableAnimation, }: CardViewV2Props) => jsx.JSX.Element;
-export declare const CardViewV2: React.ForwardRefExoticComponent<Omit<CardViewV2Props, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;
+export declare const CardViewV2Base: ({ innerRef, onImageLoad, onImageError, dimensions, onClick, onMouseEnter, testId, metadata, status, selected, selectable, cardPreview, mediaCardCursor, shouldHideTooltip, progress, alt, resizeMode, onDisplayImage, nativeLazyLoad, forceSyncDisplay, actions, disableOverlay, titleBoxBgColor, titleBoxIcon, error, disableAnimation, }: CardViewV2BaseProps) => jsx.JSX.Element;
+export declare const CardViewV2: React.ForwardRefExoticComponent<Omit<CardViewV2BaseProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;

package/dist/types-ts4.5/card/v2/fileCard.d.ts

@@ -1,19 +1,53 @@
 /// <reference types="react" />
 import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-import { FileIdentifier, Identifier, MediaClient } from '@atlaskit/media-client';
-import { SSR } from '@atlaskit/media-common';
-import { CardEventProps, SharedCardProps } from '../../types';
-export interface FileCardProps extends SharedCardProps, CardEventProps {
-    readonly mediaClient: MediaClient;
+import { FileIdentifier, Identifier, ImageResizeMode } from '@atlaskit/media-client';
+import { MediaFeatureFlags, NumericalCardDimensions, SSR } from '@atlaskit/media-common';
+import { CardAppearance, CardDimensions, CardEventProps, TitleBoxIcon } from '../../types';
+import { CardAction } from '../actions';
+export interface FileCardProps extends CardEventProps {
+    /** Overlay the media file. */
+    readonly disableOverlay?: boolean;
+    /** Resize the media to 'crop' | 'fit' | 'full-fit' | 'stretchy-fit'. */
+    readonly resizeMode?: ImageResizeMode;
+    readonly featureFlags?: MediaFeatureFlags;
+    /** Sets meida card appearance */
+    readonly appearance?: CardAppearance;
+    /** Custom media card dimension like width and height. */
+    readonly dimensions?: CardDimensions;
+    /** Original media card dimension like width and height. */
+    readonly originalDimensions?: NumericalCardDimensions;
+    /** Array of additional media card actions. */
+    readonly actions?: Array<CardAction>;
+    /** Enable media card selectable. */
+    readonly selectable?: boolean;
+    /** Renders media card as selected, if selected is true. */
+    readonly selected?: boolean;
+    /** Alternate text for an media card. */
+    readonly alt?: string;
+    /** ID for testing the media card. */
+    readonly testId?: string;
+    /** Sets the title box background color. */
+    readonly titleBoxBgColor?: string;
+    /** Sets the title box icon. */
+    readonly titleBoxIcon?: TitleBoxIcon;
+    /** Instance of file identifier. */
     readonly identifier: FileIdentifier;
+    /** Lazy loads the media file. */
     readonly isLazy?: boolean;
+    /** Uses the inline player for media file. */
     readonly useInlinePlayer?: boolean;
+    /** Uses media MediaViewer to preview the media file. */
     readonly shouldOpenMediaViewer?: boolean;
+    /** Media file list to display in Media Viewer. */
     readonly mediaViewerItems?: Identifier[];
+    /** Retrieve auth based on a given context. */
     readonly contextId?: string;
+    /** Enables the download button for media file. */
     readonly shouldEnableDownloadButton?: boolean;
+    /** Server-Side-Rendering modes are "server" and "client" */
     readonly ssr?: SSR;
+    /** Disable tooltip for the card */
     readonly shouldHideTooltip?: boolean;
 }
 export type FileCardBaseProps = FileCardProps & WithAnalyticsEventsProps;
-export declare const FileCard: ({ appearance, resizeMode, isLazy, disableOverlay, featureFlags, identifier, ssr, mediaClient, dimensions, originalDimensions, contextId, alt, actions, shouldEnableDownloadButton, useInlinePlayer, shouldOpenMediaViewer, onFullscreenChange, selectable, selected, testId, titleBoxBgColor, titleBoxIcon, shouldHideTooltip, mediaViewerItems, onClick, onMouseEnter, createAnalyticsEvent, }: FileCardBaseProps) => JSX.Element;
+export declare const FileCard: ({ appearance, resizeMode, isLazy, disableOverlay, featureFlags, identifier, ssr, dimensions, originalDimensions, contextId, alt, actions, shouldEnableDownloadButton, useInlinePlayer, shouldOpenMediaViewer, onFullscreenChange, selectable, selected, testId, titleBoxBgColor, titleBoxIcon, shouldHideTooltip, mediaViewerItems, onClick, onMouseEnter, createAnalyticsEvent, }: FileCardBaseProps) => JSX.Element;

package/dist/types-ts4.5/card/v2/useFilePreview.d.ts

@@ -1,20 +1,16 @@
 /// <reference types="react" />
-import { FileIdentifier, ImageResizeMode, MediaBlobUrlAttrs, MediaClient } from '@atlaskit/media-client';
+import { FileIdentifier, ImageResizeMode, MediaBlobUrlAttrs } from '@atlaskit/media-client';
 import { MediaTraceContext, NumericalCardDimensions, SSR } from '@atlaskit/media-common';
 import { MediaCardError } from '../../errors';
-import { CardDimensions, CardPreview } from '../../types';
+import { CardPreview } from '../../types';
 import { SSRStatus } from '../../utils/analytics';
 export interface UseFilePreviewParams {
     /** Instance of file identifier. */
     readonly identifier: FileIdentifier;
-    /** Instance of MediaClient. */
-    readonly mediaClient: MediaClient;
     /** Resize the media to 'crop' | 'fit' | 'full-fit' | 'stretchy-fit' */
     readonly resizeMode?: ImageResizeMode;
-    /** Custom media card dimension like width and height. */
-    readonly dimensions?: CardDimensions;
-    /** Dimensions to be requested to the server */
-    readonly requestedDimensions: NumericalCardDimensions;
+    /** Dimensions to be requested to the server. Will be scaled x2 in Retina Displays */
+    readonly dimensions?: Partial<NumericalCardDimensions>;
     /** Server-Side-Rendering modes are "server" and "client" */
     readonly ssr?: SSR;
     /** Attributes to attach to the created Blob Url */
@@ -26,7 +22,7 @@ export interface UseFilePreviewParams {
     /** Do not fetch a remote preview. Helpful for lazy loading */
     readonly skipRemote?: boolean;
 }
-export declare const useFilePreview: ({ resizeMode, identifier, ssr, mediaClient, dimensions, requestedDimensions, traceContext, previewDidRender, skipRemote, mediaBlobUrlAttrs, }: UseFilePreviewParams) => {
+export declare const useFilePreview: ({ resizeMode, identifier, ssr, dimensions, traceContext, previewDidRender, skipRemote, mediaBlobUrlAttrs, }: UseFilePreviewParams) => {
     cardPreview: CardPreview | undefined;
     error: MediaCardError | undefined;
     nonCriticalError: MediaCardError | undefined;

package/dist/types-ts4.5/utils/getDataURIDimension.d.ts

@@ -1,9 +1,26 @@
 import { CardDimensions } from '../types';
 import { ElementDimension } from './getElementDimension';
 import { NumericalCardDimensions } from '@atlaskit/media-common';
+/**
+ * ************************************************
+ * For Card v1
+ * ************************************************
+ */
 export type getDataURIDimensionOptions = {
     element?: Element | null;
     dimensions?: CardDimensions;
 };
 export declare const getDataURIDimension: (dimension: ElementDimension, options: getDataURIDimensionOptions) => number;
 export declare const getRequestedDimensions: (options: getDataURIDimensionOptions) => NumericalCardDimensions;
+/**
+ * ************************************************
+ * For Card v2
+ * ************************************************
+ */
+type ResolveCardDimensionOptions = {
+    element?: Element | null;
+    dimensions?: CardDimensions;
+};
+export declare const resolveCardPreviewDimension: (dimensionName: ElementDimension, { dimensions, element }: ResolveCardDimensionOptions) => number;
+export declare const resolveCardPreviewDimensions: (options: ResolveCardDimensionOptions) => NumericalCardDimensions;
+export {};

package/dist/types-ts4.5/utils/globalScope/globalScope.d.ts

@@ -11,5 +11,5 @@ export type MediaGlobalScope = {
 export declare function getMediaGlobalScope(globalScope?: any): MediaGlobalScope;
 export declare function getMediaCardSSR(globalScope?: any): MediaCardSsr;
 export declare const getKey: ({ id, collectionName, occurrenceKey }: FileIdentifier) => string;
-export declare const storeDataURI: (key: string, dataURI?: string, dimensions?: NumericalCardDimensions, error?: MediaCardErrorInfo, globalScope?: any) => void;
-export declare const generateScriptProps: (identifier: FileIdentifier, dataURI?: string, dimensions?: NumericalCardDimensions, error?: MediaCardErrorInfo) => React.ScriptHTMLAttributes<HTMLScriptElement>;
+export declare const storeDataURI: (key: string, dataURI?: string, dimensions?: Partial<NumericalCardDimensions>, error?: MediaCardErrorInfo, globalScope?: any) => void;
+export declare const generateScriptProps: (identifier: FileIdentifier, dataURI?: string, dimensions?: Partial<NumericalCardDimensions>, error?: MediaCardErrorInfo) => React.ScriptHTMLAttributes<HTMLScriptElement>;

package/dist/types-ts4.5/utils/globalScope/types.d.ts

@@ -2,7 +2,7 @@ import { NumericalCardDimensions } from '@atlaskit/media-common';
 import { MediaCardErrorInfo } from '../../utils/analytics';
 export type MediaCardSsrData = {
     dataURI?: string;
-    dimensions?: NumericalCardDimensions;
+    dimensions?: Partial<NumericalCardDimensions>;
     error?: MediaCardErrorInfo;
 };
 export type MediaCardSsr = Record<string, MediaCardSsrData>;

package/dist/types-ts4.5/utils/lightCards/styles.d.ts

@@ -1,2 +1,2 @@
 import { WrapperProps } from './types';
-export declare const wrapperStyles: ({ dimensions, theme }: WrapperProps) => import("@emotion/react").SerializedStyles;
+export declare const wrapperStyles: ({ dimensions }: WrapperProps) => import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/utils/lightCards/types.d.ts

@@ -1,7 +1,6 @@
 /// <reference types="react" />
 import { CardDimensions } from '../../types';
 import { MediaFeatureFlags } from '@atlaskit/media-common';
-import { GlobalThemeTokens } from '@atlaskit/theme/components';
 export interface StaticCardProps {
     dimensions?: CardDimensions;
     testId?: string;
@@ -11,5 +10,4 @@ export interface WrapperProps {
     dimensions: CardDimensions;
     testId?: string;
     children?: JSX.Element;
-    theme?: GlobalThemeTokens;
 }