@atlaskit/media-card 79.16.17 → 79.16.18

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 (21) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/card/ui/progressBar/styles.js +1 -2
  3. package/dist/cjs/card/ui/titleBox/titleBoxComponents-compiled.js +1 -2
  4. package/dist/es2019/card/ui/progressBar/styles.js +1 -2
  5. package/dist/es2019/card/ui/titleBox/titleBoxComponents-compiled.js +1 -2
  6. package/dist/esm/card/ui/progressBar/styles.js +1 -2
  7. package/dist/esm/card/ui/titleBox/titleBoxComponents-compiled.js +1 -2
  8. package/dist/types/card/inlinePlayer.d.ts +1 -1
  9. package/dist/types/card/inlinePlayerLazy.d.ts +1 -1
  10. package/dist/types/card/inlinePlayerWrapperStyles.d.ts +1 -1
  11. package/dist/types/card/ui/playButton/styles.d.ts +1 -1
  12. package/dist/types/card/ui/titleBox/styles.d.ts +1 -1
  13. package/dist/types/utils/analytics/analytics.d.ts +1 -1
  14. package/dist/types-ts4.5/card/inlinePlayer.d.ts +1 -1
  15. package/dist/types-ts4.5/card/inlinePlayerLazy.d.ts +1 -1
  16. package/dist/types-ts4.5/card/inlinePlayerWrapperStyles.d.ts +1 -1
  17. package/dist/types-ts4.5/card/ui/playButton/styles.d.ts +1 -1
  18. package/dist/types-ts4.5/card/ui/titleBox/styles.d.ts +1 -1
  19. package/dist/types-ts4.5/utils/analytics/analytics.d.ts +1 -1
  20. package/example-helpers/index.tsx +7 -4
  21. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/media-card
2
2
 
3
+ ## 79.16.18
4
+
5
+ ### Patch Changes
6
+
7
+ - [`ddd049a745d38`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ddd049a745d38) -
8
+ Internal change to how legacy colors are applied. No visual changes.
9
+ - Updated dependencies
10
+
3
11
  ## 79.16.17
4
12
 
5
13
  ### Patch Changes
package/dist/cjs/card/ui/progressBar/styles.js CHANGED
@@ -8,7 +8,6 @@ exports.styledBarStyles = void 0;
8
8
  var _react = require("@emotion/react");
9
9
  var _mediaUi = require("@atlaskit/media-ui");
10
10
  var _styles = require("../styles");
11
- var _colors = require("@atlaskit/theme/colors");
12
11
  var _common = require("../common");
13
12
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
14
13
 
@@ -37,7 +36,7 @@ var getStyledBarStylesBasedOnProps = function getStyledBarStylesBasedOnProps(_re
37
36
  breakpoint = _ref.breakpoint,
38
37
  positionBottom = _ref.positionBottom,
39
38
  showOnTop = _ref.showOnTop;
40
- return "\n".concat(_mediaUi.borderRadius, "\noverflow: hidden;\nposition: absolute;\nwidth: ").concat(width, "%;\nleft: ").concat(left, "%;\nbackground-color: ").concat((0, _styles.rgba)(_colors.N0, 0.8), ";\nheight: ").concat(height + padding * 2, "px;\npadding: ").concat(padding, "px;\nbox-sizing: border-box;\n\n::before {\n content: '';\n width: ").concat(progress, "%;\n height: 100%;\n background-color: #44546F;\n ").concat(_mediaUi.borderRadius, "\n display: block;\n}\n").concat(generateResponsiveStyles(breakpoint, positionBottom, showOnTop), "\n");
39
+ return "\n".concat(_mediaUi.borderRadius, "\noverflow: hidden;\nposition: absolute;\nwidth: ").concat(width, "%;\nleft: ").concat(left, "%;\nbackground-color: ").concat((0, _styles.rgba)('#FFFFFF', 0.8), ";\nheight: ").concat(height + padding * 2, "px;\npadding: ").concat(padding, "px;\nbox-sizing: border-box;\n\n::before {\n content: '';\n width: ").concat(progress, "%;\n height: 100%;\n background-color: #44546F;\n ").concat(_mediaUi.borderRadius, "\n display: block;\n}\n").concat(generateResponsiveStyles(breakpoint, positionBottom, showOnTop), "\n");
41
40
  };
