@atlaskit/media-card 73.4.1 → 73.5.1

package/dist/esm/root/card/index.js

@@ -34,18 +34,22 @@ import { getFileDetails } from '../../utils/metadata';
 import { InlinePlayer } from '../inlinePlayer';
 import { getFileAttributes, extractErrorInfo } from '../../utils/analytics';
 import { isLocalPreviewError, MediaCardError, ensureMediaCardError, ImageLoadError } from '../../errors';
-import { fireOperationalEvent as _fireOperationalEvent, fireCommencedEvent as _fireCommencedEvent, relevantFeatureFlagNames, fireCopiedEvent, fireScreenEvent } from './cardAnalytics';
+import { fireOperationalEvent as _fireOperationalEvent, fireCommencedEvent as _fireCommencedEvent, getRelevantFeatureFlagNames, fireCopiedEvent, fireScreenEvent } from './cardAnalytics';
 import getDocument from '../../utils/document';
 import { StoreSSRDataScript, getSSRData } from '../../utils/globalScope';
 import { getCardStateFromFileState, createStateUpdater } from './cardState';
 import { getMediaFeatureFlag } from '@atlaskit/media-common';
 import { isBigger } from '../../utils/dimensionComparer';
 import { getMediaCardCursor } from '../../utils/getMediaCardCursor';
