@atlaskit/media-ui 16.5.0 → 17.2.0

package/dist/esm/ellipsify.js

@@ -2,7 +2,7 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 
 var _templateObject;
 
-import React from 'react';
+import React, { useRef, useEffect } from 'react';
 import styled from 'styled-components';
 import * as exenv from 'exenv';
 var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", ";\n"])), function (_ref) {
@@ -16,53 +16,55 @@ export var Ellipsify = function Ellipsify(_ref2) {
       endLength = _ref2.endLength,
       inline = _ref2.inline,
       testId = _ref2.testId;
-  return /*#__PURE__*/React.createElement(Wrapper, {
-    className: "ellipsed-text",
-    innerRef: setEllipsis({
+  var element = useRef(null);
+  useEffect(function () {
+    if (!element.current) {
+      return;
+    }
+
+    setEllipsis(element.current, {
       lines: lines,
       endLength: endLength
-    }),
+    });
+  }, [element, lines, endLength]);
+  return /*#__PURE__*/React.createElement(Wrapper, {
+    className: "ellipsed-text",
+    innerRef: element,
     "aria-label": text,
     inline: inline,
     "data-testid": testId
   }, text);
 };
 
-var setEllipsis = function setEllipsis(props) {
-  return function (element) {
-    if (!element) {
-      return;
-    }
+var setEllipsis = function setEllipsis(element, props) {
+  var maximumLines = props.lines;
+  var height = element.getBoundingClientRect().height;
+  var text = element.textContent;
+  element.textContent = 'a';
+  var lineHeight = element.getBoundingClientRect().height;
+  var lineCount = height / lineHeight;
+  var maximumHeight = lineHeight * maximumLines;
 
-    var maximumLines = props.lines;
-    var height = element.getBoundingClientRect().height;
-    var text = element.textContent;
-    element.textContent = 'a';
-    var lineHeight = element.getBoundingClientRect().height;
-    var lineCount = height / lineHeight;
-    var maximumHeight = lineHeight * maximumLines;
+  if (lineCount <= maximumLines) {
+    element.textContent = text;
+    return;
+  }
 
-    if (lineCount <= maximumLines) {
-      element.textContent = text;
-      return;
-    }
+  var textContent = text;
+  var endLength = typeof props.endLength === 'number' && props.endLength >= 0 ? props.endLength : 8;
+  var beginningText = text.substr(0, text.length * maximumLines / lineCount - endLength);
+  var endText = text.substr(text.length - endLength, endLength);
+  element.textContent = textContent = "".concat(beginningText, "...").concat(endText);
+  var finalHeight = element.getBoundingClientRect().height;
 
-    var textContent = text;
-    var endLength = typeof props.endLength === 'number' && props.endLength >= 0 ? props.endLength : 8;
-    var beginningText = text.substr(0, text.length * maximumLines / lineCount - endLength);
-    var endText = text.substr(text.length - endLength, endLength);
-    element.textContent = textContent = "".concat(beginningText, "...").concat(endText);
-    var finalHeight = element.getBoundingClientRect().height;
+  if (finalHeight > maximumHeight) {
+    var adjustedBeginningText = beginningText.substr(0, beginningText.length - beginningText.length / maximumLines * 0.25);
+    textContent = "".concat(adjustedBeginningText, "...").concat(endText);
+  }
 
-    if (finalHeight > maximumHeight) {
-      var adjustedBeginningText = beginningText.substr(0, beginningText.length - beginningText.length / maximumLines * 0.25);
-      textContent = "".concat(adjustedBeginningText, "...").concat(endText);
-    }
-
-    delayRun(function () {
-      return element.textContent = textContent;
-    });
-  };
+  delayRun(function () {
+    return element.textContent = textContent;
+  });
 };
 
 var timeout = function timeout(fn) {

package/dist/esm/index.js

@@ -4,6 +4,7 @@ export { DownloadAction } from './BlockCard/actions/DownloadAction';
 export { ViewAction } from './BlockCard/actions/ViewAction';
 export { AuthorizeAction, BlockCardErroredView, BlockCardNotFoundView, BlockCardForbiddenView, BlockCardResolvedView, BlockCardResolvingView, BlockCardUnauthorisedView, ForbiddenAction, PreviewAction } from './BlockCard';
 export { InlineCardErroredView, InlineCardForbiddenView, InlineCardResolvedView, InlineCardResolvingView, InlineCardUnauthorizedView } from './InlineCard';
+export { MediaInlineCardErroredView, MediaInlineCardLoadedView, MediaInlineCardLoadingView } from './MediaInlineCard';
 export { CardLinkView } from './LinkView';
 export { Ellipsify } from './ellipsify';
 export { toHumanReadableMediaSize } from './humanReadableSize';
@@ -16,7 +17,7 @@ export { InfiniteScroll } from './infiniteScroll';
 export { ExifOrientation, getCssFromImageOrientation, getImageInfo, getMetaTagNumericValue, getOrientation, getScaleFactor, getScaleFactorFromFile, isRotated, readImageMetaData } from './imageMetaData';
 export { dataURItoFile, fileToArrayBuffer, fileToDataURI, getFileInfo, getFileInfoFromSrc, loadImage, findParentByClassname, getMimeIcon } from './util';
 export { MimeTypeIcon } from './mime-type-icon';
-export { default as CustomMediaPlayer } from './customMediaPlayer/index';
+export { CustomMediaPlayer } from './customMediaPlayer/index';
 export { TimeRange } from './customMediaPlayer/timeRange';
 export { hideControlsClassName } from './classNames';
 export { Shortcut, keyCodes } from './shortcut';

package/dist/esm/locales.js

@@ -0,0 +1,3 @@
+import * as untypedLocales from './i18n/index';
+var locales = untypedLocales;
+export { locales };

package/dist/esm/mediaImage/index.js

@@ -87,7 +87,9 @@ export var MediaImage = /*#__PURE__*/function (_Component) {
           crossOrigin = _this$props.crossOrigin,
           onImageError = _this$props.onImageError,
           _this$props$alt = _this$props.alt,
-          alt = _this$props$alt === void 0 ? '' : _this$props$alt;
+          alt = _this$props$alt === void 0 ? '' : _this$props$alt,
+          loading = _this$props.loading,
+          forceSyncDisplay = _this$props.forceSyncDisplay;
       var _this$state = this.state,
           parentWidth = _this$state.parentWidth,
           parentHeight = _this$state.parentHeight,
@@ -290,7 +292,7 @@ export var MediaImage = /*#__PURE__*/function (_Component) {
         and we can do that only when image is loaded (and we have image size)
        */
 
-      var showImage = isImageLoaded || isFitStrategy && !isImageRotated;
+      var showImage = forceSyncDisplay || isImageLoaded || isFitStrategy && !isImageRotated;
       var style = {
         transform: 'translate(-50%, -50%)'
       };
@@ -381,13 +383,14 @@ export var MediaImage = /*#__PURE__*/function (_Component) {
       }
 
       return /*#__PURE__*/React.createElement(ImageComponent, {
+        loading: loading,
         "data-testid": "media-image",
         draggable: false,
         alt: alt,
         style: style,
         onLoad: this.onImageLoad,
         onError: onImageError,
-        innerRef: this.imageRef,
+        imageRef: this.imageRef,
         src: dataURI,
         crossOrigin: crossOrigin
       });
@@ -399,5 +402,6 @@ export var MediaImage = /*#__PURE__*/function (_Component) {
 
 _defineProperty(MediaImage, "defaultProps", {
   crop: true,
-  stretch: false
+  stretch: false,
+  forceSyncDisplay: false
 });

package/dist/esm/mediaImage/styled.js

@@ -1,6 +1,33 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 
-var _templateObject;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-import styled from 'styled-components';
-export var ImageComponent = styled.img(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  object-fit: contain;\n  image-orientation: none;\n"])));
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+import React from 'react';
+var imgStyle = {
+  position: 'absolute',
+  left: '50%',
+  top: '50%',
+  objectFit: 'contain',
+  imageOrientation: 'none'
+};
+/*
+This image component falls back to using the native React CSS in JS styling because
+in Styled Components 3.6.2 the additinoal loading property is stripped from the final html.
+This is not the case when using the JSX <img> tag, it is also fixed in the latest versionm of
+styled-components.
+*/
+
+export var ImageComponent = function ImageComponent(props) {
+  var style = props.style,
+      imageRef = props.imageRef,
+      otherProps = _objectWithoutProperties(props, ["style", "imageRef"]);
+
+  return /*#__PURE__*/React.createElement("img", _extends({}, otherProps, {
+    ref: imageRef,
+    style: _objectSpread(_objectSpread({}, imgStyle), style)
+  }));
+};

package/dist/esm/messages.js

@@ -50,6 +50,11 @@ export var messages = defineMessages({
     defaultMessage: 'Failed to load',
     description: 'We show this message when we have an error loading a file'
   },
+  failed_to_upload: {
+    id: 'fabric.media.failed_to_upload',
+    defaultMessage: 'Failed to upload',
+    description: 'We show this message when we have an error uploading a file'
+  },
   recent_uploads: {
     id: 'fabric.media.recent_uploads',
     defaultMessage: 'Recent uploads',
@@ -442,12 +447,12 @@ export var messages = defineMessages({
   },
   play: {
     id: 'fabric.media.play',
-    defaultMessage: 'play',
+    defaultMessage: 'Play',
     description: ''
   },
   pause: {
     id: 'fabric.media.pause',
-    defaultMessage: 'pause',
+    defaultMessage: 'Pause',
     description: ''
   },
   disable_fullscreen: {
@@ -515,6 +520,11 @@ export var messages = defineMessages({
     defaultMessage: 'text',
     description: ''
   },
+  displayThumbnail: {
+    id: 'fabric.media.display_thumbnail',
+    defaultMessage: 'Display thumbnail',
+    description: 'Display file with as a thumbnail.'
+  },
   search: {
     id: 'fabric.media.search',
     defaultMessage: 'search',
@@ -540,6 +550,16 @@ export var messages = defineMessages({
     defaultMessage: 'Playback speed',
     description: 'In the context of a video player, it allows user to switch the speed of the video'
   },
+  skipBackward: {
+    id: 'fabric.media.skip_backward',
+    defaultMessage: 'Back 10 seconds',
+    description: 'In the context of a video player, it allows user to skip 10 seconds of play time backward.'
+  },
+  skipForward: {
+    id: 'fabric.media.skip_forward',
+    defaultMessage: 'Forward 10 seconds',
+    description: 'In the context of a video player, it allows user to skip 10 seconds of play time forward.'
+  },
   playbackDefaultSpeed: {
     id: 'fabric.media.playback_default_speed',
     defaultMessage: 'Default',
@@ -575,11 +595,6 @@ export var messages = defineMessages({
     defaultMessage: 'Error 429',
     description: 'Error 429 is thrown'
   },
-  preview_rateLimited: {
-    id: 'fabric.media.preview_rateLimited',
-    defaultMessage: 'We had difficulties creating a preview',
-    description: 'The preview is rate limited'
-  },
   close_and_reopen: {
     id: 'fabric.media.close_and_reopen',
     defaultMessage: 'Try closing this file and reopening.',

package/dist/esm/shortcut.js

@@ -12,8 +12,10 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 import { Component } from 'react';
 export var keyCodes = {
-  space: 32,
-  m: 77
+  space: 'Space',
+  m: 'KeyM',
+  rightArrow: 'ArrowRight',
+  leftArrow: 'ArrowLeft'
 };
 export var Shortcut = /*#__PURE__*/function (_Component) {
   _inherits(Shortcut, _Component);
@@ -33,10 +35,15 @@ export var Shortcut = /*#__PURE__*/function (_Component) {
 
     _defineProperty(_assertThisInitialized(_this), "keyHandler", function (e) {
       var _this$props = _this.props,
-          keyCode = _this$props.keyCode,
-          handler = _this$props.handler;
+          handler = _this$props.handler,
+          code = _this$props.code,
+          keyCode = _this$props.keyCode;
 
-      if (e.keyCode === keyCode) {
+      if (keyCode !== undefined && e.keyCode === keyCode) {
+        handler();
+      }
+
+      if (code !== undefined && e.code === code) {
         handler();
       }
     });

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/media-ui",
-	"version": "16.5.0",
+	"version": "17.2.0",
 	"sideEffects": false
 }

package/dist/types/BlockCard/components/Byline.d.ts

@@ -2,6 +2,7 @@
 export interface BylineProps {
     text?: React.ReactNode;
     testId?: string;
+    className?: string;
     children?: React.ReactNode;
 }
-export declare const Byline: ({ text, children, testId }: BylineProps) => JSX.Element;
+export declare const Byline: ({ text, children, testId, className }: BylineProps) => JSX.Element;

package/dist/types/BlockCard/components/Content.d.ts

@@ -3,4 +3,5 @@ export interface ContentProps {
     children: React.ReactNode;
     isCompact?: boolean;
 }
+export declare const blockCardContentClassName = "block-card-content";
 export declare const Content: ({ children, isCompact }: ContentProps) => JSX.Element;

package/dist/types/BlockCard/components/ContentHeader.d.ts

@@ -4,4 +4,5 @@ export interface ContentHeaderProps {
     link: string;
     children: React.ReactNode;
 }
+export declare const blockCardContentHeaderClassName = "block-card-content-header";
 export declare const ContentHeader: ({ onClick, link, children, }: ContentHeaderProps) => JSX.Element;

package/dist/types/BlockCard/components/Link.d.ts

@@ -1,5 +1,6 @@
 export interface LinkProps {
     url: string;
     testId?: string;
+    className?: string;
 }
-export declare const Link: ({ url, testId }: LinkProps) => JSX.Element;
+export declare const Link: ({ url, testId, className }: LinkProps) => JSX.Element;

package/dist/types/BlockCard/components/ModalHeader.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { HeaderComponentProps } from '@atlaskit/modal-dialog';
+import { ModalHeaderProps as HeaderComponentProps } from '@atlaskit/modal-dialog';
 import { IconProps } from './Icon';
 import { MetadataListProps } from './MetadataList';
 export interface HeaderProps extends HeaderComponentProps {
@@ -14,4 +14,4 @@ export interface HeaderProps extends HeaderComponentProps {
     onViewActionClick?: () => void;
     onDownloadActionClick?: () => void;
 }
-export declare const Header: ({ onClose, title, label, metadata, icon, providerName, url, download, byline, onViewActionClick, onDownloadActionClick, }: HeaderProps) => JSX.Element;
+export declare const Header: ({ title, label, metadata, icon, providerName, url, download, byline, onViewActionClick, onDownloadActionClick, }: HeaderProps) => JSX.Element;

package/dist/types/BlockCard/components/Name.d.ts

@@ -6,4 +6,5 @@ export interface NameProps {
     children?: React.ReactNode;
     textColor?: string;
 }
+export declare const blockCardContentHeaderNameClassName = "block-card-content-header-name";
 export declare const Name: ({ name, isLeftPadded, testId, textColor, }: NameProps) => JSX.Element;

package/dist/types/BlockCard/views/ErroredView.d.ts

@@ -8,4 +8,5 @@ export interface ErroredViewProps {
     testId?: string;
     inheritDimensions?: boolean;
 }
+export declare const blockCardErroredViewClassName = "block-card-errored-view";
 export declare const ErroredView: ({ isSelected, testId, link, onClick, onRetry, inheritDimensions, }: ErroredViewProps) => JSX.Element;

package/dist/types/BlockCard/views/ForbiddenView.d.ts

@@ -17,4 +17,5 @@ export interface PermissionDeniedProps {
     requestAccessContext?: RequestAccessContextProps;
 }
 export declare const blockCardForbiddenViewClassName = "block-card-forbidden-view";
+export declare const blockCardForbiddenViewLinkClassName = "block-card-forbidden-view-link";
 export declare const ForbiddenView: ({ context, isSelected, actions, testId, showActions, link, onClick, requestAccessContext, }: PermissionDeniedProps) => JSX.Element;

package/dist/types/BlockCard/views/NotFoundView.d.ts

@@ -11,4 +11,5 @@ export interface NotFoundProps {
     icon: IconProps;
     testId?: string;
 }
+export declare const blockCardNotFoundViewClassName = "block-card-not-found-view";
 export declare const NotFoundView: ({ context, isSelected, testId, link, onClick, }: NotFoundProps) => JSX.Element;

package/dist/types/BlockCard/views/ResolvedView.d.ts

@@ -28,4 +28,5 @@ export interface ResolvedViewProps {
     isTrusted?: boolean;
 }
 export declare const blockCardResolvedViewClassName = "block-card-resolved-view";
+export declare const blockCardResolvedViewByClassName = "block-card-resolved-view-by";
 export declare const ResolvedView: ({ icon, actions, thumbnail, context, title, titleTextColor, titlePrefix, isSelected, users, handleAvatarClick, handleMoreAvatarsClick, onClick, link, byline, lozenge, details, testId, showActions, }: ResolvedViewProps) => JSX.Element;

package/dist/types/MediaInlineCard/ErroredView/index.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+export interface MediaInlineCardErroredViewProps {
+    /** The error message to display */
+    message: string;
+    /** The optional click handler */
+    onClick?: React.EventHandler<React.MouseEvent | React.KeyboardEvent>;
+    /** A flag that determines whether the card is selected in edit mode. */
+    isSelected?: boolean;
+    /** A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests */
+    testId?: string;
+    icon?: React.ReactNode;
+}
+export declare class MediaInlineCardErroredView extends React.Component<MediaInlineCardErroredViewProps> {
+    renderMessage: () => JSX.Element;
+    render(): JSX.Element;
+}

package/dist/types/MediaInlineCard/Frame/index.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+export interface FrameViewProps {
+    /** A flag that determines whether the card is selected in edit mode. */
+    isSelected?: boolean;
+    isInteractive?: boolean;
+    children?: React.ReactNode;
+    /** The optional click handler */
+    onClick?: React.EventHandler<React.MouseEvent | React.KeyboardEvent>;
+    /** A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests */
+    testId?: string;
+}
+export declare class Frame extends React.Component<FrameViewProps> {
+    handleClick: (event: React.MouseEvent<HTMLDivElement>) => void;
+    handleKeyPress: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+    handleMouseDown: (e: React.MouseEvent) => void;
+    render(): JSX.Element;
+}

package/dist/types/MediaInlineCard/Frame/styled.d.ts

@@ -0,0 +1,5 @@
+import { HTMLAttributes, ComponentClass } from 'react';
+export interface WrapperProps {
+    isSelected?: boolean;
+}
+export declare const Wrapper: ComponentClass<HTMLAttributes<{}> & WrapperProps>;

package/dist/types/MediaInlineCard/Icon.d.ts

@@ -0,0 +1,3 @@
+import { ComponentClass, HTMLAttributes, ImgHTMLAttributes } from 'react';
+export declare const Icon: ComponentClass<ImgHTMLAttributes<{}>>;
+export declare const AKIconWrapper: ComponentClass<HTMLAttributes<{}>>;

package/dist/types/MediaInlineCard/IconAndTitleLayout/index.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+export interface IconAndTitleLayoutProps {
+    emoji?: React.ReactNode;
+    icon?: React.ReactNode;
+    title: React.ReactNode;
+    right?: React.ReactNode;
+    titleColor?: string;
+    children?: React.ReactNode;
+    defaultIcon?: React.ReactNode;
+    testId?: string;
+}
+export declare class IconAndTitleLayout extends React.Component<IconAndTitleLayoutProps> {
+    private renderAtlaskitIcon;
+    private renderImageIcon;
+    private renderIconPlaceholder;
+    renderIcon(testId: string): JSX.Element;
+    render(): JSX.Element;
+}

package/dist/types/MediaInlineCard/IconAndTitleLayout/styled.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export declare const IconObjectOverrides = "\n  & > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    line-height: 14px;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+export declare const IconOverrides = "\n  & > * > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+export declare const IconWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const EmojiWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const IconTitleWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const LozengeWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const LozengeBlockWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const RightIconPositionWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const IconPositionWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const IconEmptyWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const TitleWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;

package/dist/types/MediaInlineCard/LoadedView/index.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+export interface MediaInlineCardLoadedViewProps {
+    /** The optional con of the service (e.g. Dropbox/Asana/Google/etc) to display */
+    icon?: React.ReactNode;
+    /** The name of the resource */
+    title?: string;
+    /** A flag that determines whether the card is selected in edit mode. */
+    isSelected?: boolean;
+    /** The optional click handler */
+    onClick?: React.EventHandler<React.MouseEvent | React.KeyboardEvent>;
+    /** A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests */
+    testId?: string;
+    /** The Emoji icon prefix that was added to the title text via Add emoji button */
+    titlePrefix?: React.ReactNode;
+}
+export declare class MediaInlineCardLoadedView extends React.Component<MediaInlineCardLoadedViewProps> {
+    render(): JSX.Element;
+}

package/dist/types/MediaInlineCard/LoadingView/index.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { InlinePreloaderStyle } from '../../types';
+export interface MediaInlineCardLoadingViewProps {
+    /** The file name to display */
+    message: string;
+    inlinePreloaderStyle?: InlinePreloaderStyle;
+    /** The optional click handler */
+    onClick?: React.EventHandler<React.MouseEvent | React.KeyboardEvent>;
+    /** A flag that determines whether the card is selected in edit mode. */
+    isSelected?: boolean;
+    /** A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests */
+    testId?: string;
+    withoutHover?: boolean;
+}
+export declare class MediaInlineCardLoadingView extends React.Component<MediaInlineCardLoadingViewProps> {
+    render(): JSX.Element;
+}

package/dist/types/MediaInlineCard/LoadingView/styled.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const SpinnerWrapper: import("styled-components").StyledComponentClass<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;

package/dist/types/MediaInlineCard/index.d.ts

@@ -0,0 +1,6 @@
+export { MediaInlineCardLoadingView } from './LoadingView';
+export type { MediaInlineCardLoadingViewProps } from './LoadingView';
+export { MediaInlineCardLoadedView } from './LoadedView';
+export type { MediaInlineCardLoadedViewProps } from './LoadedView';
+export { MediaInlineCardErroredView } from './ErroredView';
+export type { MediaInlineCardErroredViewProps } from './ErroredView';

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

@@ -0,0 +1,2 @@
+import { ComponentClass, HTMLAttributes } from 'react';
+export declare const NoLinkAppearance: ComponentClass<HTMLAttributes<{}>>;

package/dist/types/classNames.d.ts

@@ -2,6 +2,11 @@ export declare const hideControlsClassName = "mvng-hide-controls";
 export { contentFooterClassName } from './BlockCard/components/ContentFooter';
 export { metadataListClassName } from './BlockCard/components/MetadataList';
 export { blockCardResolvingViewClassName } from './BlockCard/views/ResolvingView';
-export { blockCardResolvedViewClassName } from './BlockCard/views/ResolvedView';
-export { blockCardForbiddenViewClassName } from './BlockCard/views/ForbiddenView';
+export { blockCardResolvedViewClassName, blockCardResolvedViewByClassName, } from './BlockCard/views/ResolvedView';
+export { blockCardForbiddenViewClassName, blockCardForbiddenViewLinkClassName, } from './BlockCard/views/ForbiddenView';
 export { blockCardIconImageClassName } from './BlockCard/components/Icon';
+export { blockCardContentClassName } from './BlockCard/components/Content';
+export { blockCardContentHeaderClassName } from './BlockCard/components/ContentHeader';
+export { blockCardContentHeaderNameClassName } from './BlockCard/components/Name';
+export { blockCardNotFoundViewClassName } from './BlockCard/views/NotFoundView';
+export { blockCardErroredViewClassName } from './BlockCard/views/ErroredView';

package/dist/types/customMediaPlayer/analytics/events/screen/customMediaPlayer.d.ts

@@ -0,0 +1,5 @@
+import { ScreenAttributes, ScreenEventPayload } from '@atlaskit/media-common';
+import { PlaybackState, WithPlaybackAttributes } from '../../utils/playbackAttributes';
+import { CustomMediaPlayerType, WithCustomMediaPlayerType } from '../../../types';
+export declare type CustomMediaPlayerScreenEventPayload = ScreenEventPayload<ScreenAttributes & WithPlaybackAttributes & WithCustomMediaPlayerType, 'customMediaPlayerScreen'>;
+export declare const createCustomMediaPlayerScreenEvent: (type: CustomMediaPlayerType, playbackState: PlaybackState, fileId?: string | undefined) => CustomMediaPlayerScreenEventPayload;

package/dist/types/customMediaPlayer/analytics/events/track/playCount.d.ts

@@ -0,0 +1,5 @@
+import { TrackAttributes, TrackEventPayload } from '@atlaskit/media-common';
+import { PlaybackState, WithPlaybackAttributes } from '../../utils/playbackAttributes';
+import { CustomMediaPlayerType, WithCustomMediaPlayerType } from '../../../types';
+export declare type FirstPlayedTrackEventPayload = TrackEventPayload<TrackAttributes & WithPlaybackAttributes & WithCustomMediaPlayerType, 'firstPlayed', 'customMediaPlayer'>;
+export declare const createFirstPlayedTrackEvent: (type: CustomMediaPlayerType, playbackState: PlaybackState, fileId?: string | undefined) => FirstPlayedTrackEventPayload;

package/dist/types/customMediaPlayer/analytics/events/track/played.d.ts

@@ -0,0 +1,5 @@
+import { TrackAttributes, TrackEventPayload } from '@atlaskit/media-common';
+import { PlaybackState, WithPlaybackAttributes } from '../../utils/playbackAttributes';
+import { CustomMediaPlayerType, WithCustomMediaPlayerType } from '../../../types';
+export declare type PlayedTrackEventPayload = TrackEventPayload<TrackAttributes & WithPlaybackAttributes & WithCustomMediaPlayerType, 'played', 'customMediaPlayer'>;
+export declare const createPlayedTrackEvent: (type: CustomMediaPlayerType, playbackState: PlaybackState, fileId?: string | undefined) => PlayedTrackEventPayload;

package/dist/types/customMediaPlayer/analytics/events/ui/mediaButtonClicked.d.ts

@@ -0,0 +1,5 @@
+import { UIAttributes, UIEventPayload } from '@atlaskit/media-common';
+import { PlaybackState, WithPlaybackAttributes } from '../../utils/playbackAttributes';
+import { CustomMediaPlayerType, WithCustomMediaPlayerType } from '../../../types';
+export declare type MediaButtonClickEventPayload = UIEventPayload<UIAttributes & WithPlaybackAttributes & WithCustomMediaPlayerType, 'clicked', 'button'>;
+export declare function createMediaButtonClickedEvent(type: CustomMediaPlayerType, playbackState: PlaybackState, buttonType?: string, fileId?: string): MediaButtonClickEventPayload;

package/dist/types/customMediaPlayer/analytics/events/ui/playPauseBlanketClicked.d.ts

@@ -0,0 +1,5 @@
+import { UIAttributes, UIEventPayload } from '@atlaskit/media-common';
+import { PlaybackState, WithPlaybackAttributes } from '../../utils/playbackAttributes';
+import { CustomMediaPlayerType, WithCustomMediaPlayerType } from '../../../types';
+export declare type PlayPauseBlanketClickEventPayload = UIEventPayload<UIAttributes & WithPlaybackAttributes & WithCustomMediaPlayerType, 'clicked', 'playPauseBlanket'>;
+export declare function createPlayPauseBlanketClickedEvent(type: CustomMediaPlayerType, playbackState: PlaybackState, fileId?: string): PlayPauseBlanketClickEventPayload;

package/dist/types/customMediaPlayer/analytics/events/ui/playbackSpeedChanged.d.ts

@@ -0,0 +1,5 @@
+import { UIAttributes, UIEventPayload } from '@atlaskit/media-common';
+import { PlaybackState, WithPlaybackAttributes } from '../../utils/playbackAttributes';
+import { CustomMediaPlayerType, WithCustomMediaPlayerType } from '../../../types';
+export declare type PlaybackSpeedChangeEventPayload = UIEventPayload<UIAttributes & WithPlaybackAttributes & WithCustomMediaPlayerType, 'changed', 'playbackSpeed'>;
+export declare function createPlaybackSpeedChangedEvent(type: CustomMediaPlayerType, playbackState: PlaybackState, fileId?: string): PlaybackSpeedChangeEventPayload;

package/dist/types/customMediaPlayer/analytics/events/ui/shortcutPressed.d.ts

@@ -0,0 +1,5 @@
+import { UIAttributes, UIEventPayload } from '@atlaskit/media-common';
+import { PlaybackState, WithPlaybackAttributes } from '../../utils/playbackAttributes';
+import { CustomMediaPlayerType, WithCustomMediaPlayerType } from '../../../types';
+export declare type ShortcutPressEventPayload = UIEventPayload<UIAttributes & WithPlaybackAttributes & WithCustomMediaPlayerType, 'pressed', 'shortcut'>;
+export declare function createMediaShortcutPressedEvent(type: CustomMediaPlayerType, playbackState: PlaybackState, shortcutType?: string, fileId?: string): ShortcutPressEventPayload;

package/dist/types/customMediaPlayer/analytics/events/ui/timeRangeNavigated.d.ts

@@ -0,0 +1,5 @@
+import { UIAttributes, UIEventPayload } from '@atlaskit/media-common';
+import { PlaybackState, WithPlaybackAttributes } from '../../utils/playbackAttributes';
+import { CustomMediaPlayerType, WithCustomMediaPlayerType } from '../../../types';
+export declare type TimeRangeNavigateEventPayload = UIEventPayload<UIAttributes & WithPlaybackAttributes & WithCustomMediaPlayerType, 'navigated', 'timeRange'>;
+export declare function createTimeRangeNavigatedEvent(type: CustomMediaPlayerType, playbackState: PlaybackState, actionSubjectId?: string, fileId?: string): TimeRangeNavigateEventPayload;