@atlaskit/rovo-agent-components 3.13.0 → 3.15.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/rovo-agent-components
 
+## 3.15.0
+
+### Minor Changes
+
+- [`81f7a388b27a2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/81f7a388b27a2) -
+  clean up expandable_subsection_styling_fix fg and a11y_agents_fixes
+
+## 3.14.0
+
+### Minor Changes
+
+- [`4e43c6db295d3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4e43c6db295d3) -
+  [ux] Refresh agent profile card UI
+
 ## 3.13.0
 
 ### Minor Changes

package/dist/cjs/common/ui/agent-chat-icon/index.compiled.css

@@ -0,0 +1,6 @@
+
+._2rko1mok{border-radius:var(--ds-radius-large,8px)}._189ee4h9{border-width:var(--ds-border-width,1px)}
+._1dqonqa1{border-style:solid}
+._1h6d1l7x{border-color:var(--ds-border,#0b120e24)}
+._1bsbzwfg{width:2pc}
+._4t3izwfg{height:2pc}

package/dist/cjs/common/ui/agent-chat-icon/index.js

@@ -0,0 +1,26 @@
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AgentChatIcon = void 0;
+require("./index.compiled.css");
+var _runtime = require("@compiled/react/runtime");
+var _react = _interopRequireDefault(require("react"));
+var _rovoChat = _interopRequireDefault(require("@atlaskit/icon/core/rovo-chat"));
+var _compiled = require("@atlaskit/primitives/compiled");
+var styles = {
+  agentChatIcon: "_2rko1mok _189ee4h9 _1dqonqa1 _1h6d1l7x _1bsbzwfg _4t3izwfg"
+};
+var AgentChatIcon = exports.AgentChatIcon = function AgentChatIcon() {
+  return /*#__PURE__*/_react.default.createElement(_compiled.Flex, {
+    xcss: styles.agentChatIcon,
+    alignItems: "center",
+    justifyContent: "center"
+  }, /*#__PURE__*/_react.default.createElement(_rovoChat.default, {
+    label: "",
+    color: "var(--ds-icon-subtlest, #6B6E76)"
+  }));
+};

package/dist/cjs/ui/agent-conversation-starters/index.compiled.css

@@ -1,5 +1,24 @@
-
-._qtt8glyw{list-style:none}._19bvidpf{padding-left:0}
+._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._2rko12b0{border-radius:var(--ds-radius-small,4px)}
+._qtt8glyw{list-style:none}
+._18m915vq{overflow-y:hidden}
+._19bv12x7{padding-left:var(--ds-space-075,6px)}
+._19bvidpf{padding-left:0}
+._1bsb1osq{width:100%}
+._1bto1l2s{text-overflow:ellipsis}
+._1o9zidpf{flex-shrink:0}
+._1o9zkb7n{flex-shrink:1}
+._1reo15vq{overflow-x:hidden}
+._1ul9idpf{min-width:0}
+._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
+._ca0q12x7{padding-top:var(--ds-space-075,6px)}
 ._ca0qidpf{padding-top:0}
+._k48p1wq8{font-weight:var(--ds-font-weight-medium,500)}
+._n3td12x7{padding-bottom:var(--ds-space-075,6px)}
 ._n3tdidpf{padding-bottom:0}
-._u5f3idpf{padding-right:0}
+._o5721q9c{white-space:nowrap}
+._syazazsu{color:var(--ds-text-subtle,#505258)}
+._u5f312x7{padding-right:var(--ds-space-075,6px)}
+._u5f3idpf{padding-right:0}
+._irr31dpa:hover{background-color:var(--ds-background-neutral-subtle-hovered,#0515240f)}
+._1di6fcek:active{background-color:var(--ds-background-neutral-subtle-pressed,#0b120e24)}

package/dist/cjs/ui/agent-conversation-starters/index.js

@@ -8,22 +8,28 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getConversationStarters = exports.ConversationStarters = exports.AgentConversationStarters = void 0;
 require("./index.compiled.css");
-var _react = _interopRequireWildcard(require("react"));
-var React = _react;
 var _runtime = require("@compiled/react/runtime");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _new = require("@atlaskit/button/new");
+var _css = require("@atlaskit/css");
 var _retry = _interopRequireDefault(require("@atlaskit/icon/core/retry"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
+var _agentChatIcon = require("../../common/ui/agent-chat-icon");
 var _chatPill = require("../../common/ui/chat-pill");
 var _messages = require("./messages");
 var _excluded = ["userDefinedConversationStarters", "isAgentDefault"];
 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 styles = {
-  conversationStartersList: "_qtt8glyw _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf"
+  conversationStartersList: "_qtt8glyw _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf",
+  conversationStartersListRefresh: "_1bsb1osq",
+  conversationStarterIcon: "_1o9zidpf",
+  conversationStarterText: "_1reo15vq _18m915vq _1bto1l2s _o5721q9c _1o9zkb7n _1ul9idpf",
+  button: "_11c82smr _2rko12b0 _syazazsu _ca0q12x7 _u5f312x7 _n3td12x7 _19bv12x7 _k48p1wq8 _1bto1l2s _o5721q9c _1o9zkb7n _1bsb1osq _bfhksm61 _irr31dpa _1di6fcek"
 };
 var getConversationStarters = exports.getConversationStarters = function getConversationStarters(_ref) {
   var userDefinedConversationStartersParam = _ref.userDefinedConversationStarters,
@@ -89,7 +95,7 @@ var AgentConversationStarters = exports.AgentConversationStarters = function Age
       };
     });
   }, [combinedConversationStarters, formatMessage]);
-  return /*#__PURE__*/React.createElement(ConversationStarters, (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement(ConversationStarters, (0, _extends2.default)({
     starters: starters
   }, props));
 };
@@ -101,36 +107,48 @@ var ConversationStarters = exports.ConversationStarters = function ConversationS
     _ref3$onReloadButtonC = _ref3.onReloadButtonClick,
     onReloadButtonClick = _ref3$onReloadButtonC === void 0 ? function () {} : _ref3$onReloadButtonC,
     onBrowseAgentsClick = _ref3.onBrowseAgentsClick;
-  return /*#__PURE__*/React.createElement(_compiled.Stack, {
+  return /*#__PURE__*/_react.default.createElement(_compiled.Stack, {
     as: "ul",
     space: "space.050",
-    xcss: styles.conversationStartersList
+    xcss: (0, _css.cx)(styles.conversationStartersList, (0, _platformFeatureFlags.fg)('rovo_agent_empty_state_refresh') && styles.conversationStartersListRefresh)
   }, starters.map(function (starter, index) {
     var isLastStarter = index === starters.length - 1;
-    var chatPill = /*#__PURE__*/React.createElement(_compiled.Box, {
+    var chatPill = /*#__PURE__*/_react.default.createElement(_compiled.Box, {
       as: "li",
       key: starter.message
-    }, /*#__PURE__*/React.createElement(_chatPill.ChatPill, {
+    }, (0, _platformFeatureFlags.fg)('rovo_agent_empty_state_refresh') ? /*#__PURE__*/_react.default.createElement(_compiled.Pressable, {
+      xcss: styles.button,
+      onClick: function onClick() {
+        return onConversationStarterClick(starter);
+      }
+    }, /*#__PURE__*/_react.default.createElement(_compiled.Inline, {
+      space: "space.150",
+      alignBlock: "center"
+    }, /*#__PURE__*/_react.default.createElement(_compiled.Box, {
+      xcss: styles.conversationStarterIcon
+    }, /*#__PURE__*/_react.default.createElement(_agentChatIcon.AgentChatIcon, null)), /*#__PURE__*/_react.default.createElement(_compiled.Box, {
+      xcss: styles.conversationStarterText
+    }, starter.message))) : /*#__PURE__*/_react.default.createElement(_chatPill.ChatPill, {
       testId: "conversation-starter",
       key: starter.message,
       onClick: function onClick() {
         return onConversationStarterClick(starter);
       }
     }, starter.message));
-    return isLastStarter && showReloadButton ? /*#__PURE__*/React.createElement(_compiled.Inline, {
+    return isLastStarter && showReloadButton ? /*#__PURE__*/_react.default.createElement(_compiled.Inline, {
       space: "space.050",
       grow: "fill",
       alignInline: "end",
       key: starter.message
-    }, chatPill, /*#__PURE__*/React.createElement(_new.IconButton, {
+    }, chatPill, /*#__PURE__*/_react.default.createElement(_new.IconButton, {
       icon: _retry.default,
       onClick: onReloadButtonClick,
       appearance: "subtle",
       label: ""
     })) : chatPill;
-  }), !!onBrowseAgentsClick && /*#__PURE__*/React.createElement(_compiled.Box, {
+  }), !!onBrowseAgentsClick && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
     as: "li"
-  }, /*#__PURE__*/React.createElement(_chatPill.BrowseAgentsPill, {
+  }, /*#__PURE__*/_react.default.createElement(_chatPill.BrowseAgentsPill, {
     onClick: onBrowseAgentsClick
   })));
 };

package/dist/cjs/ui/agent-dropdown-menu/index.js

@@ -19,7 +19,6 @@ var _reactIntlNext = require("react-intl-next");
 var _new = _interopRequireWildcard(require("@atlaskit/button/new"));
 var _dropdownMenu = _interopRequireWildcard(require("@atlaskit/dropdown-menu"));
 var _showMoreHorizontalMore = _interopRequireDefault(require("@atlaskit/icon/core/migration/show-more-horizontal--more"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _chatIcon = require("../../common/ui/chat-icon");
 var _messages = _interopRequireDefault(require("./messages"));
@@ -156,7 +155,7 @@ var AgentDropdownMenu = exports.AgentDropdownMenu = function AgentDropdownMenu(_
         props = (0, _objectWithoutProperties2.default)(_ref4, _excluded);
       return /*#__PURE__*/_react.default.createElement(_new.IconButton, (0, _extends2.default)({}, props, {
         icon: _showMoreHorizontalMore.default,
-        label: agentName && (0, _platformFeatureFlags.fg)('a11y_agents_fixes') ? formatMessage(_messages.default.moreActionsForLabel, {
+        label: agentName ? formatMessage(_messages.default.moreActionsForLabel, {
           agentName: agentName
         }) : formatMessage(_messages.default.moreActionsLabel),
         ref: triggerRef,

package/dist/cjs/ui/agent-profile-info/index.compiled.css

@@ -1,5 +1,6 @@
 
 ._zulp1b66{gap:var(--ds-space-050,4px)}._195gu2gc{margin-inline:var(--ds-space-100,8px)}
+._1mouze3t{margin-block:var(--ds-space-0,0)}
 ._19pkze3t{margin-top:var(--ds-space-0,0)}
 ._1bah1yb4{justify-content:space-between}
 ._1e0c116y{display:inline-flex}

package/dist/cjs/ui/agent-profile-info/index.js

@@ -24,6 +24,7 @@ var styles = {
   clickableItem: "_zulp1b66 _1e0c1txw _4cvr1h6o",
   name: "_1bah1yb4 _4cvr1y6m",
   description: "_19pkze3t _otyru2gc _1i4qfg65 _1nmz1hna",
+  descriptionRefresh: "_1mouze3t _1i4qfg65 _1nmz1hna",
   wrapper: "_otyru2gc",
   tooltipWrapper: "_195gu2gc _1e0c116y _kqswh2mm _94n5v77o",
   headingWrapper: "_kqswh2mm"
@@ -154,7 +155,7 @@ var AgentProfileInfo = exports.AgentProfileInfo = function AgentProfileInfo(_ref
     formatMessage = _useIntl2.formatMessage;
   return /*#__PURE__*/_react.default.createElement(_compiled.Stack, {
     space: "space.100",
-    xcss: styles.wrapper
+    xcss: (0, _platformFeatureFlags.fg)('rovo_agent_empty_state_refresh') ? null : styles.wrapper
   }, /*#__PURE__*/_react.default.createElement(_compiled.Inline, {
     xcss: styles.name,
     space: "space.100",
@@ -164,7 +165,7 @@ var AgentProfileInfo = exports.AgentProfileInfo = function AgentProfileInfo(_ref
     alignBlock: "end"
   }, /*#__PURE__*/_react.default.createElement(_heading.default, {
     as: "h2",
-    size: "xlarge"
+    size: (0, _platformFeatureFlags.fg)('rovo_agent_empty_state_refresh') ? 'medium' : 'xlarge'
   }, agentName), isHidden && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
     xcss: styles.tooltipWrapper
   }, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
@@ -176,7 +177,7 @@ var AgentProfileInfo = exports.AgentProfileInfo = function AgentProfileInfo(_ref
     isStarred: isStarred,
     handleToggle: onStarToggle
   })), creatorRender, !!agentDescription && /*#__PURE__*/_react.default.createElement(_compiled.Box, {
-    xcss: styles.description,
+    xcss: (0, _platformFeatureFlags.fg)('rovo_agent_empty_state_refresh') ? styles.descriptionRefresh : styles.description,
     as: "p"
   }, agentDescription), starCountRender);
 };

package/dist/es2019/common/ui/agent-chat-icon/index.compiled.css

@@ -0,0 +1,6 @@
+
+._2rko1mok{border-radius:var(--ds-radius-large,8px)}._189ee4h9{border-width:var(--ds-border-width,1px)}
+._1dqonqa1{border-style:solid}
+._1h6d1l7x{border-color:var(--ds-border,#0b120e24)}
+._1bsbzwfg{width:2pc}
+._4t3izwfg{height:2pc}

package/dist/es2019/common/ui/agent-chat-icon/index.js

@@ -0,0 +1,19 @@
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
+import React from 'react';
+import RovoChatIcon from '@atlaskit/icon/core/rovo-chat';
+import { Flex } from '@atlaskit/primitives/compiled';
+const styles = {
+  agentChatIcon: "_2rko1mok _189ee4h9 _1dqonqa1 _1h6d1l7x _1bsbzwfg _4t3izwfg"
+};
+export const AgentChatIcon = () => {
+  return /*#__PURE__*/React.createElement(Flex, {
+    xcss: styles.agentChatIcon,
+    alignItems: "center",
+    justifyContent: "center"
+  }, /*#__PURE__*/React.createElement(RovoChatIcon, {
+    label: "",
+    color: "var(--ds-icon-subtlest, #6B6E76)"
+  }));
+};

package/dist/es2019/ui/agent-conversation-starters/index.compiled.css

@@ -1,5 +1,24 @@
-
-._qtt8glyw{list-style:none}._19bvidpf{padding-left:0}
+._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._2rko12b0{border-radius:var(--ds-radius-small,4px)}
+._qtt8glyw{list-style:none}
+._18m915vq{overflow-y:hidden}
+._19bv12x7{padding-left:var(--ds-space-075,6px)}
+._19bvidpf{padding-left:0}
+._1bsb1osq{width:100%}
+._1bto1l2s{text-overflow:ellipsis}
+._1o9zidpf{flex-shrink:0}
+._1o9zkb7n{flex-shrink:1}
+._1reo15vq{overflow-x:hidden}
+._1ul9idpf{min-width:0}
+._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
+._ca0q12x7{padding-top:var(--ds-space-075,6px)}
 ._ca0qidpf{padding-top:0}
+._k48p1wq8{font-weight:var(--ds-font-weight-medium,500)}
+._n3td12x7{padding-bottom:var(--ds-space-075,6px)}
 ._n3tdidpf{padding-bottom:0}
-._u5f3idpf{padding-right:0}
+._o5721q9c{white-space:nowrap}
+._syazazsu{color:var(--ds-text-subtle,#505258)}
+._u5f312x7{padding-right:var(--ds-space-075,6px)}
+._u5f3idpf{padding-right:0}
+._irr31dpa:hover{background-color:var(--ds-background-neutral-subtle-hovered,#0515240f)}
+._1di6fcek:active{background-color:var(--ds-background-neutral-subtle-pressed,#0b120e24)}

package/dist/es2019/ui/agent-conversation-starters/index.js

@@ -1,17 +1,23 @@
 /* index.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./index.compiled.css";
-import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-import { useMemo } from 'react';
+import React, { useMemo } from 'react';
 import { useIntl } from 'react-intl-next';
 import { IconButton } from '@atlaskit/button/new';
+import { cx } from '@atlaskit/css';
 import RetryIcon from '@atlaskit/icon/core/retry';
-import { Box, Inline, Stack } from '@atlaskit/primitives/compiled';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { Box, Inline, Pressable, Stack } from '@atlaskit/primitives/compiled';
+import { AgentChatIcon } from '../../common/ui/agent-chat-icon';
 import { BrowseAgentsPill, ChatPill } from '../../common/ui/chat-pill';
 import { messages } from './messages';
 const styles = {
-  conversationStartersList: "_qtt8glyw _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf"
+  conversationStartersList: "_qtt8glyw _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf",
+  conversationStartersListRefresh: "_1bsb1osq",
+  conversationStarterIcon: "_1o9zidpf",
+  conversationStarterText: "_1reo15vq _18m915vq _1bto1l2s _o5721q9c _1o9zkb7n _1ul9idpf",
+  button: "_11c82smr _2rko12b0 _syazazsu _ca0q12x7 _u5f312x7 _n3td12x7 _19bv12x7 _k48p1wq8 _1bto1l2s _o5721q9c _1o9zkb7n _1bsb1osq _bfhksm61 _irr31dpa _1di6fcek"
 };
 export const getConversationStarters = ({
   userDefinedConversationStarters: userDefinedConversationStartersParam,
@@ -89,13 +95,23 @@ export const ConversationStarters = ({
   return /*#__PURE__*/React.createElement(Stack, {
     as: "ul",
     space: "space.050",
-    xcss: styles.conversationStartersList
+    xcss: cx(styles.conversationStartersList, fg('rovo_agent_empty_state_refresh') && styles.conversationStartersListRefresh)
   }, starters.map((starter, index) => {
     const isLastStarter = index === starters.length - 1;
     const chatPill = /*#__PURE__*/React.createElement(Box, {
       as: "li",
       key: starter.message
-    }, /*#__PURE__*/React.createElement(ChatPill, {
+    }, fg('rovo_agent_empty_state_refresh') ? /*#__PURE__*/React.createElement(Pressable, {
+      xcss: styles.button,
+      onClick: () => onConversationStarterClick(starter)
+    }, /*#__PURE__*/React.createElement(Inline, {
+      space: "space.150",
+      alignBlock: "center"
+    }, /*#__PURE__*/React.createElement(Box, {
+      xcss: styles.conversationStarterIcon
+    }, /*#__PURE__*/React.createElement(AgentChatIcon, null)), /*#__PURE__*/React.createElement(Box, {
+      xcss: styles.conversationStarterText
+    }, starter.message))) : /*#__PURE__*/React.createElement(ChatPill, {
       testId: "conversation-starter",
       key: starter.message,
       onClick: () => onConversationStarterClick(starter)

package/dist/es2019/ui/agent-dropdown-menu/index.js

@@ -7,7 +7,6 @@ import { useIntl } from 'react-intl-next';
 import Button, { IconButton } from '@atlaskit/button/new';
 import DropdownMenu, { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
 import MoreIcon from '@atlaskit/icon/core/migration/show-more-horizontal--more';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, Inline } from '@atlaskit/primitives/compiled';
 import { ChatPillIcon } from '../../common/ui/chat-icon';
 import messages from './messages';
@@ -117,7 +116,7 @@ export const AgentDropdownMenu = ({
       ...props
     }) => /*#__PURE__*/React.createElement(IconButton, _extends({}, props, {
       icon: MoreIcon,
-      label: agentName && fg('a11y_agents_fixes') ? formatMessage(messages.moreActionsForLabel, {
+      label: agentName ? formatMessage(messages.moreActionsForLabel, {
         agentName: agentName
       }) : formatMessage(messages.moreActionsLabel),
       ref: triggerRef,

package/dist/es2019/ui/agent-profile-info/index.compiled.css

@@ -1,5 +1,6 @@
 
 ._zulp1b66{gap:var(--ds-space-050,4px)}._195gu2gc{margin-inline:var(--ds-space-100,8px)}
+._1mouze3t{margin-block:var(--ds-space-0,0)}
 ._19pkze3t{margin-top:var(--ds-space-0,0)}
 ._1bah1yb4{justify-content:space-between}
 ._1e0c116y{display:inline-flex}

package/dist/es2019/ui/agent-profile-info/index.js

@@ -17,6 +17,7 @@ const styles = {
   clickableItem: "_zulp1b66 _1e0c1txw _4cvr1h6o",
   name: "_1bah1yb4 _4cvr1y6m",
   description: "_19pkze3t _otyru2gc _1i4qfg65 _1nmz1hna",
+  descriptionRefresh: "_1mouze3t _1i4qfg65 _1nmz1hna",
   wrapper: "_otyru2gc",
   tooltipWrapper: "_195gu2gc _1e0c116y _kqswh2mm _94n5v77o",
   headingWrapper: "_kqswh2mm"
@@ -148,7 +149,7 @@ export const AgentProfileInfo = ({
   } = useIntl();
   return /*#__PURE__*/React.createElement(Stack, {
     space: "space.100",
-    xcss: styles.wrapper
+    xcss: fg('rovo_agent_empty_state_refresh') ? null : styles.wrapper
   }, /*#__PURE__*/React.createElement(Inline, {
     xcss: styles.name,
     space: "space.100",
@@ -158,7 +159,7 @@ export const AgentProfileInfo = ({
     alignBlock: "end"
   }, /*#__PURE__*/React.createElement(Heading, {
     as: "h2",
-    size: "xlarge"
+    size: fg('rovo_agent_empty_state_refresh') ? 'medium' : 'xlarge'
   }, agentName), isHidden && /*#__PURE__*/React.createElement(Box, {
     xcss: styles.tooltipWrapper
   }, /*#__PURE__*/React.createElement(Tooltip, {
@@ -170,7 +171,7 @@ export const AgentProfileInfo = ({
     isStarred: isStarred,
     handleToggle: onStarToggle
   })), creatorRender, !!agentDescription && /*#__PURE__*/React.createElement(Box, {
-    xcss: styles.description,
+    xcss: fg('rovo_agent_empty_state_refresh') ? styles.descriptionRefresh : styles.description,
     as: "p"
   }, agentDescription), starCountRender);
 };

package/dist/esm/common/ui/agent-chat-icon/index.compiled.css

@@ -0,0 +1,6 @@
+
+._2rko1mok{border-radius:var(--ds-radius-large,8px)}._189ee4h9{border-width:var(--ds-border-width,1px)}
+._1dqonqa1{border-style:solid}
+._1h6d1l7x{border-color:var(--ds-border,#0b120e24)}
+._1bsbzwfg{width:2pc}
+._4t3izwfg{height:2pc}

package/dist/esm/common/ui/agent-chat-icon/index.js

@@ -0,0 +1,19 @@
+/* index.tsx generated by @compiled/babel-plugin v0.38.1 */
+import "./index.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
+import React from 'react';
+import RovoChatIcon from '@atlaskit/icon/core/rovo-chat';
+import { Flex } from '@atlaskit/primitives/compiled';
+var styles = {
+  agentChatIcon: "_2rko1mok _189ee4h9 _1dqonqa1 _1h6d1l7x _1bsbzwfg _4t3izwfg"
+};
+export var AgentChatIcon = function AgentChatIcon() {
+  return /*#__PURE__*/React.createElement(Flex, {
+    xcss: styles.agentChatIcon,
+    alignItems: "center",
+    justifyContent: "center"
+  }, /*#__PURE__*/React.createElement(RovoChatIcon, {
+    label: "",
+    color: "var(--ds-icon-subtlest, #6B6E76)"
+  }));
+};

package/dist/esm/ui/agent-conversation-starters/index.compiled.css

@@ -1,5 +1,24 @@
-
-._qtt8glyw{list-style:none}._19bvidpf{padding-left:0}
+._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._2rko12b0{border-radius:var(--ds-radius-small,4px)}
+._qtt8glyw{list-style:none}
+._18m915vq{overflow-y:hidden}
+._19bv12x7{padding-left:var(--ds-space-075,6px)}
+._19bvidpf{padding-left:0}
+._1bsb1osq{width:100%}
+._1bto1l2s{text-overflow:ellipsis}
+._1o9zidpf{flex-shrink:0}
+._1o9zkb7n{flex-shrink:1}
+._1reo15vq{overflow-x:hidden}
+._1ul9idpf{min-width:0}
+._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
+._ca0q12x7{padding-top:var(--ds-space-075,6px)}
 ._ca0qidpf{padding-top:0}
+._k48p1wq8{font-weight:var(--ds-font-weight-medium,500)}
+._n3td12x7{padding-bottom:var(--ds-space-075,6px)}
 ._n3tdidpf{padding-bottom:0}
-._u5f3idpf{padding-right:0}
+._o5721q9c{white-space:nowrap}
+._syazazsu{color:var(--ds-text-subtle,#505258)}
+._u5f312x7{padding-right:var(--ds-space-075,6px)}
+._u5f3idpf{padding-right:0}
+._irr31dpa:hover{background-color:var(--ds-background-neutral-subtle-hovered,#0515240f)}
+._1di6fcek:active{background-color:var(--ds-background-neutral-subtle-pressed,#0b120e24)}

package/dist/esm/ui/agent-conversation-starters/index.js

@@ -4,17 +4,23 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 var _excluded = ["userDefinedConversationStarters", "isAgentDefault"];
 import "./index.compiled.css";
-import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-import { useMemo } from 'react';
+import React, { useMemo } from 'react';
 import { useIntl } from 'react-intl-next';
 import { IconButton } from '@atlaskit/button/new';
+import { cx } from '@atlaskit/css';
 import RetryIcon from '@atlaskit/icon/core/retry';
-import { Box, Inline, Stack } from '@atlaskit/primitives/compiled';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { Box, Inline, Pressable, Stack } from '@atlaskit/primitives/compiled';
+import { AgentChatIcon } from '../../common/ui/agent-chat-icon';
 import { BrowseAgentsPill, ChatPill } from '../../common/ui/chat-pill';
 import { messages } from './messages';
 var styles = {
-  conversationStartersList: "_qtt8glyw _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf"
+  conversationStartersList: "_qtt8glyw _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf",
+  conversationStartersListRefresh: "_1bsb1osq",
+  conversationStarterIcon: "_1o9zidpf",
+  conversationStarterText: "_1reo15vq _18m915vq _1bto1l2s _o5721q9c _1o9zkb7n _1ul9idpf",
+  button: "_11c82smr _2rko12b0 _syazazsu _ca0q12x7 _u5f312x7 _n3td12x7 _19bv12x7 _k48p1wq8 _1bto1l2s _o5721q9c _1o9zkb7n _1bsb1osq _bfhksm61 _irr31dpa _1di6fcek"
 };
 export var getConversationStarters = function getConversationStarters(_ref) {
   var userDefinedConversationStartersParam = _ref.userDefinedConversationStarters,
@@ -95,13 +101,25 @@ export var ConversationStarters = function ConversationStarters(_ref3) {
   return /*#__PURE__*/React.createElement(Stack, {
     as: "ul",
     space: "space.050",
-    xcss: styles.conversationStartersList
+    xcss: cx(styles.conversationStartersList, fg('rovo_agent_empty_state_refresh') && styles.conversationStartersListRefresh)
   }, starters.map(function (starter, index) {
     var isLastStarter = index === starters.length - 1;
     var chatPill = /*#__PURE__*/React.createElement(Box, {
       as: "li",
       key: starter.message
-    }, /*#__PURE__*/React.createElement(ChatPill, {
+    }, fg('rovo_agent_empty_state_refresh') ? /*#__PURE__*/React.createElement(Pressable, {
+      xcss: styles.button,
+      onClick: function onClick() {
+        return onConversationStarterClick(starter);
+      }
+    }, /*#__PURE__*/React.createElement(Inline, {
+      space: "space.150",
+      alignBlock: "center"
+    }, /*#__PURE__*/React.createElement(Box, {
+      xcss: styles.conversationStarterIcon
+    }, /*#__PURE__*/React.createElement(AgentChatIcon, null)), /*#__PURE__*/React.createElement(Box, {
+      xcss: styles.conversationStarterText
+    }, starter.message))) : /*#__PURE__*/React.createElement(ChatPill, {
       testId: "conversation-starter",
       key: starter.message,
       onClick: function onClick() {

package/dist/esm/ui/agent-dropdown-menu/index.js

@@ -12,7 +12,6 @@ import { useIntl } from 'react-intl-next';
 import Button, { IconButton } from '@atlaskit/button/new';
 import DropdownMenu, { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
 import MoreIcon from '@atlaskit/icon/core/migration/show-more-horizontal--more';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, Inline } from '@atlaskit/primitives/compiled';
 import { ChatPillIcon } from '../../common/ui/chat-icon';
 import messages from './messages';
@@ -147,7 +146,7 @@ export var AgentDropdownMenu = function AgentDropdownMenu(_ref2) {
         props = _objectWithoutProperties(_ref4, _excluded);
       return /*#__PURE__*/React.createElement(IconButton, _extends({}, props, {
         icon: MoreIcon,
-        label: agentName && fg('a11y_agents_fixes') ? formatMessage(messages.moreActionsForLabel, {
+        label: agentName ? formatMessage(messages.moreActionsForLabel, {
           agentName: agentName
         }) : formatMessage(messages.moreActionsLabel),
         ref: triggerRef,

package/dist/esm/ui/agent-profile-info/index.compiled.css

@@ -1,5 +1,6 @@
 
 ._zulp1b66{gap:var(--ds-space-050,4px)}._195gu2gc{margin-inline:var(--ds-space-100,8px)}
+._1mouze3t{margin-block:var(--ds-space-0,0)}
 ._19pkze3t{margin-top:var(--ds-space-0,0)}
 ._1bah1yb4{justify-content:space-between}
 ._1e0c116y{display:inline-flex}

package/dist/esm/ui/agent-profile-info/index.js

@@ -17,6 +17,7 @@ var styles = {
   clickableItem: "_zulp1b66 _1e0c1txw _4cvr1h6o",
   name: "_1bah1yb4 _4cvr1y6m",
   description: "_19pkze3t _otyru2gc _1i4qfg65 _1nmz1hna",
+  descriptionRefresh: "_1mouze3t _1i4qfg65 _1nmz1hna",
   wrapper: "_otyru2gc",
   tooltipWrapper: "_195gu2gc _1e0c116y _kqswh2mm _94n5v77o",
   headingWrapper: "_kqswh2mm"
@@ -147,7 +148,7 @@ export var AgentProfileInfo = function AgentProfileInfo(_ref3) {
     formatMessage = _useIntl2.formatMessage;
   return /*#__PURE__*/React.createElement(Stack, {
     space: "space.100",
-    xcss: styles.wrapper
+    xcss: fg('rovo_agent_empty_state_refresh') ? null : styles.wrapper
   }, /*#__PURE__*/React.createElement(Inline, {
     xcss: styles.name,
     space: "space.100",
@@ -157,7 +158,7 @@ export var AgentProfileInfo = function AgentProfileInfo(_ref3) {
     alignBlock: "end"
   }, /*#__PURE__*/React.createElement(Heading, {
     as: "h2",
-    size: "xlarge"
+    size: fg('rovo_agent_empty_state_refresh') ? 'medium' : 'xlarge'
   }, agentName), isHidden && /*#__PURE__*/React.createElement(Box, {
     xcss: styles.tooltipWrapper
   }, /*#__PURE__*/React.createElement(Tooltip, {
@@ -169,7 +170,7 @@ export var AgentProfileInfo = function AgentProfileInfo(_ref3) {
     isStarred: isStarred,
     handleToggle: onStarToggle
   })), creatorRender, !!agentDescription && /*#__PURE__*/React.createElement(Box, {
-    xcss: styles.description,
+    xcss: fg('rovo_agent_empty_state_refresh') ? styles.descriptionRefresh : styles.description,
     as: "p"
   }, agentDescription), starCountRender);
 };

package/dist/types/common/ui/agent-chat-icon/index.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const AgentChatIcon: () => React.JSX.Element;

package/dist/types/ui/agent-conversation-starters/index.d.ts

@@ -1,7 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+import React from 'react';
 import { type MessageDescriptor } from 'react-intl-next';
 export type ConversationStarter = {
     message: string;
@@ -27,7 +24,7 @@ export type AgentConversationStartersProps = {
     userDefinedConversationStarters?: GetConversationStartersParams['userDefinedConversationStarters'];
     isAgentDefault: GetConversationStartersParams['isAgentDefault'];
 } & Omit<ConversationStartersProps, 'starters'>;
-export declare const AgentConversationStarters: ({ userDefinedConversationStarters, isAgentDefault, ...props }: AgentConversationStartersProps) => JSX.Element;
+export declare const AgentConversationStarters: ({ userDefinedConversationStarters, isAgentDefault, ...props }: AgentConversationStartersProps) => React.JSX.Element;
 export type ConversationStartersProps = {
     starters: ConversationStarter[];
     onConversationStarterClick: (conversationStarter: ConversationStarter) => void;
@@ -35,5 +32,5 @@ export type ConversationStartersProps = {
     onReloadButtonClick?: () => void;
     onBrowseAgentsClick?: () => void;
 };
-export declare const ConversationStarters: ({ starters, onConversationStarterClick, showReloadButton, onReloadButtonClick, onBrowseAgentsClick, }: ConversationStartersProps) => JSX.Element;
+export declare const ConversationStarters: ({ starters, onConversationStarterClick, showReloadButton, onReloadButtonClick, onBrowseAgentsClick, }: ConversationStartersProps) => React.JSX.Element;
 export {};

package/dist/types-ts4.5/common/ui/agent-chat-icon/index.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const AgentChatIcon: () => React.JSX.Element;

package/dist/types-ts4.5/ui/agent-conversation-starters/index.d.ts

@@ -1,7 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+import React from 'react';
 import { type MessageDescriptor } from 'react-intl-next';
 export type ConversationStarter = {
     message: string;
@@ -27,7 +24,7 @@ export type AgentConversationStartersProps = {
     userDefinedConversationStarters?: GetConversationStartersParams['userDefinedConversationStarters'];
     isAgentDefault: GetConversationStartersParams['isAgentDefault'];
 } & Omit<ConversationStartersProps, 'starters'>;
-export declare const AgentConversationStarters: ({ userDefinedConversationStarters, isAgentDefault, ...props }: AgentConversationStartersProps) => JSX.Element;
+export declare const AgentConversationStarters: ({ userDefinedConversationStarters, isAgentDefault, ...props }: AgentConversationStartersProps) => React.JSX.Element;
 export type ConversationStartersProps = {
     starters: ConversationStarter[];
     onConversationStarterClick: (conversationStarter: ConversationStarter) => void;
@@ -35,5 +32,5 @@ export type ConversationStartersProps = {
     onReloadButtonClick?: () => void;
     onBrowseAgentsClick?: () => void;
 };
-export declare const ConversationStarters: ({ starters, onConversationStarterClick, showReloadButton, onReloadButtonClick, onBrowseAgentsClick, }: ConversationStartersProps) => JSX.Element;
+export declare const ConversationStarters: ({ starters, onConversationStarterClick, showReloadButton, onReloadButtonClick, onBrowseAgentsClick, }: ConversationStartersProps) => React.JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/rovo-agent-components",
-	"version": "3.13.0",
+	"version": "3.15.0",
 	"description": "This package host public components related to rovo agents, the components here are needed for other public atlaskit packages",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -63,6 +63,7 @@
 		"@af/visual-regression": "workspace:^",
 		"@atlaskit/ssr": "workspace:^",
 		"@atlassian/feature-flags-test-utils": "^1.0.0",
+		"@atlassian/testing-library": "^0.4.0",
 		"@testing-library/react": "^13.4.0",
 		"@testing-library/react-hooks": "^8.0.1",
 		"@testing-library/user-event": "^14.4.3",
@@ -116,14 +117,14 @@
 		"should-render-to-parent-should-be-true-ai-mate": {
 			"type": "boolean"
 		},
-		"a11y_agents_fixes": {
-			"type": "boolean"
-		},
 		"agent_studio_permissions_settings_m3_profiles": {
 			"type": "boolean"
 		},
 		"jira_ai_force_rovo_dev_avatar": {
 			"type": "boolean"
+		},
+		"rovo_agent_empty_state_refresh": {
+			"type": "boolean"
 		}
 	}
 }