@atlaskit/smart-card 26.50.11 → 26.50.13

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 (31) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/cjs/utils/analytics/analytics.js +1 -1
  3. package/dist/cjs/view/BlockCard/views/flexible/FlexibleErroredView.js +1 -0
  4. package/dist/cjs/view/BlockCard/views/flexible/FlexibleForbiddenView.js +1 -1
  5. package/dist/cjs/view/BlockCard/views/flexible/FlexibleNotFoundView.js +2 -1
  6. package/dist/cjs/view/BlockCard/views/flexible/styled.js +31 -7
  7. package/dist/cjs/view/BlockCard/views/flexible/unresolved-view/index.js +7 -1
  8. package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +3 -1
  9. package/dist/cjs/view/HoverCard/styled.js +1 -1
  10. package/dist/cjs/view/LinkUrl/index.js +1 -1
  11. package/dist/es2019/utils/analytics/analytics.js +1 -1
  12. package/dist/es2019/view/BlockCard/views/flexible/FlexibleErroredView.js +1 -0
  13. package/dist/es2019/view/BlockCard/views/flexible/FlexibleForbiddenView.js +1 -1
  14. package/dist/es2019/view/BlockCard/views/flexible/FlexibleNotFoundView.js +2 -1
  15. package/dist/es2019/view/BlockCard/views/flexible/styled.js +25 -31
  16. package/dist/es2019/view/BlockCard/views/flexible/unresolved-view/index.js +7 -1
  17. package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +4 -2
  18. package/dist/es2019/view/HoverCard/styled.js +1 -1
  19. package/dist/es2019/view/LinkUrl/index.js +1 -1
  20. package/dist/esm/utils/analytics/analytics.js +1 -1
  21. package/dist/esm/view/BlockCard/views/flexible/FlexibleErroredView.js +1 -0
  22. package/dist/esm/view/BlockCard/views/flexible/FlexibleForbiddenView.js +1 -1
  23. package/dist/esm/view/BlockCard/views/flexible/FlexibleNotFoundView.js +2 -1
  24. package/dist/esm/view/BlockCard/views/flexible/styled.js +31 -6
  25. package/dist/esm/view/BlockCard/views/flexible/unresolved-view/index.js +7 -1
  26. package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +3 -1
  27. package/dist/esm/view/HoverCard/styled.js +1 -1
  28. package/dist/esm/view/LinkUrl/index.js +1 -1
  29. package/dist/types/view/FlexibleCard/components/elements/text/types.d.ts +1 -1
  30. package/dist/types-ts4.5/view/FlexibleCard/components/elements/text/types.d.ts +1 -1
  31. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # @atlaskit/smart-card
2
2
 
