@atlaskit/smart-card 26.45.3 → 26.46.1

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 (84) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/cjs/messages.js +5 -0
  3. package/dist/cjs/utils/actions/combine-action-options.js +15 -15
  4. package/dist/cjs/utils/analytics/analytics.js +1 -1
  5. package/dist/cjs/view/CardWithUrl/component.js +2 -3
  6. package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/index.js +33 -0
  7. package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +73 -0
  8. package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/types.js +5 -0
  9. package/dist/cjs/view/FlexibleCard/components/blocks/footer-block/resolved/index.js +8 -19
  10. package/dist/cjs/view/FlexibleCard/components/blocks/index.js +8 -1
  11. package/dist/cjs/view/FlexibleCard/components/blocks/utils.js +10 -2
  12. package/dist/cjs/view/LinkUrl/index.js +1 -1
  13. package/dist/cjs/view/common/ai-icon/index.js +117 -0
  14. package/dist/cjs/view/common/ai-prism/ai-glowing-border/animated-svg-container.js +249 -0
  15. package/dist/cjs/view/common/ai-prism/ai-glowing-border/index.js +55 -0
  16. package/dist/cjs/view/common/ai-prism/ai-glowing-border/types.js +5 -0
  17. package/dist/cjs/view/common/ai-prism/constants.js +53 -0
  18. package/dist/cjs/view/common/ai-prism/index.js +45 -0
  19. package/dist/cjs/view/common/ai-prism/types.js +5 -0
  20. package/dist/es2019/messages.js +5 -0
  21. package/dist/es2019/utils/actions/combine-action-options.js +15 -15
  22. package/dist/es2019/utils/analytics/analytics.js +1 -1
  23. package/dist/es2019/view/CardWithUrl/component.js +2 -3
  24. package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/index.js +25 -0
  25. package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +62 -0
  26. package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/types.js +1 -0
  27. package/dist/es2019/view/FlexibleCard/components/blocks/footer-block/resolved/index.js +1 -12
  28. package/dist/es2019/view/FlexibleCard/components/blocks/index.js +2 -1
  29. package/dist/es2019/view/FlexibleCard/components/blocks/utils.js +10 -0
  30. package/dist/es2019/view/LinkUrl/index.js +1 -1
  31. package/dist/es2019/view/common/ai-icon/index.js +108 -0
  32. package/dist/es2019/view/common/ai-prism/ai-glowing-border/animated-svg-container.js +236 -0
  33. package/dist/es2019/view/common/ai-prism/ai-glowing-border/index.js +45 -0
  34. package/dist/es2019/view/common/ai-prism/ai-glowing-border/types.js +1 -0
  35. package/dist/es2019/view/common/ai-prism/constants.js +47 -0
  36. package/dist/es2019/view/common/ai-prism/index.js +36 -0
  37. package/dist/es2019/view/common/ai-prism/types.js +1 -0
  38. package/dist/esm/messages.js +5 -0
  39. package/dist/esm/utils/actions/combine-action-options.js +15 -15
  40. package/dist/esm/utils/analytics/analytics.js +1 -1
  41. package/dist/esm/view/CardWithUrl/component.js +2 -3
  42. package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/index.js +27 -0
  43. package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +63 -0
  44. package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/types.js +1 -0
  45. package/dist/esm/view/FlexibleCard/components/blocks/footer-block/resolved/index.js +1 -12
  46. package/dist/esm/view/FlexibleCard/components/blocks/index.js +2 -1
  47. package/dist/esm/view/FlexibleCard/components/blocks/utils.js +9 -1
  48. package/dist/esm/view/LinkUrl/index.js +1 -1
  49. package/dist/esm/view/common/ai-icon/index.js +110 -0
  50. package/dist/esm/view/common/ai-prism/ai-glowing-border/animated-svg-container.js +239 -0
  51. package/dist/esm/view/common/ai-prism/ai-glowing-border/index.js +47 -0
  52. package/dist/esm/view/common/ai-prism/ai-glowing-border/types.js +1 -0
  53. package/dist/esm/view/common/ai-prism/constants.js +47 -0
  54. package/dist/esm/view/common/ai-prism/index.js +37 -0
  55. package/dist/esm/view/common/ai-prism/types.js +1 -0
  56. package/dist/types/messages.d.ts +1 -1
  57. package/dist/types/utils/actions/combine-action-options.d.ts +2 -2
  58. package/dist/types/view/FlexibleCard/components/blocks/ai-summary-block/index.d.ts +11 -0
  59. package/dist/types/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.d.ts +4 -0
  60. package/dist/types/view/FlexibleCard/components/blocks/ai-summary-block/types.d.ts +23 -0
  61. package/dist/types/view/FlexibleCard/components/blocks/index.d.ts +1 -0
  62. package/dist/types/view/FlexibleCard/components/blocks/utils.d.ts +1 -0
  63. package/dist/types/view/common/ai-icon/index.d.ts +9 -0
  64. package/dist/types/view/common/ai-prism/ai-glowing-border/animated-svg-container.d.ts +9 -0
  65. package/dist/types/view/common/ai-prism/ai-glowing-border/index.d.ts +10 -0
  66. package/dist/types/view/common/ai-prism/ai-glowing-border/types.d.ts +25 -0
  67. package/dist/types/view/common/ai-prism/constants.d.ts +30 -0
  68. package/dist/types/view/common/ai-prism/index.d.ts +4 -0
  69. package/dist/types/view/common/ai-prism/types.d.ts +13 -0
  70. package/dist/types-ts4.5/messages.d.ts +1 -1
  71. package/dist/types-ts4.5/utils/actions/combine-action-options.d.ts +2 -2
  72. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/ai-summary-block/index.d.ts +11 -0
  73. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.d.ts +4 -0
  74. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/ai-summary-block/types.d.ts +23 -0
  75. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/index.d.ts +1 -0
  76. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/utils.d.ts +1 -0
  77. package/dist/types-ts4.5/view/common/ai-icon/index.d.ts +9 -0
  78. package/dist/types-ts4.5/view/common/ai-prism/ai-glowing-border/animated-svg-container.d.ts +9 -0
  79. package/dist/types-ts4.5/view/common/ai-prism/ai-glowing-border/index.d.ts +10 -0
  80. package/dist/types-ts4.5/view/common/ai-prism/ai-glowing-border/types.d.ts +25 -0
  81. package/dist/types-ts4.5/view/common/ai-prism/constants.d.ts +30 -0
  82. package/dist/types-ts4.5/view/common/ai-prism/index.d.ts +4 -0
  83. package/dist/types-ts4.5/view/common/ai-prism/types.d.ts +13 -0
  84. package/package.json +4 -4