42
41
  /* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
43
42
 
package/dist/cjs/card/ui/titleBox/titleBoxComponents-compiled.js CHANGED
@@ -9,7 +9,6 @@ exports.TitleBoxWrapper = exports.TitleBoxIcon = exports.TitleBoxHeader = export
9
9
  require("./titleBoxComponents-compiled.compiled.css");
10
10
  var React = _interopRequireWildcard(require("react"));
11
11
  var _runtime = require("@compiled/react/runtime");
12
- var _colors = require("@atlaskit/theme/colors");
13
12
  var _styles = require("../styles");
14
13
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
15
14
  var smallLineHeight = 14;
@@ -28,7 +27,7 @@ var TitleBoxWrapper = exports.TitleBoxWrapper = function TitleBoxWrapper(props)
28
27
  var breakpoint = props.breakpoint,
29
28
  titleBoxBgColor = props.titleBoxBgColor,
30
29
  hidden = props.hidden;
31
- var color = titleBoxBgColor && (0, _styles.rgba)(HEX_REGEX.test(titleBoxBgColor) ? titleBoxBgColor : _colors.N0, 1);
30
+ var color = titleBoxBgColor && (0, _styles.rgba)(HEX_REGEX.test(titleBoxBgColor) ? titleBoxBgColor : '#FFFFFF', 1);
32
31
  return /*#__PURE__*/React.createElement("div", {
33
32
  id: "titleBoxWrapper",
34
33
  "data-testid": "media-title-box",
package/dist/es2019/card/ui/progressBar/styles.js CHANGED
@@ -2,7 +2,6 @@
2
2
  import { css } from '@emotion/react';
3
3
  import { borderRadius } from '@atlaskit/media-ui';
4
4
  import { rgba } from '../styles';
5
- import { N0 } from '@atlaskit/theme/colors';
6
5
  import { Breakpoint, getTitleBoxHeight, responsiveSettings } from '../common';
7
6
  const height = 3;
8
7
  const padding = 1;
@@ -36,7 +35,7 @@ overflow: hidden;
36
35
  position: absolute;
37
36
  width: ${width}%;
38
37
  left: ${left}%;
39
- background-color: ${rgba(N0, 0.8)};
38
+ background-color: ${rgba('#FFFFFF', 0.8)};
40
39
  height: ${height + padding * 2}px;
41
40
  padding: ${padding}px;
42
41
  box-sizing: border-box;
package/dist/es2019/card/ui/titleBox/titleBoxComponents-compiled.js CHANGED
@@ -2,7 +2,6 @@
2
2
  import "./titleBoxComponents-compiled.compiled.css";
3
3
  import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
- import { N0 } from '@atlaskit/theme/colors';
6
5
  import { rgba } from '../styles';
7
6
  const smallLineHeight = 14;
8
7
  const smallVerticalPadding = 4;
@@ -22,7 +21,7 @@ export const TitleBoxWrapper = props => {
22
21
  titleBoxBgColor,
23
22
  hidden
24
23
  } = props;
25
- const color = titleBoxBgColor && rgba(HEX_REGEX.test(titleBoxBgColor) ? titleBoxBgColor : N0, 1);
24
+ const color = titleBoxBgColor && rgba(HEX_REGEX.test(titleBoxBgColor) ? titleBoxBgColor : '#FFFFFF', 1);
26
25
  return /*#__PURE__*/React.createElement("div", {
27
26
  id: "titleBoxWrapper",
28
27
  "data-testid": "media-title-box",
package/dist/esm/card/ui/progressBar/styles.js CHANGED
@@ -2,7 +2,6 @@
2
2
  import { css } from '@emotion/react';
3
3
  import { borderRadius } from '@atlaskit/media-ui';
4
4
  import { rgba } from '../styles';
5
- import { N0 } from '@atlaskit/theme/colors';
6
5
  import { Breakpoint, getTitleBoxHeight, responsiveSettings } from '../common';
7
6
  var height = 3;
8
7
  var padding = 1;
@@ -29,7 +28,7 @@ var getStyledBarStylesBasedOnProps = function getStyledBarStylesBasedOnProps(_re
29
28
  breakpoint = _ref.breakpoint,
30
29
  positionBottom = _ref.positionBottom,
31
30
  showOnTop = _ref.showOnTop;
32
- return "\n".concat(borderRadius, "\noverflow: hidden;\nposition: absolute;\nwidth: ").concat(width, "%;\nleft: ").concat(left, "%;\nbackground-color: ").concat(rgba(N0, 0.8), ";\nheight: ").concat(height + padding * 2, "px;\npadding: ").concat(padding, "px;\nbox-sizing: border-box;\n\n::before {\n content: '';\n width: ").concat(progress, "%;\n height: 100%;\n background-color: #44546F;\n ").concat(borderRadius, "\n display: block;\n}\n").concat(generateResponsiveStyles(breakpoint, positionBottom, showOnTop), "\n");
31
+ return "\n".concat(borderRadius, "\noverflow: hidden;\nposition: absolute;\nwidth: ").concat(width, "%;\nleft: ").concat(left, "%;\nbackground-color: ").concat(rgba('#FFFFFF', 0.8), ";\nheight: ").concat(height + padding * 2, "px;\npadding: ").concat(padding, "px;\nbox-sizing: border-box;\n\n::before {\n content: '';\n width: ").concat(progress, "%;\n height: 100%;\n background-color: #44546F;\n ").concat(borderRadius, "\n display: block;\n}\n").concat(generateResponsiveStyles(breakpoint, positionBottom, showOnTop), "\n");
33
32
  };
34
33
  /* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
35
34
 
package/dist/esm/card/ui/titleBox/titleBoxComponents-compiled.js CHANGED
@@ -2,7 +2,6 @@
2
2
  import "./titleBoxComponents-compiled.compiled.css";
3
3
  import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
- import { N0 } from '@atlaskit/theme/colors';
6
5
  import { rgba } from '../styles';
7
6
  var smallLineHeight = 14;
8
7
  var smallVerticalPadding = 4;
@@ -20,7 +19,7 @@ export var TitleBoxWrapper = function TitleBoxWrapper(props) {
20
19
  var breakpoint = props.breakpoint,
21
20
  titleBoxBgColor = props.titleBoxBgColor,
22
21
  hidden = props.hidden;
23
- var color = titleBoxBgColor && rgba(HEX_REGEX.test(titleBoxBgColor) ? titleBoxBgColor : N0, 1);
22
+ var color = titleBoxBgColor && rgba(HEX_REGEX.test(titleBoxBgColor) ? titleBoxBgColor : '#FFFFFF', 1);
24
23
  return /*#__PURE__*/React.createElement("div", {
25
24
  id: "titleBoxWrapper",
26
25
  "data-testid": "media-title-box",
package/dist/types/card/inlinePlayer.d.ts CHANGED
@@ -21,4 +21,4 @@ export interface InlinePlayerOwnProps {
21
21
  export type InlinePlayerProps = InlinePlayerOwnProps & WithAnalyticsEventsProps;
22
22
  export declare const getPreferredVideoArtifact: (fileState: FileState) => keyof MediaFileArtifacts | undefined;
23
23
  export declare const InlinePlayerBase: ({ identifier, onError, onClick, dimensions, originalDimensions, selected, testId, forwardRef, autoplay, cardPreview, onFullscreenChange, videoControlsWrapperRef, }: InlinePlayerProps) => React.JSX.Element;
24
- export declare const InlinePlayer: React.ForwardRefExoticComponent<Omit<InlinePlayerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
24
+ export declare const InlinePlayer: React.ForwardRefExoticComponent<Omit<InlinePlayerProps, 'ref'> & React.RefAttributes<HTMLDivElement>>;
package/dist/types/card/inlinePlayerLazy.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { type ForwardRefExoticComponent, type LazyExoticComponent, type RefAttributes } from 'react';
2
2
  import type { InlinePlayerProps } from './inlinePlayer';
3
- export declare const InlinePlayerLazy: LazyExoticComponent<ForwardRefExoticComponent<Omit<InlinePlayerProps, "ref"> & RefAttributes<HTMLDivElement>>>;
3
+ export declare const InlinePlayerLazy: LazyExoticComponent<ForwardRefExoticComponent<Omit<InlinePlayerProps, 'ref'> & RefAttributes<HTMLDivElement>>>;
package/dist/types/card/inlinePlayerWrapperStyles.d.ts CHANGED
@@ -2,6 +2,6 @@ import { type SerializedStyles } from '@emotion/react';
2
2
  import { type InlinePlayerWrapperProps } from './types';
3
3
  export declare const inlinePlayerClassName = "media-card-inline-player";
4
4
  export declare const inlinePlayerWrapperStyles: {
5
- ({ dimensions, selected, }: InlinePlayerWrapperProps): SerializedStyles;
5
+ ({ dimensions, selected }: InlinePlayerWrapperProps): SerializedStyles;
6
6
  displayName: string;
7
7
  };
package/dist/types/card/ui/playButton/styles.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { type SerializedStyles } from '@emotion/react';
2
2
  export declare const playButtonClassName = "media-card-play-button";
3
3
  export declare const bkgClassName = "play-icon-background";
4
- export declare const fixedPlayButtonStyles: "\n .play-icon-background {\n width: 56px;\n height: 56px;\n }\n";
4
+ export declare const fixedPlayButtonStyles: '\n .play-icon-background {\n width: 56px;\n height: 56px;\n }\n';
5
5
  export declare const playButtonWrapperStyles: SerializedStyles;
6
6
  export declare const backgroundStyles: SerializedStyles;
package/dist/types/card/ui/titleBox/styles.d.ts CHANGED
@@ -7,7 +7,7 @@ type TitleBoxWrapperStyleArgs = {
7
7
  display?: 'none' | 'flex';
8
8
  };
9
9
  export declare const titleBoxWrapperStyles: {
10
- ({ breakpoint, display }: TitleBoxWrapperStyleArgs): SerializedStyles;
10
+ ({ breakpoint, display, }: TitleBoxWrapperStyleArgs): SerializedStyles;
11
11
  displayName: string;
12
12
  };
13
13
  export declare const titleBoxHeaderStyles: {
package/dist/types/utils/analytics/analytics.d.ts CHANGED
@@ -155,5 +155,5 @@ export declare const getAuthProviderFailedPayload: (durationMs: number, timeoutM
155
155
  collectionName?: string;
156
156
  }) => AuthProviderFailedAnalyticsPayload;
157
157
  export declare function fireMediaCardEvent(payload: MediaCardAnalyticsEventPayload, createAnalyticsEvent?: CreateUIAnalyticsEvent): void;
158
- export declare const createAndFireMediaCardEvent: (payload: MediaCardAnalyticsEventPayload) => (createAnalyticsEvent: CreateUIAnalyticsEvent) => UIAnalyticsEvent;
158
+ export declare const createAndFireMediaCardEvent: (payload: MediaCardAnalyticsEventPayload) => ((createAnalyticsEvent: CreateUIAnalyticsEvent) => UIAnalyticsEvent);
159
159
  export {};
package/dist/types-ts4.5/card/inlinePlayer.d.ts CHANGED
@@ -21,4 +21,4 @@ export interface InlinePlayerOwnProps {
21
21
  export type InlinePlayerProps = InlinePlayerOwnProps & WithAnalyticsEventsProps;
22
22
  export declare const getPreferredVideoArtifact: (fileState: FileState) => keyof MediaFileArtifacts | undefined;
23
23
  export declare const InlinePlayerBase: ({ identifier, onError, onClick, dimensions, originalDimensions, selected, testId, forwardRef, autoplay, cardPreview, onFullscreenChange, videoControlsWrapperRef, }: InlinePlayerProps) => React.JSX.Element;
24
- export declare const InlinePlayer: React.ForwardRefExoticComponent<Omit<InlinePlayerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
24
+ export declare const InlinePlayer: React.ForwardRefExoticComponent<Omit<InlinePlayerProps, 'ref'> & React.RefAttributes<HTMLDivElement>>;
package/dist/types-ts4.5/card/inlinePlayerLazy.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { type ForwardRefExoticComponent, type LazyExoticComponent, type RefAttributes } from 'react';
2
2
  import type { InlinePlayerProps } from './inlinePlayer';
3
- export declare const InlinePlayerLazy: LazyExoticComponent<ForwardRefExoticComponent<Omit<InlinePlayerProps, "ref"> & RefAttributes<HTMLDivElement>>>;
3
+ export declare const InlinePlayerLazy: LazyExoticComponent<ForwardRefExoticComponent<Omit<InlinePlayerProps, 'ref'> & RefAttributes<HTMLDivElement>>>;
package/dist/types-ts4.5/card/inlinePlayerWrapperStyles.d.ts CHANGED
@@ -2,6 +2,6 @@ import { type SerializedStyles } from '@emotion/react';
2
2
  import { type InlinePlayerWrapperProps } from './types';
3
3
  export declare const inlinePlayerClassName = "media-card-inline-player";
4
4
  export declare const inlinePlayerWrapperStyles: {
5
- ({ dimensions, selected, }: InlinePlayerWrapperProps): SerializedStyles;
5
+ ({ dimensions, selected }: InlinePlayerWrapperProps): SerializedStyles;
6
6
  displayName: string;
7
7
  };
package/dist/types-ts4.5/card/ui/playButton/styles.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { type SerializedStyles } from '@emotion/react';
2
2
  export declare const playButtonClassName = "media-card-play-button";
3
3
  export declare const bkgClassName = "play-icon-background";
4
- export declare const fixedPlayButtonStyles: "\n .play-icon-background {\n width: 56px;\n height: 56px;\n }\n";
4
+ export declare const fixedPlayButtonStyles: '\n .play-icon-background {\n width: 56px;\n height: 56px;\n }\n';
5
5
  export declare const playButtonWrapperStyles: SerializedStyles;
6
6
  export declare const backgroundStyles: SerializedStyles;
package/dist/types-ts4.5/card/ui/titleBox/styles.d.ts CHANGED
@@ -7,7 +7,7 @@ type TitleBoxWrapperStyleArgs = {
7
7
  display?: 'none' | 'flex';
8
8
  };
9
9
  export declare const titleBoxWrapperStyles: {
10
- ({ breakpoint, display }: TitleBoxWrapperStyleArgs): SerializedStyles;
10
+ ({ breakpoint, display, }: TitleBoxWrapperStyleArgs): SerializedStyles;
11
11
  displayName: string;
12
12
  };
13
13
  export declare const titleBoxHeaderStyles: {
package/dist/types-ts4.5/utils/analytics/analytics.d.ts CHANGED
@@ -155,5 +155,5 @@ export declare const getAuthProviderFailedPayload: (durationMs: number, timeoutM
155
155
  collectionName?: string;
156
156
  }) => AuthProviderFailedAnalyticsPayload;
157
157
  export declare function fireMediaCardEvent(payload: MediaCardAnalyticsEventPayload, createAnalyticsEvent?: CreateUIAnalyticsEvent): void;
158
- export declare const createAndFireMediaCardEvent: (payload: MediaCardAnalyticsEventPayload) => (createAnalyticsEvent: CreateUIAnalyticsEvent) => UIAnalyticsEvent;
158
+ export declare const createAndFireMediaCardEvent: (payload: MediaCardAnalyticsEventPayload) => ((createAnalyticsEvent: CreateUIAnalyticsEvent) => UIAnalyticsEvent);
159
159
  export {};
package/example-helpers/index.tsx CHANGED
@@ -100,10 +100,13 @@ export const annotateCardAction: CardAction = {
100
100
  icon: <AnnotateIcon label="annotate" />,
101
101
  };
102
102
 
103
- export const actions: ({
104
- label: string;
105
- handler: () => void;
106
- } | CardAction)[] = [openAction, closeAction, deleteAction, annotateCardAction];
103
+ export const actions: (
104
+ | {
105
+ label: string;
106
+ handler: () => void;
107
+ }
108
+ | CardAction
109
+ )[] = [openAction, closeAction, deleteAction, annotateCardAction];
107
110
 
108
111
  export const anotherAction: CardAction = {
109
112
  label: 'Some other action',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/media-card",
3
- "version": "79.16.17",
3
+ "version": "79.16.18",
4
4
  "description": "Includes all media card related components, CardView, CardViewSmall, Card...",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -49,7 +49,7 @@
49
49
  "@atlaskit/react-ufo": "^5.12.0",
50
50
  "@atlaskit/spinner": "^19.1.0",
51
51
  "@atlaskit/theme": "^23.0.0",
52
- "@atlaskit/tmp-editor-statsig": "^56.0.0",
52
+ "@atlaskit/tmp-editor-statsig": "^57.0.0",
53
53
  "@atlaskit/tokens": "^12.0.0",
54
54
  "@atlaskit/tooltip": "^21.1.0",
55
55
  "@atlaskit/ufo": "^0.4.0",