3
+ ## 26.50.13
4
+
5
+ ### Patch Changes
6
+
7
+ - [#86599](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/86599) [`06e49db490ed`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/06e49db490ed) - [ux] Updated hover card background token to use overlay rather than raised to match shadow token
8
+ - [#85643](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/85643) [`32f691ba9300`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/32f691ba9300) - Removes error state indicator when hovercard is remounted"
9
+
10
+ ## 26.50.12
11
+
12
+ ### Patch Changes
13
+
14
+ - [#85502](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/85502) [`65a8e82b8b0c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/65a8e82b8b0c) - [ux] increasing max lines for error messages on flexible block cards
15
+ - Updated dependencies
16
+
3
17
  ## 26.50.11
4
18
 
5
19
  ### Patch Changes
@@ -22,7 +22,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
22
22
  var context = exports.context = {
23
23
  componentName: 'smart-cards',
24
24
  packageName: "@atlaskit/smart-card",
25
- packageVersion: "26.50.11"
25
+ packageVersion: "26.50.13"
26
26
  };
27
27
  var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
28
28
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -41,6 +41,7 @@ var FlexibleErroredView = function FlexibleErroredView(_ref) {
41
41
  primaryColor: "var(--ds-icon-warning, ".concat(_colors.R300, ")"),
42
42
  testId: "".concat(testId, "-warning-icon")
43
43
  }), /*#__PURE__*/_react.default.createElement(_text.default, {
44
+ maxLines: 3,
44
45
  message: {
45
46
  descriptor: _messages.messages.could_not_load_link
46
47
  }
@@ -91,7 +91,7 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
91
91
  primaryColor: "var(--ds-icon-danger, ".concat(_colors.R300, ")"),
92
92
  testId: "".concat(testId, "-lock-icon")
93
93
  }), /*#__PURE__*/_react.default.createElement(_text.default, {
94
- maxLines: 2,
94
+ maxLines: 3,
95
95
  message: {
96
96
  descriptor: (0, _intlUtils.toMessage)(_messages.messages.invalid_permissions_description, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.descriptiveMessageKey),
97
97
  values: messageContext
@@ -59,7 +59,8 @@ var FlexibleNotFoundView = function FlexibleNotFoundView(_ref) {
59
59
  testId: "".concat(testId, "-lock-icon")
60
60
  }), /*#__PURE__*/_react.default.createElement(_text.default, {
61
61
  message: description,
62
- testId: "".concat(testId, "-message")
62
+ testId: "".concat(testId, "-message"),
63
+ maxLines: 3
63
64
  }));
64
65
  };
65
66
  var _default = exports.default = (0, _withFlexibleUIBlockCardStyle.withFlexibleUIBlockCardStyle)(FlexibleNotFoundView);
@@ -1,17 +1,41 @@
1
1
  "use strict";
2
2
 
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
3
  Object.defineProperty(exports, "__esModule", {
5
4
  value: true
6
5
  });
7
6
  exports.titleBlockCss = exports.metadataBlockCss = exports.footerBlockCss = exports.flexibleBlockCardStyle = void 0;
8
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
9
7
  var _react = require("@emotion/react");
10
8
  var _colors = require("@atlaskit/theme/colors");
11
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
12
9
  // in editor prosemirror adds padding-left so we need to overwrite it
13
10
  // renderer overwrites the margin-right so we need to add it here
14
- var metadataBlockCss = exports.metadataBlockCss = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n /* primary element group */\n span[data-smart-element-avatar-group] {\n > ul {\n padding-left: 0px;\n margin-right: 0.5rem;\n }\n }\n [data-smart-element-group] {\n line-height: 1rem;\n }\n"])));
15
- var titleBlockCss = exports.titleBlockCss = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n gap: 0.5em;\n\n [data-smart-element='Title'] {\n font-weight: 600;\n }\n"])));
16
- var footerBlockCss = exports.footerBlockCss = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n height: 1.5rem;\n\n .actions-button-group {\n button,\n button:hover,\n button:focus,\n button:active {\n font-size: 0.875rem;\n }\n }\n"])));
17
- var flexibleBlockCardStyle = exports.flexibleBlockCardStyle = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n & > div {\n border-radius: ", ";\n border: 1px solid ", ";\n }\n"])), "var(--ds-border-radius-200, 8px)", "var(--ds-border, ".concat(_colors.N40, ")"));
11
+ var metadataBlockCss = exports.metadataBlockCss = (0, _react.css)({
12
+ 'span[data-smart-element-avatar-group]': {
13
+ '> ul': {
14
+ paddingLeft: '0px',
15
+ marginRight: "var(--ds-space-100, 0.5rem)"
16
+ }
17
+ },
18
+ '[data-smart-element-group]': {
19
+ lineHeight: '1rem'
20
+ }
21
+ });
22
+ var titleBlockCss = exports.titleBlockCss = (0, _react.css)({
23
+ gap: "var(--ds-space-100, 0.5em)",
24
+ "[data-smart-element='Title']": {
25
+ fontWeight: 600
26
+ }
27
+ });
28
+ var footerBlockCss = exports.footerBlockCss = (0, _react.css)({
29
+ height: '1.5rem',
30
+ '.actions-button-group': {
31
+ 'button, button:hover, button:focus, button:active': {
32
+ fontSize: '0.875rem'
33
+ }
34
+ }
35
+ });
36
+ var flexibleBlockCardStyle = exports.flexibleBlockCardStyle = (0, _react.css)({
37
+ '& > div': {
38
+ borderRadius: "var(--ds-border-radius-200, 8px)",
39
+ border: "1px solid ".concat("var(--ds-border, ".concat(_colors.N40, ")"))
40
+ }
41
+ });
@@ -10,6 +10,10 @@ var _blocks = require("../../../../FlexibleCard/components/blocks");
10
10
  var _react = _interopRequireDefault(require("react"));
11
11
  var _FlexibleCard = _interopRequireDefault(require("../../../../FlexibleCard"));
12
12
  var _utils = require("../utils");
13
+ var _react2 = require("@emotion/react");
14
+ var customBlockStyles = (0, _react2.css)({
15
+ alignItems: 'flex-start'
16
+ });
13
17
  var UnresolvedView = function UnresolvedView(_ref) {
14
18
  var actions = _ref.actions,
15
19
  cardState = _ref.cardState,
@@ -34,7 +38,9 @@ var UnresolvedView = function UnresolvedView(_ref) {
34
38
  }, /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, (0, _extends2.default)({}, _utils.titleBlockOptions, {
35
39
  hideIcon: !!title,
36
40
  text: title
37
- })), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, children), showPreview && /*#__PURE__*/_react.default.createElement(_blocks.PreviewBlock, _utils.PreviewBlockOptions), /*#__PURE__*/_react.default.createElement(_blocks.InternalFooterBlock, (0, _extends2.default)({}, _utils.FooterBlockOptions, {
41
+ })), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, {
42
+ overrideCss: customBlockStyles
43
+ }, children), showPreview && /*#__PURE__*/_react.default.createElement(_blocks.PreviewBlock, _utils.PreviewBlockOptions), /*#__PURE__*/_react.default.createElement(_blocks.InternalFooterBlock, (0, _extends2.default)({}, _utils.FooterBlockOptions, {
38
44
  actions: actions,
39
45
  testId: "smart-block-card-footer"
40
46
  })));
