@atlaskit/editor-plugin-card 5.4.12 → 5.4.14

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 (18) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/cjs/nodeviews/inlineCardWithAwareness.js +17 -8
  3. package/dist/cjs/ui/AwarenessWrapper/index.js +21 -18
  4. package/dist/cjs/ui/OpenButtonOverlay/index.js +10 -3
  5. package/dist/cjs/ui/OpenButtonOverlay/types.js +5 -1
  6. package/dist/es2019/nodeviews/inlineCardWithAwareness.js +17 -8
  7. package/dist/es2019/ui/AwarenessWrapper/index.js +21 -18
  8. package/dist/es2019/ui/OpenButtonOverlay/index.js +9 -2
  9. package/dist/es2019/ui/OpenButtonOverlay/types.js +1 -0
  10. package/dist/esm/nodeviews/inlineCardWithAwareness.js +17 -8
  11. package/dist/esm/ui/AwarenessWrapper/index.js +21 -18
  12. package/dist/esm/ui/OpenButtonOverlay/index.js +10 -3
  13. package/dist/esm/ui/OpenButtonOverlay/types.js +1 -0
  14. package/dist/types/ui/OpenButtonOverlay/index.d.ts +1 -1
  15. package/dist/types/ui/OpenButtonOverlay/types.d.ts +2 -0
  16. package/dist/types-ts4.5/ui/OpenButtonOverlay/index.d.ts +1 -1
  17. package/dist/types-ts4.5/ui/OpenButtonOverlay/types.d.ts +2 -0
  18. package/package.json +13 -7
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/editor-plugin-card
2
2
 
