@atlaskit/rovo-agent-components 8.12.2 → 8.13.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/rovo-agent-components
 
+## 8.13.0
+
+### Minor Changes
+
+- [`241e671db5235`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/241e671db5235) -
+  `ResolvedAgentAvatar` now accepts either a bare account id or a full identity ARI for
+  `agentIdentityAccountId`, so callers that already have the bare id don't need to wrap it first.
+  `fallback` is now optional, defaulting to a generic hexagon `Avatar` built from `agentName` when a
+  caller has nothing more specific to show. The fetched picture now renders through `Avatar`
+  directly instead of the deprecated `AgentAvatar`.
+
+## 8.12.3
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 8.12.2
 
 ### Patch Changes

package/dist/cjs/ui/agent-avatar/resolved-agent-avatar/ResolvedAgentAvatar.compiled.css

@@ -0,0 +1,4 @@
+._1bah1h6o{justify-content:center}
+._1e0c1txw{display:flex}
+._4cvr1h6o{align-items:center}
+._bfhkvuon{background-color:var(--ds-surface,#fff)}

package/dist/cjs/ui/agent-avatar/resolved-agent-avatar/ResolvedAgentAvatar.js

@@ -1,3 +1,4 @@
+/* ResolvedAgentAvatar.tsx generated by @compiled/babel-plugin v3.0.2 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -6,25 +7,37 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ResolvedAgentAvatar = void 0;
+require("./ResolvedAgentAvatar.compiled.css");
+var _runtime = require("@compiled/react/runtime");
 var _ResolvedAgentAvatarQuery2 = _interopRequireDefault(require("./__generated__/ResolvedAgentAvatarQuery.graphql"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactErrorBoundary = require("react-error-boundary");
 var _reactRelay = require("react-relay");
+var _avatar = _interopRequireDefault(require("@atlaskit/avatar/avatar"));
+var _avatarSizes = require("@atlaskit/avatar/avatar-sizes");
 var _Skeleton = _interopRequireDefault(require("@atlaskit/avatar/Skeleton"));
-var _index = require("../index");
+var _box = require("@atlaskit/primitives/compiled/box");
 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); }
-// A relative import, not the package's own public subpath: a package can't resolve its own
-// name from within itself when building its published type declarations in isolation.
+var styles = {
+  showBorder: "_1e0c1txw _4cvr1h6o _1bah1h6o _bfhkvuon"
+};
 
 // The fixed partition/resource-owner/resource-type segments of an identity user ARI — only the
 // account id itself varies. Matched by prefix rather than via `@atlassian/ari` (an internal
 // package this public package can't depend on).
 var IDENTITY_USER_ARI_PREFIX = 'ari:cloud:identity::user/';
 
-/** Parses the account id needed for the picture fetch from the identity ARI a caller carries. */
+/**
+ * Parses the account id needed for the picture fetch from whatever identity a caller carries —
+ * either the bare account id, or the full identity ARI (callers that already have one on hand
+ * don't need to strip it first).
+ */
 var parseIdentityAccountId = function parseIdentityAccountId(value) {
   var trimmed = value === null || value === void 0 ? void 0 : value.trim();
-  return trimmed !== null && trimmed !== void 0 && trimmed.startsWith(IDENTITY_USER_ARI_PREFIX) ? trimmed.slice(IDENTITY_USER_ARI_PREFIX.length) : undefined;
+  if (!trimmed) {
+    return undefined;
+  }
+  return trimmed.startsWith(IDENTITY_USER_ARI_PREFIX) ? trimmed.slice(IDENTITY_USER_ARI_PREFIX.length) : trimmed;
 };
 var FetchedAgentAvatar = function FetchedAgentAvatar(_ref) {
   var _data$user, _data$user2;
@@ -43,21 +56,39 @@ var FetchedAgentAvatar = function FetchedAgentAvatar(_ref) {
     return fallback;
   }
   var name = ((_data$user2 = data.user) === null || _data$user2 === void 0 || (_data$user2 = _data$user2.name) === null || _data$user2 === void 0 ? void 0 : _data$user2.trim()) || agentName;
-  return /*#__PURE__*/_react.default.createElement(_index.AgentAvatar, {
-    imageUrl: picture,
+  if (!showBorder) {
+    return /*#__PURE__*/_react.default.createElement(_avatar.default, {
+      appearance: "hexagon",
+      src: picture,
+      name: name,
+      label: name,
+      size: size
+    });
+  }
+  return /*#__PURE__*/_react.default.createElement(_box.Box, {
+    testId: "resolved-agent-avatar-border",
+    xcss: styles.showBorder,
+    style: {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values
+      height: _avatarSizes.AVATAR_SIZES[size],
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values
+      width: _avatarSizes.AVATAR_SIZES[size]
+    }
+  }, /*#__PURE__*/_react.default.createElement(_avatar.default, {
+    appearance: "hexagon",
+    src: picture,
     name: name,
     label: name,
-    showBorder: showBorder,
     size: size
-  });
+  }));
 };
 
 /**
  * The best avatar available for an agent identity: the real account picture when one can be
- * fetched, otherwise the caller-supplied `fallback`. Works for any identity with an
- * `agentIdentityAccountId` — including the default Rovo agent, now that Rovo is provisioned its
- * own identity account. A `Suspense` skeleton bridges the fetch, and an `ErrorBoundary` keeps a
- * failed or unavailable fetch from ever breaking the caller — it just renders `fallback`.
+ * fetched, otherwise `fallback`. Works for any identity with an `agentIdentityAccountId` —
+ * including the default Rovo agent, now that Rovo is provisioned its own identity account. A
+ * `Suspense` skeleton bridges the fetch, and an `ErrorBoundary` keeps a failed or unavailable
+ * fetch from ever breaking the caller — it just renders `fallback`.
  */
 var ResolvedAgentAvatar = exports.ResolvedAgentAvatar = function ResolvedAgentAvatar(_ref2) {
   var agentIdentityAccountId = _ref2.agentIdentityAccountId,
@@ -67,12 +98,17 @@ var ResolvedAgentAvatar = exports.ResolvedAgentAvatar = function ResolvedAgentAv
     showBorder = _ref2$showBorder === void 0 ? false : _ref2$showBorder,
     _ref2$size = _ref2.size,
     size = _ref2$size === void 0 ? 'medium' : _ref2$size;
+  var resolvedFallback = fallback !== null && fallback !== void 0 ? fallback : /*#__PURE__*/_react.default.createElement(_avatar.default, {
+    appearance: "hexagon",
+    name: agentName,
+    size: size
+  });
   var accountId = parseIdentityAccountId(agentIdentityAccountId);
   if (!accountId) {
-    return fallback;
+    return resolvedFallback;
   }
   return /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
-    fallback: fallback
+    fallback: resolvedFallback
   }, /*#__PURE__*/_react.default.createElement(_react.Suspense, {
     fallback: /*#__PURE__*/_react.default.createElement(_Skeleton.default, {
       appearance: "hexagon",
@@ -81,7 +117,7 @@ var ResolvedAgentAvatar = exports.ResolvedAgentAvatar = function ResolvedAgentAv
   }, /*#__PURE__*/_react.default.createElement(FetchedAgentAvatar, {
     accountId: accountId,
     agentName: agentName,
-    fallback: fallback,
+    fallback: resolvedFallback,
     showBorder: showBorder,
     size: size
   })));

package/dist/es2019/ui/agent-avatar/resolved-agent-avatar/ResolvedAgentAvatar.compiled.css

@@ -0,0 +1,4 @@
+._1bah1h6o{justify-content:center}
+._1e0c1txw{display:flex}
+._4cvr1h6o{align-items:center}
+._bfhkvuon{background-color:var(--ds-surface,#fff)}

package/dist/es2019/ui/agent-avatar/resolved-agent-avatar/ResolvedAgentAvatar.js

@@ -1,20 +1,34 @@
+/* ResolvedAgentAvatar.tsx generated by @compiled/babel-plugin v3.0.2 */
+import "./ResolvedAgentAvatar.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
 import _ResolvedAgentAvatarQuery from "./__generated__/ResolvedAgentAvatarQuery.graphql";
 import React, { Suspense } from 'react';
 import { ErrorBoundary } from 'react-error-boundary';
 import { graphql, useLazyLoadQuery } from 'react-relay';
+import Avatar from '@atlaskit/avatar/avatar';
+import { AVATAR_SIZES } from '@atlaskit/avatar/avatar-sizes';
 import AvatarSkeleton from '@atlaskit/avatar/Skeleton';
-// A relative import, not the package's own public subpath: a package can't resolve its own
-// name from within itself when building its published type declarations in isolation.
-import { AgentAvatar } from '../index';
+import { Box } from '@atlaskit/primitives/compiled/box';
+const styles = {
+  showBorder: "_1e0c1txw _4cvr1h6o _1bah1h6o _bfhkvuon"
+};
+
 // The fixed partition/resource-owner/resource-type segments of an identity user ARI — only the
 // account id itself varies. Matched by prefix rather than via `@atlassian/ari` (an internal
 // package this public package can't depend on).
 const IDENTITY_USER_ARI_PREFIX = 'ari:cloud:identity::user/';
 
-/** Parses the account id needed for the picture fetch from the identity ARI a caller carries. */
+/**
+ * Parses the account id needed for the picture fetch from whatever identity a caller carries —
+ * either the bare account id, or the full identity ARI (callers that already have one on hand
+ * don't need to strip it first).
+ */
 const parseIdentityAccountId = value => {
   const trimmed = value === null || value === void 0 ? void 0 : value.trim();
-  return trimmed !== null && trimmed !== void 0 && trimmed.startsWith(IDENTITY_USER_ARI_PREFIX) ? trimmed.slice(IDENTITY_USER_ARI_PREFIX.length) : undefined;
+  if (!trimmed) {
+    return undefined;
+  }
+  return trimmed.startsWith(IDENTITY_USER_ARI_PREFIX) ? trimmed.slice(IDENTITY_USER_ARI_PREFIX.length) : trimmed;
 };
 const FetchedAgentAvatar = ({
   accountId,
@@ -34,21 +48,39 @@ const FetchedAgentAvatar = ({
     return fallback;
   }
   const name = ((_data$user2 = data.user) === null || _data$user2 === void 0 ? void 0 : (_data$user2$name = _data$user2.name) === null || _data$user2$name === void 0 ? void 0 : _data$user2$name.trim()) || agentName;
-  return /*#__PURE__*/React.createElement(AgentAvatar, {
-    imageUrl: picture,
+  if (!showBorder) {
+    return /*#__PURE__*/React.createElement(Avatar, {
+      appearance: "hexagon",
+      src: picture,
+      name: name,
+      label: name,
+      size: size
+    });
+  }
+  return /*#__PURE__*/React.createElement(Box, {
+    testId: "resolved-agent-avatar-border",
+    xcss: styles.showBorder,
+    style: {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values
+      height: AVATAR_SIZES[size],
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values
+      width: AVATAR_SIZES[size]
+    }
+  }, /*#__PURE__*/React.createElement(Avatar, {
+    appearance: "hexagon",
+    src: picture,
     name: name,
     label: name,
-    showBorder: showBorder,
     size: size
-  });
+  }));
 };
 
 /**
  * The best avatar available for an agent identity: the real account picture when one can be
- * fetched, otherwise the caller-supplied `fallback`. Works for any identity with an
- * `agentIdentityAccountId` — including the default Rovo agent, now that Rovo is provisioned its
- * own identity account. A `Suspense` skeleton bridges the fetch, and an `ErrorBoundary` keeps a
- * failed or unavailable fetch from ever breaking the caller — it just renders `fallback`.
+ * fetched, otherwise `fallback`. Works for any identity with an `agentIdentityAccountId` —
+ * including the default Rovo agent, now that Rovo is provisioned its own identity account. A
+ * `Suspense` skeleton bridges the fetch, and an `ErrorBoundary` keeps a failed or unavailable
+ * fetch from ever breaking the caller — it just renders `fallback`.
  */
 export const ResolvedAgentAvatar = ({
   agentIdentityAccountId,
@@ -57,12 +89,17 @@ export const ResolvedAgentAvatar = ({
   showBorder = false,
   size = 'medium'
 }) => {
+  const resolvedFallback = fallback !== null && fallback !== void 0 ? fallback : /*#__PURE__*/React.createElement(Avatar, {
+    appearance: "hexagon",
+    name: agentName,
+    size: size
+  });
   const accountId = parseIdentityAccountId(agentIdentityAccountId);
   if (!accountId) {
-    return fallback;
+    return resolvedFallback;
   }
   return /*#__PURE__*/React.createElement(ErrorBoundary, {
-    fallback: fallback
+    fallback: resolvedFallback
   }, /*#__PURE__*/React.createElement(Suspense, {
     fallback: /*#__PURE__*/React.createElement(AvatarSkeleton, {
       appearance: "hexagon",
@@ -71,7 +108,7 @@ export const ResolvedAgentAvatar = ({
   }, /*#__PURE__*/React.createElement(FetchedAgentAvatar, {
     accountId: accountId,
     agentName: agentName,
-    fallback: fallback,
+    fallback: resolvedFallback,
     showBorder: showBorder,
     size: size
   })));

package/dist/esm/ui/agent-avatar/resolved-agent-avatar/ResolvedAgentAvatar.compiled.css

@@ -0,0 +1,4 @@
+._1bah1h6o{justify-content:center}
+._1e0c1txw{display:flex}
+._4cvr1h6o{align-items:center}
+._bfhkvuon{background-color:var(--ds-surface,#fff)}

package/dist/esm/ui/agent-avatar/resolved-agent-avatar/ResolvedAgentAvatar.js

@@ -1,20 +1,34 @@
+/* ResolvedAgentAvatar.tsx generated by @compiled/babel-plugin v3.0.2 */
+import "./ResolvedAgentAvatar.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
 import _ResolvedAgentAvatarQuery from "./__generated__/ResolvedAgentAvatarQuery.graphql";
 import React, { Suspense } from 'react';
 import { ErrorBoundary } from 'react-error-boundary';
 import { graphql, useLazyLoadQuery } from 'react-relay';
+import Avatar from '@atlaskit/avatar/avatar';
+import { AVATAR_SIZES } from '@atlaskit/avatar/avatar-sizes';
 import AvatarSkeleton from '@atlaskit/avatar/Skeleton';
-// A relative import, not the package's own public subpath: a package can't resolve its own
-// name from within itself when building its published type declarations in isolation.
-import { AgentAvatar } from '../index';
+import { Box } from '@atlaskit/primitives/compiled/box';
+var styles = {
+  showBorder: "_1e0c1txw _4cvr1h6o _1bah1h6o _bfhkvuon"
+};
+
 // The fixed partition/resource-owner/resource-type segments of an identity user ARI — only the
 // account id itself varies. Matched by prefix rather than via `@atlassian/ari` (an internal
 // package this public package can't depend on).
 var IDENTITY_USER_ARI_PREFIX = 'ari:cloud:identity::user/';
 
-/** Parses the account id needed for the picture fetch from the identity ARI a caller carries. */
+/**
+ * Parses the account id needed for the picture fetch from whatever identity a caller carries —
+ * either the bare account id, or the full identity ARI (callers that already have one on hand
+ * don't need to strip it first).
+ */
 var parseIdentityAccountId = function parseIdentityAccountId(value) {
   var trimmed = value === null || value === void 0 ? void 0 : value.trim();
-  return trimmed !== null && trimmed !== void 0 && trimmed.startsWith(IDENTITY_USER_ARI_PREFIX) ? trimmed.slice(IDENTITY_USER_ARI_PREFIX.length) : undefined;
+  if (!trimmed) {
+    return undefined;
+  }
+  return trimmed.startsWith(IDENTITY_USER_ARI_PREFIX) ? trimmed.slice(IDENTITY_USER_ARI_PREFIX.length) : trimmed;
 };
 var FetchedAgentAvatar = function FetchedAgentAvatar(_ref) {
   var _data$user, _data$user2;
@@ -33,21 +47,39 @@ var FetchedAgentAvatar = function FetchedAgentAvatar(_ref) {
     return fallback;
   }
   var name = ((_data$user2 = data.user) === null || _data$user2 === void 0 || (_data$user2 = _data$user2.name) === null || _data$user2 === void 0 ? void 0 : _data$user2.trim()) || agentName;
-  return /*#__PURE__*/React.createElement(AgentAvatar, {
-    imageUrl: picture,
+  if (!showBorder) {
+    return /*#__PURE__*/React.createElement(Avatar, {
+      appearance: "hexagon",
+      src: picture,
+      name: name,
+      label: name,
+      size: size
+    });
+  }
+  return /*#__PURE__*/React.createElement(Box, {
+    testId: "resolved-agent-avatar-border",
+    xcss: styles.showBorder,
+    style: {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values
+      height: AVATAR_SIZES[size],
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values
+      width: AVATAR_SIZES[size]
+    }
+  }, /*#__PURE__*/React.createElement(Avatar, {
+    appearance: "hexagon",
+    src: picture,
     name: name,
     label: name,
-    showBorder: showBorder,
     size: size
-  });
+  }));
 };
 
 /**
  * The best avatar available for an agent identity: the real account picture when one can be
- * fetched, otherwise the caller-supplied `fallback`. Works for any identity with an
- * `agentIdentityAccountId` — including the default Rovo agent, now that Rovo is provisioned its
- * own identity account. A `Suspense` skeleton bridges the fetch, and an `ErrorBoundary` keeps a
- * failed or unavailable fetch from ever breaking the caller — it just renders `fallback`.
+ * fetched, otherwise `fallback`. Works for any identity with an `agentIdentityAccountId` —
+ * including the default Rovo agent, now that Rovo is provisioned its own identity account. A
+ * `Suspense` skeleton bridges the fetch, and an `ErrorBoundary` keeps a failed or unavailable
+ * fetch from ever breaking the caller — it just renders `fallback`.
  */
 export var ResolvedAgentAvatar = function ResolvedAgentAvatar(_ref2) {
   var agentIdentityAccountId = _ref2.agentIdentityAccountId,
@@ -57,12 +89,17 @@ export var ResolvedAgentAvatar = function ResolvedAgentAvatar(_ref2) {
     showBorder = _ref2$showBorder === void 0 ? false : _ref2$showBorder,
     _ref2$size = _ref2.size,
     size = _ref2$size === void 0 ? 'medium' : _ref2$size;
+  var resolvedFallback = fallback !== null && fallback !== void 0 ? fallback : /*#__PURE__*/React.createElement(Avatar, {
+    appearance: "hexagon",
+    name: agentName,
+    size: size
+  });
   var accountId = parseIdentityAccountId(agentIdentityAccountId);
   if (!accountId) {
-    return fallback;
+    return resolvedFallback;
   }
   return /*#__PURE__*/React.createElement(ErrorBoundary, {
-    fallback: fallback
+    fallback: resolvedFallback
   }, /*#__PURE__*/React.createElement(Suspense, {
     fallback: /*#__PURE__*/React.createElement(AvatarSkeleton, {
       appearance: "hexagon",
@@ -71,7 +108,7 @@ export var ResolvedAgentAvatar = function ResolvedAgentAvatar(_ref2) {
   }, /*#__PURE__*/React.createElement(FetchedAgentAvatar, {
     accountId: accountId,
     agentName: agentName,
-    fallback: fallback,
+    fallback: resolvedFallback,
     showBorder: showBorder,
     size: size
   })));

package/dist/types/ui/agent-avatar/resolved-agent-avatar/ResolvedAgentAvatar.d.ts

@@ -2,16 +2,22 @@ import React from 'react';
 import type { SizeType } from '@atlaskit/avatar/types';
 /**
  * The best avatar available for an agent identity: the real account picture when one can be
- * fetched, otherwise the caller-supplied `fallback`. Works for any identity with an
- * `agentIdentityAccountId` — including the default Rovo agent, now that Rovo is provisioned its
- * own identity account. A `Suspense` skeleton bridges the fetch, and an `ErrorBoundary` keeps a
- * failed or unavailable fetch from ever breaking the caller — it just renders `fallback`.
+ * fetched, otherwise `fallback`. Works for any identity with an `agentIdentityAccountId` —
+ * including the default Rovo agent, now that Rovo is provisioned its own identity account. A
+ * `Suspense` skeleton bridges the fetch, and an `ErrorBoundary` keeps a failed or unavailable
+ * fetch from ever breaking the caller — it just renders `fallback`.
  */
 export declare const ResolvedAgentAvatar: ({ agentIdentityAccountId, agentName, fallback, showBorder, size, }: {
+    /** Either the bare account id or the full identity ARI — whichever the caller already has. */
     agentIdentityAccountId?: string | null;
     agentName?: string;
-    /** Rendered when there's no account id, no picture on file, or the fetch fails. */
-    fallback: React.JSX.Element;
+    /**
+     * Rendered when there's no account id, no picture on file, or the fetch fails. Defaults to a
+     * generic hexagon `Avatar` (renders its own agent icon with no `src`) — pass an explicit
+     * `fallback` only when the caller has something more specific to show (e.g. its own
+     * already-known picture, or an `agentNamedId` for a generated illustration).
+     */
+    fallback?: React.JSX.Element;
     /** Border/background treatment for the fetched picture, matching `AgentAvatar`'s own prop. */
     showBorder?: boolean;
     size?: SizeType;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/rovo-agent-components",
-	"version": "8.12.2",
+	"version": "8.13.0",
 	"description": "This package host public components related to rovo agents, the components here are needed for other public atlaskit packages",
 	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-monorepo",
 	"atlassian": {
@@ -52,8 +52,8 @@
 		"@atlaskit/rovo-agent-analytics": "^6.4.0",
 		"@atlaskit/skeleton": "^4.4.0",
 		"@atlaskit/spinner": "^20.4.0",
-		"@atlaskit/tmp-editor-statsig": "^199.0.0",
-		"@atlaskit/tokens": "^18.1.0",
+		"@atlaskit/tmp-editor-statsig": "^200.0.0",
+		"@atlaskit/tokens": "^18.2.0",
 		"@atlaskit/tooltip": "^24.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^1.0.2",