@@ -60,10 +60,12 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
60
60
  showAISummaryErrorMessage = _useState2[0],
61
61
  setShowAISummaryErrorMessage = _useState2[1];
62
62
  (0, _react.useEffect)(function () {
63
+ // if the error was apparent on mount and the status is changed to loading we can
64
+ // clear the initial error on mount state
63
65
  if (isErroredOnMountRef.current && status === 'loading') {
64
66
  isErroredOnMountRef.current = false;
65
- setShowAISummaryErrorMessage(true);
66
67
  } else {
68
+ // if a new error occurs and it was not an apparent error on mount, we can show the error message
67
69
  setShowAISummaryErrorMessage(!isErroredOnMountRef.current && status === 'error');
68
70
  }
69
71
  }, [status]);
@@ -42,7 +42,7 @@ var getTransitionStyles = exports.getTransitionStyles = function getTransitionSt
42
42
  };
43
43
  var popupContainerStyles = exports.popupContainerStyles = (0, _react.css)({
44
44
  borderRadius: "var(--ds-border-radius-200, 8px)",
45
- backgroundColor: "var(--ds-surface-raised, white)",
45
+ backgroundColor: "var(--ds-surface-overlay, white)",
46
46
  boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px rgba(9, 30, 66, 0.15),0px 0px 1px rgba(9, 30, 66, 0.31))"
47
47
  });
48
48
  var getPreviewBlockStyles = exports.getPreviewBlockStyles = function getPreviewBlockStyles(previewHeight) {
@@ -17,7 +17,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
17
17
  _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
18
18
  var PACKAGE_DATA = {
19
19
  packageName: "@atlaskit/smart-card",
20
- packageVersion: "26.50.11",
20
+ packageVersion: "26.50.13",
21
21
  componentName: 'linkUrl'
22
22
  };
23
23
  var Link = (0, _click.withLinkClickedEvent)('a');
@@ -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.50.11"
7
+ packageVersion: "26.50.13"
8
8
  };
9
9
  export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