3
+ ## 5.4.14
4
+
5
+ ### Patch Changes
6
+
7
+ - [#143317](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/143317)
8
+ [`9af7f0abb556d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9af7f0abb556d) -
9
+ Add placeholder replace for SSRed element to ignore recalculation on TTVC
10
+ - Updated dependencies
11
+
12
+ ## 5.4.13
13
+
14
+ ### Patch Changes
15
+
16
+ - [#141796](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/141796)
17
+ [`79a03eeb47e72`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/79a03eeb47e72) -
18
+ [ux] Fix truncate issue for open button text when hover on smart link
19
+ - Updated dependencies
20
+
3
21
  ## 5.4.12
4
22
 
5
23
  ### Patch Changes
package/dist/cjs/nodeviews/inlineCardWithAwareness.js CHANGED
@@ -19,6 +19,7 @@ var _inlineCard = require("./inlineCard");
19
19
  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); }
20
20
  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; }
21
21
  var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0, _react.memo)(function (_ref) {
22
+ var _pluginInjectionApi$c;
22
23
  var node = _ref.node,
23
24
  cardContext = _ref.cardContext,
24
25
  actionOptions = _ref.actionOptions,
@@ -44,6 +45,7 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
44
45
  _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
45
46
  isResolvedViewRendered = _useState6[0],
46
47
  setIsResolvedViewRendered = _useState6[1];
48
+ var editorAppearance = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c = pluginInjectionApi.card.sharedState.currentState()) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.editorAppearance;
47
49
  var onResolve = (0, _react.useCallback)(function (tr, title) {
48
50
  if ((0, _platformFeatureFlags.fg)('platform_editor_fix_card_plugin_state')) {
49
51
  var metadata = tr.getMeta(_pluginKey.pluginKey);
@@ -80,7 +82,8 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
80
82
  var innerCardWithOpenButtonOverlay = (0, _react.useMemo)(function () {
81
83
  return /*#__PURE__*/_react.default.createElement(_OpenButtonOverlay.default, {
82
84
  isVisible: isResolvedViewRendered,
83
- url: node.attrs.url
85
+ url: node.attrs.url,
86
+ editorAppearance: editorAppearance
84
87
  }, /*#__PURE__*/_react.default.createElement(_inlineCard.InlineCard, {
85
88
  node: node,
86
89
  view: view,
@@ -93,7 +96,7 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
93
96
  isHovered: isHovered,
94
97
  isPageSSRed: isPageSSRed
95
98
  }));
96
- }, [isResolvedViewRendered, node, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed]);
99
+ }, [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed]);
97
100
  var innerCardOriginal = (0, _react.useMemo)(function () {
98
101
  return /*#__PURE__*/_react.default.createElement(_inlineCard.InlineCard, {
99
102
  node: node,
@@ -108,7 +111,12 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
108
111
  isPageSSRed: isPageSSRed
109
112
  });
110
113
  }, [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed]);
111
- var innerCard = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'edit' && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? innerCardWithOpenButtonOverlay : innerCardOriginal;
114
+ var shouldShowOpenButtonOverlay = (0, _react.useMemo)(function () {
115
+ return ((editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'edit' || editorAppearance === 'comment' && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6')) && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
116
+ }, [editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode, editorAppearance]);
117
+ var innerCard = shouldShowOpenButtonOverlay ? innerCardWithOpenButtonOverlay : innerCardOriginal;
118
+ var getPosFunction = typeof getPos === 'function' ? getPos : undefined;
119
+ var placeholderUniqId = (getPosFunction === null || getPosFunction === void 0 ? void 0 : getPosFunction()) || 0;
112
120
  return isOverlayEnabled || isPulseEnabled ? /*#__PURE__*/_react.default.createElement(_AwarenessWrapper.AwarenessWrapper, {
113
121
  isOverlayEnabled: isOverlayEnabled,
114
122
  isPulseEnabled: isPulseEnabled,
@@ -123,10 +131,11 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
123
131
  pluginInjectionApi: pluginInjectionApi,
124
132
  setOverlayHoveredStyles: setOverlayHoveredStyles,
125
133
  appearance: appearance
126
- }, innerCard) :
127
- /*#__PURE__*/
128
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
129
- _react.default.createElement("span", {
130
- className: "card"
134
+ }, innerCard) : /*#__PURE__*/_react.default.createElement("span", {
135
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
136
+ className: "card",
137
+ "data-vc": "editor-plugin-inline-card",
138
+ "data-ssr-placeholder": "editor-plugin-inline-card-".concat(placeholderUniqId),
139
+ "data-ssr-placeholder-replace": "editor-plugin-inline-card-".concat(placeholderUniqId)
131
140
  }, innerCard);
132
141
  });
package/dist/cjs/ui/AwarenessWrapper/index.js CHANGED
@@ -101,25 +101,28 @@ var AwarenessWrapper = exports.AwarenessWrapper = function AwarenessWrapper(_ref
101
101
  return children;
102
102
  }, [shouldShowLinkOverlay, children, isSelected, isResolvedViewRendered, isInserted, isHovered, url, handleOverlayChange]);
103
103
  var isInline = appearance === 'inline';
104
+ var placeholderUniqId = linkPosition || 0;
104
105
  return (0, _react.useMemo)(function () {
105
106
  var _cardContext$value;
106
- return (
107
+ return (0, _react2.jsx)("span", {
108
+ css: shouldShowLinkPulse && loaderWrapperStyles
107
109
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
108
- (0, _react2.jsx)("span", {
109
- css: shouldShowLinkPulse && loaderWrapperStyles,
110
- className: "card"
111
- }, (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
112
- data: {
113
- attributes: (0, _utils.getResolvedAttributesFromStore)(url, 'inline', cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store)
114
- }
115
- }, (0, _react2.jsx)(_Pulse.DiscoveryPulse, {
116
- localStorageKey: _localStorage.LOCAL_STORAGE_DISCOVERY_KEY_SMART_LINK,
117
- localStorageKeyExpirationInMs: _localStorage.ONE_DAY_IN_MILLISECONDS,
118
- discoveryMode: "start",
119
- shouldShowPulse: isResolvedViewRendered && shouldShowLinkPulse,
120
- testId: "link-discovery-pulse",
121
- isInline: isInline
122
- }, cardWithOverlay)))
123
- );
124
- }, [shouldShowLinkPulse, url, cardContext === null || cardContext === void 0 || (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 ? void 0 : _cardContext$value2.store, isResolvedViewRendered, cardWithOverlay, isInline]);
110
+ ,
111
+ className: "card",
112
+ "data-vc": "awareness-wrapper",
113
+ "data-ssr-placeholder": "awareness-wrapper-".concat(placeholderUniqId),
114
+ "data-ssr-placeholder-replace": "awareness-wrapper-".concat(placeholderUniqId)
115
+ }, (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
116
+ data: {
117
+ attributes: (0, _utils.getResolvedAttributesFromStore)(url, 'inline', cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store)
118
+ }
119
+ }, (0, _react2.jsx)(_Pulse.DiscoveryPulse, {
120
+ localStorageKey: _localStorage.LOCAL_STORAGE_DISCOVERY_KEY_SMART_LINK,
121
+ localStorageKeyExpirationInMs: _localStorage.ONE_DAY_IN_MILLISECONDS,
122
+ discoveryMode: "start",
123
+ shouldShowPulse: isResolvedViewRendered && shouldShowLinkPulse,
124
+ testId: "link-discovery-pulse",
125
+ isInline: isInline
126
+ }, cardWithOverlay)));
127
+ }, [shouldShowLinkPulse, url, cardContext === null || cardContext === void 0 || (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 ? void 0 : _cardContext$value2.store, isResolvedViewRendered, cardWithOverlay, isInline, placeholderUniqId]);
125
128
  };
package/dist/cjs/ui/OpenButtonOverlay/index.js CHANGED
@@ -13,7 +13,7 @@ var _react2 = require("@emotion/react");
13
13
  var _linkExternal = _interopRequireDefault(require("@atlaskit/icon/core/link-external"));
14
14
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
15
15
  var _primitives = require("@atlaskit/primitives");
16
- var _excluded = ["children", "isVisible", "url"];
16
+ var _excluded = ["children", "isVisible", "url", "editorAppearance"];
17
17
  /* eslint-disable @atlaskit/design-system/no-nested-styles */
18
18
  /* eslint-disable @atlaskit/design-system/prefer-primitives */
19
19
  /**
@@ -62,6 +62,9 @@ var linkStyles = (0, _primitives.xcss)({
62
62
  textDecoration: 'none'
63
63
  }
64
64
  });
65
+ var linkStylesFix = (0, _primitives.xcss)({
66
+ whiteSpace: 'nowrap'
67
+ });
65
68
  var MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY = 45;
66
69
  var ICON_WIDTH = 16;
67
70
  var DEFAULT_OPEN_TEXT_WIDTH = 28; // Default open text width in English
@@ -71,6 +74,7 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
71
74
  _ref$isVisible = _ref.isVisible,
72
75
  isVisible = _ref$isVisible === void 0 ? false : _ref$isVisible,
73
76
  url = _ref.url,
77
+ editorAppearance = _ref.editorAppearance,
74
78
  props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
75
79
  // TODO: ED-26961 - add translation
76
80
  var label = 'Open';
@@ -147,9 +151,12 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
147
151
  maxLines: 1
148
152
  }, label)), isHovered && (0, _react2.jsx)(_primitives.Anchor, {
149
153
  ref: openButtonRef,
150
- xcss: linkStyles,
154
+ xcss: [linkStyles, (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_5') && linkStylesFix],
151
155
  href: url,
152
- target: "_blank"
156
+ target: "_blank",
157
+ style: {
158
+ paddingBlock: editorAppearance === 'comment' && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6') ? '1px' : "var(--ds-space-025, 2px)"
159
+ }
153
160
  }, (0, _react2.jsx)(_primitives.Box, {
154
161
  xcss: iconWrapperStyles,
155
162
  "data-inlinecard-button-overlay": "icon-wrapper-line-height"
package/dist/cjs/ui/OpenButtonOverlay/types.js CHANGED
@@ -1 +1,5 @@
1
- "use strict";
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
package/dist/es2019/nodeviews/inlineCardWithAwareness.js CHANGED
@@ -22,9 +22,11 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
22
22
  isPageSSRed,
23
23
  appearance
24
24
  }) => {
25
+ var _pluginInjectionApi$c;
25
26
  const [isHovered, setIsHovered] = useState(false);
26
27
  const [isInserted, setIsInserted] = useState(false);
27
28
  const [isResolvedViewRendered, setIsResolvedViewRendered] = useState(false);
29
+ const editorAppearance = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$c = pluginInjectionApi.card.sharedState.currentState()) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.editorAppearance;
28
30
  const onResolve = useCallback((tr, title) => {
29
31
  if (fg('platform_editor_fix_card_plugin_state')) {
30
32
  const metadata = tr.getMeta(pluginKey);
@@ -55,7 +57,8 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
55
57
  } = useSharedPluginState(pluginInjectionApi, ['editorViewMode']);
56
58
  const innerCardWithOpenButtonOverlay = useMemo(() => /*#__PURE__*/React.createElement(OpenButtonOverlay, {
57
59
  isVisible: isResolvedViewRendered,
58
- url: node.attrs.url
60
+ url: node.attrs.url,
61
+ editorAppearance: editorAppearance
59
62
  }, /*#__PURE__*/React.createElement(InlineCard, {
60
63
  node: node,
61
64
  view: view,
@@ -67,7 +70,7 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
67
70
  cardContext: cardContext,
68
71
  isHovered: isHovered,
69
72
  isPageSSRed: isPageSSRed
70
- })), [isResolvedViewRendered, node, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed]);
73
+ })), [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed]);
71
74
  const innerCardOriginal = useMemo(() => /*#__PURE__*/React.createElement(InlineCard, {
72
75
  node: node,
73
76
  view: view,
@@ -80,7 +83,12 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
80
83
  isHovered: isHovered,
81
84
  isPageSSRed: isPageSSRed
82
85
  }), [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed]);
83
- const innerCard = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'edit' && editorExperiment('platform_editor_controls', 'variant1') ? innerCardWithOpenButtonOverlay : innerCardOriginal;
86
+ const shouldShowOpenButtonOverlay = useMemo(() => {
87
+ return ((editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'edit' || editorAppearance === 'comment' && fg('platform_editor_controls_patch_6')) && editorExperiment('platform_editor_controls', 'variant1');
88
+ }, [editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode, editorAppearance]);
89
+ const innerCard = shouldShowOpenButtonOverlay ? innerCardWithOpenButtonOverlay : innerCardOriginal;
90
+ const getPosFunction = typeof getPos === 'function' ? getPos : undefined;
91
+ const placeholderUniqId = (getPosFunction === null || getPosFunction === void 0 ? void 0 : getPosFunction()) || 0;
84
92
  return isOverlayEnabled || isPulseEnabled ? /*#__PURE__*/React.createElement(AwarenessWrapper, {
85
93
  isOverlayEnabled: isOverlayEnabled,
86
94
  isPulseEnabled: isPulseEnabled,
@@ -95,10 +103,11 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
95
103
  pluginInjectionApi: pluginInjectionApi,
96
104
  setOverlayHoveredStyles: setOverlayHoveredStyles,
97
105
  appearance: appearance
98
- }, innerCard) :
99
- /*#__PURE__*/
100
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
101
- React.createElement("span", {
102
- className: "card"
106
+ }, innerCard) : /*#__PURE__*/React.createElement("span", {
107
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
108
+ className: "card",
109
+ "data-vc": "editor-plugin-inline-card",
110
+ "data-ssr-placeholder": `editor-plugin-inline-card-${placeholderUniqId}`,
111
+ "data-ssr-placeholder-replace": `editor-plugin-inline-card-${placeholderUniqId}`
103
112
  }, innerCard);
104
113
  });
package/dist/es2019/ui/AwarenessWrapper/index.js CHANGED
@@ -87,25 +87,28 @@ export const AwarenessWrapper = ({
87
87
  return children;
88
88
  }, [shouldShowLinkOverlay, children, isSelected, isResolvedViewRendered, isInserted, isHovered, url, handleOverlayChange]);
89
89
  const isInline = appearance === 'inline';
90
+ const placeholderUniqId = linkPosition || 0;
90
91
  return useMemo(() => {
91
92
  var _cardContext$value;
92
- return (
93
+ return jsx("span", {
94
+ css: shouldShowLinkPulse && loaderWrapperStyles
93
95
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
94
- jsx("span", {
95
- css: shouldShowLinkPulse && loaderWrapperStyles,
96
- className: "card"
97
- }, jsx(AnalyticsContext, {
98
- data: {
99
- attributes: getResolvedAttributesFromStore(url, 'inline', cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store)
100
- }
101
- }, jsx(DiscoveryPulse, {
102
- localStorageKey: LOCAL_STORAGE_DISCOVERY_KEY_SMART_LINK,
103
- localStorageKeyExpirationInMs: ONE_DAY_IN_MILLISECONDS,
104
- discoveryMode: "start",
105
- shouldShowPulse: isResolvedViewRendered && shouldShowLinkPulse,
106
- testId: "link-discovery-pulse",
107
- isInline: isInline
108
- }, cardWithOverlay)))
109
- );
110
- }, [shouldShowLinkPulse, url, cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 ? void 0 : _cardContext$value2.store, isResolvedViewRendered, cardWithOverlay, isInline]);
96
+ ,
97
+ className: "card",
98
+ "data-vc": "awareness-wrapper",
99
+ "data-ssr-placeholder": `awareness-wrapper-${placeholderUniqId}`,
100
+ "data-ssr-placeholder-replace": `awareness-wrapper-${placeholderUniqId}`
101
+ }, jsx(AnalyticsContext, {
102
+ data: {
103
+ attributes: getResolvedAttributesFromStore(url, 'inline', cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store)
104
+ }
105
+ }, jsx(DiscoveryPulse, {
106
+ localStorageKey: LOCAL_STORAGE_DISCOVERY_KEY_SMART_LINK,
107
+ localStorageKeyExpirationInMs: ONE_DAY_IN_MILLISECONDS,
108
+ discoveryMode: "start",
109
+ shouldShowPulse: isResolvedViewRendered && shouldShowLinkPulse,
110
+ testId: "link-discovery-pulse",
111
+ isInline: isInline
112
+ }, cardWithOverlay)));
113
+ }, [shouldShowLinkPulse, url, cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 ? void 0 : _cardContext$value2.store, isResolvedViewRendered, cardWithOverlay, isInline, placeholderUniqId]);
111
114
  };
package/dist/es2019/ui/OpenButtonOverlay/index.js CHANGED
@@ -49,6 +49,9 @@ const linkStyles = xcss({
49
49
  textDecoration: 'none'
50
50
  }
51
51
  });
52
+ const linkStylesFix = xcss({
53
+ whiteSpace: 'nowrap'
54
+ });
52
55
  const MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY = 45;
53
56
  const ICON_WIDTH = 16;
54
57
  const DEFAULT_OPEN_TEXT_WIDTH = 28; // Default open text width in English
@@ -57,6 +60,7 @@ const OpenButtonOverlay = ({
57
60
  children,
58
61
  isVisible = false,
59
62
  url,
63
+ editorAppearance,
60
64
  ...props
61
65
  }) => {
62
66
  // TODO: ED-26961 - add translation
@@ -124,9 +128,12 @@ const OpenButtonOverlay = ({
124
128
  maxLines: 1
125
129
  }, label)), isHovered && jsx(Anchor, {
126
130
  ref: openButtonRef,
127
- xcss: linkStyles,
131
+ xcss: [linkStyles, fg('platform_editor_controls_patch_5') && linkStylesFix],
128
132
  href: url,
129
- target: "_blank"
133
+ target: "_blank",
134
+ style: {
135
+ paddingBlock: editorAppearance === 'comment' && fg('platform_editor_controls_patch_6') ? '1px' : "var(--ds-space-025, 2px)"
136
+ }
130
137
  }, jsx(Box, {
131
138
  xcss: iconWrapperStyles,
132
139
  "data-inlinecard-button-overlay": "icon-wrapper-line-height"
package/dist/es2019/ui/OpenButtonOverlay/types.js CHANGED
@@ -0,0 +1 @@
1
+ export {};
package/dist/esm/nodeviews/inlineCardWithAwareness.js CHANGED
@@ -9,6 +9,7 @@ import { AwarenessWrapper } from '../ui/AwarenessWrapper';
9
9
  import OpenButtonOverlay from '../ui/OpenButtonOverlay';
10
10
  import { InlineCard } from './inlineCard';
11
11
  export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
12
+ var _pluginInjectionApi$c;
12
13
  var node = _ref.node,
13
14
  cardContext = _ref.cardContext,
14
15
  actionOptions = _ref.actionOptions,
@@ -34,6 +35,7 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
34
35
  _useState6 = _slicedToArray(_useState5, 2),
35
36
  isResolvedViewRendered = _useState6[0],
36
37
  setIsResolvedViewRendered = _useState6[1];
38
+ var editorAppearance = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c = pluginInjectionApi.card.sharedState.currentState()) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.editorAppearance;
37
39
  var onResolve = useCallback(function (tr, title) {
38
40
  if (fg('platform_editor_fix_card_plugin_state')) {
39
41
  var metadata = tr.getMeta(pluginKey);
@@ -70,7 +72,8 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
70
72
  var innerCardWithOpenButtonOverlay = useMemo(function () {
71
73
  return /*#__PURE__*/React.createElement(OpenButtonOverlay, {
72
74
  isVisible: isResolvedViewRendered,
73
- url: node.attrs.url
75
+ url: node.attrs.url,
76
+ editorAppearance: editorAppearance
74
77
  }, /*#__PURE__*/React.createElement(InlineCard, {
75
78
  node: node,
76
79
  view: view,
@@ -83,7 +86,7 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
83
86
  isHovered: isHovered,
84
87
  isPageSSRed: isPageSSRed
85
88
  }));
86
- }, [isResolvedViewRendered, node, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed]);
89
+ }, [isResolvedViewRendered, node, editorAppearance, view, getPos, useAlternativePreloader, actionOptions, onResolve, onClick, cardContext, isHovered, isPageSSRed]);
87
90
  var innerCardOriginal = useMemo(function () {
88
91
  return /*#__PURE__*/React.createElement(InlineCard, {
89
92
  node: node,
@@ -98,7 +101,12 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
98
101
  isPageSSRed: isPageSSRed
99
102
  });
100
103
  }, [actionOptions, cardContext, getPos, isHovered, node, onClick, onResolve, useAlternativePreloader, view, isPageSSRed]);
101
- var innerCard = (editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'edit' && editorExperiment('platform_editor_controls', 'variant1') ? innerCardWithOpenButtonOverlay : innerCardOriginal;
104
+ var shouldShowOpenButtonOverlay = useMemo(function () {
105
+ return ((editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode) === 'edit' || editorAppearance === 'comment' && fg('platform_editor_controls_patch_6')) && editorExperiment('platform_editor_controls', 'variant1');
106
+ }, [editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode, editorAppearance]);
107
+ var innerCard = shouldShowOpenButtonOverlay ? innerCardWithOpenButtonOverlay : innerCardOriginal;
108
+ var getPosFunction = typeof getPos === 'function' ? getPos : undefined;
109
+ var placeholderUniqId = (getPosFunction === null || getPosFunction === void 0 ? void 0 : getPosFunction()) || 0;
102
110
  return isOverlayEnabled || isPulseEnabled ? /*#__PURE__*/React.createElement(AwarenessWrapper, {
103
111
  isOverlayEnabled: isOverlayEnabled,
104
112
  isPulseEnabled: isPulseEnabled,
@@ -113,10 +121,11 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
113
121
  pluginInjectionApi: pluginInjectionApi,
114
122
  setOverlayHoveredStyles: setOverlayHoveredStyles,
115
123
  appearance: appearance
116
- }, innerCard) :
117
- /*#__PURE__*/
118
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
119
- React.createElement("span", {
120
- className: "card"
124
+ }, innerCard) : /*#__PURE__*/React.createElement("span", {
125
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
126
+ className: "card",
127
+ "data-vc": "editor-plugin-inline-card",
128
+ "data-ssr-placeholder": "editor-plugin-inline-card-".concat(placeholderUniqId),
129
+ "data-ssr-placeholder-replace": "editor-plugin-inline-card-".concat(placeholderUniqId)
121
130
  }, innerCard);
122
131
  });
package/dist/esm/ui/AwarenessWrapper/index.js CHANGED
@@ -93,25 +93,28 @@ export var AwarenessWrapper = function AwarenessWrapper(_ref) {
93
93
  return children;
94
94
  }, [shouldShowLinkOverlay, children, isSelected, isResolvedViewRendered, isInserted, isHovered, url, handleOverlayChange]);
95
95
  var isInline = appearance === 'inline';
96
+ var placeholderUniqId = linkPosition || 0;
96
97
  return useMemo(function () {
97
98
  var _cardContext$value;
98
- return (
99
+ return jsx("span", {
100
+ css: shouldShowLinkPulse && loaderWrapperStyles
99
101
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
100
- jsx("span", {
101
- css: shouldShowLinkPulse && loaderWrapperStyles,
102
- className: "card"
103
- }, jsx(AnalyticsContext, {
104
- data: {
105
- attributes: getResolvedAttributesFromStore(url, 'inline', cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store)
106
- }
107
- }, jsx(DiscoveryPulse, {
108
- localStorageKey: LOCAL_STORAGE_DISCOVERY_KEY_SMART_LINK,
109
- localStorageKeyExpirationInMs: ONE_DAY_IN_MILLISECONDS,
110
- discoveryMode: "start",
111
- shouldShowPulse: isResolvedViewRendered && shouldShowLinkPulse,
112
- testId: "link-discovery-pulse",
113
- isInline: isInline
114
- }, cardWithOverlay)))
115
- );
116
- }, [shouldShowLinkPulse, url, cardContext === null || cardContext === void 0 || (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 ? void 0 : _cardContext$value2.store, isResolvedViewRendered, cardWithOverlay, isInline]);
102
+ ,
103
+ className: "card",
104
+ "data-vc": "awareness-wrapper",
105
+ "data-ssr-placeholder": "awareness-wrapper-".concat(placeholderUniqId),
106
+ "data-ssr-placeholder-replace": "awareness-wrapper-".concat(placeholderUniqId)
107
+ }, jsx(AnalyticsContext, {
108
+ data: {
109
+ attributes: getResolvedAttributesFromStore(url, 'inline', cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store)
110
+ }
111
+ }, jsx(DiscoveryPulse, {
112
+ localStorageKey: LOCAL_STORAGE_DISCOVERY_KEY_SMART_LINK,
113
+ localStorageKeyExpirationInMs: ONE_DAY_IN_MILLISECONDS,
114
+ discoveryMode: "start",
115
+ shouldShowPulse: isResolvedViewRendered && shouldShowLinkPulse,
116
+ testId: "link-discovery-pulse",
117
+ isInline: isInline
118
+ }, cardWithOverlay)));
119
+ }, [shouldShowLinkPulse, url, cardContext === null || cardContext === void 0 || (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 ? void 0 : _cardContext$value2.store, isResolvedViewRendered, cardWithOverlay, isInline, placeholderUniqId]);
117
120
  };
package/dist/esm/ui/OpenButtonOverlay/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["children", "isVisible", "url"];
3
+ var _excluded = ["children", "isVisible", "url", "editorAppearance"];
4
4
  /* eslint-disable @atlaskit/design-system/no-nested-styles */
5
5
  /* eslint-disable @atlaskit/design-system/prefer-primitives */
6
6
  /**
@@ -52,6 +52,9 @@ var linkStyles = xcss({
52
52
  textDecoration: 'none'
53
53
  }
54
54
  });
55
+ var linkStylesFix = xcss({
56
+ whiteSpace: 'nowrap'
57
+ });
55
58
  var MIN_AVAILABLE_SPACE_WITH_LABEL_OVERLAY = 45;
56
59
  var ICON_WIDTH = 16;
57
60
  var DEFAULT_OPEN_TEXT_WIDTH = 28; // Default open text width in English
@@ -61,6 +64,7 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
61
64
  _ref$isVisible = _ref.isVisible,
62
65
  isVisible = _ref$isVisible === void 0 ? false : _ref$isVisible,
63
66
  url = _ref.url,
67
+ editorAppearance = _ref.editorAppearance,
64
68
  props = _objectWithoutProperties(_ref, _excluded);
65
69
  // TODO: ED-26961 - add translation
66
70
  var label = 'Open';
@@ -137,9 +141,12 @@ var OpenButtonOverlay = function OpenButtonOverlay(_ref) {
137
141
  maxLines: 1
138
142
  }, label)), isHovered && jsx(Anchor, {
139
143
  ref: openButtonRef,
140
- xcss: linkStyles,
144
+ xcss: [linkStyles, fg('platform_editor_controls_patch_5') && linkStylesFix],
141
145
  href: url,
142
- target: "_blank"
146
+ target: "_blank",
147
+ style: {
148
+ paddingBlock: editorAppearance === 'comment' && fg('platform_editor_controls_patch_6') ? '1px' : "var(--ds-space-025, 2px)"
149
+ }
143
150
  }, jsx(Box, {
144
151
  xcss: iconWrapperStyles,
145
152
  "data-inlinecard-button-overlay": "icon-wrapper-line-height"
package/dist/esm/ui/OpenButtonOverlay/types.js CHANGED
@@ -0,0 +1 @@
1
+ export {};
package/dist/types/ui/OpenButtonOverlay/index.d.ts CHANGED
@@ -5,5 +5,5 @@
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  import type { OpenButtonOverlayProps } from './types';
8
- declare const OpenButtonOverlay: ({ children, isVisible, url, ...props }: React.PropsWithChildren<OpenButtonOverlayProps>) => jsx.JSX.Element;
8
+ declare const OpenButtonOverlay: ({ children, isVisible, url, editorAppearance, ...props }: React.PropsWithChildren<OpenButtonOverlayProps>) => jsx.JSX.Element;
9
9
  export default OpenButtonOverlay;
package/dist/types/ui/OpenButtonOverlay/types.d.ts CHANGED
@@ -1,5 +1,7 @@
1
1
  /// <reference types="react" />
2
+ import { EditorAppearance } from '@atlaskit/editor-common/types';
2
3
  export type OpenButtonOverlayProps = React.HTMLAttributes<HTMLSpanElement> & {
3
4
  isVisible?: boolean;
4
5
  url: string;
6
+ editorAppearance?: EditorAppearance;
5
7
  };
package/dist/types-ts4.5/ui/OpenButtonOverlay/index.d.ts CHANGED
@@ -5,5 +5,5 @@
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  import type { OpenButtonOverlayProps } from './types';
8
- declare const OpenButtonOverlay: ({ children, isVisible, url, ...props }: React.PropsWithChildren<OpenButtonOverlayProps>) => jsx.JSX.Element;
8
+ declare const OpenButtonOverlay: ({ children, isVisible, url, editorAppearance, ...props }: React.PropsWithChildren<OpenButtonOverlayProps>) => jsx.JSX.Element;
9
9
  export default OpenButtonOverlay;
package/dist/types-ts4.5/ui/OpenButtonOverlay/types.d.ts CHANGED
@@ -1,5 +1,7 @@
1
1
  /// <reference types="react" />
2
+ import { EditorAppearance } from '@atlaskit/editor-common/types';
2
3
  export type OpenButtonOverlayProps = React.HTMLAttributes<HTMLSpanElement> & {
3
4
  isVisible?: boolean;
4
5
  url: string;
6
+ editorAppearance?: EditorAppearance;
5
7
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-card",
3
- "version": "5.4.12",
3
+ "version": "5.4.14",
4
4
  "description": "Card plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -37,7 +37,7 @@
37
37
  "@atlaskit/analytics-next": "^11.0.0",
38
38
  "@atlaskit/button": "^23.0.0",
39
39
  "@atlaskit/custom-steps": "^0.11.0",
40
- "@atlaskit/editor-common": "^103.4.0",
40
+ "@atlaskit/editor-common": "^103.10.0",
41
41
  "@atlaskit/editor-plugin-analytics": "^2.2.0",
42
42
  "@atlaskit/editor-plugin-base": "^2.3.0",
43
43
  "@atlaskit/editor-plugin-connectivity": "^2.0.0",
@@ -51,19 +51,19 @@
51
51
  "@atlaskit/editor-prosemirror": "7.0.0",
52
52
  "@atlaskit/editor-shared-styles": "^3.4.0",
53
53
  "@atlaskit/frontend-utilities": "^3.0.0",
54
- "@atlaskit/icon": "^25.5.0",
54
+ "@atlaskit/icon": "^25.6.0",
55
55
  "@atlaskit/link-analytics": "^9.1.0",
56
56
  "@atlaskit/link-client-extension": "^4.0.0",
57
- "@atlaskit/link-datasource": "^4.1.0",
57
+ "@atlaskit/link-datasource": "^4.3.0",
58
58
  "@atlaskit/linking-common": "^8.0.0",
59
59
  "@atlaskit/linking-types": "^9.8.0",
60
60
  "@atlaskit/menu": "^3.2.0",
61
61
  "@atlaskit/platform-feature-flags": "^1.1.0",
62
62
  "@atlaskit/primitives": "^14.4.0",
63
- "@atlaskit/smart-card": "^36.5.0",
63
+ "@atlaskit/smart-card": "^36.8.0",
64
64
  "@atlaskit/theme": "^18.0.0",
65
- "@atlaskit/tmp-editor-statsig": "^4.6.0",
66
- "@atlaskit/tokens": "^4.7.0",
65
+ "@atlaskit/tmp-editor-statsig": "^4.12.0",
66
+ "@atlaskit/tokens": "^4.8.0",
67
67
  "@babel/runtime": "^7.0.0",
68
68
  "@emotion/react": "^11.7.1",
69
69
  "lodash": "^4.17.21",
@@ -145,6 +145,12 @@
145
145
  },
146
146
  "platform_editor_controls_patch_3": {
147
147
  "type": "boolean"
148
+ },
149
+ "platform_editor_controls_patch_5": {
150
+ "type": "boolean"
151
+ },
152
+ "platform_editor_controls_patch_6": {
153
+ "type": "boolean"
148
154
  }
149
155
  },
150
156
  "stricter": {