@atlaskit/media-card 77.12.4 → 78.0.0

package/dist/esm/card/v2/inlinePlayerV2.js

@@ -1,214 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import React, { useRef, useState, useEffect } from 'react';
-import { globalMediaEventEmitter } from '@atlaskit/media-client';
-import { CustomMediaPlayer, InactivityDetector } from '@atlaskit/media-ui';
-import { defaultImageCardDimensions } from '../../utils';
-import { CardLoading } from '../../utils/lightCards/cardLoading';
-import { ProgressBar } from '../ui/progressBar/progressBar';
-import { InlinePlayerWrapper } from '../inlinePlayerWrapper';
-import { useBreakpoint } from '../useBreakpoint';
-import { useFileState, useMediaClient } from '@atlaskit/media-client-react';
-export var getPreferredVideoArtifact = function getPreferredVideoArtifact(fileState) {
-  if (fileState.status === 'processed' || fileState.status === 'processing') {
-    var artifacts = fileState.artifacts;
-    if (!artifacts) {
-      return undefined;
-    }
-    return artifacts['video_1280.mp4'] ? 'video_1280.mp4' : artifacts['video_640.mp4'] ? 'video_640.mp4' : undefined;
-  }
-  return undefined;
-};
-export var InlinePlayerBaseV2 = function InlinePlayerBaseV2(_ref) {
-  var identifier = _ref.identifier,
-    onError = _ref.onError,
-    onClick = _ref.onClick,
-    _ref$dimensions = _ref.dimensions,
-    dimensions = _ref$dimensions === void 0 ? defaultImageCardDimensions : _ref$dimensions,
-    originalDimensions = _ref.originalDimensions,
-    selected = _ref.selected,
-    testId = _ref.testId,
-    forwardRef = _ref.forwardRef,
-    autoplay = _ref.autoplay,
-    cardPreview = _ref.cardPreview,
-    onFullscreenChange = _ref.onFullscreenChange,
-    videoControlsWrapperRef = _ref.videoControlsWrapperRef;
-  // === States ===
-  var _useState = useState(),
-    _useState2 = _slicedToArray(_useState, 2),
-    fileSrc = _useState2[0],
-    setFileSrc = _useState2[1];
-  var _useState3 = useState(),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isUploading = _useState4[0],
-    setIsUploading = _useState4[1];
-  var _useState5 = useState(),
-    _useState6 = _slicedToArray(_useState5, 2),
-    progress = _useState6[0],
-    setProgress = _useState6[1];
-
-  // === Refs and Local Variables ===
-  var divRef = useRef(null);
-  var onErrorRef = useRef(onError);
-  onErrorRef.current = onError;
-  var id = identifier.id,
-    collectionName = identifier.collectionName,
-    occurrenceKey = identifier.occurrenceKey;
-  var breakpoint = useBreakpoint(dimensions === null || dimensions === void 0 ? void 0 : dimensions.width, divRef);
-  var mediaClient = useMediaClient();
-  var _useFileState = useFileState(id, {
-      collectionName: collectionName,
-      occurrenceKey: occurrenceKey
-    }),
-    fileState = _useFileState.fileState;
-  useEffect(function () {
-    var subscribeFileState = /*#__PURE__*/function () {
-      var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(fileState) {
-        var _yield$fileState$prev, value, newFileSrc, artifactName, artifacts, _newFileSrc, _newFileSrc2;
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              if (fileState.status === 'uploading') {
-                setIsUploading(true);
-                setProgress(fileState.progress);
-              } else {
-                setIsUploading(false);
-              }
-
-              // We reuse the existing fileSrc to prevent re renders, therefore we only perform fileSrc updates when there isn't any
-              if (!fileSrc) {
-                _context.next = 3;
-                break;
-              }
-              return _context.abrupt("return");
-            case 3:
-              if (!(fileState.status !== 'error' && fileState.preview)) {
-                _context.next = 12;
-                break;
-              }
-              _context.next = 6;
-              return fileState.preview;
-            case 6:
-              _yield$fileState$prev = _context.sent;
-              value = _yield$fileState$prev.value;
-              if (!(value instanceof Blob && value.type.indexOf('video/') === 0)) {
-                _context.next = 12;
-                break;
-              }
-              newFileSrc = URL.createObjectURL(value);
-              setFileSrc(newFileSrc);
-              return _context.abrupt("return");
-            case 12:
-              if (!(fileState.status === 'processed' || fileState.status === 'processing')) {
-                _context.next = 37;
-                break;
-              }
-              artifactName = getPreferredVideoArtifact(fileState);
-              artifacts = fileState.artifacts;
-              if (!(!artifactName || !artifacts)) {
-                _context.next = 27;
-                break;
-              }
-              _context.prev = 16;
-              _context.next = 19;
-              return mediaClient.file.getFileBinaryURL(id, collectionName);
-            case 19:
-              _newFileSrc = _context.sent;
-              setFileSrc(_newFileSrc);
-              _context.next = 26;
-              break;
-            case 23:
-              _context.prev = 23;
-              _context.t0 = _context["catch"](16);
-              if (onErrorRef.current && _context.t0 instanceof Error) {
-                onErrorRef.current(_context.t0);
-              }
-            case 26:
-              return _context.abrupt("return");
-            case 27:
-              _context.prev = 27;
-              _context.next = 30;
-              return mediaClient.file.getArtifactURL(artifacts, artifactName, collectionName);
-            case 30:
-              _newFileSrc2 = _context.sent;
-              setFileSrc(_newFileSrc2);
-              _context.next = 37;
-              break;
-            case 34:
-              _context.prev = 34;
-              _context.t1 = _context["catch"](27);
-              if (onErrorRef.current && _context.t1 instanceof Error) {
-                onErrorRef.current(_context.t1);
-              }
-            case 37:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee, null, [[16, 23], [27, 34]]);
-      }));
-      return function subscribeFileState(_x) {
-        return _ref2.apply(this, arguments);
-      };
-    }();
-    if (fileState) {
-      subscribeFileState(fileState);
-    }
-  }, [fileState, collectionName, fileSrc, id, mediaClient]);
-  useEffect(function () {
-    return function () {
-      fileSrc && URL.revokeObjectURL(fileSrc);
-    };
-  }, [fileSrc]);
-
-  // === Render ===
-  return fileSrc ? /*#__PURE__*/React.createElement(InlinePlayerWrapper, {
-    testId: testId || 'media-card-inline-player',
-    selected: {
-      selected: selected
-    },
-    onClick: onClick,
-    innerRef: forwardRef || undefined,
-    dimensions: dimensions
-  }, /*#__PURE__*/React.createElement(InactivityDetector, null, function (checkMouseMovement) {
-    return /*#__PURE__*/React.createElement(CustomMediaPlayer, {
-      type: "video",
-      src: fileSrc,
-      onFullscreenChange: onFullscreenChange,
-      fileId: id,
-      isAutoPlay: autoplay,
-      isHDAvailable: false,
-      onDownloadClick: function onDownloadClick() {
-        mediaClient.file.downloadBinary(id, undefined, collectionName);
-      },
-      onFirstPlay: function onFirstPlay() {
-        globalMediaEventEmitter.emit('media-viewed', {
-          fileId: id,
-          viewingLevel: 'full'
-        });
-      },
-      lastWatchTimeConfig: {
-        contentId: id
-      },
-      originalDimensions: originalDimensions,
-      showControls: checkMouseMovement,
-      poster: cardPreview === null || cardPreview === void 0 ? void 0 : cardPreview.dataURI,
-      videoControlsWrapperRef: videoControlsWrapperRef
-    });
-  }), isUploading && /*#__PURE__*/React.createElement(ProgressBar, {
-    progress: progress,
-    breakpoint: breakpoint,
-    positionBottom: true,
-    showOnTop: true
-  })) : /*#__PURE__*/React.createElement(CardLoading, {
-    testId: testId,
-    dimensions: dimensions
-  });
-};
-var InlinePlayerForwardRef = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  return /*#__PURE__*/React.createElement(InlinePlayerBaseV2, _extends({}, props, {
-    forwardRef: ref
-  }));
-});
-export var InlinePlayerV2 = InlinePlayerForwardRef;