10
10
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -28,6 +28,7 @@ const FlexibleErroredView = ({
28
28
  primaryColor: `var(--ds-icon-warning, ${R300})`,
29
29
  testId: `${testId}-warning-icon`
30
30
  }), /*#__PURE__*/React.createElement(Text, {
31
+ maxLines: 3,
31
32
  message: {
32
33
  descriptor: messages.could_not_load_link
33
34
  }
@@ -84,7 +84,7 @@ const FlexibleForbiddenView = ({
84
84
  primaryColor: `var(--ds-icon-danger, ${R300})`,
85
85
  testId: `${testId}-lock-icon`
86
86
  }), /*#__PURE__*/React.createElement(Text, {
87
- maxLines: 2,
87
+ maxLines: 3,
88
88
  message: {
89
89
  descriptor: toMessage(messages.invalid_permissions_description, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.descriptiveMessageKey),
90
90
  values: messageContext
@@ -46,7 +46,8 @@ const FlexibleNotFoundView = ({
46
46
  testId: `${testId}-lock-icon`
47
47
  }), /*#__PURE__*/React.createElement(Text, {
48
48
  message: description,
49
- testId: `${testId}-message`
49
+ testId: `${testId}-message`,
50
+ maxLines: 3
50
51
  }));
51
52
  };
52
53
  export default withFlexibleUIBlockCardStyle(FlexibleNotFoundView);
@@ -3,40 +3,34 @@ import { N40 } from '@atlaskit/theme/colors';
3
3
 
4
4
  // in editor prosemirror adds padding-left so we need to overwrite it
5
5
  // renderer overwrites the margin-right so we need to add it here
6
- export const metadataBlockCss = css`
7
- /* primary element group */
8
- span[data-smart-element-avatar-group] {
9
- > ul {
10
- padding-left: 0px;
11
- margin-right: 0.5rem;
6
+ export const metadataBlockCss = css({
7
+ 'span[data-smart-element-avatar-group]': {
8
+ '> ul': {
9
+ paddingLeft: '0px',
10
+ marginRight: "var(--ds-space-100, 0.5rem)"
12
11
  }
12
+ },
13
+ '[data-smart-element-group]': {
14
+ lineHeight: '1rem'
13
15
  }
14
- [data-smart-element-group] {
15
- line-height: 1rem;
16
+ });
17
+ export const titleBlockCss = css({
18
+ gap: "var(--ds-space-100, 0.5em)",
19
+ "[data-smart-element='Title']": {
20
+ fontWeight: 600
16
21
  }
17
- `;
18
- export const titleBlockCss = css`
19
- gap: 0.5em;
20
-
21
- [data-smart-element='Title'] {
22
- font-weight: 600;
23
- }
24
- `;
25
- export const footerBlockCss = css`
26
- height: 1.5rem;
27
-
28
- .actions-button-group {
29
- button,
30
- button:hover,
31
- button:focus,
32
- button:active {
33
- font-size: 0.875rem;
22
+ });
23
+ export const footerBlockCss = css({
24
+ height: '1.5rem',
25
+ '.actions-button-group': {
26
+ 'button, button:hover, button:focus, button:active': {
27
+ fontSize: '0.875rem'
34
28
  }
35
29
  }
36
- `;
37
- export const flexibleBlockCardStyle = css`
38
- & > div {
39
- border-radius: ${"var(--ds-border-radius-200, 8px)"};
40
- border: 1px solid ${`var(--ds-border, ${N40})`};
30
+ });
31
+ export const flexibleBlockCardStyle = css({
32
+ '& > div': {
33
+ borderRadius: "var(--ds-border-radius-200, 8px)",
34
+ border: `1px solid ${`var(--ds-border, ${N40})`}`
41
35
  }
42
- `;
36
+ });
@@ -4,6 +4,10 @@ import React from 'react';
4
4
  import FlexibleCard from '../../../../FlexibleCard';
5
5
  import { InternalFooterBlock } from '../../../../FlexibleCard/components/blocks';
6
6
  import { FlexibleCardUiOptions, PreviewBlockOptions, titleBlockOptions, FooterBlockOptions } from '../utils';
7
+ import { css } from '@emotion/react';
8
+ const customBlockStyles = css({
9
+ alignItems: 'flex-start'
10
+ });
7
11
  const UnresolvedView = ({
8
12
  actions,
9
13
  cardState,
@@ -27,7 +31,9 @@ const UnresolvedView = ({
27
31
  }, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockOptions, {
28
32
  hideIcon: !!title,
29
33
  text: title
30
- })), /*#__PURE__*/React.createElement(CustomBlock, null, children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, PreviewBlockOptions), /*#__PURE__*/React.createElement(InternalFooterBlock, _extends({}, FooterBlockOptions, {
34
+ })), /*#__PURE__*/React.createElement(CustomBlock, {
35
+ overrideCss: customBlockStyles
36
+ }, children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, PreviewBlockOptions), /*#__PURE__*/React.createElement(InternalFooterBlock, _extends({}, FooterBlockOptions, {
31
37
  actions: actions,
32
38
  testId: "smart-block-card-footer"
33
39
  })));
@@ -45,13 +45,15 @@ const AISummaryBlockResolvedView = props => {
45
45
  // We want to display the AI Summary component only when there is content available during the loading process.
46
46
  status === 'loading' && !!content;
47
47
  const isSummarisedOnMountRef = useRef(status === 'done');
48
- let isErroredOnMountRef = useRef(status === 'error');
48
+ const isErroredOnMountRef = useRef(status === 'error');
49
49
  const [showAISummaryErrorMessage, setShowAISummaryErrorMessage] = useState(false);
50
50
  useEffect(() => {
51
+ // if the error was apparent on mount and the status is changed to loading we can
52
+ // clear the initial error on mount state
51
53
  if (isErroredOnMountRef.current && status === 'loading') {
52
54
  isErroredOnMountRef.current = false;
53
- setShowAISummaryErrorMessage(true);
54
55
  } else {
56
+ // if a new error occurs and it was not an apparent error on mount, we can show the error message
55
57
  setShowAISummaryErrorMessage(!isErroredOnMountRef.current && status === 'error');
56
58
  }
57
59
  }, [status]);
@@ -62,7 +62,7 @@ export const getTransitionStyles = snippetHeight => css({
62
62
  });
63
63
  export const popupContainerStyles = css({
64
64
  borderRadius: "var(--ds-border-radius-200, 8px)",
65
- backgroundColor: "var(--ds-surface-raised, white)",
65
+ backgroundColor: "var(--ds-surface-overlay, white)",
66
66
  boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px rgba(9, 30, 66, 0.15),0px 0px 1px rgba(9, 30, 66, 0.31))"
67
67
  });
68
68
  export const getPreviewBlockStyles = previewHeight => css(previewHeight ? `height: ${previewHeight}px;` : '', {
@@ -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.50.11",
10
+ packageVersion: "26.50.13",
11
11
  componentName: 'linkUrl'
12
12
  };
13
13
  const Link = withLinkClickedEvent('a');
@@ -15,7 +15,7 @@ export var ANALYTICS_CHANNEL = 'media';
15
15
  export var context = {
16
16
  componentName: 'smart-cards',
17
17
  packageName: "@atlaskit/smart-card",
18
- packageVersion: "26.50.11"
18
+ packageVersion: "26.50.13"
19
19
  };
20
20
  export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
21
21
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -32,6 +32,7 @@ var FlexibleErroredView = function FlexibleErroredView(_ref) {
32
32
  primaryColor: "var(--ds-icon-warning, ".concat(R300, ")"),
33
33
  testId: "".concat(testId, "-warning-icon")
34
34
  }), /*#__PURE__*/React.createElement(Text, {
35
+ maxLines: 3,
35
36
  message: {
36
37
  descriptor: messages.could_not_load_link
37
38
  }
@@ -82,7 +82,7 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
82
82
  primaryColor: "var(--ds-icon-danger, ".concat(R300, ")"),
83
83
  testId: "".concat(testId, "-lock-icon")
84
84
  }), /*#__PURE__*/React.createElement(Text, {
85
- maxLines: 2,
85
+ maxLines: 3,
86
86
  message: {
87
87
  descriptor: toMessage(messages.invalid_permissions_description, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.descriptiveMessageKey),
88
88
  values: messageContext
@@ -50,7 +50,8 @@ var FlexibleNotFoundView = function FlexibleNotFoundView(_ref) {
50
50
  testId: "".concat(testId, "-lock-icon")
51
51
  }), /*#__PURE__*/React.createElement(Text, {
52
52
  message: description,
53
- testId: "".concat(testId, "-message")
53
+ testId: "".concat(testId, "-message"),
54
+ maxLines: 3
54
55
  }));
55
56
  };
56
57
  export default withFlexibleUIBlockCardStyle(FlexibleNotFoundView);
@@ -1,11 +1,36 @@
1
- import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
2
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
3
1
  import { css } from '@emotion/react';
4
2
  import { N40 } from '@atlaskit/theme/colors';
5
3
 
6
4
  // in editor prosemirror adds padding-left so we need to overwrite it
7
5
  // renderer overwrites the margin-right so we need to add it here
8
- export var metadataBlockCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n /* primary element group */\n span[data-smart-element-avatar-group] {\n > ul {\n padding-left: 0px;\n margin-right: 0.5rem;\n }\n }\n [data-smart-element-group] {\n line-height: 1rem;\n }\n"])));
9
- export var titleBlockCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n gap: 0.5em;\n\n [data-smart-element='Title'] {\n font-weight: 600;\n }\n"])));
10
- export var footerBlockCss = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n height: 1.5rem;\n\n .actions-button-group {\n button,\n button:hover,\n button:focus,\n button:active {\n font-size: 0.875rem;\n }\n }\n"])));
11
- export var flexibleBlockCardStyle = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n & > div {\n border-radius: ", ";\n border: 1px solid ", ";\n }\n"])), "var(--ds-border-radius-200, 8px)", "var(--ds-border, ".concat(N40, ")"));
6
+ export var metadataBlockCss = css({
7
+ 'span[data-smart-element-avatar-group]': {
8
+ '> ul': {
9
+ paddingLeft: '0px',
10
+ marginRight: "var(--ds-space-100, 0.5rem)"
11
+ }
12
+ },
13
+ '[data-smart-element-group]': {
14
+ lineHeight: '1rem'
15
+ }
16
+ });
17
+ export var titleBlockCss = css({
18
+ gap: "var(--ds-space-100, 0.5em)",
19
+ "[data-smart-element='Title']": {
20
+ fontWeight: 600
21
+ }
22
+ });
23
+ export var footerBlockCss = css({
24
+ height: '1.5rem',
25
+ '.actions-button-group': {
26
+ 'button, button:hover, button:focus, button:active': {
27
+ fontSize: '0.875rem'
28
+ }
29
+ }
30
+ });
31
+ export var flexibleBlockCardStyle = css({
32
+ '& > div': {
33
+ borderRadius: "var(--ds-border-radius-200, 8px)",
34
+ border: "1px solid ".concat("var(--ds-border, ".concat(N40, ")"))
35
+ }
36
+ });
@@ -4,6 +4,10 @@ import React from 'react';
4
4
  import FlexibleCard from '../../../../FlexibleCard';
5
5
  import { InternalFooterBlock } from '../../../../FlexibleCard/components/blocks';
6
6
  import { FlexibleCardUiOptions, PreviewBlockOptions, titleBlockOptions, FooterBlockOptions } from '../utils';
7
+ import { css } from '@emotion/react';
8
+ var customBlockStyles = css({
9
+ alignItems: 'flex-start'
10
+ });
7
11
  var UnresolvedView = function UnresolvedView(_ref) {
8
12
  var actions = _ref.actions,
9
13
  cardState = _ref.cardState,
@@ -28,7 +32,9 @@ var UnresolvedView = function UnresolvedView(_ref) {
28
32
  }, /*#__PURE__*/React.createElement(TitleBlock, _extends({}, titleBlockOptions, {
29
33
  hideIcon: !!title,
30
34
  text: title
31
- })), /*#__PURE__*/React.createElement(CustomBlock, null, children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, PreviewBlockOptions), /*#__PURE__*/React.createElement(InternalFooterBlock, _extends({}, FooterBlockOptions, {
35
+ })), /*#__PURE__*/React.createElement(CustomBlock, {
36
+ overrideCss: customBlockStyles
37
+ }, children), showPreview && /*#__PURE__*/React.createElement(PreviewBlock, PreviewBlockOptions), /*#__PURE__*/React.createElement(InternalFooterBlock, _extends({}, FooterBlockOptions, {
32
38
  actions: actions,
33
39
  testId: "smart-block-card-footer"
34
40
  })));
@@ -50,10 +50,12 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
50
50
  showAISummaryErrorMessage = _useState2[0],
51
51
  setShowAISummaryErrorMessage = _useState2[1];
52
52
  useEffect(function () {
53
+ // if the error was apparent on mount and the status is changed to loading we can
54
+ // clear the initial error on mount state
53
55
  if (isErroredOnMountRef.current && status === 'loading') {
54
56
  isErroredOnMountRef.current = false;
55
- setShowAISummaryErrorMessage(true);
56
57
  } else {
58
+ // if a new error occurs and it was not an apparent error on mount, we can show the error message
57
59
  setShowAISummaryErrorMessage(!isErroredOnMountRef.current && status === 'error');
58
60
  }
59
61
  }, [status]);
@@ -36,7 +36,7 @@ export var getTransitionStyles = function getTransitionStyles(snippetHeight) {
36
36
  };
37
37
  export var popupContainerStyles = css({
38
38
  borderRadius: "var(--ds-border-radius-200, 8px)",
39
- backgroundColor: "var(--ds-surface-raised, white)",
39
+ backgroundColor: "var(--ds-surface-overlay, white)",
40
40
  boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px rgba(9, 30, 66, 0.15),0px 0px 1px rgba(9, 30, 66, 0.31))"
41
41
  });
