@atlaskit/editor-plugin-media 10.1.1 → 10.1.2

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 (5) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/cjs/nodeviews/styles.js +8 -1
  3. package/dist/es2019/nodeviews/styles.js +8 -1
  4. package/dist/esm/nodeviews/styles.js +8 -1
  5. package/package.json +5 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-media
2
2
 
3
+ ## 10.1.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`ca2338799c141`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ca2338799c141) -
8
+ [ux] Fix media cards and media singles to use the correct border radius in the editor, renderer
9
+ and inline media player.
10
+ - Updated dependencies
11
+
3
12
  ## 10.1.1
4
13
 
5
14
  ### Patch Changes
package/dist/cjs/nodeviews/styles.js CHANGED
@@ -8,6 +8,7 @@ exports.MediaSingleNodeSelector = exports.MediaCardWrapper = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _react2 = require("@emotion/react");
10
10
  var _ui = require("@atlaskit/editor-common/ui");
11
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
11
12
  /**
12
13
  * @jsxRuntime classic
13
14
  * @jsx jsx
@@ -36,6 +37,11 @@ var MediaCardWrapper = exports.MediaCardWrapper = function MediaCardWrapper(_ref
36
37
  borderWidth = _ref$borderWidth === void 0 ? 0 : _ref$borderWidth,
37
38
  onContextMenu = _ref.onContextMenu;
38
39
  var calculatedBorderWidth = selected && borderWidth > 0 ? borderWidth + 1 : borderWidth;
40
+ // [FEATURE FLAG: platform_editor_media_border_radius_fix]
41
+ // Fixes border radius calculation to properly fit image with 8px radius
42
+ // To clean up: keep only flag-on behavior (calculatedBorderWidth + 8)
43
+ var borderRadius = (0, _platformFeatureFlags.fg)('platform_editor_media_border_radius_fix') ? "".concat(calculatedBorderWidth + 8, "px") : "".concat(calculatedBorderWidth * 2, "px"); // OLD BEHAVIOR (to be removed when flag is cleaned up)
44
+
39
45
  return (0, _react2.jsx)("div", {
40
46
  "data-testid": "media-card-wrapper"
41
47
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -47,7 +53,8 @@ var MediaCardWrapper = exports.MediaCardWrapper = function MediaCardWrapper(_ref
47
53
  borderWidth: "".concat(calculatedBorderWidth, "px"),
48
54
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
49
55
  borderStyle: 'solid',
50
- borderRadius: "".concat(calculatedBorderWidth * 2, "px")
56
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
57
+ borderRadius: borderRadius
51
58
  }
52
59
  }, (0, _react2.jsx)("div", {
53
60
  css: forcedDimensionsStyles,
package/dist/es2019/nodeviews/styles.js CHANGED
@@ -7,6 +7,7 @@ import React from 'react';
7
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
8
8
  import { css, jsx } from '@emotion/react';
9
9
  import { MediaBorderGapFiller } from '@atlaskit/editor-common/ui';
10
+ import { fg } from '@atlaskit/platform-feature-flags';
10
11
  export const MediaSingleNodeSelector = 'media-single-node';
11
12
  const absoluteDivStyles = css({
12
13
  position: 'absolute',
@@ -28,6 +29,11 @@ export const MediaCardWrapper = ({
28
29
  onContextMenu
29
30
  }) => {
30
31
  const calculatedBorderWidth = selected && borderWidth > 0 ? borderWidth + 1 : borderWidth;
32
+ // [FEATURE FLAG: platform_editor_media_border_radius_fix]
33
+ // Fixes border radius calculation to properly fit image with 8px radius
34
+ // To clean up: keep only flag-on behavior (calculatedBorderWidth + 8)
35
+ const borderRadius = fg('platform_editor_media_border_radius_fix') ? `${calculatedBorderWidth + 8}px` : `${calculatedBorderWidth * 2}px`; // OLD BEHAVIOR (to be removed when flag is cleaned up)
36
+
31
37
  return jsx("div", {
32
38
  "data-testid": "media-card-wrapper"
33
39
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -39,7 +45,8 @@ export const MediaCardWrapper = ({
39
45
  borderWidth: `${calculatedBorderWidth}px`,
40
46
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
41
47
  borderStyle: 'solid',
42
- borderRadius: `${calculatedBorderWidth * 2}px`
48
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
49
+ borderRadius
43
50
  }
44
51
  }, jsx("div", {
45
52
  css: forcedDimensionsStyles,
package/dist/esm/nodeviews/styles.js CHANGED
@@ -7,6 +7,7 @@ import React from 'react';
7
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
8
8
  import { css, jsx } from '@emotion/react';
9
9
  import { MediaBorderGapFiller } from '@atlaskit/editor-common/ui';
10
+ import { fg } from '@atlaskit/platform-feature-flags';
10
11
  export var MediaSingleNodeSelector = 'media-single-node';
11
12
  var absoluteDivStyles = css({
12
13
  position: 'absolute',
@@ -28,6 +29,11 @@ export var MediaCardWrapper = function MediaCardWrapper(_ref) {
28
29
  borderWidth = _ref$borderWidth === void 0 ? 0 : _ref$borderWidth,
29
30
  onContextMenu = _ref.onContextMenu;
30
31
  var calculatedBorderWidth = selected && borderWidth > 0 ? borderWidth + 1 : borderWidth;
32
+ // [FEATURE FLAG: platform_editor_media_border_radius_fix]
33
+ // Fixes border radius calculation to properly fit image with 8px radius
34
+ // To clean up: keep only flag-on behavior (calculatedBorderWidth + 8)
35
+ var borderRadius = fg('platform_editor_media_border_radius_fix') ? "".concat(calculatedBorderWidth + 8, "px") : "".concat(calculatedBorderWidth * 2, "px"); // OLD BEHAVIOR (to be removed when flag is cleaned up)
36
+
31
37
  return jsx("div", {
32
38
  "data-testid": "media-card-wrapper"
33
39
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -39,7 +45,8 @@ export var MediaCardWrapper = function MediaCardWrapper(_ref) {
39
45
  borderWidth: "".concat(calculatedBorderWidth, "px"),
40
46
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
41
47
  borderStyle: 'solid',
42
- borderRadius: "".concat(calculatedBorderWidth * 2, "px")
48
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
49
+ borderRadius: borderRadius
43
50
  }
44
51
  }, jsx("div", {
45
52
  css: forcedDimensionsStyles,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-media",
3
- "version": "10.1.1",
3
+ "version": "10.1.2",
4
4
  "description": "Media plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -67,7 +67,7 @@
67
67
  "@atlaskit/textfield": "^8.2.0",
68
68
  "@atlaskit/theme": "^22.0.0",
69
69
  "@atlaskit/tmp-editor-statsig": "^45.0.0",
70
- "@atlaskit/tokens": "^11.1.0",
70
+ "@atlaskit/tokens": "^11.2.0",
71
71
  "@atlaskit/tooltip": "^21.0.0",
72
72
  "@babel/runtime": "^7.0.0",
73
73
  "@emotion/react": "^11.7.1",
@@ -162,6 +162,9 @@
162
162
  },
163
163
  "confluence_fe_create_inline_comment_exp_coverage_2": {
164
164
  "type": "boolean"
165
+ },
166
+ "platform_editor_media_border_radius_fix": {
167
+ "type": "boolean"
165
168
  }
166
169
  },
167
170
  "stricter": {