@atlaskit/renderer 120.2.5 → 120.2.6

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 (11) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/afm-cc/tsconfig.json +128 -128
  3. package/dist/cjs/react/nodes/inlineCard.js +62 -14
  4. package/dist/cjs/ui/Renderer/index.js +1 -1
  5. package/dist/es2019/react/nodes/inlineCard.js +45 -6
  6. package/dist/es2019/ui/Renderer/index.js +1 -1
  7. package/dist/esm/react/nodes/inlineCard.js +53 -6
  8. package/dist/esm/ui/Renderer/index.js +1 -1
  9. package/dist/types/react/nodes/inlineCard.d.ts +2 -0
  10. package/dist/types-ts4.5/react/nodes/inlineCard.d.ts +2 -0
  11. package/package.json +4 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/renderer
2
2
 
3
+ ## 120.2.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [#190768](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/190768)
8
+ [`45e3e754cfcc1`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/45e3e754cfcc1) -
9
+ [ux] Add open and panel hover buttons to inline smart card
10
+
3
11
  ## 120.2.5
4
12
 
5
13
  ### Patch Changes
package/afm-cc/tsconfig.json CHANGED
@@ -1,129 +1,129 @@
1
1
  {
2
- "extends": "../../../../tsconfig.entry-points.confluence.json",
3
- "compilerOptions": {
4
- "declaration": true,
5
- "target": "es5",
6
- "composite": true,
7
- "outDir": "../../../../../confluence/tsDist/@atlaskit__renderer",
8
- "rootDir": "../"
9
- },
10
- "include": [
11
- "../src/**/*.ts",
12
- "../src/**/*.tsx"
13
- ],
14
- "exclude": [
15
- "../src/**/__tests__/*",
16
- "../src/**/*.test.*",
17
- "../src/**/test.*"
18
- ],
19
- "references": [
20
- {
21
- "path": "../../adf-utils/afm-cc/tsconfig.json"
22
- },
23
- {
24
- "path": "../../../analytics/analytics-listeners/afm-cc/tsconfig.json"
25
- },
26
- {
27
- "path": "../../../analytics/analytics-namespaced-context/afm-cc/tsconfig.json"
28
- },
29
- {
30
- "path": "../../../analytics/analytics-next/afm-cc/tsconfig.json"
31
- },
32
- {
33
- "path": "../../../design-system/button/afm-cc/tsconfig.json"
34
- },
35
- {
36
- "path": "../../../design-system/code/afm-cc/tsconfig.json"
37
- },
38
- {
39
- "path": "../../editor-json-transformer/afm-cc/tsconfig.json"
40
- },
41
- {
42
- "path": "../../editor-palette/afm-cc/tsconfig.json"
43
- },
44
- {
45
- "path": "../../editor-shared-styles/afm-cc/tsconfig.json"
46
- },
47
- {
48
- "path": "../../editor-tables/afm-cc/tsconfig.json"
49
- },
50
- {
51
- "path": "../../../elements/emoji/afm-cc/tsconfig.json"
52
- },
53
- {
54
- "path": "../../../measurement/feature-gate-js-client/afm-cc/tsconfig.json"
55
- },
56
- {
57
- "path": "../../../design-system/icon/afm-cc/tsconfig.json"
58
- },
59
- {
60
- "path": "../../../design-system/link/afm-cc/tsconfig.json"
61
- },
62
- {
63
- "path": "../../../linking-platform/link-datasource/afm-cc/tsconfig.json"
64
- },
65
- {
66
- "path": "../../../media/media-card/afm-cc/tsconfig.json"
67
- },
68
- {
69
- "path": "../../../media/media-client/afm-cc/tsconfig.json"
70
- },
71
- {
72
- "path": "../../../media/media-client-react/afm-cc/tsconfig.json"
73
- },
74
- {
75
- "path": "../../../media/media-common/afm-cc/tsconfig.json"
76
- },
77
- {
78
- "path": "../../../media/media-filmstrip/afm-cc/tsconfig.json"
79
- },
80
- {
81
- "path": "../../../media/media-ui/afm-cc/tsconfig.json"
82
- },
83
- {
84
- "path": "../../../media/media-viewer/afm-cc/tsconfig.json"
85
- },
86
- {
87
- "path": "../../../platform/feature-flags/afm-cc/tsconfig.json"
88
- },
89
- {
90
- "path": "../../../platform/feature-flags-react/afm-cc/tsconfig.json"
91
- },
92
- {
93
- "path": "../../../react-ufo/atlaskit/afm-cc/tsconfig.json"
94
- },
95
- {
96
- "path": "../../../linking-platform/smart-card/afm-cc/tsconfig.json"
97
- },
98
- {
99
- "path": "../../../elements/status/afm-cc/tsconfig.json"
100
- },
101
- {
102
- "path": "../../../elements/task-decision/afm-cc/tsconfig.json"
103
- },
104
- {
105
- "path": "../../../design-system/theme/afm-cc/tsconfig.json"
106
- },
107
- {
108
- "path": "../../tmp-editor-statsig/afm-cc/tsconfig.json"
109
- },
110
- {
111
- "path": "../../../design-system/tokens/afm-cc/tsconfig.json"
112
- },
113
- {
114
- "path": "../../../design-system/tooltip/afm-cc/tsconfig.json"
115
- },
116
- {
117
- "path": "../../../design-system/visually-hidden/afm-cc/tsconfig.json"
118
- },
119
- {
120
- "path": "../../editor-common/afm-cc/tsconfig.json"
121
- },
122
- {
123
- "path": "../../../linking-platform/link-provider/afm-cc/tsconfig.json"
124
- },
125
- {
126
- "path": "../../../media/media-core/afm-cc/tsconfig.json"
127
- }
128
- ]
129
- }
2
+ "extends": "../../../../tsconfig.entry-points.confluence.json",
3
+ "compilerOptions": {
4
+ "declaration": true,
5
+ "target": "es5",
6
+ "composite": true,
7
+ "outDir": "../../../../../confluence/tsDist/@atlaskit__renderer",
8
+ "rootDir": "../"
9
+ },
10
+ "include": [
11
+ "../src/**/*.ts",
12
+ "../src/**/*.tsx"
13
+ ],
14
+ "exclude": [
15
+ "../src/**/__tests__/*",
16
+ "../src/**/*.test.*",
17
+ "../src/**/test.*"
18
+ ],
19
+ "references": [
20
+ {
21
+ "path": "../../adf-utils/afm-cc/tsconfig.json"
22
+ },
23
+ {
24
+ "path": "../../../analytics/analytics-listeners/afm-cc/tsconfig.json"
25
+ },
26
+ {
27
+ "path": "../../../analytics/analytics-namespaced-context/afm-cc/tsconfig.json"
28
+ },
29
+ {
30
+ "path": "../../../analytics/analytics-next/afm-cc/tsconfig.json"
31
+ },
32
+ {
33
+ "path": "../../../design-system/button/afm-cc/tsconfig.json"
34
+ },
35
+ {
36
+ "path": "../../../design-system/code/afm-cc/tsconfig.json"
37
+ },
38
+ {
39
+ "path": "../../editor-json-transformer/afm-cc/tsconfig.json"
40
+ },
41
+ {
42
+ "path": "../../editor-palette/afm-cc/tsconfig.json"
43
+ },
44
+ {
45
+ "path": "../../editor-shared-styles/afm-cc/tsconfig.json"
46
+ },
47
+ {
48
+ "path": "../../editor-tables/afm-cc/tsconfig.json"
49
+ },
50
+ {
51
+ "path": "../../../elements/emoji/afm-cc/tsconfig.json"
52
+ },
53
+ {
54
+ "path": "../../../measurement/feature-gate-js-client/afm-cc/tsconfig.json"
55
+ },
56
+ {
57
+ "path": "../../../design-system/icon/afm-cc/tsconfig.json"
58
+ },
59
+ {
60
+ "path": "../../../design-system/link/afm-cc/tsconfig.json"
61
+ },
62
+ {
63
+ "path": "../../../linking-platform/link-datasource/afm-cc/tsconfig.json"
64
+ },
65
+ {
66
+ "path": "../../../media/media-card/afm-cc/tsconfig.json"
67
+ },
68
+ {
69
+ "path": "../../../media/media-client/afm-cc/tsconfig.json"
70
+ },
71
+ {
72
+ "path": "../../../media/media-client-react/afm-cc/tsconfig.json"
73
+ },
74
+ {
75
+ "path": "../../../media/media-common/afm-cc/tsconfig.json"
76
+ },
77
+ {
78
+ "path": "../../../media/media-filmstrip/afm-cc/tsconfig.json"
79
+ },
80
+ {
81
+ "path": "../../../media/media-ui/afm-cc/tsconfig.json"
82
+ },
83
+ {
84
+ "path": "../../../media/media-viewer/afm-cc/tsconfig.json"
85
+ },
86
+ {
87
+ "path": "../../../platform/feature-flags/afm-cc/tsconfig.json"
88
+ },
89
+ {
90
+ "path": "../../../platform/feature-flags-react/afm-cc/tsconfig.json"
91
+ },
92
+ {
93
+ "path": "../../../react-ufo/atlaskit/afm-cc/tsconfig.json"
94
+ },
95
+ {
96
+ "path": "../../../linking-platform/smart-card/afm-cc/tsconfig.json"
97
+ },
98
+ {
99
+ "path": "../../../elements/status/afm-cc/tsconfig.json"
100
+ },
101
+ {
102
+ "path": "../../../elements/task-decision/afm-cc/tsconfig.json"
103
+ },
104
+ {
105
+ "path": "../../../design-system/theme/afm-cc/tsconfig.json"
106
+ },
107
+ {
108
+ "path": "../../tmp-editor-statsig/afm-cc/tsconfig.json"
109
+ },
110
+ {
111
+ "path": "../../../design-system/tokens/afm-cc/tsconfig.json"
112
+ },
113
+ {
114
+ "path": "../../../design-system/tooltip/afm-cc/tsconfig.json"
115
+ },
116
+ {
117
+ "path": "../../../design-system/visually-hidden/afm-cc/tsconfig.json"
118
+ },
119
+ {
120
+ "path": "../../editor-common/afm-cc/tsconfig.json"
121
+ },
122
+ {
123
+ "path": "../../../linking-platform/link-provider/afm-cc/tsconfig.json"
124
+ },
125
+ {
126
+ "path": "../../../media/media-core/afm-cc/tsconfig.json"
127
+ }
128
+ ]
129
+ }
package/dist/cjs/react/nodes/inlineCard.js CHANGED
@@ -6,29 +6,47 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.default = void 0;
8
8
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
- var _react = require("@emotion/react");
9
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
10
+ var _react = require("react");
11
+ var _react2 = require("@emotion/react");
12
+ var _linkProvider = require("@atlaskit/link-provider");
10
13
  var _smartCard = require("@atlaskit/smart-card");