package/dist/types/card/cardSwitcher.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import { type CardWithMediaClientConfigProps } from './types';
-declare function CardSwitcher(props: CardWithMediaClientConfigProps): JSX.Element;
-export default CardSwitcher;

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

@@ -1,7 +0,0 @@
-import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-import React from 'react';
-import { type WrappedComponentProps } from 'react-intl-next';
-import { type CardProps } from '../../types';
-export type CardV2BaseProps = CardProps & WithAnalyticsEventsProps & Partial<WrappedComponentProps>;
-export declare const CardV2Base: ({ identifier, ...otherProps }: CardV2BaseProps & WrappedComponentProps) => JSX.Element;
-export declare const CardV2: React.ComponentType<CardV2BaseProps>;

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

@@ -1,4 +0,0 @@
-import React from 'react';
-import { type CardWithMediaClientConfigProps } from '../types';
-declare const CardLoader: React.FC<CardWithMediaClientConfigProps>;
-export default CardLoader;

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

@@ -1,59 +0,0 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-import React, { type MouseEvent } from 'react';
-import { type MessageDescriptor } from 'react-intl-next';
-import { type MediaItemType, type FileDetails, type ImageResizeMode } from '@atlaskit/media-client';
-import { type WithAnalyticsEventsProps, type UIAnalyticsEvent } from '@atlaskit/analytics-next';
-import { type CardStatus, type MediaCardCursor, type CardDimensions, type TitleBoxIcon } from '../../types';
-import { type MediaFilePreview } from '@atlaskit/media-file-preview';
-import { type CardAction } from '../actions';
-import { type MediaCardError } from '../../errors';
-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;
-    readonly metadata?: FileDetails;
-    readonly error?: MediaCardError;
-    readonly onClick?: (event: React.MouseEvent<HTMLDivElement | HTMLButtonElement>, analyticsEvent?: UIAnalyticsEvent) => void;
-    readonly openMediaViewerButtonRef?: React.Ref<HTMLButtonElement>;
-    readonly shouldOpenMediaViewer?: boolean;
-    readonly onMouseEnter?: (event: MouseEvent<HTMLDivElement>) => void;
-    readonly onDisplayImage?: () => void;
-    readonly cardPreview?: MediaFilePreview;
-    readonly progress?: number;
-    readonly innerRef?: (instance: HTMLDivElement | null) => void;
-    readonly onImageLoad?: (cardPreview: MediaFilePreview) => void;
-    readonly onImageError?: (cardPreview: MediaFilePreview) => void;
-    readonly nativeLazyLoad?: boolean;
-    readonly forceSyncDisplay?: boolean;
-    disableAnimation?: boolean;
-    shouldHideTooltip?: boolean;
-    overriddenCreationDate?: number;
-}
-export type CardViewV2BaseProps = CardViewV2Props & WithAnalyticsEventsProps;
-export interface RenderConfigByStatusV2 {
-    renderTypeIcon?: boolean;
-    iconMessage?: JSX.Element;
-    renderImageRenderer?: boolean;
-    renderPlayButton?: boolean;
-    renderTitleBox?: boolean;
-    renderBlanket?: boolean;
-    isFixedBlanket?: boolean;
-    renderProgressBar?: boolean;
-    renderSpinner?: boolean;
-    renderFailedTitleBox?: boolean;
-    renderTickBox?: boolean;
-    customTitleMessage?: MessageDescriptor;
-}
-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, openMediaViewerButtonRef, shouldOpenMediaViewer, overriddenCreationDate, }: CardViewV2BaseProps) => jsx.JSX.Element;
-export declare const CardViewV2: React.ForwardRefExoticComponent<Omit<CardViewV2Props & WithAnalyticsEventsProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;

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