42
42
  export var getPreviewBlockStyles = function getPreviewBlockStyles(previewHeight) {
@@ -10,7 +10,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
10
10
  import LinkWarningModal from './LinkWarningModal';
11
11
  var PACKAGE_DATA = {
12
12
  packageName: "@atlaskit/smart-card",
13
- packageVersion: "26.50.11",
13
+ packageVersion: "26.50.13",
14
14
  componentName: 'linkUrl'
15
15
  };
16
16
  var Link = withLinkClickedEvent('a');
@@ -11,7 +11,7 @@ export type TextProps = ElementProps & {
11
11
  */
12
12
  content?: string;
13
13
  /**
14
- * The maximum number of lines the text should span over. Maximum is 2.
14
+ * The maximum number of lines the text should span over. Maximum is 2 unless its an error message.
15
15
  */
16
16
  maxLines?: number;
17
17
  };
@@ -11,7 +11,7 @@ export type TextProps = ElementProps & {
11
11
  */
12
12
  content?: string;
13
13
  /**
14
- * The maximum number of lines the text should span over. Maximum is 2.
14
+ * The maximum number of lines the text should span over. Maximum is 2 unless its an error message.
15
15
  */
16
16
  maxLines?: number;
17
17
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "26.50.11",
3
+ "version": "26.50.13",
4
4
  "description": "Smart card component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -51,7 +51,7 @@
51
51
  "@atlaskit/outbound-auth-flow-client": "^3.4.0",
52
52
  "@atlaskit/platform-feature-flags": "^0.2.1",
53
53
  "@atlaskit/popup": "^1.14.0",
54
- "@atlaskit/primitives": "^5.1.0",
54
+ "@atlaskit/primitives": "^5.2.0",
55
55
  "@atlaskit/spinner": "^16.0.0",
56
56
  "@atlaskit/theme": "^12.7.0",
57
57
  "@atlaskit/tokens": "^1.42.0",