@@ -0,0 +1,249 @@
1
+ "use strict";
2
+
3
+ var _typeof = require("@babel/runtime/helpers/typeof");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = void 0;
8
+ var _react = require("@emotion/react");
9
+ var _react2 = _interopRequireWildcard(require("react"));
10
+ var _constants = require("../constants");
11
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
12
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
13
+ /** @jsx jsx */
14
+
15
+ var namespaceUUID = 0;
16
+ var svgStyles = (0, _react.css)({
17
+ position: 'absolute',
18
+ borderRadius: _constants.OUTER_BORDER_RADIUS
19
+ });
20
+ var blurredStyles = (0, _react.css)({
21
+ width: "calc(100% - ".concat(_constants.GLOW_SIZE / 2, "px)"),
22
+ height: "calc(100% - ".concat(_constants.GLOW_SIZE / 2, "px)"),
23
+ top: _constants.GLOW_SIZE / 2,
24
+ left: _constants.GLOW_SIZE / 2,
25
+ filter: "blur(".concat(_constants.GLOW_SIZE, "px)"),
26
+ // for safari... : https://stackoverflow.com/a/71353198
27
+ backfaceVisibility: 'hidden',
28
+ transform: 'translate3d(0, 0, 0)'
29
+ });
30
+ var notBlurredStyles = (0, _react.css)({
31
+ left: 0,
32
+ top: 0,
33
+ width: '100%',
34
+ height: '100%'
35
+ });
36
+
37
+ /**
38
+ * The bulk of this file is originally from
39
+ * https://bitbucket.org/atlassian/barrel/src/master/ui/platform/ui-kit/ai
40
+ * with modifications.
41
+ */
42
+ var AnimatedSvgContainer = function AnimatedSvgContainer(_ref) {
43
+ var palette = _ref.palette,
44
+ isMoving = _ref.isMoving,
45
+ isGlowing = _ref.isGlowing,
46
+ additionalCss = _ref.additionalCss;
47
+ var svgRef = (0, _react2.useRef)(null);
48
+ var namespaceId = (0, _react2.useRef)();
49
+ if (namespaceId.current === undefined) {
50
+ namespaceId.current = namespaceUUID;
51
+ namespaceUUID += 1;
52
+ }
53
+ (0, _react2.useEffect)(function () {
54
+ if (isMoving) {
55
+ var svg = svgRef.current;
56
+
57
+ // Schedule animation to begin before next browser paint
58
+ var beginReq = requestAnimationFrame(function () {
59
+ svg === null || svg === void 0 || svg.querySelectorAll('animate').forEach(function (node) {
60
+ return node.beginElement();
61
+ });
62
+ });
63
+ return function () {
64
+ // Ensure any pending animation frame is cancelled as the element animation does not end properly if it
65
+ // begins in the same event tick, i.e. isLoading synchronously changes to true then false.
66
+ cancelAnimationFrame(beginReq);
67
+ requestAnimationFrame(function () {
68
+ svg === null || svg === void 0 || svg.querySelectorAll('animate').forEach(function (node) {
69
+ return node.endElement();
70
+ });
71
+ });
72
+ };
73
+ }
74
+ return undefined;
75
+ }, [isMoving]);
76
+ return (0, _react.jsx)("svg", {
77
+ css: [svgStyles, isGlowing ? blurredStyles : notBlurredStyles, additionalCss],
78
+ ref: svgRef,
79
+ viewBox: "0 0 24 24",
80
+ preserveAspectRatio: "none"
81
+ }, (0, _react.jsx)("defs", null, (0, _react.jsx)("linearGradient", {
82
+ id: "".concat(namespaceId.current, "_lg1"),
83
+ gradientUnits: "userSpaceOnUse",
84
+ x1: "0%",
85
+ y1: "0",
86
+ x2: "400%",
87
+ y2: "0",
88
+ spreadMethod: "reflect"
89
+ }, (0, _react.jsx)("animate", {
90
+ begin: "indefinite",
91
+ attributeName: "x1",
92
+ from: "0%",
93
+ to: "400%",
94
+ repeatCount: "indefinite",
95
+ dur: "3s"
96
+ }), (0, _react.jsx)("animate", {
97
+ begin: "indefinite",
98
+ attributeName: "x2",
99
+ from: "400%",
100
+ to: "800%",
101
+ repeatCount: "indefinite",
102
+ dur: "3s"
103
+ }), (0, _react.jsx)("stop", {
104
+ offset: "0",
105
+ stopColor: palette.blue
106
+ }), (0, _react.jsx)("stop", {
107
+ offset: "0.25",
108
+ stopColor: palette.teal
109
+ }), (0, _react.jsx)("stop", {
110
+ offset: "0.5",
111
+ stopColor: palette.yellow
112
+ }), (0, _react.jsx)("stop", {
113
+ offset: "0.75",
114
+ stopColor: palette.teal
115
+ }), (0, _react.jsx)("stop", {
116
+ offset: "1",
117
+ stopColor: palette.blue
118
+ })), (0, _react.jsx)("linearGradient", {
119
+ id: "".concat(namespaceId.current, "_lg2"),
120
+ gradientUnits: "userSpaceOnUse",
121
+ x1: "0",
122
+ y1: "-100%",
123
+ x2: "0",
124
+ y2: "300%",
125
+ spreadMethod: "reflect"
126
+ }, (0, _react.jsx)("animate", {
127
+ begin: "indefinite",
128
+ attributeName: "y1",
129
+ from: "-100%",
130
+ to: "300%",
131
+ repeatCount: "indefinite",
132
+ dur: "3s"
133
+ }), (0, _react.jsx)("animate", {
134
+ begin: "indefinite",
135
+ attributeName: "y2",
136
+ from: "300%",
137
+ to: "700%",
138
+ repeatCount: "indefinite",
139
+ dur: "3s"
140
+ }), (0, _react.jsx)("stop", {
141
+ offset: "0",
142
+ stopColor: palette.blue
143
+ }), (0, _react.jsx)("stop", {
144
+ offset: "0.25",
145
+ stopColor: palette.teal
146
+ }), (0, _react.jsx)("stop", {
147
+ offset: "0.5",
148
+ stopColor: palette.yellow
149
+ }), (0, _react.jsx)("stop", {
150
+ offset: "0.75",
151
+ stopColor: palette.teal
152
+ }), (0, _react.jsx)("stop", {
153
+ offset: "1",
154
+ stopColor: palette.blue
155
+ })), (0, _react.jsx)("linearGradient", {
156
+ id: "".concat(namespaceId.current, "_lg3"),
157
+ gradientUnits: "userSpaceOnUse",
158
+ x1: "300%",
159
+ y1: "0",
160
+ x2: "700%",
161
+ y2: "0",
162
+ spreadMethod: "reflect"
163
+ }, (0, _react.jsx)("animate", {
164
+ begin: "indefinite",
165
+ attributeName: "x1",
166
+ from: "300%",
167
+ to: "-100%",
168
+ repeatCount: "indefinite",
169
+ dur: "3s"
170
+ }), (0, _react.jsx)("animate", {
171
+ begin: "indefinite",
172
+ attributeName: "x2",
173
+ from: "700%",
174
+ to: "300%",
175
+ repeatCount: "indefinite",
176
+ dur: "3s"
177
+ }), (0, _react.jsx)("stop", {
178
+ offset: "0",
179
+ stopColor: palette.blue
180
+ }), (0, _react.jsx)("stop", {
181
+ offset: "0.25",
182
+ stopColor: palette.teal
183
+ }), (0, _react.jsx)("stop", {
184
+ offset: "0.5",
185
+ stopColor: palette.yellow
186
+ }), (0, _react.jsx)("stop", {
187
+ offset: "0.75",
188
+ stopColor: palette.teal
189
+ }), (0, _react.jsx)("stop", {
190
+ offset: "1",
191
+ stopColor: palette.blue
192
+ })), (0, _react.jsx)("linearGradient", {
193
+ id: "".concat(namespaceId.current, "_lg4"),
194
+ gradientUnits: "userSpaceOnUse",
195
+ x1: "0",
196
+ y1: "0",
197
+ x2: "0",
198
+ y2: "400%",
199
+ spreadMethod: "reflect"
200
+ }, (0, _react.jsx)("animate", {
201
+ begin: "indefinite",
202
+ attributeName: "y1",
203
+ from: "0%",
204
+ to: "-400%",
205
+ repeatCount: "indefinite",
206
+ dur: "3s"
207
+ }), (0, _react.jsx)("animate", {
208
+ begin: "indefinite",
209
+ attributeName: "y2",
210
+ from: "400%",
211
+ to: "0%",
212
+ repeatCount: "indefinite",
213
+ dur: "3s"
214
+ }), (0, _react.jsx)("stop", {
215
+ offset: "0",
216
+ stopColor: palette.blue
217
+ }), (0, _react.jsx)("stop", {
218
+ offset: "0.25",
219
+ stopColor: palette.teal
220
+ }), (0, _react.jsx)("stop", {
221
+ offset: "0.5",
222
+ stopColor: palette.yellow
223
+ }), (0, _react.jsx)("stop", {
224
+ offset: "0.75",
225
+ stopColor: palette.teal
226
+ }), (0, _react.jsx)("stop", {
227
+ offset: "1",
228
+ stopColor: palette.blue
229
+ }))), (0, _react.jsx)("g", {
230
+ strokeWidth: "8"
231
+ }, (0, _react.jsx)("path", {
232
+ stroke: "url(#".concat(namespaceId.current, "_lg1)"),
233
+ d: "M0 0h24",
234
+ vectorEffect: "non-scaling-stroke"
235
+ }), (0, _react.jsx)("path", {
236
+ stroke: "url(#".concat(namespaceId.current, "_lg2)"),
237
+ d: "M24 0v24",
238
+ vectorEffect: "non-scaling-stroke"
239
+ }), (0, _react.jsx)("path", {
240
+ stroke: "url(#".concat(namespaceId.current, "_lg3)"),
241
+ d: "M24 24H0",
242
+ vectorEffect: "non-scaling-stroke"
243
+ }), (0, _react.jsx)("path", {
244
+ stroke: "url(#".concat(namespaceId.current, "_lg4)"),
245
+ d: "M0 24V0",
246
+ vectorEffect: "non-scaling-stroke"
247
+ })));
248
+ };
249
+ var _default = exports.default = AnimatedSvgContainer;
@@ -0,0 +1,55 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = exports.borderContentStyles = void 0;
8
+ var _react = require("@emotion/react");
9
+ var _react2 = _interopRequireDefault(require("react"));
10
+ var _animatedSvgContainer = _interopRequireDefault(require("./animated-svg-container"));
11
+ var _constants = require("../constants");
12
+ /** @jsx jsx */
13
+
14
+ var borderContainerStyles = (0, _react.css)({
15
+ display: 'flex',
16
+ position: 'relative',
17
+ padding: "var(--ds-space-025, 2px)",
18
+ width: 'fit-content'
19
+ });
20
+ var borderContentStyles = exports.borderContentStyles = (0, _react.css)({
21
+ borderRadius: _constants.INNER_BORDER_RADIUS,
22
+ flexGrow: 1,
23
+ zIndex: 1 // needs to be more than the svg container at least
24
+ });
25
+
26
+ /**
27
+ * The bulk of this file is originally from
28
+ * https://bitbucket.org/atlassian/barrel/src/master/ui/platform/ui-kit/ai
29
+ * with modifications.
30
+ */
31
+ var AIGlowingBorder = function AIGlowingBorder(_ref) {
32
+ var children = _ref.children,
33
+ palette = _ref.palette,
34
+ _ref$isMoving = _ref.isMoving,
35
+ isMoving = _ref$isMoving === void 0 ? true : _ref$isMoving,
36
+ isGlowing = _ref.isGlowing,
37
+ testId = _ref.testId,
38
+ additionalCss = _ref.additionalCss;
39
+ return (0, _react.jsx)("div", {
40
+ css: [borderContainerStyles, additionalCss === null || additionalCss === void 0 ? void 0 : additionalCss.container],
41
+ "data-testid": testId
42
+ }, (0, _react.jsx)(_animatedSvgContainer.default, {
43
+ palette: palette,
44
+ isMoving: isMoving,
45
+ additionalCss: additionalCss === null || additionalCss === void 0 ? void 0 : additionalCss.animatedSvgContainer
46
+ }), isGlowing && (0, _react.jsx)(_animatedSvgContainer.default, {
47
+ palette: palette,
48
+ isMoving: isMoving,
49
+ isGlowing: true,
50
+ additionalCss: additionalCss === null || additionalCss === void 0 ? void 0 : additionalCss.animatedSvgContainer
51
+ }), (0, _react.jsx)("div", {
52
+ css: borderContentStyles
53
+ }, children, " "));
54
+ };
55
+ var _default = exports.default = AIGlowingBorder;
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
@@ -0,0 +1,53 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.aiThemeTokens = exports.OUTER_BORDER_RADIUS = exports.INNER_BORDER_RADIUS = exports.GLOW_SIZE = exports.AI_BORDER_PALETTE = void 0;
7
+ /**
8
+ * The bulk of this file is originally from
9
+ * https://bitbucket.org/atlassian/barrel/src/master/ui/platform/ui-kit/ai
10
+ * with modifications.
11
+ */
12
+
13
+ var GLOW_SIZE = exports.GLOW_SIZE = 8;
14
+ var INNER_BORDER_RADIUS = exports.INNER_BORDER_RADIUS = 8;
15
+ var OUTER_BORDER_RADIUS = exports.OUTER_BORDER_RADIUS = 10;
16
+
17
+ // We don't yet have design system tokens representing the AI prism colour palette. We should replace this with
18
+ // equivalent tokens when available
19
+ /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
20
+ var aiThemeTokens = exports.aiThemeTokens = {
21
+ blueUniqueGradientLight: '#00ACF8',
22
+ blueUniqueGradientDark: '#008BD2',
23
+ blue1000: '#092957',
24
+ blue800: '#0055CC',
25
+ blue700: '#0C66E4',
26
+ blue600: '#1D7AFC',
27
+ blue500: '#388BFF',
28
+ blue300: '#85B8FF',
29
+ blue200: '#CCE0FF',
30
+ blue100: '#E9F2FF',
31
+ teal500: '#37B4C3',
32
+ teal300: '#8BDBE5',
33
+ yellow500: '#CF9F02',
34
+ yellow200: '#F8E6A0',
35
+ red800: '#AE2A19',
36
+ red600: '#E34935',
37
+ orange500: '#F18D13',
38
+ orange300: '#FEC57B'
39
+ };
40
+ /* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
41
+
42
+ var AI_BORDER_PALETTE = exports.AI_BORDER_PALETTE = {
43
+ dark: {
44
+ blue: aiThemeTokens.blue800,
45
+ teal: aiThemeTokens.teal500,
46
+ yellow: aiThemeTokens.yellow500
47
+ },
48
+ light: {
49
+ blue: aiThemeTokens.blue600,
50
+ teal: aiThemeTokens.teal300,
51
+ yellow: aiThemeTokens.yellow200
52
+ }
53
+ };
@@ -0,0 +1,45 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = void 0;
8
+ var _react = require("@emotion/react");
9
+ var _react2 = _interopRequireDefault(require("react"));
10
+ var _tokens = require("@atlaskit/tokens");
11
+ var _constants = require("./constants");
12
+ var _aiGlowingBorder = _interopRequireDefault(require("./ai-glowing-border"));
13
+ /** @jsx jsx */
14
+
15
+ var contentStyles = (0, _react.css)({
16
+ backgroundColor: "var(--ds-surface-raised, white)",
17
+ borderRadius: _constants.INNER_BORDER_RADIUS
18
+ });
19
+ var AIPrism = function AIPrism(_ref) {
20
+ var _AI_BORDER_PALETTE$co;
21
+ var children = _ref.children,
22
+ _ref$isGlowing = _ref.isGlowing,
23
+ isGlowing = _ref$isGlowing === void 0 ? true : _ref$isGlowing,
24
+ _ref$isMoving = _ref.isMoving,
25
+ isMoving = _ref$isMoving === void 0 ? true : _ref$isMoving,
26
+ isVisible = _ref.isVisible,
27
+ testId = _ref.testId;
28
+ var _useThemeObserver = (0, _tokens.useThemeObserver)(),
29
+ _useThemeObserver$col = _useThemeObserver.colorMode,
30
+ colorMode = _useThemeObserver$col === void 0 ? 'light' : _useThemeObserver$col;
31
+ return (0, _react.jsx)(_aiGlowingBorder.default, {
32
+ additionalCss: {
33
+ animatedSvgContainer: (0, _react.css)({
34
+ opacity: isVisible ? 1 : 0
35
+ })
36
+ },
37
+ palette: (_AI_BORDER_PALETTE$co = _constants.AI_BORDER_PALETTE[colorMode]) !== null && _AI_BORDER_PALETTE$co !== void 0 ? _AI_BORDER_PALETTE$co : _constants.AI_BORDER_PALETTE.light,
38
+ isGlowing: isGlowing,
39
+ isMoving: isMoving,
40
+ testId: testId
41
+ }, (0, _react.jsx)("div", {
42
+ css: contentStyles
43
+ }, children));
44
+ };
45
+ var _default = exports.default = AIPrism;
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
@@ -13,6 +13,11 @@ export const messages = defineMessages({
13
13
  defaultMessage: 'Add account',
14
14
  description: 'Allows to add a new account'
15
15
  },
16
+ ai_summarize: {
17
+ id: 'fabric.linking.ai_summarize',
18
+ defaultMessage: 'Summarize',
19
+ description: 'Action to summarize link resource content with AI'
20
+ },
16
21
  assigned_to: {
17
22
  id: 'fabric.linking.assigned_to',
18
23
  defaultMessage: 'Assigned to {context}',
@@ -1,27 +1,27 @@
1
1
  import { CardAction } from '../../view/Card/types';
2
- export const combineActionOptions = (actionOptions, showServerActions, showActions) => {
2
+ export const combineActionOptions = (actionOptions, showServerActions, showActions, platform) => {
3
3
  if (typeof actionOptions !== 'undefined') {
4
4
  return actionOptions;
5
5
  }
6
- if (showServerActions === false && showActions === false) {
6
+ if (platform === 'mobile' || showServerActions === false && showActions === false) {
7
7
  return {
8
8
  hide: true
9
9
  };
10
- } else if (showServerActions && showActions) {
10
+ }
11
+ if (showServerActions && showActions) {
11
12
  return {
12
13
  hide: false
13
14
  };
14
- } else {
15
- let exclude = [];
16
- if (showServerActions === false) {
17
- exclude = [...exclude, CardAction.FollowAction, CardAction.ChangeStatusAction];
18
- }
19
- if (showActions === false) {
20
- exclude = [...exclude, CardAction.DownloadAction, CardAction.PreviewAction, CardAction.ViewAction];
21
- }
22
- return {
23
- hide: false,
24
- exclude
25
- };
26
15
  }
16
+ let exclude = [];
17
+ if (showServerActions === false) {
18
+ exclude = [...exclude, CardAction.FollowAction, CardAction.ChangeStatusAction];
19
+ }
20
+ if (showActions === false) {
21
+ exclude = [...exclude, CardAction.DownloadAction, CardAction.PreviewAction, CardAction.ViewAction];
22
+ }
23
+ return {
24
+ hide: false,
25
+ exclude
26
+ };
27
27
  };
@@ -4,7 +4,7 @@ export const ANALYTICS_CHANNEL = 'media';
4
4
  export const context = {
5
5
  componentName: 'smart-cards',
6
6
  packageName: "@atlaskit/smart-card",
7
- packageVersion: "26.45.3"
7
+ packageVersion: "26.46.1"
8
8
  };
9
9
  export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
10
10
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -29,7 +29,7 @@ function Component({
29
29
  onError,
30
30
  testId,
31
31
  showActions,
32
- showServerActions: showServerActionsProp,
32
+ showServerActions,
33
33
  actionOptions: actionOptionsProp,
34
34
  inheritDimensions,
35
35
  embedIframeRef,
@@ -64,8 +64,7 @@ function Component({
64
64
  const canBeDatasource = getCanBeDatasource(state.details);
65
65
  let isFlexibleUi = useMemo(() => isFlexibleUiCard(children), [children]);
66
66
  const enableFlexibleBlockCardFlag = Boolean(useFeatureFlag('enableFlexibleBlockCard'));
67
- const hideServerActions = showServerActionsProp === false || platform === 'mobile';
68
- const actionOptions = combineActionOptions(actionOptionsProp, !hideServerActions, showActions);
67
+ const actionOptions = combineActionOptions(actionOptionsProp, showServerActions, showActions, platform);
69
68
 
70
69
  // Setup UI handlers.
71
70
  const handleClickWrapper = useCallback(event => {
@@ -0,0 +1,25 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import React from 'react';
3
+ import AISummaryBlockResolvedView from './resolved';
4
+ import { SmartLinkStatus } from '../../../../../constants';
5
+
6
+ /**
7
+ * Represents an AISummaryBlock, designed to summarising link resource
8
+ * content using AI.
9
+ * @public
10
+ * @param {AISummaryBlockProps} AISummaryBlock
11
+ * @see Block
12
+ */
13
+ const AISummaryBlock = ({
14
+ status,
15
+ testId = 'smart-ai-summary-block',
16
+ ...props
17
+ }) => {
18
+ if (status !== SmartLinkStatus.Resolved) {
19
+ return null;
20
+ }
21
+ return /*#__PURE__*/React.createElement(AISummaryBlockResolvedView, _extends({}, props, {
22
+ testId: testId
23
+ }));
24
+ };
25
+ export default AISummaryBlock;
@@ -0,0 +1,62 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import React, { useCallback, useMemo } from 'react';
3
+ import { FormattedMessage } from 'react-intl-next';
4
+ import { ActionName, SmartLinkAlignment, SmartLinkSize, SmartLinkWidth } from '../../../../../../constants';
5
+ import { useFlexibleUiContext } from '../../../../../../state/flexible-ui-context';
6
+ import ActionGroup from '../../action-group';
7
+ import Block from '../../block';
8
+ import ElementGroup from '../../element-group';
9
+ import { filterActionItems, getActionGroupStyles, renderElementItems } from '../../utils';
10
+ import { messages } from '../../../../../../messages';
11
+ const AISummaryBlockResolvedView = props => {
12
+ const {
13
+ actions = [],
14
+ metadata,
15
+ testId,
16
+ onActionMenuOpenChange,
17
+ onAIActionChange,
18
+ size = SmartLinkSize.Medium
19
+ } = props;
20
+ const context = useFlexibleUiContext();
21
+ const metadataElements = renderElementItems(metadata);
22
+ const onAIActionClick = useCallback(() => {
23
+ if (onAIActionChange) {
24
+ onAIActionChange();
25
+ }
26
+ }, [onAIActionChange]);
27
+ const combinedActions = useMemo(() => {
28
+ const aiAction = {
29
+ content: /*#__PURE__*/React.createElement(FormattedMessage, messages.ai_summarize),
30
+ name: ActionName.CustomAction,
31
+ onClick: onAIActionClick,
32
+ testId: `${testId}-ai-summary-action`
33
+ };
34
+ return [aiAction, ...actions];
35
+ }, [actions, onAIActionClick, testId]);
36
+ const hasActions = useMemo(() => {
37
+ var _filterActionItems;
38
+ return ((_filterActionItems = filterActionItems(combinedActions, context)) === null || _filterActionItems === void 0 ? void 0 : _filterActionItems.length) > 0;
39
+ }, [combinedActions, context]);
40
+ const onDropdownOpenChange = useCallback(isOpen => {
41
+ if (onActionMenuOpenChange) {
42
+ onActionMenuOpenChange({
43
+ isOpen
44
+ });
45
+ }
46
+ }, [onActionMenuOpenChange]);
47
+ return /*#__PURE__*/React.createElement(Block, _extends({}, props, {
48
+ testId: `${testId}-resolved-view`
49
+ }), /*#__PURE__*/React.createElement(ElementGroup, {
50
+ width: SmartLinkWidth.Flexible
51
+ }, metadataElements), hasActions && /*#__PURE__*/React.createElement(ElementGroup, {
52
+ testId: "smart-element-group-actions",
53
+ align: SmartLinkAlignment.Right,
54
+ overrideCss: getActionGroupStyles(size),
55
+ width: SmartLinkWidth.Flexible
56
+ }, /*#__PURE__*/React.createElement(ActionGroup, {
57
+ onDropdownOpenChange: onDropdownOpenChange,
58
+ items: combinedActions,
59
+ appearance: "default"
60
+ })));
61
+ };
62
+ export default AISummaryBlockResolvedView;
@@ -1,5 +1,4 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
- import { css } from '@emotion/react';
3
2
  import React, { useCallback, useMemo } from 'react';
4
3
  import { SmartLinkAlignment, SmartLinkDirection, SmartLinkSize, SmartLinkWidth } from '../../../../../../constants';
5
4
  import { useFlexibleUiContext } from '../../../../../../state/flexible-ui-context';
@@ -7,17 +6,7 @@ import { Provider } from '../../../elements';
7
6
  import ActionGroup from '../../action-group';
8
7
  import Block from '../../block';
9
8
  import ElementGroup from '../../element-group';
10
- import { filterActionItems } from '../../utils';
11
- const getActionGroupStyles = size => {
12
- if (size === SmartLinkSize.XLarge) {
13
- // The biggest height of the action button exceeds the max line-height
14
- // of the elements causing the action on the block with x-large size to
15
- // get cut at the bottom.
16
- return css`
17
- max-height: 2rem;
18
- `;
19
- }
20
- };
9
+ import { filterActionItems, getActionGroupStyles } from '../../utils';
21
10
  const FooterBlockResolvedView = props => {
22
11
  const {
23
12
  actions,
@@ -7,4 +7,5 @@ export { default as CustomBlock } from './block';
7
7
 
8
8
  // Internal components to be used within @atlaskit/smart-card only.
9
9
  export { default as InternalFooterBlock } from './footer-block/resolved';
10
- export { default as RelatedUrlsBlock } from './related-urls-block';
10
+ export { default as RelatedUrlsBlock } from './related-urls-block';
11
+ export { default as AISummaryBlock } from './ai-summary-block';
@@ -111,6 +111,16 @@ export const isJSXElementNull = children => {
111
111
  return Boolean(children.type() === null);
112
112
  };
113
113
  const isElementOrElementGroup = node => /*#__PURE__*/React.isValidElement(node) && (isFlexibleUiElement(node) || node.type === ElementGroup);
114
+ export const getActionGroupStyles = size => {
115
+ if (size === SmartLinkSize.XLarge) {
116
+ // The biggest height of the action button exceeds the max line-height
117
+ // of the elements causing the action on the block with x-large size to
118
+ // get cut at the bottom.
119
+ return css`
120
+ max-height: 2rem;
121
+ `;
122
+ }
123
+ };
114
124
  export const filterActionItems = (items = [], context) => {
115
125
  return items.filter(item => {
116
126
  switch (item.name) {
@@ -7,7 +7,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
7
7
  import LinkWarningModal from './LinkWarningModal';
8
8
  const PACKAGE_DATA = {
9
9
  packageName: "@atlaskit/smart-card",
10
- packageVersion: "26.45.3",
10
+ packageVersion: "26.46.1",
11
11
  componentName: 'linkUrl'
12
12
  };
13
13
  const Link = withLinkClickedEvent('a');