@atlaskit/media-card 73.3.0 → 73.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/CHANGELOG.md +99 -0
  2. package/dist/cjs/root/inline/mediaInlineCard.js +7 -4
  3. package/dist/cjs/utils/viewportDetector.js +1 -1
  4. package/dist/cjs/version.json +1 -1
  5. package/dist/es2019/root/card/index.js +1 -2
  6. package/dist/es2019/root/inline/mediaInlineCard.js +7 -4
  7. package/dist/es2019/utils/viewportDetector.js +1 -1
  8. package/dist/es2019/version.json +1 -1
  9. package/dist/esm/root/card/index.js +1 -2
  10. package/dist/esm/root/inline/mediaInlineCard.js +7 -4
  11. package/dist/esm/utils/viewportDetector.js +1 -1
  12. package/dist/esm/version.json +1 -1
  13. package/dist/types/root/card/index.d.ts +2 -3
  14. package/dist/types/root/inlinePlayer.d.ts +2 -3
  15. package/package.json +6 -10
package/CHANGELOG.md CHANGED
@@ -1,5 +1,104 @@
1
1
  # @atlaskit/media-card
2
2
 
3
+ ## 73.4.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`e7581c27aff`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e7581c27aff) - Removed unused dev dependencies
8
+ - [`f862d5ae7aa`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f862d5ae7aa) - remove RxJs peer dependency
9
+ - [`118f3af101f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/118f3af101f) - Media Client APIs has been updated to use MediaSubscribable which provides subscription functionality (similar to RxJs observables).
10
+ It exposes subscribe method that is called with MediaObserver as an argument and returns MediaSubscription.
11
+ MediaSubscription exposes unsubscribe method.
12
+
13
+ getFileState:
14
+ The returned type of this function has changed from RxJs ReplaySubject to MediaSubscribable.
15
+
16
+ ```
17
+ import { MediaClient, MediaObserver, MediaSubscribable, MediaSubscription } from '@atlaskit/media-client';
18
+
19
+ const mediaClient = new MediaClient({ authProvider });
20
+
21
+ const fileStateSubscribable: MediaSubscribable<FileState> = mediaClient.file.getFileState(id);
22
+
23
+ const mediaObserver: MediaObserver<FileState> = {
24
+ next: (fileState) => {
25
+ nextCallback(fileState)
26
+ },
27
+ error: (error) => {
28
+ errorCallback(error)
29
+ },
30
+ };
31
+
32
+ const subscription: MediaSubscription = fileStateSubscribable.subscribe(mediaObserver);
33
+
34
+ subscription.unsubscribe();
35
+ ```
36
+
37
+ upload:
38
+ The returned type of this function has changed from RxJs ReplaySubject to MediaSubscribable.
39
+
40
+ ```
41
+ import { MediaClient, MediaObserver, MediaSubscribable, MediaSubscription } from '@atlaskit/media-client';
42
+
43
+ const mediaClient = new MediaClient({ authProvider });
44
+
45
+ const uploadFileSubscribable: MediaSubscribable<FileState> = mediaClient.file.upload(uploadableFile);
46
+
47
+ const mediaObserver: MediaObserver<FileState> = {
48
+ next: (fileState) => {
49
+ nextCallback(fileState)
50
+ },
51
+ error: (error) => {
52
+ errorCallback(error)
53
+ },
54
+ };
55
+
56
+ const subscription: MediaSubscription = uploadFileSubscribable.subscribe(mediaObserver);
57
+
58
+ subscription.unsubscribe();
59
+ ```
60
+
61
+ getItems:
62
+ The returned type of this function has changed from RxJs ReplaySubject to MediaSubscribable.
63
+
64
+ ```
65
+ import { MediaClient, MediaObserver, MediaSubscribable, MediaSubscription } from '@atlaskit/media-client';
66
+
67
+ const mediaClient = new MediaClient({ authProvider });
68
+
69
+ const collectionItemsSubscribable: MediaSubscribable<MediaCollectionItem[]> = mediaClient.collection.getItems(collectionName);
70
+
71
+ const mediaObserver: MediaObserver<MediaCollectionItem[]> = {
72
+ next: (items) => {
73
+ nextCallback(items)
74
+ },
75
+ error: (error) => {
76
+ errorCallback(error)
77
+ },
78
+ };
79
+
80
+ const subscription: MediaSubscription = collectionItemsSubscribable.subscribe(mediaObserver);
81
+
82
+ subscription.unsubscribe();
83
+ ```
84
+
85
+ ### Patch Changes
86
+
87
+ - Updated dependencies
88
+
89
+ ## 73.3.2
90
+
91
+ ### Patch Changes
92
+
93
+ - [`4f97dd898fc`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4f97dd898fc) - EDM-2995: fix media inline icon, use mimeType to render a better icon type
94
+ - Updated dependencies
95
+
96
+ ## 73.3.1
97
+
98
+ ### Patch Changes
99
+
100
+ - [`9671dfa12b1`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9671dfa12b1) - Revert [MEX-1276] fix vertical scroll for firefox when media link is wrapped
101
+
3
102
  ## 73.3.0
4
103
 
5
104
  ### Minor Changes
package/dist/cjs/root/inline/mediaInlineCard.js CHANGED
@@ -19,7 +19,7 @@ var _reactIntlNext = require("react-intl-next");
19
19
 
20
20
  var _mediaUi = require("@atlaskit/media-ui");
21
21
 
22
- var _mediaTypeIcon = require("@atlaskit/media-ui/media-type-icon");
22
+ var _mimeTypeIcon = require("@atlaskit/media-ui/mime-type-icon");
23
23
 
24
24
  var _mediaViewer = require("@atlaskit/media-viewer");
25
25
 
@@ -149,12 +149,15 @@ var MediaInlineCardInternal = function MediaInlineCardInternal(_ref) {
149
149
  }
150
150
 
151
151
  var mediaType = fileState.mediaType,
152
- name = fileState.name;
152
+ name = fileState.name,
153
+ mimeType = fileState.mimeType;
153
154
 
154
- var linkIcon = /*#__PURE__*/_react.default.createElement(_mediaTypeIcon.MediaTypeIcon, {
155
+ var linkIcon = /*#__PURE__*/_react.default.createElement(_mimeTypeIcon.MimeTypeIcon, {
155
156
  testId: 'media-inline-card-file-type-icon',
156
157
  size: "small",
157
- type: mediaType
158
+ mediaType: mediaType,
159
+ mimeType: mimeType,
160
+ name: name
158
161
  });
159
162
 
160
163
  var mediaViewer = renderMediaViewer();
package/dist/cjs/utils/viewportDetector.js CHANGED
@@ -35,7 +35,7 @@ var ViewportAnchor = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
35
35
  ref: ref,
36
36
  className: "media-card-viewport-anchor",
37
37
  style: {
38
- position: 'absolute',
38
+ position: 'relative',
39
39
  top: "".concat(props.offsetTop, "px")
40
40
  }
41
41
  });
package/dist/cjs/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/media-card",
3
- "version": "73.3.0",
3
+ "version": "73.4.0",
4
4
  "sideEffects": false
5
5
  }
package/dist/es2019/root/card/index.js CHANGED
@@ -5,7 +5,7 @@ import { version as packageVersion, name as packageName } from '../../version.js
5
5
  import { withAnalyticsEvents } from '@atlaskit/analytics-next';
6
6
  import { withMediaAnalyticsContext } from '@atlaskit/media-common';
7
7
  import DownloadIcon from '@atlaskit/icon/glyph/download';
8
- import { globalMediaEventEmitter, isDifferentIdentifier, isFileIdentifier, RECENTS_COLLECTION, isImageRepresentationReady, isExternalImageIdentifier, imageResizeModeToFileImageMode } from '@atlaskit/media-client';
8
+ import { globalMediaEventEmitter, isDifferentIdentifier, isFileIdentifier, RECENTS_COLLECTION, isImageRepresentationReady, isExternalImageIdentifier, isProcessedFileState, imageResizeModeToFileImageMode } from '@atlaskit/media-client';
9
9
  import { MediaViewer } from '@atlaskit/media-viewer';
10
10
  import { injectIntl, IntlProvider } from 'react-intl-next';
11
11
  import { CardView } from '../cardView';
@@ -20,7 +20,6 @@ import { fireOperationalEvent, fireCommencedEvent, relevantFeatureFlagNames, fir
20
20
  import getDocument from '../../utils/document';
21
21
  import { StoreSSRDataScript, getSSRData } from '../../utils/globalScope';
22
22
  import { getCardStateFromFileState, createStateUpdater } from './cardState';
23
- import { isProcessedFileState } from '@atlaskit/media-client';
24
23
  import { getMediaFeatureFlag } from '@atlaskit/media-common';
25
24
  import { isBigger } from '../../utils/dimensionComparer';
26
25
  import { getMediaCardCursor } from '../../utils/getMediaCardCursor';
package/dist/es2019/root/inline/mediaInlineCard.js CHANGED
@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
2
2
  import ReactDOM from 'react-dom';
3
3
  import { injectIntl, IntlProvider, createIntl } from 'react-intl-next';
4
4
  import { MediaInlineCardLoadedView, MediaInlineCardLoadingView, MediaInlineCardErroredView, messages } from '@atlaskit/media-ui';
5
- import { MediaTypeIcon } from '@atlaskit/media-ui/media-type-icon';
5
+ import { MimeTypeIcon } from '@atlaskit/media-ui/mime-type-icon';
6
6
  import { MediaViewer } from '@atlaskit/media-viewer';
7
7
  import Tooltip from '@atlaskit/tooltip';
8
8
  import { formatDate } from '@atlaskit/media-ui/formatDate';
@@ -112,12 +112,15 @@ export const MediaInlineCardInternal = ({
112
112
 
113
113
  const {
114
114
  mediaType,
115
- name
115
+ name,
116
+ mimeType
116
117
  } = fileState;
117
- const linkIcon = /*#__PURE__*/React.createElement(MediaTypeIcon, {
118
+ const linkIcon = /*#__PURE__*/React.createElement(MimeTypeIcon, {
118
119
  testId: 'media-inline-card-file-type-icon',
119
120
  size: "small",
120
- type: mediaType
121
+ mediaType: mediaType,
122
+ mimeType: mimeType,
123
+ name: name
121
124
  });
122
125
  const mediaViewer = renderMediaViewer();
123
126
  let formattedDate;
package/dist/es2019/utils/viewportDetector.js CHANGED
@@ -15,7 +15,7 @@ export const ViewportAnchor = /*#__PURE__*/forwardRef((props, ref) => {
15
15
  ref: ref,
16
16
  className: "media-card-viewport-anchor",
17
17
  style: {
18
- position: 'absolute',
18
+ position: 'relative',
19
19
  top: `${props.offsetTop}px`
20
20
  }
21
21
  });
package/dist/es2019/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/media-card",
3
- "version": "73.3.0",
3
+ "version": "73.4.0",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/root/card/index.js CHANGED
@@ -23,7 +23,7 @@ import { version as packageVersion, name as packageName } from '../../version.js
23
23
  import { withAnalyticsEvents } from '@atlaskit/analytics-next';
24
24
  import { withMediaAnalyticsContext } from '@atlaskit/media-common';
25
25
  import DownloadIcon from '@atlaskit/icon/glyph/download';
26
- import { globalMediaEventEmitter, isDifferentIdentifier, isFileIdentifier, RECENTS_COLLECTION, isImageRepresentationReady, isExternalImageIdentifier, imageResizeModeToFileImageMode } from '@atlaskit/media-client';
26
+ import { globalMediaEventEmitter, isDifferentIdentifier, isFileIdentifier, RECENTS_COLLECTION, isImageRepresentationReady, isExternalImageIdentifier, isProcessedFileState, imageResizeModeToFileImageMode } from '@atlaskit/media-client';
27
27
  import { MediaViewer } from '@atlaskit/media-viewer';
28
28
  import { injectIntl, IntlProvider } from 'react-intl-next';
29
29
  import { CardView } from '../cardView';
@@ -38,7 +38,6 @@ import { fireOperationalEvent as _fireOperationalEvent, fireCommencedEvent as _f
38
38
  import getDocument from '../../utils/document';
39
39
  import { StoreSSRDataScript, getSSRData } from '../../utils/globalScope';
40
40
  import { getCardStateFromFileState, createStateUpdater } from './cardState';
41
- import { isProcessedFileState } from '@atlaskit/media-client';
42
41
  import { getMediaFeatureFlag } from '@atlaskit/media-common';
43
42
  import { isBigger } from '../../utils/dimensionComparer';
44
43
  import { getMediaCardCursor } from '../../utils/getMediaCardCursor';
package/dist/esm/root/inline/mediaInlineCard.js CHANGED
@@ -3,7 +3,7 @@ import React, { useState, useEffect } from 'react';
3
3
  import ReactDOM from 'react-dom';
4
4
  import { injectIntl, IntlProvider, createIntl } from 'react-intl-next';
5
5
  import { MediaInlineCardLoadedView, MediaInlineCardLoadingView, MediaInlineCardErroredView, messages } from '@atlaskit/media-ui';
6
- import { MediaTypeIcon } from '@atlaskit/media-ui/media-type-icon';
6
+ import { MimeTypeIcon } from '@atlaskit/media-ui/mime-type-icon';
7
7
  import { MediaViewer } from '@atlaskit/media-viewer';
8
8
  import Tooltip from '@atlaskit/tooltip';
9
9
  import { formatDate } from '@atlaskit/media-ui/formatDate';
@@ -125,11 +125,14 @@ export var MediaInlineCardInternal = function MediaInlineCardInternal(_ref) {
125
125
  }
126
126
 
127
127
  var mediaType = fileState.mediaType,
128
- name = fileState.name;
129
- var linkIcon = /*#__PURE__*/React.createElement(MediaTypeIcon, {
128
+ name = fileState.name,
129
+ mimeType = fileState.mimeType;
130
+ var linkIcon = /*#__PURE__*/React.createElement(MimeTypeIcon, {
130
131
  testId: 'media-inline-card-file-type-icon',
131
132
  size: "small",
132
- type: mediaType
133
+ mediaType: mediaType,
134
+ mimeType: mimeType,
135
+ name: name
133
136
  });
134
137
  var mediaViewer = renderMediaViewer();
135
138
  var formattedDate;
package/dist/esm/utils/viewportDetector.js CHANGED
@@ -21,7 +21,7 @@ export var ViewportAnchor = /*#__PURE__*/forwardRef(function (props, ref) {
21
21
  ref: ref,
22
22
  className: "media-card-viewport-anchor",
23
23
  style: {
24
- position: 'absolute',
24
+ position: 'relative',
25
25
  top: "".concat(props.offsetTop, "px")
26
26
  }
27
27
  });
package/dist/esm/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/media-card",
3
- "version": "73.3.0",
3
+ "version": "73.4.0",
4
4
  "sideEffects": false
5
5
  }
package/dist/types/root/card/index.d.ts CHANGED
@@ -1,7 +1,6 @@
1
1
  import React, { Component } from 'react';
2
2
  import { UIAnalyticsEvent, WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
3
- import { FileIdentifier } from '@atlaskit/media-client';
4
- import { Subscription } from 'rxjs/Subscription';
3
+ import { FileIdentifier, MediaSubscription } from '@atlaskit/media-client';
5
4
  import { WrappedComponentProps } from 'react-intl-next';
6
5
  import { CardAction, CardProps, CardState } from '../..';
7
6
  export declare type CardBaseProps = CardProps & WithAnalyticsEventsProps & Partial<WrappedComponentProps>;
@@ -11,7 +10,7 @@ export declare class CardBase extends Component<CardBaseProps, CardState> {
11
10
  private viewportPostAnchorRef;
12
11
  private ssrReliability;
13
12
  private timeElapsedTillCommenced;
14
- subscription?: Subscription;
13
+ subscription?: MediaSubscription;
15
14
  private ssrData?;
16
15
  static defaultProps: Partial<CardProps>;
17
16
  constructor(props: CardBaseProps);
package/dist/types/root/inlinePlayer.d.ts CHANGED
@@ -1,7 +1,6 @@
1
1
  import React from 'react';
2
2
  import { Component } from 'react';
3
- import { MediaClient, FileIdentifier, FileState, MediaFileArtifacts } from '@atlaskit/media-client';
4
- import { Subscription } from 'rxjs/Subscription';
3
+ import { MediaClient, FileIdentifier, FileState, MediaFileArtifacts, MediaSubscription } from '@atlaskit/media-client';
5
4
  import { CardDimensions, NumericalCardDimensions } from '..';
6
5
  import { WithAnalyticsEventsProps, UIAnalyticsEvent } from '@atlaskit/analytics-next';
7
6
  import type { CardPreview } from '..';
@@ -28,7 +27,7 @@ export interface InlinePlayerState {
28
27
  }
29
28
  export declare const getPreferredVideoArtifact: (fileState: FileState) => keyof MediaFileArtifacts | undefined;
30
29
  export declare class InlinePlayerBase extends Component<InlinePlayerProps, InlinePlayerState> {
31
- subscription?: Subscription;
30
+ subscription?: MediaSubscription;
32
31
  state: InlinePlayerState;
33
32
  divRef: React.RefObject<HTMLDivElement>;
34
33
  static defaultProps: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/media-card",
3
- "version": "73.3.0",
3
+ "version": "73.4.0",
4
4
  "description": "Includes all media card related components, CardView, CardViewSmall, Card...",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -33,10 +33,10 @@
33
33
  "@atlaskit/editor-shared-styles": "^2.0.0",
34
34
  "@atlaskit/icon": "^21.10.0",
35
35
  "@atlaskit/in-product-testing": "^0.1.0",
36
- "@atlaskit/media-client": "^14.4.0",
36
+ "@atlaskit/media-client": "^15.0.0",
37
37
  "@atlaskit/media-common": "^2.11.0",
38
- "@atlaskit/media-ui": "^20.0.0",
39
- "@atlaskit/media-viewer": "^46.1.0",
38
+ "@atlaskit/media-ui": "^21.0.0",
39
+ "@atlaskit/media-viewer": "^46.2.0",
40
40
  "@atlaskit/spinner": "^15.1.0",
41
41
  "@atlaskit/theme": "^12.1.0",
42
42
  "@atlaskit/tooltip": "^17.5.0",
@@ -51,7 +51,6 @@
51
51
  "react": "^16.8.0",
52
52
  "react-dom": "^16.8.0",
53
53
  "react-intl-next": "npm:react-intl@^5.18.1",
54
- "rxjs": "^5.5.0",
55
54
  "styled-components": "^3.2.6"
56
55
  },
57
56
  "devDependencies": {
@@ -61,14 +60,12 @@
61
60
  "@atlaskit/checkbox": "^12.3.0",
62
61
  "@atlaskit/docs": "*",
63
62
  "@atlaskit/inline-message": "^11.2.0",
64
- "@atlaskit/item": "^12.0.0",
65
- "@atlaskit/media-core": "^32.2.0",
66
- "@atlaskit/media-test-helpers": "^29.2.0",
63
+ "@atlaskit/media-core": "^32.3.0",
64
+ "@atlaskit/media-test-helpers": "^29.3.0",
67
65
  "@atlaskit/radio": "^5.3.2",
68
66
  "@atlaskit/range": "^6.0.0",
69
67
  "@atlaskit/select": "^15.2.1",
70
68
  "@atlaskit/ssr": "*",
71
- "@atlaskit/textfield": "^5.1.0",
72
69
  "@atlaskit/toggle": "^12.4.0",
73
70
  "@atlaskit/visual-regression": "*",
74
71
  "@atlaskit/webdriver-runner": "*",
@@ -83,7 +80,6 @@
83
80
  "react": "^16.8.0",
84
81
  "react-dom": "^16.8.0",
85
82
  "react-intl-next": "npm:react-intl@^5.18.1",
86
- "rxjs": "^5.5.0",
87
83
  "typescript": "3.9.6",
88
84
  "uuid": "^3.1.0",
89
85
  "wait-for-expect": "^1.2.0"