@atlaskit/media-card 79.2.5 → 79.3.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/media-card
 
+## 79.3.0
+
+### Minor Changes
+
+- [#153282](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/153282)
+  [`b271b4820aef9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b271b4820aef9) -
+  Added support for Video Captions (experimental)
+- [#157095](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/157095)
+  [`ec7b5d3268aaf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ec7b5d3268aaf) -
+  We are testing the migration to the ADS Link component behind a feature flag. If this fix is
+  successful it will be available in a later release.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 79.2.5
 
 ### Patch Changes

package/dist/cjs/card/card.js

@@ -21,7 +21,7 @@ var _excluded = ["identifier"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var packageName = "@atlaskit/media-card";
-var packageVersion = "79.2.5";
+var packageVersion = "79.3.0";
 var CardBase = exports.CardBase = function CardBase(_ref) {
   var identifier = _ref.identifier,
     otherProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);

package/dist/cjs/card/cardWithMediaClient.js

@@ -9,10 +9,14 @@ var _react = _interopRequireDefault(require("react"));
 var _mediaClientReact = require("@atlaskit/media-client-react");
 var _mediaCardAnalyticsErrorBoundary = _interopRequireDefault(require("./media-card-analytics-error-boundary"));
 var _card = require("./card");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var CardWithMediaClient = exports.CardWithMediaClient = function CardWithMediaClient(props) {
   var dimensions = props.dimensions,
     onClick = props.onClick;
   var Card = _react.default.useMemo(function () {
+    if ((0, _platformFeatureFlags.fg)('platform_media_video_captions')) {
+      return (0, _mediaClientReact.withMediaClientAndSettings)(_card.Card);
+    }
     return (0, _mediaClientReact.withMediaClient)(_card.Card);
   }, []);
   return /*#__PURE__*/_react.default.createElement(_mediaCardAnalyticsErrorBoundary.default, {

package/dist/cjs/card/inlinePlayer.js

@@ -19,6 +19,7 @@ var _progressBar = require("./ui/progressBar/progressBar");
 var _inlinePlayerWrapper = require("./inlinePlayerWrapper");
 var _useBreakpoint = require("./useBreakpoint");
 var _mediaClientReact = require("@atlaskit/media-client-react");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var getPreferredVideoArtifact = exports.getPreferredVideoArtifact = function getPreferredVideoArtifact(fileState) {
@@ -182,8 +183,32 @@ var InlinePlayerBase = exports.InlinePlayerBase = function InlinePlayerBase(_ref
     onClick: onClick,
     innerRef: forwardRef || undefined,
     dimensions: dimensions
-  }, /*#__PURE__*/_react.default.createElement(_mediaUi.InactivityDetector, null, function (checkMouseMovement) {
-    return /*#__PURE__*/_react.default.createElement(_mediaUi.CustomMediaPlayer, {
+  }, /*#__PURE__*/_react.default.createElement(_mediaUi.InactivityDetector, null, function (checkMouseMovement, controlsAreVisible) {
+    return (0, _platformFeatureFlags.fg)('platform_media_video_captions') ? /*#__PURE__*/_react.default.createElement(_mediaUi.MediaPlayer, {
+      identifier: identifier,
+      type: "video",
+      src: fileSrc,
+      onFullscreenChange: onFullscreenChange,
+      isAutoPlay: autoplay,
+      isHDAvailable: false,
+      onDownloadClick: function onDownloadClick() {
+        mediaClient.file.downloadBinary(id, undefined, collectionName);
+      },
+      onFirstPlay: function onFirstPlay() {
+        _mediaClient.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,
+      areControlsVisible: controlsAreVisible
+    }) : /*#__PURE__*/_react.default.createElement(_mediaUi.CustomMediaPlayer, {
       type: "video",
       src: fileSrc,
       onFullscreenChange: onFullscreenChange,

package/dist/cjs/card/media-card-analytics-error-boundary.js

@@ -87,7 +87,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
 }(_react.default.Component);
 (0, _defineProperty2.default)(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
 var packageName = "@atlaskit/media-card";
-var packageVersion = "79.2.5";
+var packageVersion = "79.3.0";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 var MediaCardAnalyticsErrorBoundary = (0, _mediaCommon.withMediaAnalyticsContext)({

package/dist/cjs/inline/loader.js

@@ -117,7 +117,7 @@ var MediaInlineCardLoader = exports.default = /*#__PURE__*/function (_React$Pure
         ErrorBoundary = _this$state.ErrorBoundary;
       var analyticsContext = {
         packageVersion: "@atlaskit/media-card",
-        packageName: "79.2.5",
+        packageName: "79.3.0",
         componentName: 'mediaInlineCard',
         component: 'mediaInlineCard'
       };

package/dist/cjs/utils/ufoExperiences.js

@@ -15,7 +15,7 @@ var _mediaClient = require("@atlaskit/media-client");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var packageName = "@atlaskit/media-card";
-var packageVersion = "79.2.5";
+var packageVersion = "79.3.0";
 var SAMPLE_RATE = 0.05;
 var concurrentExperience;
 var getExperience = function getExperience(id) {

package/dist/es2019/card/card.js

@@ -9,7 +9,7 @@ import { startResourceObserver, setAnalyticsContext } from '../utils/mediaPerfor
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import UFOLabel from '@atlaskit/react-ufo/label';
 const packageName = "@atlaskit/media-card";
-const packageVersion = "79.2.5";
+const packageVersion = "79.3.0";
 export const CardBase = ({
   identifier,
   ...otherProps

package/dist/es2019/card/cardWithMediaClient.js

@@ -1,13 +1,17 @@
 import React from 'react';
-import { withMediaClient } from '@atlaskit/media-client-react';
+import { withMediaClientAndSettings, withMediaClient } from '@atlaskit/media-client-react';
 import MediaCardAnalyticsErrorBoundary from './media-card-analytics-error-boundary';
 import { Card as InternalCard } from './card';
+import { fg } from '@atlaskit/platform-feature-flags';
 export const CardWithMediaClient = props => {
   const {
     dimensions,
     onClick
   } = props;
   const Card = React.useMemo(() => {
+    if (fg('platform_media_video_captions')) {
+      return withMediaClientAndSettings(InternalCard);
+    }
     return withMediaClient(InternalCard);
   }, []);
   return /*#__PURE__*/React.createElement(MediaCardAnalyticsErrorBoundary, {

package/dist/es2019/card/inlinePlayer.js

@@ -1,13 +1,14 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useRef, useState, useEffect } from 'react';
 import { globalMediaEventEmitter } from '@atlaskit/media-client';
-import { CustomMediaPlayer, InactivityDetector } from '@atlaskit/media-ui';
+import { CustomMediaPlayer, MediaPlayer, 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';
+import { fg } from '@atlaskit/platform-feature-flags';
 export const getPreferredVideoArtifact = fileState => {
   if (fileState.status === 'processed' || fileState.status === 'processing') {
     const {
@@ -126,7 +127,31 @@ export const InlinePlayerBase = ({
     onClick: onClick,
     innerRef: forwardRef || undefined,
     dimensions: dimensions
-  }, /*#__PURE__*/React.createElement(InactivityDetector, null, checkMouseMovement => /*#__PURE__*/React.createElement(CustomMediaPlayer, {
+  }, /*#__PURE__*/React.createElement(InactivityDetector, null, (checkMouseMovement, controlsAreVisible) => fg('platform_media_video_captions') ? /*#__PURE__*/React.createElement(MediaPlayer, {
+    identifier: identifier,
+    type: "video",
+    src: fileSrc,
+    onFullscreenChange: onFullscreenChange,
+    isAutoPlay: autoplay,
+    isHDAvailable: false,
+    onDownloadClick: () => {
+      mediaClient.file.downloadBinary(id, undefined, collectionName);
+    },
+    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,
+    areControlsVisible: controlsAreVisible
+  }) : /*#__PURE__*/React.createElement(CustomMediaPlayer, {
     type: "video",
     src: fileSrc,
     onFullscreenChange: onFullscreenChange,

package/dist/es2019/card/media-card-analytics-error-boundary.js

@@ -66,7 +66,7 @@ class WrappedMediaCardAnalyticsErrorBoundary extends React.Component {
 }
 _defineProperty(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
 const packageName = "@atlaskit/media-card";
-const packageVersion = "79.2.5";
+const packageVersion = "79.3.0";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 const MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({

package/dist/es2019/inline/loader.js

@@ -37,7 +37,7 @@ export default class MediaInlineCardLoader extends React.PureComponent {
     } = this.state;
     const analyticsContext = {
       packageVersion: "@atlaskit/media-card",
-      packageName: "79.2.5",
+      packageName: "79.3.0",
       componentName: 'mediaInlineCard',
       component: 'mediaInlineCard'
     };

package/dist/es2019/utils/ufoExperiences.js

@@ -5,7 +5,7 @@ import { extractErrorInfo, getRenderErrorRequestMetadata } from './analytics';
 import { MediaCardError } from '../errors';
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 const packageName = "@atlaskit/media-card";
-const packageVersion = "79.2.5";
+const packageVersion = "79.3.0";
 const SAMPLE_RATE = 0.05;
 let concurrentExperience;
 const getExperience = id => {

package/dist/esm/card/card.js

@@ -11,7 +11,7 @@ import { startResourceObserver, setAnalyticsContext } from '../utils/mediaPerfor
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import UFOLabel from '@atlaskit/react-ufo/label';
 var packageName = "@atlaskit/media-card";
-var packageVersion = "79.2.5";
+var packageVersion = "79.3.0";
 export var CardBase = function CardBase(_ref) {
   var identifier = _ref.identifier,
     otherProps = _objectWithoutProperties(_ref, _excluded);

package/dist/esm/card/cardWithMediaClient.js

@@ -1,11 +1,15 @@
 import React from 'react';
-import { withMediaClient } from '@atlaskit/media-client-react';
+import { withMediaClientAndSettings, withMediaClient } from '@atlaskit/media-client-react';
 import MediaCardAnalyticsErrorBoundary from './media-card-analytics-error-boundary';
 import { Card as InternalCard } from './card';
+import { fg } from '@atlaskit/platform-feature-flags';
 export var CardWithMediaClient = function CardWithMediaClient(props) {
   var dimensions = props.dimensions,
     onClick = props.onClick;
   var Card = React.useMemo(function () {
+    if (fg('platform_media_video_captions')) {
+      return withMediaClientAndSettings(InternalCard);
+    }
     return withMediaClient(InternalCard);
   }, []);
   return /*#__PURE__*/React.createElement(MediaCardAnalyticsErrorBoundary, {

package/dist/esm/card/inlinePlayer.js

@@ -4,13 +4,14 @@ 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 { CustomMediaPlayer, MediaPlayer, 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';
+import { fg } from '@atlaskit/platform-feature-flags';
 export var getPreferredVideoArtifact = function getPreferredVideoArtifact(fileState) {
   if (fileState.status === 'processed' || fileState.status === 'processing') {
     var artifacts = fileState.artifacts;
@@ -172,8 +173,32 @@ export var InlinePlayerBase = function InlinePlayerBase(_ref) {
     onClick: onClick,
     innerRef: forwardRef || undefined,
     dimensions: dimensions
-  }, /*#__PURE__*/React.createElement(InactivityDetector, null, function (checkMouseMovement) {
-    return /*#__PURE__*/React.createElement(CustomMediaPlayer, {
+  }, /*#__PURE__*/React.createElement(InactivityDetector, null, function (checkMouseMovement, controlsAreVisible) {
+    return fg('platform_media_video_captions') ? /*#__PURE__*/React.createElement(MediaPlayer, {
+      identifier: identifier,
+      type: "video",
+      src: fileSrc,
+      onFullscreenChange: onFullscreenChange,
+      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,
+      areControlsVisible: controlsAreVisible
+    }) : /*#__PURE__*/React.createElement(CustomMediaPlayer, {
       type: "video",
       src: fileSrc,
       onFullscreenChange: onFullscreenChange,

package/dist/esm/card/media-card-analytics-error-boundary.js

@@ -80,7 +80,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
 }(React.Component);
 _defineProperty(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
 var packageName = "@atlaskit/media-card";
-var packageVersion = "79.2.5";
+var packageVersion = "79.3.0";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 var MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({

package/dist/esm/inline/loader.js

@@ -101,7 +101,7 @@ var MediaInlineCardLoader = /*#__PURE__*/function (_React$PureComponent) {
         ErrorBoundary = _this$state.ErrorBoundary;
       var analyticsContext = {
         packageVersion: "@atlaskit/media-card",
-        packageName: "79.2.5",
+        packageName: "79.3.0",
         componentName: 'mediaInlineCard',
         component: 'mediaInlineCard'
       };

package/dist/esm/utils/ufoExperiences.js

@@ -8,7 +8,7 @@ import { extractErrorInfo, getRenderErrorRequestMetadata } from './analytics';
 import { MediaCardError } from '../errors';
 import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
 var packageName = "@atlaskit/media-card";
-var packageVersion = "79.2.5";
+var packageVersion = "79.3.0";
 var SAMPLE_RATE = 0.05;
 var concurrentExperience;
 var getExperience = function getExperience(id) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/media-card",
-	"version": "79.2.5",
+	"version": "79.3.0",
 	"description": "Includes all media card related components, CardView, CardViewSmall, Card...",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -38,22 +38,23 @@
 	},
 	"dependencies": {
 		"@atlaskit/analytics-next": "^11.0.0",
-		"@atlaskit/dropdown-menu": "^15.0.0",
+		"@atlaskit/dropdown-menu": "^15.2.0",
 		"@atlaskit/editor-shared-styles": "^3.4.0",
-		"@atlaskit/icon": "^26.0.0",
+		"@atlaskit/icon": "^26.1.0",
+		"@atlaskit/link": "^3.2.0",
 		"@atlaskit/media-client": "^33.3.0",
 		"@atlaskit/media-client-react": "^4.1.0",
-		"@atlaskit/media-common": "^12.0.0",
+		"@atlaskit/media-common": "^12.1.0",
 		"@atlaskit/media-file-preview": "^0.11.0",
-		"@atlaskit/media-svg": "^2.0.0",
-		"@atlaskit/media-ui": "^28.1.0",
-		"@atlaskit/media-viewer": "^52.0.0",
+		"@atlaskit/media-svg": "^2.1.0",
+		"@atlaskit/media-ui": "^28.2.0",
+		"@atlaskit/media-viewer": "^52.1.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/primitives": "^14.7.0",
-		"@atlaskit/react-ufo": "^3.12.0",
+		"@atlaskit/primitives": "^14.8.0",
+		"@atlaskit/react-ufo": "^3.13.0",
 		"@atlaskit/spinner": "^18.0.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tokens": "^4.8.0",
+		"@atlaskit/tokens": "^4.9.0",
 		"@atlaskit/tooltip": "^20.0.0",
 		"@atlaskit/ufo": "^0.4.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
@@ -77,7 +78,7 @@
 		"@atlaskit/analytics-listeners": "^9.0.0",
 		"@atlaskit/analytics-namespaced-context": "^7.0.0",
 		"@atlaskit/form": "^12.0.0",
-		"@atlaskit/inline-message": "^15.1.0",
+		"@atlaskit/inline-message": "^15.2.0",
 		"@atlaskit/media-core": "^36.1.0",
 		"@atlaskit/media-picker": "^69.0.0",
 		"@atlaskit/media-state": "^1.6.0",
@@ -132,6 +133,12 @@
 		},
 		"platform_media_card_image_render": {
 			"type": "boolean"
+		},
+		"dst-a11y__replace-anchor-with-link__media-exif": {
+			"type": "boolean"
+		},
+		"platform_media_video_captions": {
+			"type": "boolean"
 		}
 	},
 	"techstack": {