@atlaskit/smart-card 44.3.23 → 44.4.0

package/dist/cjs/view/FlexibleCard/components/elements/common/base-badge-element/index.js

@@ -11,6 +11,7 @@ require("./index.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _constants = require("../../../../../../constants");
 var _messages = require("../../../../../../messages");
@@ -84,13 +85,16 @@ var BaseBadgeRefreshNew = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, re
     _ref$testId = _ref.testId,
     testId = _ref$testId === void 0 ? 'smart-element-badge' : _ref$testId,
     url = _ref.url,
-    color = _ref.color;
+    color = _ref.color,
+    _ref$hideLabel = _ref.hideLabel,
+    hideLabel = _ref$hideLabel === void 0 ? false : _ref$hideLabel;
   var ui = (0, _flexibleUiContext.useFlexibleUiOptionContext)();
   var formattedMessageOrLabel = getFormattedMessageFromIcon(icon) || label;
   var badgeIcon = renderAtlaskitIcon(icon, testId) || renderImageIcon(url, testId, ui === null || ui === void 0 ? void 0 : ui.hideLoadingSkeleton);
   if (!formattedMessageOrLabel || !badgeIcon) {
     return null;
   }
+  var shouldHideLabel = hideLabel && (0, _platformFeatureFlags.fg)('platform_sl_3p_auth_rovo_block_card_kill_switch');
   return /*#__PURE__*/_react.default.createElement("span", {
     "data-smart-element": name,
     "data-smart-element-badge": true,
@@ -103,7 +107,7 @@ var BaseBadgeRefreshNew = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, re
   }, !hideIcon && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
     as: "span",
     xcss: styles.icon
-  }, badgeIcon), /*#__PURE__*/_react.default.createElement(_compiled.Box, {
+  }, badgeIcon), !shouldHideLabel && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
     as: "span",
     testId: "".concat(testId, "-label"),
     xcss: styles.text

package/dist/cjs/view/FlexibleCard/components/elements/common/base-lozenge-element/lozenge-action/lozenge-action-item/index.js

@@ -6,11 +6,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
 var _dropdownMenu = require("@atlaskit/dropdown-menu");
 var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var LozengeActionItem = function LozengeActionItem(_ref) {
   var appearance = _ref.appearance,
@@ -30,13 +28,11 @@ var LozengeActionItem = function LozengeActionItem(_ref) {
     var _e$currentTarget;
     (_e$currentTarget = e.currentTarget) === null || _e$currentTarget === void 0 || (_e$currentTarget = _e$currentTarget.firstElementChild) === null || _e$currentTarget === void 0 || _e$currentTarget.focus();
   }, []);
-  return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({}, (0, _platformFeatureFlags.fg)('platform_sl_a11y_enghealth_46829') ? {
-    onFocus: handleMouseEnter
-  } : undefined, {
-    // eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
+  return /*#__PURE__*/_react.default.createElement("span", {
+    onFocus: handleMouseEnter,
     onMouseEnter: handleMouseEnter,
     role: "presentation"
-  }), /*#__PURE__*/_react.default.createElement(_dropdownMenu.DropdownItem, {
+  }, /*#__PURE__*/_react.default.createElement(_dropdownMenu.DropdownItem, {
     onClick: handleClick,
     testId: testId
   }, /*#__PURE__*/_react.default.createElement(_lozenge.default, {

package/dist/cjs/view/HoverCard/components/HoverCardComponent.js

@@ -248,10 +248,7 @@ var HoverCardComponent = exports.HoverCardComponent = function HoverCardComponen
     return /*#__PURE__*/_react.default.createElement("span", {
       ref: parentSpan
     }, /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({}, triggerProps, {
-      // eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
-      onMouseOver: initShowCard
-      // eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
-      ,
+      onMouseOver: initShowCard,
       onMouseLeave: initHideCard,
       onMouseMove: setMousePosition,
       onKeyDown: (0, _platformFeatureFlags.fg)('fix_hover_card_on_focus_a11y') ? handleKeyDown : undefined,
@@ -260,11 +257,11 @@ var HoverCardComponent = exports.HoverCardComponent = function HoverCardComponen
       "data-testid": HOVER_CARD_TRIGGER_WRAPPER
     }, (0, _experiments.editorExperiment)('platform_editor_preview_panel_linking_exp', true) ? {
       className: HOVER_CARD_TRIGGER_WRAPPER
-    } : {}, (0, _platformFeatureFlags.fg)('platform_sl_a11y_enghealth_46829') ? {
+    } : {}, {
       onFocus: _utils.noop,
       onBlur: _utils.noop,
-      role: 'none'
-    } : undefined), children));
+      role: "none"
+    }), children));
   }, [children, initHideCard, initShowCard, onChildClick, onContextMenuClick, setMousePosition, handleKeyDown]);
   var popupComponent = (0, _react.useMemo)(
   // Within the Popup component, if shouldRenderToParent, the zIndex prop is ignored

package/dist/cjs/view/LinkUrl/index.js

@@ -22,7 +22,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId", "isLink
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "44.3.22",
+  packageVersion: "44.3.24",
   componentName: 'linkUrl'
 };
 var Anchor = (0, _click.withLinkClickedEvent)('a');