@@ -1,3 +0,0 @@
-import React from 'react';
-import { type CardWithMediaClientConfigProps } from '../types';
-export declare const CardWithMediaClientV2: React.FC<CardWithMediaClientConfigProps>;

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

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const InlinePlayerLazyV2: import("react").LazyExoticComponent<import("react").ForwardRefExoticComponent<Pick<import("./inlinePlayerV2").InlinePlayerProps, "createAnalyticsEvent" | keyof import("./inlinePlayerV2").InlinePlayerOwnProps> & import("react").RefAttributes<HTMLDivElement>>>;

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

@@ -1,24 +0,0 @@
-import React from 'react';
-import { type FileIdentifier, type FileState, type MediaFileArtifacts } from '@atlaskit/media-client';
-import { type NumericalCardDimensions } from '@atlaskit/media-common';
-import { type CardDimensions } from '../../types';
-import { type WithAnalyticsEventsProps, type UIAnalyticsEvent } from '@atlaskit/analytics-next';
-import type { CardPreview } from '../../types';
-export interface InlinePlayerOwnProps {
-    identifier: FileIdentifier;
-    dimensions?: CardDimensions;
-    originalDimensions?: NumericalCardDimensions;
-    autoplay: boolean;
-    selected?: boolean;
-    onFullscreenChange?: (fullscreen: boolean) => void;
-    onError?: (error: Error) => void;
-    readonly onClick?: (event: React.MouseEvent<HTMLDivElement>, analyticsEvent?: UIAnalyticsEvent) => void;
-    testId?: string;
-    readonly cardPreview?: CardPreview;
-    readonly forwardRef?: React.Ref<HTMLDivElement>;
-    readonly videoControlsWrapperRef?: React.Ref<HTMLDivElement>;
-}
-export type InlinePlayerProps = InlinePlayerOwnProps & WithAnalyticsEventsProps;
-export declare const getPreferredVideoArtifact: (fileState: FileState) => keyof MediaFileArtifacts | undefined;
-export declare const InlinePlayerBaseV2: ({ identifier, onError, onClick, dimensions, originalDimensions, selected, testId, forwardRef, autoplay, cardPreview, onFullscreenChange, videoControlsWrapperRef, }: InlinePlayerProps) => JSX.Element;
-export declare const InlinePlayerV2: React.ForwardRefExoticComponent<Pick<InlinePlayerProps, "createAnalyticsEvent" | keyof InlinePlayerOwnProps> & React.RefAttributes<HTMLDivElement>>;