+import { completeUfoExperience, startUfoExperience } from '../../utils/ufoExperiences';
+import { generateUniqueId } from '../../utils/generateUniqueId';
 export var CardBase = /*#__PURE__*/function (_Component) {
   _inherits(CardBase, _Component);
 
   var _super = _createSuper(CardBase);
 
+  // An internalOccurrenceKey is a randomly generated value to differentiate various instances
+  // of Cards regardless of whether it shares the same file (either internal or external)
   // We initialise timeElapsedTillCommenced
   // to avoid extra branching on a possibly undefined value.
   function CardBase(props) {
@@ -55,6 +59,8 @@ export var CardBase = /*#__PURE__*/function (_Component) {
 
     _this = _super.call(this, props);
 
+    _defineProperty(_assertThisInitialized(_this), "internalOccurrenceKey", generateUniqueId());
+
     _defineProperty(_assertThisInitialized(_this), "hasBeenMounted", false);
 
     _defineProperty(_assertThisInitialized(_this), "viewportPreAnchorRef", /*#__PURE__*/createRef());
@@ -255,7 +261,7 @@ export var CardBase = /*#__PURE__*/function (_Component) {
         if (isSSRClientPreview(cardPreview)) {
           _this.ssrReliability.client = failedSSRObject;
         }
-        /* 
+        /*
           If the cardPreview failed and it comes from server (global scope / ssrData), it means that we have reused it in client and the error counts for both: server & client.
         */
 
@@ -313,7 +319,7 @@ export var CardBase = /*#__PURE__*/function (_Component) {
             status: 'success'
           };
         }
-        /* 
+        /*
           If the image loads successfully and it comes from server (global scope / ssrData), it means that we have reused it in client and the success counts for both: server & client.
         */
 
@@ -936,6 +942,7 @@ export var CardBase = /*#__PURE__*/function (_Component) {
           error = _this$state7.error;
       var createAnalyticsEvent = this.props.createAnalyticsEvent;
       createAnalyticsEvent && _fireOperationalEvent(createAnalyticsEvent, status, this.fileAttributes, this.getPerformanceAttributes(), this.ssrReliability, error);
+      completeUfoExperience(this.internalOccurrenceKey, status, this.fileAttributes, this.ssrReliability, error);
     }
   }, {
     key: "fireCommencedEvent",
@@ -947,6 +954,7 @@ export var CardBase = /*#__PURE__*/function (_Component) {
           durationSincePageStart: this.timeElapsedTillCommenced
         }
       });
+      startUfoExperience(this.internalOccurrenceKey);
     }
   }, {
     key: "actions",
@@ -1007,7 +1015,7 @@ export var Card = withMediaAnalyticsContext({
   componentName: 'mediaCard',
   component: 'mediaCard'
 }, {
-  filterFeatureFlags: relevantFeatureFlagNames
+  filterFeatureFlags: getRelevantFeatureFlagNames()
 })(withAnalyticsEvents()(injectIntl(CardBase, {
   enforceContext: false
 })));

package/dist/esm/utils/generateUniqueId.js

@@ -0,0 +1,3 @@
+export var generateUniqueId = function generateUniqueId() {
+  return (performance.now().toString(36) + Math.random().toString(36)).replace(/\./g, '');
+};

package/dist/esm/utils/ufoExperiences.js

@@ -0,0 +1,74 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import { ConcurrentExperience, ExperiencePerformanceTypes, ExperienceTypes } from '@atlaskit/ufo';
+import { name as packageName, version as packageVersion } from '../version.json';
+import { extractErrorInfo, getRenderErrorRequestMetadata } from './analytics';
+var concurrentExperience;
+
+var getExperience = function getExperience(id) {
+  if (!concurrentExperience) {
+    var inlineExperience = {
+      platform: {
+        component: 'media-card'
+      },
+      type: ExperienceTypes.Experience,
+      performanceType: ExperiencePerformanceTypes.InlineResult
+    };
+    concurrentExperience = new ConcurrentExperience('media-card-render', inlineExperience);
+  }
+
+  return concurrentExperience.getInstance(id);
+};
+
+export var startUfoExperience = function startUfoExperience(id) {
+  getExperience(id).start();
+};
+export var completeUfoExperience = function completeUfoExperience(id, status, fileAttributes, ssrReliability, error) {
+  switch (status) {
+    case 'complete':
+      succeedUfoExperience(id, {
+        fileAttributes: fileAttributes,
+        ssrReliability: ssrReliability
+      });
+      break;
+
+    case 'failed-processing':
+      failUfoExperience(id, {
+        fileAttributes: fileAttributes,
+        failReason: 'failed-processing',
+        ssrReliability: ssrReliability
+      });
+      break;
+
+    case 'error':
+      error && failUfoExperience(id, _objectSpread(_objectSpread({
+        fileAttributes: fileAttributes
+      }, extractErrorInfo(error)), {}, {
+        request: getRenderErrorRequestMetadata(error),
+        ssrReliability: ssrReliability
+      }));
+      break;
+  }
+};
+
+var succeedUfoExperience = function succeedUfoExperience(id, properties) {
+  getExperience(id).success({
+    metadata: _objectSpread(_objectSpread({}, properties), {}, {
+      packageName: packageName,
+      packageVersion: packageVersion
+    })
+  });
+};
+
+var failUfoExperience = function failUfoExperience(id, properties) {
+  getExperience(id).failure({
+    metadata: _objectSpread(_objectSpread({}, properties), {}, {
+      packageName: packageName,
+      packageVersion: packageVersion
+    })
+  });
+};

package/dist/esm/utils/viewportDetector.js

@@ -21,7 +21,7 @@ export var ViewportAnchor = /*#__PURE__*/forwardRef(function (props, ref) {
     ref: ref,
     className: "media-card-viewport-anchor",
     style: {
-      position: 'relative',
+      position: 'absolute',
       top: "".concat(props.offsetTop, "px"),
       maxHeight: 0,
       pointerEvents: 'none'

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/media-card",
-	"version": "73.4.1",
+	"version": "73.5.1",
 	"sideEffects": false
 }

package/dist/types/classnames.d.ts

@@ -0,0 +1 @@
+export { fileCardImageViewSelector, fileCardImageViewSelectedSelector, } from './files/cardImageView/classnames';

package/dist/types/errors.d.ts

@@ -24,7 +24,7 @@ export declare class SsrPreviewError extends MediaCardError {
     readonly secondaryError?: Error | undefined;
     constructor(primaryReason: SsrPreviewPrimaryReason, secondaryError?: Error | undefined);
 }
-export declare const getImageLoadPrimaryReason: (source?: "local" | "remote" | "ssr-server" | "ssr-client" | "ssr-data" | "cache-local" | "cache-remote" | "cache-ssr-client" | "cache-ssr-server" | "external" | undefined) => ImageLoadPrimaryReason;
+export declare const getImageLoadPrimaryReason: (source?: import("./types").CardPreviewSource | undefined) => ImageLoadPrimaryReason;
 export declare class ImageLoadError extends MediaCardError {
     constructor(source?: CardPreview['source']);
 }

package/dist/types/files/cardImageView/cardOverlay/styled.d.ts

@@ -11,13 +11,13 @@ export interface OverlayProps {
 }
 export declare const TickBox: ComponentClass<HTMLAttributes<{}> & OverlayProps>;
 export declare const Overlay: ComponentClass<HTMLAttributes<{}> & OverlayProps>;
-export declare const ErrorLine: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const LeftColumn: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const TopRow: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const BottomRow: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const RightColumn: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const ErrorMessage: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const AltWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const TitleWrapper: import("styled-components").StyledComponentClass<(import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & import("@atlaskit/theme").AtlaskitThemeProps) | (import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & import("@atlaskit/theme").CustomThemeProps) | (import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & import("@atlaskit/theme").NoThemeProps), any, (import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & import("@atlaskit/theme").AtlaskitThemeProps) | (import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & import("@atlaskit/theme").CustomThemeProps) | (import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & import("@atlaskit/theme").NoThemeProps)>;
-export declare const Subtitle: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const Metadata: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
+export declare const ErrorLine: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>>;
+export declare const LeftColumn: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>>;
+export declare const TopRow: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>>;
+export declare const BottomRow: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>>;
+export declare const RightColumn: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>>;
+export declare const ErrorMessage: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>>;
+export declare const AltWrapper: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>>;
+export declare const TitleWrapper: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & (import("@atlaskit/theme").ThemeProps | undefined), any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & (import("@atlaskit/theme").ThemeProps | undefined)>;
+export declare const Subtitle: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>>;
+export declare const Metadata: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>>;

package/dist/types/files/cardImageView/classnames.d.ts

@@ -0,0 +1,2 @@
+export declare const fileCardImageViewSelector = "media-file-card-view";
+export declare const fileCardImageViewSelectedSelector = "media-file-card-view-selected";

package/dist/types/files/cardImageView/index.d.ts

@@ -26,8 +26,6 @@ export interface FileCardImageViewProps {
     readonly onImageLoad?: (cardPreview: CardPreview) => void;
     readonly cardPreview: CardPreview;
 }
-export declare const fileCardImageViewSelector = "media-file-card-view";
-export declare const fileCardImageViewSelectedSelector = "media-file-card-view-selected";
 export declare class FileCardImageView extends Component<FileCardImageViewProps> {
     private wasThumbnailDisplayed;
     static defaultProps: Partial<FileCardImageViewProps>;

package/dist/types/files/cardImageView/styled.d.ts

@@ -6,14 +6,271 @@ export interface WrapperProps {
     hasOnClick?: boolean;
     mediaType?: string;
 }
-export declare const Wrapper: import("styled-components").StyledComponentClass<import("react").HTMLAttributes<{}> & WrapperProps, any, Pick<import("react").HTMLAttributes<{}>, "style" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "inputMode" | "is" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css"> & {
+export declare const Wrapper: import("styled-components").StyledComponentClass<import("react").HTMLAttributes<{}> & WrapperProps, any, {
+    style?: import("react").CSSProperties | undefined;
+    title?: string | undefined;
+    defaultChecked?: boolean | undefined;
+    defaultValue?: string | string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined;
+    suppressHydrationWarning?: boolean | undefined;
+    accessKey?: string | undefined;
+    className?: string | undefined;
+    contentEditable?: boolean | undefined;
+    contextMenu?: string | undefined;
+    dir?: string | undefined;
+    draggable?: boolean | undefined;
+    hidden?: boolean | undefined;
+    id?: string | undefined;
+    lang?: string | undefined;
+    placeholder?: string | undefined;
+    slot?: string | undefined;
+    spellCheck?: boolean | undefined;
+    tabIndex?: number | undefined;
+    inputMode?: string | undefined;
+    is?: string | undefined;
+    radioGroup?: string | undefined;
+    role?: string | undefined;
+    about?: string | undefined;
+    datatype?: string | undefined;
+    inlist?: any;
+    prefix?: string | undefined;
+    property?: string | undefined;
+    resource?: string | undefined;
+    typeof?: string | undefined;
+    vocab?: string | undefined;
+    autoCapitalize?: string | undefined;
+    autoCorrect?: string | undefined;
+    autoSave?: string | undefined;
+    color?: string | undefined;
+    itemProp?: string | undefined;
+    itemScope?: boolean | undefined;
+    itemType?: string | undefined;
+    itemID?: string | undefined;
+    itemRef?: string | undefined;
+    results?: number | undefined;
+    security?: string | undefined;
+    unselectable?: "on" | "off" | undefined;
+    'aria-activedescendant'?: string | undefined;
+    'aria-atomic'?: boolean | "false" | "true" | undefined;
+    'aria-autocomplete'?: "none" | "inline" | "list" | "both" | undefined;
+    'aria-busy'?: boolean | "false" | "true" | undefined;
+    'aria-checked'?: boolean | "false" | "true" | "mixed" | undefined;
+    'aria-colcount'?: number | undefined;
+    'aria-colindex'?: number | undefined;
+    'aria-colspan'?: number | undefined;
+    'aria-controls'?: string | undefined;
+    'aria-current'?: boolean | "time" | "false" | "true" | "page" | "step" | "location" | "date" | undefined;
+    'aria-describedby'?: string | undefined;
+    'aria-details'?: string | undefined;
+    'aria-disabled'?: boolean | "false" | "true" | undefined;
+    'aria-dropeffect'?: "copy" | "link" | "move" | "none" | "execute" | "popup" | undefined;
+    'aria-errormessage'?: string | undefined;
+    'aria-expanded'?: boolean | "false" | "true" | undefined;
+    'aria-flowto'?: string | undefined;
+    'aria-grabbed'?: boolean | "false" | "true" | undefined;
+    'aria-haspopup'?: boolean | "dialog" | "menu" | "false" | "true" | "listbox" | "tree" | "grid" | undefined;
+    'aria-hidden'?: boolean | "false" | "true" | undefined;
+    'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+    'aria-keyshortcuts'?: string | undefined;
+    'aria-label'?: string | undefined;
+    'aria-labelledby'?: string | undefined;
+    'aria-level'?: number | undefined;
+    'aria-live'?: "off" | "assertive" | "polite" | undefined;
+    'aria-modal'?: boolean | "false" | "true" | undefined;
+    'aria-multiline'?: boolean | "false" | "true" | undefined;
+    'aria-multiselectable'?: boolean | "false" | "true" | undefined;
+    'aria-orientation'?: "horizontal" | "vertical" | undefined;
+    'aria-owns'?: string | undefined;
+    'aria-placeholder'?: string | undefined;
+    'aria-posinset'?: number | undefined;
+    'aria-pressed'?: boolean | "false" | "true" | "mixed" | undefined;
+    'aria-readonly'?: boolean | "false" | "true" | undefined;
+    'aria-relevant'?: "text" | "all" | "additions" | "additions text" | "removals" | undefined;
+    'aria-required'?: boolean | "false" | "true" | undefined;
+    'aria-roledescription'?: string | undefined;
+    'aria-rowcount'?: number | undefined;
+    'aria-rowindex'?: number | undefined;
+    'aria-rowspan'?: number | undefined;
+    'aria-selected'?: boolean | "false" | "true" | undefined;
+    'aria-setsize'?: number | undefined;
+    'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined;
+    'aria-valuemax'?: number | undefined;
+    'aria-valuemin'?: number | undefined;
+    'aria-valuenow'?: number | undefined;
+    'aria-valuetext'?: string | undefined;
+    children?: import("react").ReactNode;
+    dangerouslySetInnerHTML?: {
+        __html: string;
+    } | undefined;
+    onCopy?: import("react").ClipboardEventHandler<{}> | undefined;
+    onCopyCapture?: import("react").ClipboardEventHandler<{}> | undefined;
+    onCut?: import("react").ClipboardEventHandler<{}> | undefined;
+    onCutCapture?: import("react").ClipboardEventHandler<{}> | undefined;
+    onPaste?: import("react").ClipboardEventHandler<{}> | undefined;
+    onPasteCapture?: import("react").ClipboardEventHandler<{}> | undefined;
+    onCompositionEnd?: import("react").CompositionEventHandler<{}> | undefined;
+    onCompositionEndCapture?: import("react").CompositionEventHandler<{}> | undefined;
+    onCompositionStart?: import("react").CompositionEventHandler<{}> | undefined;
+    onCompositionStartCapture?: import("react").CompositionEventHandler<{}> | undefined;
+    onCompositionUpdate?: import("react").CompositionEventHandler<{}> | undefined;
+    onCompositionUpdateCapture?: import("react").CompositionEventHandler<{}> | undefined;
+    onFocus?: import("react").FocusEventHandler<{}> | undefined;
+    onFocusCapture?: import("react").FocusEventHandler<{}> | undefined;
+    onBlur?: import("react").FocusEventHandler<{}> | undefined;
+    onBlurCapture?: import("react").FocusEventHandler<{}> | undefined;
+    onChange?: import("react").FormEventHandler<{}> | undefined;
+    onChangeCapture?: import("react").FormEventHandler<{}> | undefined;
+    onBeforeInput?: import("react").FormEventHandler<{}> | undefined;
+    onBeforeInputCapture?: import("react").FormEventHandler<{}> | undefined;
+    onInput?: import("react").FormEventHandler<{}> | undefined;
+    onInputCapture?: import("react").FormEventHandler<{}> | undefined;
+    onReset?: import("react").FormEventHandler<{}> | undefined;
+    onResetCapture?: import("react").FormEventHandler<{}> | undefined;
+    onSubmit?: import("react").FormEventHandler<{}> | undefined;
+    onSubmitCapture?: import("react").FormEventHandler<{}> | undefined;
+    onInvalid?: import("react").FormEventHandler<{}> | undefined;
+    onInvalidCapture?: import("react").FormEventHandler<{}> | undefined;
+    onLoad?: import("react").ReactEventHandler<{}> | undefined;
+    onLoadCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onError?: import("react").ReactEventHandler<{}> | undefined;
+    onErrorCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onKeyDown?: import("react").KeyboardEventHandler<{}> | undefined;
+    onKeyDownCapture?: import("react").KeyboardEventHandler<{}> | undefined;
+    onKeyPress?: import("react").KeyboardEventHandler<{}> | undefined;
+    onKeyPressCapture?: import("react").KeyboardEventHandler<{}> | undefined;
+    onKeyUp?: import("react").KeyboardEventHandler<{}> | undefined;
+    onKeyUpCapture?: import("react").KeyboardEventHandler<{}> | undefined;
+    onAbort?: import("react").ReactEventHandler<{}> | undefined;
+    onAbortCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onCanPlay?: import("react").ReactEventHandler<{}> | undefined;
+    onCanPlayCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onCanPlayThrough?: import("react").ReactEventHandler<{}> | undefined;
+    onCanPlayThroughCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onDurationChange?: import("react").ReactEventHandler<{}> | undefined;
+    onDurationChangeCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onEmptied?: import("react").ReactEventHandler<{}> | undefined;
+    onEmptiedCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onEncrypted?: import("react").ReactEventHandler<{}> | undefined;
+    onEncryptedCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onEnded?: import("react").ReactEventHandler<{}> | undefined;
+    onEndedCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onLoadedData?: import("react").ReactEventHandler<{}> | undefined;
+    onLoadedDataCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onLoadedMetadata?: import("react").ReactEventHandler<{}> | undefined;
+    onLoadedMetadataCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onLoadStart?: import("react").ReactEventHandler<{}> | undefined;
+    onLoadStartCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onPause?: import("react").ReactEventHandler<{}> | undefined;
+    onPauseCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onPlay?: import("react").ReactEventHandler<{}> | undefined;
+    onPlayCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onPlaying?: import("react").ReactEventHandler<{}> | undefined;
+    onPlayingCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onProgress?: import("react").ReactEventHandler<{}> | undefined;
+    onProgressCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onRateChange?: import("react").ReactEventHandler<{}> | undefined;
+    onRateChangeCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onSeeked?: import("react").ReactEventHandler<{}> | undefined;
+    onSeekedCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onSeeking?: import("react").ReactEventHandler<{}> | undefined;
+    onSeekingCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onStalled?: import("react").ReactEventHandler<{}> | undefined;
+    onStalledCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onSuspend?: import("react").ReactEventHandler<{}> | undefined;
+    onSuspendCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onTimeUpdate?: import("react").ReactEventHandler<{}> | undefined;
+    onTimeUpdateCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onVolumeChange?: import("react").ReactEventHandler<{}> | undefined;
+    onVolumeChangeCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onWaiting?: import("react").ReactEventHandler<{}> | undefined;
+    onWaitingCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onAuxClick?: import("react").MouseEventHandler<{}> | undefined;
+    onAuxClickCapture?: import("react").MouseEventHandler<{}> | undefined;
+    onClick?: import("react").MouseEventHandler<{}> | undefined;
+    onClickCapture?: import("react").MouseEventHandler<{}> | undefined;
+    onContextMenu?: import("react").MouseEventHandler<{}> | undefined;
+    onContextMenuCapture?: import("react").MouseEventHandler<{}> | undefined;
+    onDoubleClick?: import("react").MouseEventHandler<{}> | undefined;
+    onDoubleClickCapture?: import("react").MouseEventHandler<{}> | undefined;
+    onDrag?: import("react").DragEventHandler<{}> | undefined;
+    onDragCapture?: import("react").DragEventHandler<{}> | undefined;
+    onDragEnd?: import("react").DragEventHandler<{}> | undefined;
+    onDragEndCapture?: import("react").DragEventHandler<{}> | undefined;
+    onDragEnter?: import("react").DragEventHandler<{}> | undefined;
+    onDragEnterCapture?: import("react").DragEventHandler<{}> | undefined;
+    onDragExit?: import("react").DragEventHandler<{}> | undefined;
+    onDragExitCapture?: import("react").DragEventHandler<{}> | undefined;
+    onDragLeave?: import("react").DragEventHandler<{}> | undefined;
+    onDragLeaveCapture?: import("react").DragEventHandler<{}> | undefined;
+    onDragOver?: import("react").DragEventHandler<{}> | undefined;
+    onDragOverCapture?: import("react").DragEventHandler<{}> | undefined;
+    onDragStart?: import("react").DragEventHandler<{}> | undefined;
+    onDragStartCapture?: import("react").DragEventHandler<{}> | undefined;
+    onDrop?: import("react").DragEventHandler<{}> | undefined;
+    onDropCapture?: import("react").DragEventHandler<{}> | undefined;
+    onMouseDown?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseDownCapture?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseEnter?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseLeave?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseMove?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseMoveCapture?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseOut?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseOutCapture?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseOver?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseOverCapture?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseUp?: import("react").MouseEventHandler<{}> | undefined;
+    onMouseUpCapture?: import("react").MouseEventHandler<{}> | undefined;
+    onSelect?: import("react").ReactEventHandler<{}> | undefined;
+    onSelectCapture?: import("react").ReactEventHandler<{}> | undefined;
+    onTouchCancel?: import("react").TouchEventHandler<{}> | undefined;
+    onTouchCancelCapture?: import("react").TouchEventHandler<{}> | undefined;
+    onTouchEnd?: import("react").TouchEventHandler<{}> | undefined;
+    onTouchEndCapture?: import("react").TouchEventHandler<{}> | undefined;
+    onTouchMove?: import("react").TouchEventHandler<{}> | undefined;
+    onTouchMoveCapture?: import("react").TouchEventHandler<{}> | undefined;
+    onTouchStart?: import("react").TouchEventHandler<{}> | undefined;
+    onTouchStartCapture?: import("react").TouchEventHandler<{}> | undefined;
+    onPointerDown?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerDownCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerMove?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerMoveCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerUp?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerUpCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerCancel?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerCancelCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerEnter?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerEnterCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerLeave?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerLeaveCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerOver?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerOverCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerOut?: import("react").PointerEventHandler<{}> | undefined;
+    onPointerOutCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onGotPointerCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onGotPointerCaptureCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onLostPointerCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onLostPointerCaptureCapture?: import("react").PointerEventHandler<{}> | undefined;
+    onScroll?: import("react").UIEventHandler<{}> | undefined;
+    onScrollCapture?: import("react").UIEventHandler<{}> | undefined;
+    onWheel?: import("react").WheelEventHandler<{}> | undefined;
+    onWheelCapture?: import("react").WheelEventHandler<{}> | undefined;
+    onAnimationStart?: import("react").AnimationEventHandler<{}> | undefined;
+    onAnimationStartCapture?: import("react").AnimationEventHandler<{}> | undefined;
+    onAnimationEnd?: import("react").AnimationEventHandler<{}> | undefined;
+    onAnimationEndCapture?: import("react").AnimationEventHandler<{}> | undefined;
+    onAnimationIteration?: import("react").AnimationEventHandler<{}> | undefined;
+    onAnimationIterationCapture?: import("react").AnimationEventHandler<{}> | undefined;
+    onTransitionEnd?: import("react").TransitionEventHandler<{}> | undefined;
+    onTransitionEndCapture?: import("react").TransitionEventHandler<{}> | undefined;
+    css?: import("@emotion/core").InterpolationWithTheme<any>;
+} & {
     theme?: any;
 } & WrapperProps>;
-export declare const PlayIconWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const PlayIconBackground: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const ProgressBarWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const Overlay: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const Title: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const Body: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const ProgressWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
-export declare const CardActionsWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
+export declare const PlayIconWrapper: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const PlayIconBackground: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const ProgressBarWrapper: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const Overlay: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const Title: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const Body: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const ProgressWrapper: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;
+export declare const CardActionsWrapper: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>>;

package/dist/types/index.d.ts

@@ -67,6 +67,6 @@ export interface CardState {
 export { CardLoading } from './utils/lightCards/cardLoading';
 export { CardError } from './utils/lightCards/cardError';
 export { defaultImageCardDimensions } from './utils/cardDimensions';
-export { fileCardImageViewSelector, fileCardImageViewSelectedSelector, } from './files/cardImageView';
+export { fileCardImageViewSelector, fileCardImageViewSelectedSelector, } from './files/cardImageView/classnames';
 export { inlinePlayerClassName } from './root/inlinePlayer';
 export { newFileExperienceClassName } from './root/card/cardConstants';

package/dist/types/root/card/cardAnalytics.d.ts

@@ -1,9 +1,9 @@
-import { FileAttributes, MediaFeatureFlags, PerformanceAttributes } from '@atlaskit/media-common';
+import { FileAttributes, PerformanceAttributes } from '@atlaskit/media-common';
 import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { SSRStatus } from '../../utils/analytics';
 import { CardStatus } from '../..';
 import { MediaCardError } from './../../errors';
-export declare const relevantFeatureFlagNames: Array<keyof MediaFeatureFlags>;
+export declare const getRelevantFeatureFlagNames: () => (keyof import("@atlaskit/media-common").MediaFeatureFlags)[];
 export declare const fireOperationalEvent: (createAnalyticsEvent: CreateUIAnalyticsEvent, status: CardStatus, fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes, ssrReliability: SSRStatus, error?: MediaCardError | undefined) => void;
 export declare const fireCommencedEvent: (createAnalyticsEvent: CreateUIAnalyticsEvent, fileAttributes: FileAttributes, performanceAttributes: PerformanceAttributes) => void;
 export declare const fireCopiedEvent: (createAnalyticsEvent: CreateUIAnalyticsEvent, fileId: string, cardRef: HTMLDivElement) => void;

package/dist/types/root/card/getCardPreview/helpers.d.ts

@@ -1,9 +1,9 @@
-import { MediaClient, FilePreview, MediaStoreGetFileImageParams } from '@atlaskit/media-client';
+import { MediaClient, FilePreview, MediaStoreGetFileImageParams, MediaType } from '@atlaskit/media-client';
 import { CardPreview } from '../../../types';
 /**
  * This method tells the support for the media
  * types covered in getCardPreviewFromFilePreview
  */
-export declare const isSupportedLocalPreview: (mediaType?: "audio" | "video" | "image" | "doc" | "archive" | "unknown" | undefined) => boolean;
+export declare const isSupportedLocalPreview: (mediaType?: MediaType | undefined) => boolean;
 export declare const getCardPreviewFromFilePreview: (filePreview: FilePreview | Promise<FilePreview>) => Promise<CardPreview>;
 export declare const getCardPreviewFromBackend: (mediaClient: MediaClient, id: string, params: MediaStoreGetFileImageParams) => Promise<CardPreview>;

package/dist/types/root/card/index.d.ts

@@ -5,6 +5,7 @@ import { WrappedComponentProps } from 'react-intl-next';
 import { CardAction, CardProps, CardState } from '../..';
 export declare type CardBaseProps = CardProps & WithAnalyticsEventsProps & Partial<WrappedComponentProps>;
 export declare class CardBase extends Component<CardBaseProps, CardState> {
+    private internalOccurrenceKey;
     private hasBeenMounted;
     private viewportPreAnchorRef;
     private viewportPostAnchorRef;

package/dist/types/root/cardView.d.ts

@@ -75,4 +75,4 @@ export declare class CardViewBase extends React.Component<CardViewProps, CardVie
     private getRenderConfigByStatus;
     private renderNewExperienceCard;
 }
-export declare const CardView: React.ForwardRefExoticComponent<Pick<Pick<CardViewProps, "progress" | "metadata" | "onClick" | "onMouseEnter" | "innerRef" | "testId" | "appearance" | "error" | "actions" | "selectable" | "selected" | "alt" | "disableOverlay" | "dimensions" | "featureFlags" | "status" | "mediaItemType" | "resizeMode" | "onDisplayImage" | "onImageError" | "onImageLoad" | "cardPreview" | "forceSyncDisplay" | "mediaCardCursor" | "nativeLazyLoad" | "titleBoxBgColor" | "titleBoxIcon" | "disableAnimation" | "originalDimensions">, never> & Partial<Pick<Pick<CardViewProps, "progress" | "metadata" | "onClick" | "onMouseEnter" | "innerRef" | "testId" | "appearance" | "error" | "actions" | "selectable" | "selected" | "alt" | "disableOverlay" | "dimensions" | "featureFlags" | "status" | "mediaItemType" | "resizeMode" | "onDisplayImage" | "onImageError" | "onImageLoad" | "cardPreview" | "forceSyncDisplay" | "mediaCardCursor" | "nativeLazyLoad" | "titleBoxBgColor" | "titleBoxIcon" | "disableAnimation" | "originalDimensions">, "progress" | "metadata" | "onClick" | "onMouseEnter" | "innerRef" | "testId" | "appearance" | "error" | "actions" | "selectable" | "selected" | "alt" | "disableOverlay" | "dimensions" | "featureFlags" | "status" | "mediaItemType" | "resizeMode" | "onDisplayImage" | "onImageError" | "onImageLoad" | "cardPreview" | "forceSyncDisplay" | "mediaCardCursor" | "nativeLazyLoad" | "titleBoxBgColor" | "titleBoxIcon" | "disableAnimation" | "originalDimensions">> & Partial<Pick<Partial<CardViewOwnProps>, never>> & React.RefAttributes<any>>;
+export declare const CardView: React.ForwardRefExoticComponent<Pick<Omit<CardViewProps, keyof WithAnalyticsEventsProps>, never> & Partial<Pick<Omit<CardViewProps, keyof WithAnalyticsEventsProps>, keyof CardViewOwnProps>> & Partial<Pick<Partial<CardViewOwnProps>, never>> & React.RefAttributes<any>>;

package/dist/types/root/inlinePlayer.d.ts

@@ -48,4 +48,4 @@ export declare class InlinePlayerBase extends Component<InlinePlayerProps, Inlin
     saveElementWidth: () => void;
     render(): JSX.Element;
 }
-export declare const InlinePlayer: React.ForwardRefExoticComponent<Pick<InlinePlayerProps, "onError" | "onClick" | "testId" | "createAnalyticsEvent" | "selected" | "dimensions" | "cardPreview" | "originalDimensions" | "mediaClient" | "identifier" | "autoplay" | "forwardRef"> & React.RefAttributes<HTMLDivElement>>;
+export declare const InlinePlayer: React.ForwardRefExoticComponent<Pick<InlinePlayerProps, "createAnalyticsEvent" | keyof InlinePlayerOwnProps> & React.RefAttributes<HTMLDivElement>>;

package/dist/types/root/styled.d.ts

@@ -12,5 +12,5 @@ declare type InlinePlayerWrapper = {
     selected?: boolean;
 };
 export declare const InlinePlayerWrapper: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & InlinePlayerWrapper, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & InlinePlayerWrapper>;
-export declare const FormattedMessageWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const FormattedMessageWrapper: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>, any, import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement>>;
 export {};