package/dist/es2019/__tests__/vr-tests/__snapshots__/block-card/vrblock-card-resolved-rovo-actions--default.png

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:f54ddd4636708cd0a4059a713a6a6bf3d0402d68a5aa2a69b7c430aa659fe8ef
+size 25593

package/dist/es2019/messages.js

@@ -1001,6 +1001,16 @@ export const messages = defineMessages({
     defaultMessage: '<p>Look at this <a>{url}</a> and list any open questions, unresolved decisions, or asks that still need follow‑up. Group them by owner if possible and keep it concise.</p>',
     description: 'The prompt message to send to Rovo Chat. {url} refers to Smart Link that the user triggers this action from. (Please make sure all html tags remain the same.)'
   },
+  rovo_prompt_button_key_highlights: {
+    id: 'fabric.linking.rovo_prompt_button_find_open_questions.non-final',
+    defaultMessage: `Key highlights`,
+    description: 'The name of the action to send prompt message to Rovo Chat in relation to current Smart Link'
+  },
+  rovo_prompt_message_key_highlights: {
+    id: 'fabric.linking.rovo_prompt_message_find_open_questions.non-final',
+    defaultMessage: '<p>Based on this <a>{url}</a> and the page or ticket I’m currently viewing, highlight the parts of the linked content that are most relevant to this work. Explain briefly why each part is relevant.</p>',
+    description: 'The prompt message to send to Rovo Chat. {url} refers to Smart Link that the user triggers this action from. (Please make sure all html tags remain the same.)'
+  },
   rovo_chat_action_section_header: {
     id: 'fabric.linking.rovo_chat_action_section_header.non-final',
     defaultMessage: 'Ask Rovo',

package/dist/es2019/state/hooks/use-rovo-chat/index.js

@@ -27,7 +27,7 @@ const useRovoChat = () => {
           agentId: undefined
         },
         openChat: true,
-        openChatMode: product && jiraProducts.includes(product) && fg('platform_sl_3p_auth_rovo_block_jira_kill_switch') || fg('rovogrowth-640-inline-action-nudge-fg') ? 'mini-modal' : 'sidebar'
+        openChatMode: product && jiraProducts.includes(product) && (fg('platform_sl_3p_auth_rovo_block_jira_kill_switch') || fg('rovogrowth-640-inline-action-nudge-fg')) ? 'mini-modal' : 'sidebar'
       },
       onAcknowledgeTimeout: () => {
         // NAVX-3599: Add analytics event

package/dist/es2019/utils/analytics/analytics.js

@@ -2,7 +2,7 @@ export const ANALYTICS_CHANNEL = 'media';
 export const context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card" || '',
-  packageVersion: "44.3.22" || ''
+  packageVersion: "44.3.24" || ''
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/es2019/view/BlockCard/views/ResolvedView.js

@@ -6,7 +6,7 @@ import { ax, ix } from "@compiled/react/runtime";
 import { useEffect, useMemo, useState } from 'react';
 import { browser } from '@atlaskit/linking-common/user-agent';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { ActionName, ElementName, SmartLinkPosition } from '../../../constants';
+import { ActionName, CardDisplay, ElementName, SmartLinkPosition } from '../../../constants';
 import extractRovoChatAction from '../../../extractors/flexible/actions/extract-rovo-chat-action';
 import { getExtensionKey } from '../../../state/helpers';
 import useRovoConfig from '../../../state/hooks/use-rovo-config';
@@ -64,7 +64,7 @@ const ResolvedView = ({
   const prompts = useMemo(() => {
     if (fg('platform_sl_3p_auth_rovo_block_card_kill_switch')) {
       var _cardState$details, _cardState$details$da;
-      const defaultPrompts = [RovoChatPromptKey.HIGHLIGHT_RELEVANT_CONTENT, RovoChatPromptKey.ASK_ROVO_ANYTHING];
+      const defaultPrompts = [RovoChatPromptKey.KEY_HIGHLIGHTS];
       const linkType = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : (_cardState$details$da = _cardState$details.data) === null || _cardState$details$da === void 0 ? void 0 : _cardState$details$da['@type'];
       if (extensionKey === 'slack-object-provider') {
         return [RovoChatPromptKey.FIND_OPEN_QUESTIONS, ...defaultPrompts];
@@ -79,25 +79,32 @@ const ResolvedView = ({
     }
     return [];
   }, [cardState === null || cardState === void 0 ? void 0 : (_cardState$details2 = cardState.details) === null || _cardState$details2 === void 0 ? void 0 : _cardState$details2.data, extensionKey]);
-  const footerActions = useMemo(() => showRovoResolvedView && fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? [{
-    name: ActionName.RovoChatAction,
-    prompts: prompts
-  }, {
-    name: ActionName.FollowAction,
-    hideIcon: true
-  }, {
-    name: ActionName.DownloadAction,
-    hideIcon: true
-  }] : [{
-    name: ActionName.FollowAction,
-    hideIcon: true
-  }, {
-    name: ActionName.PreviewAction,
-    hideIcon: true
-  }, {
-    name: ActionName.DownloadAction,
-    hideIcon: true
-  }], [showRovoResolvedView, prompts]);
+  const footerActions = useMemo(() => {
+    if (showRovoResolvedView && fg('platform_sl_3p_auth_rovo_block_card_kill_switch')) {
+      return [{
+        name: ActionName.RovoChatAction,
+        prompts: prompts,
+        iconSize: 'small',
+        cardAppearance: CardDisplay.Block
+      }, {
+        name: ActionName.FollowAction,
+        iconSize: 'small'
+      }, {
+        name: ActionName.DownloadAction,
+        iconSize: 'small'
+      }];
+    }
+    return [{
+      name: ActionName.FollowAction,
+      hideIcon: true
+    }, {
+      name: ActionName.PreviewAction,
+      hideIcon: true
+    }, {
+      name: ActionName.DownloadAction,
+      hideIcon: true
+    }];
+  }, [showRovoResolvedView, prompts]);
   const uiOptions = FlexibleCardUiOptions;
   uiOptions.enableSnippetRenderer = true;
   uiOptions.hideLoadingSkeleton = hideIconLoadingSkeleton;
@@ -134,6 +141,7 @@ const ResolvedView = ({
     }
   })) : null, /*#__PURE__*/React.createElement(FooterBlock, {
     actions: footerActions,
+    isPreviewBlockErrored: isPreviewBlockErrored,
     className: ax(["_4t3i1k8s _1e0c1txw _1bah1yb4 _4cvresu3 _1wpz1fhb", safari && "_4t3i1osq"])
   }));
 };

package/dist/es2019/view/FlexibleCard/components/actions/action/action-button/index.compiled.css

@@ -1,4 +1,5 @@
 ._11c8wadc{font:var(--ds-font-body-small,normal 400 9pt/1pc "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._13bowadc button{font:var(--ds-font-body-small,normal 400 9pt/1pc "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11lv1b66 button{padding-left:var(--ds-space-050,4px)}
 ._11lvidpf button{padding-left:0}
 ._11lvv77o button{padding-left:var(--ds-space-025,2px)}
@@ -12,10 +13,13 @@
 ._1gqnv77o button{padding-bottom:var(--ds-space-025,2px)}
 ._1i3bidpf button:active>span{margin-top:0}
 ._1l0qidpf button:hover>span{margin-right:0}
+._1q9t1wq8 button{font-weight:var(--ds-font-weight-medium,500)}
+._1rlg1g80 button{flex-wrap:wrap}
 ._1vtwidpf button:active>span{margin-left:0}
 ._3kh9idpf button:active>span{margin-bottom:0}
 ._4wlcidpf button:hover>span{margin-top:0}
 ._8pvjidpf button:hover>span{margin-bottom:0}
+._bdn61h6o button{align-content:center}
 ._i2vxidpf button:focus>span{margin-bottom:0}
 ._ijvwidpf button:focus>span{margin-left:0}
 ._k48p1wq8{font-weight:var(--ds-font-weight-medium,500)}

package/dist/es2019/view/FlexibleCard/components/actions/action/action-button/index.js

@@ -2,16 +2,21 @@
 import "./index.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { forwardRef, useCallback, useMemo } from 'react';
+import { cx } from '@compiled/react';
 import { LoadingButton } from '@atlaskit/button';
 import Button, { IconButton, LinkButton, LinkIconButton } from '@atlaskit/button/new';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Box } from '@atlaskit/primitives/compiled';
 import Tooltip from '@atlaskit/tooltip';
-import { SmartLinkSize } from '../../../../../../constants';
-import { useFlexibleUiOptionContext } from '../../../../../../state/flexible-ui-context';
+import { ActionName, SmartLinkSize } from '../../../../../../constants';
+import { useFlexibleUiContext, useFlexibleUiOptionContext } from '../../../../../../state/flexible-ui-context';
 import { withOverrideCss } from '../../../common/with-override-css';
 import { sizeToButtonSpacing } from '../../../utils';
 const IconOnlyLarge = null;
 const SizeSmall = null;
+const styles = {
+  textSmall: "_13bowadc _1q9t1wq8 _1rlg1g80 _bdn61h6o"
+};
 const SizeSmallIconOnly = null;
 const SizeSmallNotIconOnly = null;
 const IconButtonAppearanceMap = {
@@ -49,7 +54,10 @@ const ActionButtonRefresh = /*#__PURE__*/forwardRef(({
   href,
   ariaLabel
 }, ref) => {
+  var _context$actions;
   const iconOnly = !content;
+  const context = useFlexibleUiContext();
+  const isRovoSupported = !!(context !== null && context !== void 0 && (_context$actions = context.actions) !== null && _context$actions !== void 0 && _context$actions[ActionName.RovoChatAction]) && fg('platform_sl_3p_auth_rovo_block_card_kill_switch');
   const onButtonClick = useCallback(handler => e => {
     e.preventDefault();
     handler();
@@ -124,7 +132,8 @@ const ActionButtonRefresh = /*#__PURE__*/forwardRef(({
   }, [appearance, ariaLabel, content, href, iconAfter, iconBefore, iconOnly, isDisabled, isLoading, onButtonClick, onClick, size, testId, tooltipMessage]);
   return /*#__PURE__*/React.createElement(Box, {
     testId: `${testId}-button-wrapper`,
-    ref: ref
+    ref: ref,
+    xcss: cx(isRovoSupported && size === SmartLinkSize.Small && styles.textSmall)
   }, button);
 });
 const ActionButtonRefreshWithOverrideCss = withOverrideCss(ActionButtonRefresh);

package/dist/es2019/view/FlexibleCard/components/actions/ai-summary-action/ai-summarise-action.js

@@ -40,7 +40,7 @@ export function AISummariseAction({
       spacing: "spacious",
       color: "currentColor",
       label: "Summarise with AI"
-    }, fg('platform_sl_3p_auth_rovo_action_kill_switch') ? {
+    }, fg('platform_sl_3p_auth_rovo_action_kill_switch') || fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? {
       size: props.iconSize
     } : {})),
     onClick: handleActionClick,

package/dist/es2019/view/FlexibleCard/components/actions/automation-action/index.js

@@ -76,7 +76,7 @@ const AutomationAction = props => {
       spacing: "spacious",
       color: "currentColor",
       label: automationActionIconLabel
-    }, fg('platform_sl_3p_auth_rovo_action_kill_switch') ? {
+    }, fg('platform_sl_3p_auth_rovo_action_kill_switch') || fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? {
       size: props.iconSize
     } : {})),
     testId: "smart-action-automation-action",

package/dist/es2019/view/FlexibleCard/components/actions/copy-link-action/index.js

@@ -36,7 +36,7 @@ const CopyLinkAction = ({
       color: "currentColor",
       label: fg('navx-3698-flexible-card-a11y-fix') ? '' : 'copy url',
       spacing: "spacious"
-    }, fg('platform_sl_3p_auth_rovo_action_kill_switch') ? {
+    }, fg('platform_sl_3p_auth_rovo_action_kill_switch') || fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? {
       size: props.iconSize
     } : {})),
     onClick: onClick,

package/dist/es2019/view/FlexibleCard/components/actions/preview-action/index.js

@@ -34,7 +34,7 @@ const PreviewAction = ({
         color: "currentColor",
         spacing: "spacious",
         label: fg('navx-3698-flexible-card-a11y-fix') ? '' : 'Open preview panel'
-      }, fg('platform_sl_3p_auth_rovo_action_kill_switch') ? {
+      }, fg('platform_sl_3p_auth_rovo_action_kill_switch') || fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? {
         size: props.iconSize
       } : {}));
     }
@@ -42,7 +42,7 @@ const PreviewAction = ({
       color: "currentColor",
       spacing: "spacious",
       label: fg('navx-3698-flexible-card-a11y-fix') ? '' : 'Open preview'
-    }, fg('platform_sl_3p_auth_rovo_action_kill_switch') ? {
+    }, fg('platform_sl_3p_auth_rovo_action_kill_switch') || fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? {
       size: props.iconSize
     } : {}));
   }, [hasPreviewPanel, props.iconSize]);