package/dist/types-ts4.5/card/cardSwitcher.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import { type CardWithMediaClientConfigProps } from './types';
-declare function CardSwitcher(props: CardWithMediaClientConfigProps): JSX.Element;
-export default CardSwitcher;

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

@@ -1,7 +0,0 @@
-import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-import React from 'react';
-import { type WrappedComponentProps } from 'react-intl-next';
-import { type CardProps } from '../../types';
-export type CardV2BaseProps = CardProps & WithAnalyticsEventsProps & Partial<WrappedComponentProps>;
-export declare const CardV2Base: ({ identifier, ...otherProps }: CardV2BaseProps & WrappedComponentProps) => JSX.Element;
-export declare const CardV2: React.ComponentType<CardV2BaseProps>;

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

@@ -1,4 +0,0 @@
-import React from 'react';
-import { type CardWithMediaClientConfigProps } from '../types';
-declare const CardLoader: React.FC<CardWithMediaClientConfigProps>;
-export default CardLoader;

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

@@ -1,59 +0,0 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-import React, { type MouseEvent } from 'react';
-import { type MessageDescriptor } from 'react-intl-next';
-import { type MediaItemType, type FileDetails, type ImageResizeMode } from '@atlaskit/media-client';
-import { type WithAnalyticsEventsProps, type UIAnalyticsEvent } from '@atlaskit/analytics-next';
-import { type CardStatus, type MediaCardCursor, type CardDimensions, type TitleBoxIcon } from '../../types';
-import { type MediaFilePreview } from '@atlaskit/media-file-preview';
-import { type CardAction } from '../actions';
-import { type MediaCardError } from '../../errors';
-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;
-    readonly metadata?: FileDetails;
-    readonly error?: MediaCardError;
-    readonly onClick?: (event: React.MouseEvent<HTMLDivElement | HTMLButtonElement>, analyticsEvent?: UIAnalyticsEvent) => void;
-    readonly openMediaViewerButtonRef?: React.Ref<HTMLButtonElement>;
-    readonly shouldOpenMediaViewer?: boolean;
-    readonly onMouseEnter?: (event: MouseEvent<HTMLDivElement>) => void;
-    readonly onDisplayImage?: () => void;
-    readonly cardPreview?: MediaFilePreview;
-    readonly progress?: number;
-    readonly innerRef?: (instance: HTMLDivElement | null) => void;
-    readonly onImageLoad?: (cardPreview: MediaFilePreview) => void;
-    readonly onImageError?: (cardPreview: MediaFilePreview) => void;
-    readonly nativeLazyLoad?: boolean;
-    readonly forceSyncDisplay?: boolean;
-    disableAnimation?: boolean;
-    shouldHideTooltip?: boolean;
-    overriddenCreationDate?: number;
-}
-export type CardViewV2BaseProps = CardViewV2Props & WithAnalyticsEventsProps;
-export interface RenderConfigByStatusV2 {
-    renderTypeIcon?: boolean;
-    iconMessage?: JSX.Element;
-    renderImageRenderer?: boolean;
-    renderPlayButton?: boolean;
-    renderTitleBox?: boolean;
-    renderBlanket?: boolean;
-    isFixedBlanket?: boolean;
-    renderProgressBar?: boolean;
-    renderSpinner?: boolean;
-    renderFailedTitleBox?: boolean;
-    renderTickBox?: boolean;
-    customTitleMessage?: MessageDescriptor;
-}
-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, openMediaViewerButtonRef, shouldOpenMediaViewer, overriddenCreationDate, }: CardViewV2BaseProps) => jsx.JSX.Element;
-export declare const CardViewV2: React.ForwardRefExoticComponent<Omit<CardViewV2Props & WithAnalyticsEventsProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;

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

