@atlaskit/media-card 79.0.1 → 79.0.3

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/media-card
 
+## 79.0.3
+
+### Patch Changes
+
+- [#117537](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/117537)
+  [`1aafb49d776e0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1aafb49d776e0) -
+  Integrated Media Viewer with internal DS Portal (removed feature flag)
+- Updated dependencies
+
+## 79.0.2
+
+### Patch Changes
+
+- [#120533](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/120533)
+  [`f1bec731e278f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f1bec731e278f) -
+  Adds a `sideEffects` field to ensure this package does not have Compiled styles tree-shaken in the
+  future to avoid an accidental regression.
+
+  This is related to
+  https://community.developer.atlassian.com/t/rfc-73-migrating-our-components-to-compiled-css-in-js/85953
+
 ## 79.0.1
 
 ### Patch Changes

package/classnames/package.json

@@ -3,7 +3,9 @@
   "main": "../dist/cjs/classnames.js",
   "module": "../dist/esm/classnames.js",
   "module:es2019": "../dist/es2019/classnames.js",
-  "sideEffects": false,
+  "sideEffects": [
+    "*.compiled.css"
+  ],
   "types": "../dist/types/classnames.d.ts",
   "typesVersions": {
     ">=4.5 <5.4": {

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.0.1";
+var packageVersion = "79.0.3";
 var CardBase = exports.CardBase = function CardBase(_ref) {
   var identifier = _ref.identifier,
     otherProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);

package/dist/cjs/card/fileCard.js

@@ -17,7 +17,6 @@ var _mediaClientReact = require("@atlaskit/media-client-react");
 var _mediaCommon = require("@atlaskit/media-common");
 var _mediaViewer = require("@atlaskit/media-viewer");
 var _react = _interopRequireWildcard(require("react"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
 var _useCallbackRef = require("use-callback-ref");
 var _errors = require("../errors");
 var _types = require("../types");
@@ -39,18 +38,10 @@ var _performance = require("./performance");
 var _dateOverrideContext = require("../dateOverrideContext");
 var _reactIntlNext = require("react-intl-next");
 var _abuseModal = require("@atlaskit/media-ui/abuseModal");
-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; }
 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 MediaViewerComponent = function MediaViewerComponent(props) {
-  if ((0, _platformFeatureFlags.fg)('media_viewer_integrates_ds_portal')) {
-    return /*#__PURE__*/_react.default.createElement(_mediaViewer.MediaViewer, props);
-  } else {
-    return /*#__PURE__*/_reactDom.default.createPortal( /*#__PURE__*/_react.default.createElement(_mediaViewer.MediaViewer, props), document.body);
-  }
-};
 var FileCard = exports.FileCard = function FileCard(_ref) {
   var _ref$appearance = _ref.appearance,
     appearance = _ref$appearance === void 0 ? 'auto' : _ref$appearance,
@@ -670,7 +661,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
     testId: testId,
     cardPreview: preview,
     videoControlsWrapperRef: videoControlsWrapperRef
-  })) : renderCard(), mediaViewerSelectedItem ? /*#__PURE__*/_react.default.createElement(MediaViewerComponent, {
+  })) : renderCard(), mediaViewerSelectedItem ? /*#__PURE__*/_react.default.createElement(_mediaViewer.MediaViewer, {
     collectionName: collectionName,
     items: mediaViewerItems || [],
     mediaClientConfig: mediaClient.config,

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.0.1";
+var packageVersion = "79.0.3";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 var MediaCardAnalyticsErrorBoundary = (0, _mediaCommon.withMediaAnalyticsContext)({

package/dist/cjs/card/ui/wrapper/wrapper-compiled.js

@@ -50,7 +50,7 @@ var selectableTickboxStyle = null;
 var tooltipStyle = null;
 var getResponsiveStyles = function getResponsiveStyles(breakpoint) {
   // dynamically setting the properties to avoid ratcheting build errors. These need to be removed however for the compiled transformation.
-  return breakpoint === "small" ? (0, _defineProperty2.default)((0, _defineProperty2.default)({}, 'fontSize', '11x'), 'lineHeight', '14px') : (0, _defineProperty2.default)((0, _defineProperty2.default)({}, 'fontSize', '14px'), 'lineHeight', '22px');
+  return breakpoint === 'small' ? (0, _defineProperty2.default)((0, _defineProperty2.default)({}, 'fontSize', '11x'), 'lineHeight', '14px') : (0, _defineProperty2.default)((0, _defineProperty2.default)({}, 'fontSize', '14px'), 'lineHeight', '22px');
 };
 var Wrapper = exports.Wrapper = function Wrapper(props) {
   var testId = props.testId,

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.0.1",
+        packageName: "79.0.3",
         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.0.1";
+var packageVersion = "79.0.3";
 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.0.1";
+const packageVersion = "79.0.3";
 export const CardBase = ({
   identifier,
   ...otherProps

package/dist/es2019/card/fileCard.js

@@ -4,7 +4,6 @@ import { useFileState, useMediaClient } from '@atlaskit/media-client-react';
 import { getRandomHex, isMimeTypeSupportedByBrowser, isVideoMimeTypeSupportedByBrowser } from '@atlaskit/media-common';
 import { MediaViewer } from '@atlaskit/media-viewer';
 import React, { Suspense, useEffect, useMemo, useRef, useState, useCallback } from 'react';
-import ReactDOM from 'react-dom';
 import { useMergeRefs } from 'use-callback-ref';
 import { MediaCardError } from '../errors';
 import { isSSRPreview } from '../types';
@@ -27,14 +26,6 @@ import { useContext } from 'react';
 import { DateOverrideContext } from '../dateOverrideContext';
 import { useIntl } from 'react-intl-next';
 import { AbuseModal } from '@atlaskit/media-ui/abuseModal';
-import { fg } from '@atlaskit/platform-feature-flags';
-const MediaViewerComponent = props => {
-  if (fg('media_viewer_integrates_ds_portal')) {
-    return /*#__PURE__*/React.createElement(MediaViewer, props);
-  } else {
-    return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(MediaViewer, props), document.body);
-  }
-};
 export const FileCard = ({
   appearance = 'auto',
   resizeMode = 'crop',
@@ -589,7 +580,7 @@ export const FileCard = ({
     testId: testId,
     cardPreview: preview,
     videoControlsWrapperRef: videoControlsWrapperRef
-  })) : renderCard(), mediaViewerSelectedItem ? /*#__PURE__*/React.createElement(MediaViewerComponent, {
+  })) : renderCard(), mediaViewerSelectedItem ? /*#__PURE__*/React.createElement(MediaViewer, {
     collectionName: collectionName,
     items: mediaViewerItems || [],
     mediaClientConfig: mediaClient.config,

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.0.1";
+const packageVersion = "79.0.3";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 const MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({

package/dist/es2019/card/ui/wrapper/wrapper-compiled.js

@@ -37,7 +37,7 @@ const selectableTickboxStyle = null;
 const tooltipStyle = null;
 const getResponsiveStyles = breakpoint => {
   // dynamically setting the properties to avoid ratcheting build errors. These need to be removed however for the compiled transformation.
-  return breakpoint === "small" ? {
+  return breakpoint === 'small' ? {
     ['fontSize']: '11x',
     ['lineHeight']: '14px'
   } : {

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.0.1",
+      packageName: "79.0.3",
       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.0.1";
+const packageVersion = "79.0.3";
 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.0.1";
+var packageVersion = "79.0.3";
 export var CardBase = function CardBase(_ref) {
   var identifier = _ref.identifier,
     otherProps = _objectWithoutProperties(_ref, _excluded);

package/dist/esm/card/fileCard.js

@@ -11,7 +11,6 @@ import { useFileState, useMediaClient } from '@atlaskit/media-client-react';
 import { getRandomHex, isMimeTypeSupportedByBrowser, isVideoMimeTypeSupportedByBrowser } from '@atlaskit/media-common';
 import { MediaViewer } from '@atlaskit/media-viewer';
 import React, { Suspense, useEffect, useMemo, useRef, useState, useCallback } from 'react';
-import ReactDOM from 'react-dom';
 import { useMergeRefs } from 'use-callback-ref';
 import { MediaCardError } from '../errors';
 import { isSSRPreview } from '../types';
@@ -34,14 +33,6 @@ import { useContext } from 'react';
 import { DateOverrideContext } from '../dateOverrideContext';
 import { useIntl } from 'react-intl-next';
 import { AbuseModal } from '@atlaskit/media-ui/abuseModal';
-import { fg } from '@atlaskit/platform-feature-flags';
-var MediaViewerComponent = function MediaViewerComponent(props) {
-  if (fg('media_viewer_integrates_ds_portal')) {
-    return /*#__PURE__*/React.createElement(MediaViewer, props);
-  } else {
-    return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(MediaViewer, props), document.body);
-  }
-};
 export var FileCard = function FileCard(_ref) {
   var _ref$appearance = _ref.appearance,
     appearance = _ref$appearance === void 0 ? 'auto' : _ref$appearance,
@@ -661,7 +652,7 @@ export var FileCard = function FileCard(_ref) {
     testId: testId,
     cardPreview: preview,
     videoControlsWrapperRef: videoControlsWrapperRef
-  })) : renderCard(), mediaViewerSelectedItem ? /*#__PURE__*/React.createElement(MediaViewerComponent, {
+  })) : renderCard(), mediaViewerSelectedItem ? /*#__PURE__*/React.createElement(MediaViewer, {
     collectionName: collectionName,
     items: mediaViewerItems || [],
     mediaClientConfig: mediaClient.config,

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.0.1";
+var packageVersion = "79.0.3";
 
 // @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
 var MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({

package/dist/esm/card/ui/wrapper/wrapper-compiled.js

@@ -40,7 +40,7 @@ var selectableTickboxStyle = null;
 var tooltipStyle = null;
 var getResponsiveStyles = function getResponsiveStyles(breakpoint) {
   // dynamically setting the properties to avoid ratcheting build errors. These need to be removed however for the compiled transformation.
-  return breakpoint === "small" ? _defineProperty(_defineProperty({}, 'fontSize', '11x'), 'lineHeight', '14px') : _defineProperty(_defineProperty({}, 'fontSize', '14px'), 'lineHeight', '22px');
+  return breakpoint === 'small' ? _defineProperty(_defineProperty({}, 'fontSize', '11x'), 'lineHeight', '14px') : _defineProperty(_defineProperty({}, 'fontSize', '14px'), 'lineHeight', '22px');
 };
 export var Wrapper = function Wrapper(props) {
   var testId = props.testId,

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.0.1",
+        packageName: "79.0.3",
         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.0.1";
+var packageVersion = "79.0.3";
 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.0.1",
+	"version": "79.0.3",
 	"description": "Includes all media card related components, CardView, CardViewSmall, Card...",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -20,7 +20,9 @@
 			]
 		}
 	},
-	"sideEffects": false,
+	"sideEffects": [
+		"*.compiled.css"
+	],
 	"atlaskit:src": "src/index.ts",
 	"af:exports": {
 		"./types": "./src/types.ts",
@@ -37,21 +39,21 @@
 	"dependencies": {
 		"@atlaskit/analytics-next": "^11.0.0",
 		"@atlaskit/dropdown-menu": "^13.0.0",
-		"@atlaskit/editor-shared-styles": "^3.3.0",
-		"@atlaskit/icon": "^24.0.0",
+		"@atlaskit/editor-shared-styles": "^3.4.0",
+		"@atlaskit/icon": "^24.1.0",
 		"@atlaskit/media-client": "^32.0.0",
 		"@atlaskit/media-client-react": "^4.0.0",
 		"@atlaskit/media-common": "^12.0.0",
 		"@atlaskit/media-file-preview": "^0.11.0",
 		"@atlaskit/media-svg": "^2.0.0",
 		"@atlaskit/media-ui": "^28.0.0",
-		"@atlaskit/media-viewer": "^51.0.0",
+		"@atlaskit/media-viewer": "^52.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/primitives": "^14.0.0",
-		"@atlaskit/react-ufo": "^3.0.0",
+		"@atlaskit/primitives": "^14.1.0",
+		"@atlaskit/react-ufo": "^3.1.0",
 		"@atlaskit/spinner": "^18.0.0",
 		"@atlaskit/theme": "^17.0.0",
-		"@atlaskit/tokens": "^4.1.0",
+		"@atlaskit/tokens": "^4.2.0",
 		"@atlaskit/tooltip": "^20.0.0",
 		"@atlaskit/ufo": "^0.4.0",
 		"@atlaskit/visually-hidden": "^2.0.0",
@@ -116,9 +118,6 @@
 		"platform_media_cdn_single_host": {
 			"type": "boolean"
 		},
-		"media_viewer_integrates_ds_portal": {
-			"type": "boolean"
-		},
 		"platform_media_compiled": {
 			"type": "boolean"
 		}

package/types/package.json

@@ -3,7 +3,9 @@
   "main": "../dist/cjs/types.js",
   "module": "../dist/esm/types.js",
   "module:es2019": "../dist/es2019/types.js",
-  "sideEffects": false,
+  "sideEffects": [
+    "*.compiled.css"
+  ],
   "types": "../dist/types/types.d.ts",
   "typesVersions": {
     ">=4.5 <5.4": {