package/dist/es2019/view/FlexibleCard/components/actions/rovo-chat-action/index.js

@@ -1,12 +1,14 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useCallback, useMemo } from 'react';
 import { useIntl } from 'react-intl';
-import AiGenerativeTextIcon from '@atlaskit/icon-lab/core/ai-generative-text';
 import AiSearchIcon from '@atlaskit/icon-lab/core/ai-search';
+import AiChatIcon from '@atlaskit/icon/core/ai-chat';
 import AiGenerativeTextSummaryIcon from '@atlaskit/icon/core/ai-generative-text-summary';
 import RovoChatIcon from '@atlaskit/icon/core/rovo-chat';
+import { RovoIcon } from '@atlaskit/logo';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
-import { ActionName } from '../../../../../constants';
+import { ActionName, CardDisplay } from '../../../../../constants';
 import { messages } from '../../../../../messages';
 import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
 import useInvokeClientAction from '../../../../../state/hooks/use-invoke-client-action';
@@ -54,7 +56,7 @@ const getContext = (intl, product) => {
       };
   }
 };
-const getPromptAction = (promptKey, intl, url = '', product) => {
+const getPromptAction = (promptKey, intl, url = '', product, iconSize, cardAppearance) => {
   var _getContext;
   const {
     contextLong,
@@ -128,7 +130,10 @@ const getPromptAction = (promptKey, intl, url = '', product) => {
         ignoreTag: true
       });
       return {
-        icon: /*#__PURE__*/React.createElement(AIEditIcon, null),
+        icon: cardAppearance === CardDisplay.Block && fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? /*#__PURE__*/React.createElement(AiChatIcon, {
+          label: label_summarize,
+          size: iconSize
+        }) : /*#__PURE__*/React.createElement(AIEditIcon, null),
         content: label_summarize,
         tooltipMessage: label_summarize,
         data: {
@@ -162,9 +167,9 @@ const getPromptAction = (promptKey, intl, url = '', product) => {
           }
         }
       };
-    case RovoChatPromptKey.KEY_HIGHLIGHTS:
-      const label_key_highlights = intl.formatMessage(messages.rovo_prompt_button_highlight_relevant_content);
-      const html_key_highlights = intl.formatMessage(messages.rovo_prompt_message_highlight_relevant_content, {
+    case RovoChatPromptKey.HIGHLIGHT_RELEVANT_CONTENT:
+      const label_highlight_relevant_content = intl.formatMessage(messages.rovo_prompt_button_highlight_relevant_content);
+      const html_highlight_relevant_content = intl.formatMessage(messages.rovo_prompt_message_highlight_relevant_content, {
         context: contextLong,
         url
       }, {
@@ -172,12 +177,12 @@ const getPromptAction = (promptKey, intl, url = '', product) => {
       });
       return {
         icon: /*#__PURE__*/React.createElement(AiChapterIcon, null),
-        content: label_key_highlights,
-        tooltipMessage: label_key_highlights,
+        content: label_highlight_relevant_content,
+        tooltipMessage: label_highlight_relevant_content,
         data: {
-          name: label_key_highlights,
+          name: label_highlight_relevant_content,
           dialogues: [],
-          prompt: htmlToAdf(html_key_highlights),
+          prompt: htmlToAdf(html_highlight_relevant_content),
           mode: {
             fastModeEnabled: true
           }
@@ -189,7 +194,11 @@ const getPromptAction = (promptKey, intl, url = '', product) => {
         url
       });
       return {
-        icon: /*#__PURE__*/React.createElement(AISearchIcon, null),
+        icon: cardAppearance === CardDisplay.Block && fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? /*#__PURE__*/React.createElement(RovoIcon, {
+          label: label_ask_rovo_anything,
+          size: 'xxsmall',
+          shouldUseHexLogo: true
+        }) : /*#__PURE__*/React.createElement(AISearchIcon, null),
         content: label_ask_rovo_anything,
         tooltipMessage: label_ask_rovo_anything,
         data: {
@@ -219,24 +228,25 @@ const getPromptAction = (promptKey, intl, url = '', product) => {
           placeholderType: 'generic'
         }
       };
-    case RovoChatPromptKey.HIGHLIGHT_RELEVANT_CONTENT:
-      const label_highlight_relevant_content = intl.formatMessage(messages.rovo_prompt_button_highlight_relevant_content);
-      const html_highlight_relevant_content = intl.formatMessage(messages.rovo_prompt_message_highlight_relevant_content, {
+    case RovoChatPromptKey.KEY_HIGHLIGHTS:
+      const label_key_highlights = intl.formatMessage(messages.rovo_prompt_button_key_highlights);
+      const html_key_highlights = intl.formatMessage(messages.rovo_prompt_message_key_highlights, {
         context: contextLong,
         url
       }, {
         ignoreTag: true
       });
       return {
-        icon: /*#__PURE__*/React.createElement(AiGenerativeTextIcon, {
-          label: label_highlight_relevant_content
+        icon: /*#__PURE__*/React.createElement(AiChatIcon, {
+          label: label_key_highlights,
+          size: iconSize
         }),
-        content: label_highlight_relevant_content,
-        tooltipMessage: label_highlight_relevant_content,
+        content: label_key_highlights,
+        tooltipMessage: label_key_highlights,
         data: {
-          name: label_highlight_relevant_content,
+          name: label_key_highlights,
           dialogues: [],
-          prompt: htmlToAdf(html_highlight_relevant_content)
+          prompt: htmlToAdf(html_key_highlights)
         }
       };
     case RovoChatPromptKey.SHOW_ME_WHATS_RELEVANT:
@@ -267,8 +277,9 @@ const getPromptAction = (promptKey, intl, url = '', product) => {
         ignoreTag: true
       });
       return {
-        icon: /*#__PURE__*/React.createElement(AiGenerativeTextIcon, {
-          label: label_identify_key_trends
+        icon: /*#__PURE__*/React.createElement(AiChatIcon, {
+          label: label_identify_key_trends,
+          size: iconSize
         }),
         content: label_identify_key_trends,
         tooltipMessage: label_identify_key_trends,
@@ -286,8 +297,9 @@ const getPromptAction = (promptKey, intl, url = '', product) => {
         ignoreTag: true
       });
       return {
-        icon: /*#__PURE__*/React.createElement(AiGenerativeTextIcon, {
-          label: label_identify_key_points
+        icon: /*#__PURE__*/React.createElement(AiChatIcon, {
+          label: label_identify_key_points,
+          size: iconSize
         }),
         content: label_identify_key_points,
         tooltipMessage: label_identify_key_points,
@@ -305,8 +317,9 @@ const getPromptAction = (promptKey, intl, url = '', product) => {
         ignoreTag: true
       });
       return {
-        icon: /*#__PURE__*/React.createElement(AiGenerativeTextIcon, {
-          label: label_find_open_questions
+        icon: /*#__PURE__*/React.createElement(AiChatIcon, {
+          label: label_find_open_questions,
+          size: iconSize
         }),
         content: label_find_open_questions,
         tooltipMessage: label_find_open_questions,
@@ -359,7 +372,7 @@ const RovoChatAction = ({
         content,
         tooltipMessage,
         data: promptData
-      } = getPromptAction(promptKey, intl, data === null || data === void 0 ? void 0 : data.url, data === null || data === void 0 ? void 0 : data.product) || {};
+      } = getPromptAction(promptKey, intl, data === null || data === void 0 ? void 0 : data.url, data === null || data === void 0 ? void 0 : data.product, props.iconSize, props.cardAppearance) || {};
       return promptData ? /*#__PURE__*/React.createElement(Action, _extends({
         content: content,
         icon: icon,

package/dist/es2019/view/FlexibleCard/components/blocks/action-group/index.js

@@ -14,13 +14,16 @@ import DropdownMenu from '@atlaskit/dropdown-menu';
 import MoreIcon from '@atlaskit/icon/core/show-more-horizontal';
 import { fg } from '@atlaskit/platform-feature-flags';
 import Tooltip from '@atlaskit/tooltip';
-import { ActionName, SmartLinkSize } from '../../../../../constants';
+import { ActionName, CardDisplay, SmartLinkSize } from '../../../../../constants';
 import { messages } from '../../../../../messages';
 import { useFlexibleUiContext, useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
+import { RovoChatPromptKey } from '../../actions/rovo-chat-action';
 import { sizeToButtonSpacing } from '../../utils';
 import { filterActionItems } from '../utils';
 import ActionGroupItem from './action-group-item';
 const styles = null;
+const FULL_ACTIONS_SIZE = 450;
+const REDUCED_ACTIONS_SIZE = 360;
 const renderActionItems = (items = [], size = SmartLinkSize.Medium, appearance, asDropDownItems, onActionItemClick) => items.map((item, idx) => /*#__PURE__*/React.createElement(ActionGroupItem, {
   item: item,
   key: idx,
@@ -42,7 +45,8 @@ const ActionGroup = ({
   size = SmartLinkSize.Medium,
   appearance,
   visibleButtonsNum = 2,
-  onDropdownOpenChange
+  onDropdownOpenChange,
+  containerWidth = Infinity
 }) => {
   var _context$actions;
   const context = useFlexibleUiContext();
@@ -50,7 +54,7 @@ const ActionGroup = ({
   const [isOpen, setIsOpen] = useState(false);
   const renderableActionItems = useMemo(() => filterActionItems(items, context), [context, items]);
   const isMoreThenTwoItems = renderableActionItems.length > visibleButtonsNum;
-  const isRovoActionsEnabled = !!(context !== null && context !== void 0 && (_context$actions = context.actions) !== null && _context$actions !== void 0 && _context$actions[ActionName.RovoChatAction]);
+  const isRovoActionsEnabled = !!(context !== null && context !== void 0 && (_context$actions = context.actions) !== null && _context$actions !== void 0 && _context$actions[ActionName.RovoChatAction]) && fg('platform_sl_3p_auth_rovo_block_card_kill_switch');
   const onOpenChange = useCallback(attrs => {
     setIsOpen(attrs.isOpen);
     if (onDropdownOpenChange) {
@@ -65,21 +69,34 @@ const ActionGroup = ({
     }
   }, [isOpen, onOpenChange]);
   const actionButtons = useMemo(() => {
-    if (isRovoActionsEnabled && fg('platform_sl_3p_auth_rovo_block_card_kill_switch')) {
-      const rovoActions = [...renderableActionItems.slice(0, visibleButtonsNum - 1), {
-        name: ActionName.PreviewAction,
-        hideContent: true
+    if (isRovoActionsEnabled) {
+      const rovoActions = [...(containerWidth >= REDUCED_ACTIONS_SIZE ? renderableActionItems.slice(0, visibleButtonsNum - 1) : []), {
+        name: ActionName.RovoChatAction,
+        prompts: [RovoChatPromptKey.ASK_ROVO_ANYTHING],
+        iconSize: 'small',
+        cardAppearance: CardDisplay.Block,
+        hideContent: containerWidth < FULL_ACTIONS_SIZE && containerWidth >= REDUCED_ACTIONS_SIZE
       }, {
         name: ActionName.CopyLinkAction,
-        hideContent: true
+        hideContent: true,
+        iconSize: 'small'
+      }, {
+        name: ActionName.PreviewAction,
+        hideContent: true,
+        iconSize: 'small'
       }];
       return renderActionItems(rovoActions, size, appearance, false, onActionItemClick);
     }
     const actionItems = isMoreThenTwoItems ? renderableActionItems.slice(0, visibleButtonsNum - 1) : renderableActionItems;
     return renderActionItems(actionItems, size, appearance, false, onActionItemClick);
-  }, [appearance, isMoreThenTwoItems, onActionItemClick, renderableActionItems, size, visibleButtonsNum, isRovoActionsEnabled]);
+  }, [appearance, isMoreThenTwoItems, isRovoActionsEnabled, onActionItemClick, renderableActionItems, size, visibleButtonsNum, containerWidth]);
   const moreActionDropdown = useMemo(() => {
-    const actionItems = isMoreThenTwoItems || isRovoActionsEnabled && fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? renderableActionItems.slice(visibleButtonsNum - 1) : [];
+    let actionItems;
+    if (isRovoActionsEnabled && containerWidth < REDUCED_ACTIONS_SIZE) {
+      actionItems = renderableActionItems;
+    } else {
+      actionItems = isMoreThenTwoItems ? renderableActionItems.slice(visibleButtonsNum - 1) : [];
+    }
     if (actionItems.length > 0) {
       const spacing = sizeToButtonSpacing[size];
       const moreIcon = /*#__PURE__*/React.createElement(MoreIcon, {
@@ -99,7 +116,7 @@ const ActionGroup = ({
           testId: "action-group-more-button-tooltip",
           tag: "span"
         }, /*#__PURE__*/React.createElement(Button, _extends({}, props, {
-          spacing: spacing,
+          spacing: isRovoActionsEnabled && fg('platform_sl_3p_auth_rovo_block_card_kill_switch') ? size === SmartLinkSize.XLarge ? 'default' : 'compact' : spacing,
           testId: "action-group-more-button",
           iconBefore: moreIcon,
           ref: triggerRef
@@ -111,7 +128,7 @@ const ActionGroup = ({
       }, renderActionItems(actionItems, size, appearance, true, onActionItemClick));
     }
     return null;
-  }, [appearance, isMoreThenTwoItems, isOpen, onActionItemClick, onOpenChange, renderableActionItems, size, ui === null || ui === void 0 ? void 0 : ui.zIndex, visibleButtonsNum, isRovoActionsEnabled]);
+  }, [appearance, isMoreThenTwoItems, isOpen, isRovoActionsEnabled, onActionItemClick, onOpenChange, renderableActionItems, size, ui === null || ui === void 0 ? void 0 : ui.zIndex, visibleButtonsNum, containerWidth]);
   return renderableActionItems.length > 0 ? /*#__PURE__*/React.createElement("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: ax(["_1e0c116y _dzc21h6o _1ilq1i6y", "actions-button-group"]),

package/dist/es2019/view/FlexibleCard/components/blocks/footer-block/resolved/index.compiled.css

@@ -1,2 +1,4 @@
+._1wpz1h6o{align-self:center}
 ._4t3i1osq{height:100%}
-._c71lxy5q{max-height:var(--ds-space-400,2pc)}
+._c71lxy5q{max-height:var(--ds-space-400,2pc)}
+._kqswh2mm{position:relative}