@@ -1,3 +0,0 @@
-import React from 'react';
-import { type CardWithMediaClientConfigProps } from '../types';
-export declare const CardWithMediaClientV2: React.FC<CardWithMediaClientConfigProps>;

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

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const InlinePlayerLazyV2: import("react").LazyExoticComponent<import("react").ForwardRefExoticComponent<Pick<import("./inlinePlayerV2").InlinePlayerProps, "createAnalyticsEvent" | keyof import("./inlinePlayerV2").InlinePlayerOwnProps> & import("react").RefAttributes<HTMLDivElement>>>;

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

@@ -1,24 +0,0 @@
-import React from 'react';
-import { type FileIdentifier, type FileState, type MediaFileArtifacts } from '@atlaskit/media-client';
-import { type NumericalCardDimensions } from '@atlaskit/media-common';
-import { type CardDimensions } from '../../types';
-import { type WithAnalyticsEventsProps, type UIAnalyticsEvent } from '@atlaskit/analytics-next';
-import type { CardPreview } from '../../types';
-export interface InlinePlayerOwnProps {
-    identifier: FileIdentifier;
-    dimensions?: CardDimensions;
-    originalDimensions?: NumericalCardDimensions;
-    autoplay: boolean;
-    selected?: boolean;
-    onFullscreenChange?: (fullscreen: boolean) => void;
-    onError?: (error: Error) => void;
-    readonly onClick?: (event: React.MouseEvent<HTMLDivElement>, analyticsEvent?: UIAnalyticsEvent) => void;
-    testId?: string;
-    readonly cardPreview?: CardPreview;
-    readonly forwardRef?: React.Ref<HTMLDivElement>;
-    readonly videoControlsWrapperRef?: React.Ref<HTMLDivElement>;
-}
-export type InlinePlayerProps = InlinePlayerOwnProps & WithAnalyticsEventsProps;
-export declare const getPreferredVideoArtifact: (fileState: FileState) => keyof MediaFileArtifacts | undefined;
-export declare const InlinePlayerBaseV2: ({ identifier, onError, onClick, dimensions, originalDimensions, selected, testId, forwardRef, autoplay, cardPreview, onFullscreenChange, videoControlsWrapperRef, }: InlinePlayerProps) => JSX.Element;
-export declare const InlinePlayerV2: React.ForwardRefExoticComponent<Pick<InlinePlayerProps, "createAnalyticsEvent" | keyof InlinePlayerOwnProps> & React.RefAttributes<HTMLDivElement>>;