11
14
  var _ssr = require("@atlaskit/smart-card/ssr");
12
15
  var _ui = require("@atlaskit/editor-common/ui");
13
16
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
17
+ var _analyticsNext = require("@atlaskit/analytics-next");
18
+ var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
14
19
  var _fallback = require("./fallback");
15
20
  var _SmartCardStorage = require("../../ui/SmartCardStorage");
16
21
  var _getCardClickHandler = require("../utils/getCardClickHandler");
17
- var _analyticsNext = require("@atlaskit/analytics-next");
18
22
  var _useInlineAnnotationProps = require("../../ui/annotations/element/useInlineAnnotationProps");
19
23
  var _PortalContext = require("../../ui/Renderer/PortalContext");
20
24
  /**
21
25
  * @jsxRuntime classic
22
26
  * @jsx jsx
23
27
  */
28
+
24
29
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
25
30
 
31
+ var HoverLinkOverlayNoop = function HoverLinkOverlayNoop(props) {
32
+ return (0, _react2.jsx)("div", null, props.children);
33
+ };
34
+ var HoverLinkOverlayWithCondition = (0, _platformFeatureFlagsReact.componentWithCondition)(function () {
35
+ return (0, _platformFeatureFlags.fg)('platform_editor_preview_panel_linking');
36
+ }, _ui.HoverLinkOverlay, HoverLinkOverlayNoop);
26
37
  var InlineCard = function InlineCard(props) {
38
+ var _cardContext$value, _cardContext$value2, _cardContext$value2$i, _cardContext$value3;
27
39
  var url = props.url,
28
40
  data = props.data,
29
41
  eventHandlers = props.eventHandlers,
30
- smartLinks = props.smartLinks;
42
+ smartLinks = props.smartLinks,
43
+ rendererAppearance = props.rendererAppearance;
31
44
  var portal = (0, _PortalContext.usePortal)(props);
45
+ var cardContext = (0, _linkProvider.useSmartCardContext)();
46
+ var _useState = (0, _react.useState)(false),
47
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
48
+ isResolvedViewRendered = _useState2[0],
49
+ setIsResolvedViewRendered = _useState2[1];
32
50
  var onClick = (0, _getCardClickHandler.getCardClickHandler)(eventHandlers, url);
33
51
  var cardProps = {
34
52
  url: url,
@@ -49,7 +67,7 @@ var InlineCard = function InlineCard(props) {
49
67
  };
50
68
  var inlineAnnotationProps = (0, _useInlineAnnotationProps.useInlineAnnotationProps)(props);
51
69
  var CompetitorPrompt = smartLinks === null || smartLinks === void 0 ? void 0 : smartLinks.CompetitorPrompt;
52
- var CompetitorPromptComponent = CompetitorPrompt && url && (0, _platformFeatureFlags.fg)('prompt_whiteboard_competitor_link_gate') ? (0, _react.jsx)(CompetitorPrompt, {
70
+ var CompetitorPromptComponent = CompetitorPrompt && url && (0, _platformFeatureFlags.fg)('prompt_whiteboard_competitor_link_gate') ? (0, _react2.jsx)(CompetitorPrompt, {
53
71
  sourceUrl: url,
54
72
  linkType: "inline"
55
73
  }) : null;
@@ -57,15 +75,15 @@ var InlineCard = function InlineCard(props) {
57
75
  if (
58
76
  // eslint-disable-next-line @atlaskit/platform/no-invalid-feature-flag-usage
59
77
  (0, _platformFeatureFlags.fg)('editor_inline_comments_on_inline_nodes')) {
60
- return (0, _react.jsx)("span", (0, _extends2.default)({
78
+ return (0, _react2.jsx)("span", (0, _extends2.default)({
61
79
  "data-inline-card": true,
62
80
  "data-card-data": data ? JSON.stringify(data) : undefined,
63
81
  "data-card-url": url
64
82
  // Ignored via go/ees005
65
83
  // eslint-disable-next-line react/jsx-props-no-spreading
66
- }, inlineAnnotationProps), (0, _react.jsx)(_analyticsNext.AnalyticsContext, {
84
+ }, inlineAnnotationProps), (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
67
85
  data: analyticsData
68
- }, (0, _react.jsx)(_ssr.CardSSR, {
86
+ }, (0, _react2.jsx)(_ssr.CardSSR, {
69
87
  appearance: "inline",
70
88
  url: url,
71
89
  showHoverPreview: !hideHoverPreview,
@@ -73,9 +91,9 @@ var InlineCard = function InlineCard(props) {
73
91
  onClick: onClick
74
92
  })));
75
93
  }
76
- return (0, _react.jsx)(_analyticsNext.AnalyticsContext, {
94
+ return (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
77
95
  data: analyticsData
78
- }, (0, _react.jsx)(_ssr.CardSSR, {
96
+ }, (0, _react2.jsx)(_ssr.CardSSR, {
79
97
  appearance: "inline",
80
98
  url: url,
81
99
  showHoverPreview: !hideHoverPreview,
@@ -89,19 +107,46 @@ var InlineCard = function InlineCard(props) {
89
107
  throw err;
90
108
  }
91
109
  };
92
- return (0, _react.jsx)(_analyticsNext.AnalyticsContext, {
110
+ var cardState = cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 || (_cardContext$value = _cardContext$value.store) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.getState()[url || ''];
111
+ var ari = (0, _smartCard.getObjectAri)(cardState === null || cardState === void 0 ? void 0 : cardState.details);
112
+ var name = (0, _smartCard.getObjectName)(cardState === null || cardState === void 0 ? void 0 : cardState.details);
113
+ var iconUrl = (0, _smartCard.getObjectIconUrl)(cardState === null || cardState === void 0 ? void 0 : cardState.details);
114
+ var isPanelAvailable = ari && (cardContext === null || cardContext === void 0 || (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 || (_cardContext$value2$i = _cardContext$value2.isPreviewPanelAvailable) === null || _cardContext$value2$i === void 0 ? void 0 : _cardContext$value2$i.call(_cardContext$value2, {
115
+ ari: ari
116
+ }));
117
+ var openPreviewPanel = cardContext === null || cardContext === void 0 || (_cardContext$value3 = cardContext.value) === null || _cardContext$value3 === void 0 ? void 0 : _cardContext$value3.openPreviewPanel;
118
+ var handleOpenGlancePanelClick = function handleOpenGlancePanelClick(event) {
119
+ if (openPreviewPanel && isPanelAvailable) {
120
+ // Prevent anchor default behaviour(click to open the anchor link)
121
+ // When glance panel is available, let openPreviewPanel handle it
122
+ event.preventDefault();
123
+ openPreviewPanel({
124
+ url: url || '',
125
+ ari: ari,
126
+ name: name || '',
127
+ iconUrl: iconUrl
128
+ });
129
+ }
130
+ };
131
+ return (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
93
132
  data: analyticsData
94
- }, (0, _react.jsx)("span", (0, _extends2.default)({
133
+ }, (0, _react2.jsx)("span", (0, _extends2.default)({
95
134
  "data-inline-card": true,
96
135
  "data-card-data": data ? JSON.stringify(data) : undefined,
97
136
  "data-card-url": url
98
137
  // Ignored via go/ees005
99
138
  // eslint-disable-next-line react/jsx-props-no-spreading
100
- }, inlineAnnotationProps), (0, _react.jsx)(_fallback.CardErrorBoundary, (0, _extends2.default)({
139
+ }, inlineAnnotationProps), (0, _react2.jsx)(_fallback.CardErrorBoundary, (0, _extends2.default)({
101
140
  unsupportedComponent: _ui.UnsupportedInline
102
141
  // Ignored via go/ees005
103
142
  // eslint-disable-next-line react/jsx-props-no-spreading
104
- }, cardProps), (0, _react.jsx)(_smartCard.Card, (0, _extends2.default)({
143
+ }, cardProps), (0, _react2.jsx)(HoverLinkOverlayWithCondition, {
144
+ isVisible: isResolvedViewRendered,
145
+ url: url || '',
146
+ compactPadding: rendererAppearance === 'comment',
147
+ showPanelButton: !!isPanelAvailable,
148
+ onClick: handleOpenGlancePanelClick
149
+ }, (0, _react2.jsx)(_smartCard.Card, (0, _extends2.default)({
105
150
  appearance: "inline",
106
151
  showHoverPreview: !hideHoverPreview,
107
152
  actionOptions: actionOptions
@@ -113,8 +158,11 @@ var InlineCard = function InlineCard(props) {
113
158
  return;
114
159
  }
115
160
  props.smartCardStorage.set(data.url, data.title);
161
+ if (data.title) {
162
+ setIsResolvedViewRendered(true);
163
+ }
116
164
  },
117
165
  onError: onError
118
- })), CompetitorPromptComponent)));
166
+ }))), CompetitorPromptComponent)));
119
167
  };
120
168
  var _default = exports.default = (0, _SmartCardStorage.withSmartCardStorage)(InlineCard);
package/dist/cjs/ui/Renderer/index.js CHANGED
@@ -63,7 +63,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
63
63
  var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
64
64
  var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
65
65
  var packageName = "@atlaskit/renderer";
66
- var packageVersion = "120.2.4";
66
+ var packageVersion = "120.2.5";
67
67
  var setAsQueryContainerStyles = (0, _react2.css)({
68
68
  containerName: 'ak-renderer-wrapper',
69
69
  containerType: 'inline-size'
package/dist/es2019/react/nodes/inlineCard.js CHANGED
@@ -3,26 +3,35 @@ import _extends from "@babel/runtime/helpers/extends";
3
3
  * @jsxRuntime classic
4
4
  * @jsx jsx
5
5
  */
6
+ import { useState } from 'react';
6
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
7
8
  import { jsx } from '@emotion/react';
8
- import { Card } from '@atlaskit/smart-card';
9
+ import { useSmartCardContext } from '@atlaskit/link-provider';
10
+ import { Card, getObjectAri, getObjectIconUrl, getObjectName } from '@atlaskit/smart-card';
9
11
  import { CardSSR } from '@atlaskit/smart-card/ssr';
10
- import { UnsupportedInline } from '@atlaskit/editor-common/ui';
12
+ import { HoverLinkOverlay, UnsupportedInline } from '@atlaskit/editor-common/ui';
11
13
  import { fg } from '@atlaskit/platform-feature-flags';
14
+ import { AnalyticsContext } from '@atlaskit/analytics-next';
15
+ import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
12
16
  import { CardErrorBoundary } from './fallback';
13
17
  import { withSmartCardStorage } from '../../ui/SmartCardStorage';
14
18
  import { getCardClickHandler } from '../utils/getCardClickHandler';
15
- import { AnalyticsContext } from '@atlaskit/analytics-next';
16
19
  import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
17
20
  import { usePortal } from '../../ui/Renderer/PortalContext';
21
+ const HoverLinkOverlayNoop = props => jsx("div", null, props.children);
22
+ const HoverLinkOverlayWithCondition = componentWithCondition(() => fg('platform_editor_preview_panel_linking'), HoverLinkOverlay, HoverLinkOverlayNoop);
18
23
  const InlineCard = props => {
24
+ var _cardContext$value, _cardContext$value$st, _cardContext$value2, _cardContext$value2$i, _cardContext$value3;
19
25
  const {
20
26
  url,
21
27
  data,
22
28
  eventHandlers,
23
- smartLinks
29
+ smartLinks,
30
+ rendererAppearance
24
31
  } = props;
25
32
  const portal = usePortal(props);
33
+ const cardContext = useSmartCardContext();
34
+ const [isResolvedViewRendered, setIsResolvedViewRendered] = useState(false);
26
35
  const onClick = getCardClickHandler(eventHandlers, url);
27
36
  const cardProps = {
28
37
  url,
@@ -85,6 +94,27 @@ const InlineCard = props => {
85
94
  throw err;
86
95
  }
87
96
  };
97
+ const cardState = cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : (_cardContext$value$st = _cardContext$value.store) === null || _cardContext$value$st === void 0 ? void 0 : _cardContext$value$st.getState()[url || ''];
98
+ const ari = getObjectAri(cardState === null || cardState === void 0 ? void 0 : cardState.details);
99
+ const name = getObjectName(cardState === null || cardState === void 0 ? void 0 : cardState.details);
100
+ const iconUrl = getObjectIconUrl(cardState === null || cardState === void 0 ? void 0 : cardState.details);
101
+ const isPanelAvailable = ari && (cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 ? void 0 : (_cardContext$value2$i = _cardContext$value2.isPreviewPanelAvailable) === null || _cardContext$value2$i === void 0 ? void 0 : _cardContext$value2$i.call(_cardContext$value2, {
102
+ ari
103
+ }));
104
+ const openPreviewPanel = cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value3 = cardContext.value) === null || _cardContext$value3 === void 0 ? void 0 : _cardContext$value3.openPreviewPanel;
105
+ const handleOpenGlancePanelClick = event => {
106
+ if (openPreviewPanel && isPanelAvailable) {
107
+ // Prevent anchor default behaviour(click to open the anchor link)
108
+ // When glance panel is available, let openPreviewPanel handle it
109
+ event.preventDefault();
110
+ openPreviewPanel({
111
+ url: url || '',
112
+ ari,
113
+ name: name || '',
114
+ iconUrl
115
+ });
116
+ }
117
+ };
88
118
  return jsx(AnalyticsContext, {
89
119
  data: analyticsData
90
120
  }, jsx("span", _extends({
@@ -97,7 +127,13 @@ const InlineCard = props => {
97
127
  unsupportedComponent: UnsupportedInline
98
128
  // Ignored via go/ees005
99
129
  // eslint-disable-next-line react/jsx-props-no-spreading
100
- }, cardProps), jsx(Card, _extends({
130
+ }, cardProps), jsx(HoverLinkOverlayWithCondition, {
131
+ isVisible: isResolvedViewRendered,
132
+ url: url || '',
133
+ compactPadding: rendererAppearance === 'comment',
134
+ showPanelButton: !!isPanelAvailable,
135
+ onClick: handleOpenGlancePanelClick
136
+ }, jsx(Card, _extends({
101
137
  appearance: "inline",
102
138
  showHoverPreview: !hideHoverPreview,
103
139
  actionOptions: actionOptions
@@ -109,8 +145,11 @@ const InlineCard = props => {
109
145
  return;
110
146
  }
111
147
  props.smartCardStorage.set(data.url, data.title);
148
+ if (data.title) {
149
+ setIsResolvedViewRendered(true);
150
+ }
112
151
  },
113
152
  onError: onError
114
- })), CompetitorPromptComponent)));
153
+ }))), CompetitorPromptComponent)));
115
154
  };
116
155
  export default withSmartCardStorage(InlineCard);
package/dist/es2019/ui/Renderer/index.js CHANGED
@@ -49,7 +49,7 @@ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equ
49
49
  export const NORMAL_SEVERITY_THRESHOLD = 2000;
50
50
  export const DEGRADED_SEVERITY_THRESHOLD = 3000;
51
51
  const packageName = "@atlaskit/renderer";
52
- const packageVersion = "120.2.4";
52
+ const packageVersion = "120.2.5";
53
53
  const setAsQueryContainerStyles = css({
54
54
  containerName: 'ak-renderer-wrapper',
55
55
  containerType: 'inline-size'
package/dist/esm/react/nodes/inlineCard.js CHANGED
@@ -1,26 +1,43 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
+ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
3
  /**
3
4
  * @jsxRuntime classic
4
5
  * @jsx jsx
5
6
  */
7
+ import { useState } from 'react';
6
8
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
7
9
  import { jsx } from '@emotion/react';
8
- import { Card } from '@atlaskit/smart-card';
10
+ import { useSmartCardContext } from '@atlaskit/link-provider';
11
+ import { Card, getObjectAri, getObjectIconUrl, getObjectName } from '@atlaskit/smart-card';
9
12
  import { CardSSR } from '@atlaskit/smart-card/ssr';
10
- import { UnsupportedInline } from '@atlaskit/editor-common/ui';
13
+ import { HoverLinkOverlay, UnsupportedInline } from '@atlaskit/editor-common/ui';
11
14
  import { fg } from '@atlaskit/platform-feature-flags';
15
+ import { AnalyticsContext } from '@atlaskit/analytics-next';
16
+ import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
12
17
  import { CardErrorBoundary } from './fallback';
13
18
  import { withSmartCardStorage } from '../../ui/SmartCardStorage';
14
19
  import { getCardClickHandler } from '../utils/getCardClickHandler';
15
- import { AnalyticsContext } from '@atlaskit/analytics-next';
16
20
  import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
17
21
  import { usePortal } from '../../ui/Renderer/PortalContext';
22
+ var HoverLinkOverlayNoop = function HoverLinkOverlayNoop(props) {
23
+ return jsx("div", null, props.children);
24
+ };
25
+ var HoverLinkOverlayWithCondition = componentWithCondition(function () {
26
+ return fg('platform_editor_preview_panel_linking');
27
+ }, HoverLinkOverlay, HoverLinkOverlayNoop);
18
28
  var InlineCard = function InlineCard(props) {
29
+ var _cardContext$value, _cardContext$value2, _cardContext$value2$i, _cardContext$value3;
19
30
  var url = props.url,
20
31
  data = props.data,
21
32
  eventHandlers = props.eventHandlers,
22
- smartLinks = props.smartLinks;
33
+ smartLinks = props.smartLinks,
34
+ rendererAppearance = props.rendererAppearance;
23
35
  var portal = usePortal(props);
36
+ var cardContext = useSmartCardContext();
37
+ var _useState = useState(false),
38
+ _useState2 = _slicedToArray(_useState, 2),
39
+ isResolvedViewRendered = _useState2[0],
40
+ setIsResolvedViewRendered = _useState2[1];
24
41
  var onClick = getCardClickHandler(eventHandlers, url);
25
42
  var cardProps = {
26
43
  url: url,
@@ -81,6 +98,27 @@ var InlineCard = function InlineCard(props) {
81
98
  throw err;
82
99
  }
83
100
  };
101
+ var cardState = cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 || (_cardContext$value = _cardContext$value.store) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.getState()[url || ''];
102
+ var ari = getObjectAri(cardState === null || cardState === void 0 ? void 0 : cardState.details);
103
+ var name = getObjectName(cardState === null || cardState === void 0 ? void 0 : cardState.details);
104
+ var iconUrl = getObjectIconUrl(cardState === null || cardState === void 0 ? void 0 : cardState.details);
105
+ var isPanelAvailable = ari && (cardContext === null || cardContext === void 0 || (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 || (_cardContext$value2$i = _cardContext$value2.isPreviewPanelAvailable) === null || _cardContext$value2$i === void 0 ? void 0 : _cardContext$value2$i.call(_cardContext$value2, {
106
+ ari: ari
107
+ }));
108
+ var openPreviewPanel = cardContext === null || cardContext === void 0 || (_cardContext$value3 = cardContext.value) === null || _cardContext$value3 === void 0 ? void 0 : _cardContext$value3.openPreviewPanel;
109
+ var handleOpenGlancePanelClick = function handleOpenGlancePanelClick(event) {
110
+ if (openPreviewPanel && isPanelAvailable) {
111
+ // Prevent anchor default behaviour(click to open the anchor link)
112
+ // When glance panel is available, let openPreviewPanel handle it
113
+ event.preventDefault();
114
+ openPreviewPanel({
115
+ url: url || '',
116
+ ari: ari,
117
+ name: name || '',
118
+ iconUrl: iconUrl
119
+ });
120
+ }
121
+ };
84
122
  return jsx(AnalyticsContext, {
85
123
  data: analyticsData
86
124
  }, jsx("span", _extends({
@@ -93,7 +131,13 @@ var InlineCard = function InlineCard(props) {
93
131
  unsupportedComponent: UnsupportedInline
94
132
  // Ignored via go/ees005
95
133
  // eslint-disable-next-line react/jsx-props-no-spreading
96
- }, cardProps), jsx(Card, _extends({
134
+ }, cardProps), jsx(HoverLinkOverlayWithCondition, {
135
+ isVisible: isResolvedViewRendered,
136
+ url: url || '',
137
+ compactPadding: rendererAppearance === 'comment',
138
+ showPanelButton: !!isPanelAvailable,
139
+ onClick: handleOpenGlancePanelClick
140
+ }, jsx(Card, _extends({
97
141
  appearance: "inline",
98
142
  showHoverPreview: !hideHoverPreview,
99
143
  actionOptions: actionOptions
@@ -105,8 +149,11 @@ var InlineCard = function InlineCard(props) {
105
149
  return;
106
150
  }
107
151
  props.smartCardStorage.set(data.url, data.title);
152
+ if (data.title) {
153
+ setIsResolvedViewRendered(true);
154
+ }
108
155
  },
109
156
  onError: onError
110
- })), CompetitorPromptComponent)));
157
+ }))), CompetitorPromptComponent)));
111
158
  };
112
159
  export default withSmartCardStorage(InlineCard);
package/dist/esm/ui/Renderer/index.js CHANGED
@@ -54,7 +54,7 @@ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equ
54
54
  export var NORMAL_SEVERITY_THRESHOLD = 2000;
55
55
  export var DEGRADED_SEVERITY_THRESHOLD = 3000;
56
56
  var packageName = "@atlaskit/renderer";
57
- var packageVersion = "120.2.4";
57
+ var packageVersion = "120.2.5";
58
58
  var setAsQueryContainerStyles = css({
59
59
  containerName: 'ak-renderer-wrapper',
60
60
  containerType: 'inline-size'
package/dist/types/react/nodes/inlineCard.d.ts CHANGED
@@ -4,6 +4,7 @@ import type { EventHandlers } from '@atlaskit/editor-common/ui';
4
4
  import type { WithSmartCardStorageProps } from '../../ui/SmartCardStorage';
5
5
  import type { SmartLinksOptions } from '../../types/smartLinksOptions';
6
6
  import { type MarkDataAttributes } from '../../ui/annotations/element/useInlineAnnotationProps';
7
+ import type { RendererAppearance } from '../../ui/Renderer/types';
7
8
  export interface InlineCardProps extends MarkDataAttributes {
8
9
  url?: string;
9
10
  data?: object;
@@ -11,6 +12,7 @@ export interface InlineCardProps extends MarkDataAttributes {
11
12
  portal?: HTMLElement;
12
13
  smartLinks?: SmartLinksOptions;
13
14
  marks?: Mark[];
15
+ rendererAppearance?: RendererAppearance;
14
16
  }
15
17
  declare const _default: {
16
18
  new (props: import("@atlaskit/editor-common/utils").Diff<InlineCardProps & WithSmartCardStorageProps, WithSmartCardStorageProps> | Readonly<import("@atlaskit/editor-common/utils").Diff<InlineCardProps & WithSmartCardStorageProps, WithSmartCardStorageProps>>): {
package/dist/types-ts4.5/react/nodes/inlineCard.d.ts CHANGED
@@ -4,6 +4,7 @@ import type { EventHandlers } from '@atlaskit/editor-common/ui';
4
4
  import type { WithSmartCardStorageProps } from '../../ui/SmartCardStorage';
5
5
  import type { SmartLinksOptions } from '../../types/smartLinksOptions';
6
6
  import { type MarkDataAttributes } from '../../ui/annotations/element/useInlineAnnotationProps';
7
+ import type { RendererAppearance } from '../../ui/Renderer/types';
7
8
  export interface InlineCardProps extends MarkDataAttributes {
8
9
  url?: string;
9
10
  data?: object;
@@ -11,6 +12,7 @@ export interface InlineCardProps extends MarkDataAttributes {
11
12
  portal?: HTMLElement;
12
13
  smartLinks?: SmartLinksOptions;
13
14
  marks?: Mark[];
15
+ rendererAppearance?: RendererAppearance;
14
16
  }
15
17
  declare const _default: {
16
18
  new (props: import("@atlaskit/editor-common/utils").Diff<InlineCardProps & WithSmartCardStorageProps, WithSmartCardStorageProps> | Readonly<import("@atlaskit/editor-common/utils").Diff<InlineCardProps & WithSmartCardStorageProps, WithSmartCardStorageProps>>): {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "120.2.5",
3
+ "version": "120.2.6",
4
4
  "description": "Renderer component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -271,6 +271,9 @@
271
271
  "platform_editor_avatar_group_margin_fix": {
272
272
  "type": "boolean"
273
273
  },
274
+ "platform_editor_preview_panel_linking": {
275
+ "type": "boolean"
276
+ },
274
277
  "platform_editor_numbered_column_in_include": {
275
278
  "type": "boolean"
276
279
  }