@atlaskit/smart-card 38.13.3 → 38.14.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/smart-card
 
+## 38.14.0
+
+### Minor Changes
+
+- [#174776](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/174776)
+  [`2a6d5eb53eb89`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2a6d5eb53eb89) -
+  [ux] Add new custom elements and new props to flexible ui card elements
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 38.13.3
 
 ### Patch Changes

package/dist/cjs/index.js

@@ -93,6 +93,18 @@ Object.defineProperty(exports, "CustomBlock", {
     return _blocks.CustomBlock;
   }
 });
+Object.defineProperty(exports, "CustomByAccessTypeElement", {
+  enumerable: true,
+  get: function get() {
+    return _external.CustomByAccessTypeElement;
+  }
+});
+Object.defineProperty(exports, "CustomByStatusElement", {
+  enumerable: true,
+  get: function get() {
+    return _external.CustomByStatusElement;
+  }
+});
 Object.defineProperty(exports, "DownloadAction", {
   enumerable: true,
   get: function get() {

package/dist/cjs/utils/analytics/analytics.js

@@ -11,7 +11,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
 var context = exports.context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "38.13.2"
+  packageVersion: "38.13.3"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/cjs/view/FlexibleCard/components/elements/common/base-date-time-element/index.compiled.css

@@ -1,4 +1,6 @@
+._11c81ixg{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._18m915vq{overflow-y:hidden}
 ._1bto1l2s{text-overflow:ellipsis}

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

@@ -33,6 +33,12 @@ var typeToDescriptorMap = {
     absolute: _messages.messages.sent_on_absolute
   }
 };
+var fontOverrideStyleMap = {
+  'font.body': "_11c82smr",
+  'font.body.large': "_11c81ixg",
+  'font.body.small': "_11c81o8v",
+  'font.body.UNSAFE_small': "_11c8dcr7"
+};
 /**
  * A base element that displays an ISO Timestamp in text.
  * @internal
@@ -51,7 +57,8 @@ var BaseDateTimeElement = function BaseDateTimeElement(_ref) {
     text = _ref.text,
     _ref$hideDatePrefix = _ref.hideDatePrefix,
     hideDatePrefix = _ref$hideDatePrefix === void 0 ? false : _ref$hideDatePrefix,
-    color = _ref.color;
+    color = _ref.color,
+    fontSize = _ref.fontSize;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatRelativeTime = _useIntl.formatRelativeTime,
     formatDate = _useIntl.formatDate;
@@ -99,7 +106,7 @@ var BaseDateTimeElement = function BaseDateTimeElement(_ref) {
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
-    className: (0, _runtime.ax)([!(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_11c8dcr7 _1reo15vq _18m915vq _syaz131l _1e0ccj1k _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k1j6v", (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_11c81o8v _1reo15vq _18m915vq _syaz1gjq _1e0ccj1k _1ul9idpf _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k7vkz", className])
+    className: (0, _runtime.ax)([!(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_11c8dcr7 _1reo15vq _18m915vq _syaz131l _1e0ccj1k _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k1j6v", (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_11c81o8v _1reo15vq _18m915vq _syaz1gjq _1e0ccj1k _1ul9idpf _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k7vkz", fontSize !== undefined && (0, _platformFeatureFlags.fg)('bandicoots-smart-card-teamwork-context') && fontOverrideStyleMap[fontSize], className])
   }, content);
 };
 var _default = exports.default = BaseDateTimeElement;

package/dist/cjs/view/FlexibleCard/components/elements/common/base-text-element/index.compiled.css

@@ -1,4 +1,6 @@
+._11c81ixg{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._18m915vq{overflow-y:hidden}
 ._1bto1l2s{text-overflow:ellipsis}

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

@@ -15,6 +15,12 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 // TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
 var baseStyleOld = null;
 var baseStyle = null;
+var fontOverrideStyleMap = {
+  'font.body': "_11c82smr",
+  'font.body.large': "_11c81ixg",
+  'font.body.small': "_11c81o8v",
+  'font.body.UNSAFE_small': "_11c8dcr7"
+};
 /**
  * A base element that displays some Text.
  * @internal
@@ -32,7 +38,8 @@ var BaseTextElement = exports.BaseTextElement = function BaseTextElement(_ref) {
     testId = _ref$testId === void 0 ? 'smart-element-text' : _ref$testId,
     _ref$hideFormat = _ref.hideFormat,
     hideFormat = _ref$hideFormat === void 0 ? false : _ref$hideFormat,
-    color = _ref.color;
+    color = _ref.color,
+    fontSize = _ref.fontSize;
   if (!message && !content) {
     return null;
   }
@@ -46,7 +53,7 @@ var BaseTextElement = exports.BaseTextElement = function BaseTextElement(_ref) {
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
-    className: (0, _runtime.ax)([!(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_11c8dcr7 _1reo15vq _18m915vq _syaz131l _o5724jg8 _1e0ccj1k _1bto1l2s _1nmz1hna _sudp1e54", (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_11c81o8v _1reo15vq _18m915vq _syaz1gjq _o5724jg8 _1e0ccj1k _1ul9idpf _1bto1l2s _1nmz1hna _sudp1e54", "_1yyjr31u _102klxil", className]),
+    className: (0, _runtime.ax)([!(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_11c8dcr7 _1reo15vq _18m915vq _syaz131l _o5724jg8 _1e0ccj1k _1bto1l2s _1nmz1hna _sudp1e54", (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_11c81o8v _1reo15vq _18m915vq _syaz1gjq _o5724jg8 _1e0ccj1k _1ul9idpf _1bto1l2s _1nmz1hna _sudp1e54", fontSize !== undefined && (0, _platformFeatureFlags.fg)('bandicoots-smart-card-teamwork-context') && fontOverrideStyleMap[fontSize], "_1yyjr31u _102klxil", className]),
     style: {
       color: color && (0, _platformFeatureFlags.fg)('platform-linking-additional-flexible-element-props') ? color : undefined,
       "--_1erfju8": (0, _runtime.ix)(maxLines),

package/dist/cjs/view/FlexibleCard/components/elements/custom-by-access-type-element/index.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
+var _common = require("../common");
+var _excluded = ["className", "testId"];
+var CustomElementByAccessType = function CustomElementByAccessType(_ref) {
+  var _context$data, _props;
+  var className = _ref.className,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'custom-by-access-type-element' : _ref$testId,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var context = (0, _flexibleUiContext.useFlexibleCardContext)();
+  var accessType = context === null || context === void 0 || (_context$data = context.data) === null || _context$data === void 0 || (_context$data = _context$data.meta) === null || _context$data === void 0 ? void 0 : _context$data.accessType;
+  var text = (_props = props[accessType]) !== null && _props !== void 0 ? _props : props.fallback;
+  if (!text) {
+    return null;
+  }
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+    _react.default.createElement(_common.BaseTextElement, (0, _extends2.default)({}, props, {
+      content: text,
+      className: className,
+      testId: testId,
+      hideFormat: true
+    }))
+  );
+};
+var _default = exports.default = CustomElementByAccessType;

package/dist/cjs/view/FlexibleCard/components/elements/custom-by-status-element/index.js

@@ -0,0 +1,36 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
+var _excluded = ["className", "testId"];
+var CustomByStatusElement = function CustomByStatusElement(_ref) {
+  var className = _ref.className,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'custom-by-status-element' : _ref$testId,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var context = (0, _flexibleUiContext.useFlexibleCardContext)();
+  var status = context === null || context === void 0 ? void 0 : context.status;
+  if (!status) {
+    return null;
+  }
+  var component = props[status];
+  if (!component) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement("span", {
+    "data-separator": true,
+    "data-smart-element": "custom-element",
+    "data-smart-element-text": true,
+    "data-testid": testId
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+    ,
+    className: className
+  }, component);
+};
+var _default = exports.default = CustomByStatusElement;

package/dist/cjs/view/FlexibleCard/components/elements/index.js

@@ -64,6 +64,18 @@ Object.defineProperty(exports, "CreatedOn", {
     return _createdOnElement.default;
   }
 });
+Object.defineProperty(exports, "CustomByAccessTypeElement", {
+  enumerable: true,
+  get: function get() {
+    return _customByAccessTypeElement.default;
+  }
+});
+Object.defineProperty(exports, "CustomByStatusElement", {
+  enumerable: true,
+  get: function get() {
+    return _customByStatusElement.default;
+  }
+});
 Object.defineProperty(exports, "DueOn", {
   enumerable: true,
   get: function get() {
@@ -248,4 +260,6 @@ var _targetBranchElement = _interopRequireDefault(require("./target-branch-eleme
 var _titleElement = _interopRequireDefault(require("./title-element"));
 var _viewCountElement = _interopRequireDefault(require("./view-count-element"));
 var _voteCountElement = _interopRequireDefault(require("./vote-count-element"));
-var _appliedToComponentsCountElement = _interopRequireDefault(require("./applied-to-components-count-element"));
+var _appliedToComponentsCountElement = _interopRequireDefault(require("./applied-to-components-count-element"));
+var _customByAccessTypeElement = _interopRequireDefault(require("./custom-by-access-type-element"));
+var _customByStatusElement = _interopRequireDefault(require("./custom-by-status-element"));

package/dist/cjs/view/FlexibleCard/components/elements/owned-by-element/index.js

@@ -16,9 +16,15 @@ var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
 var _common = require("../common");
 var _excluded = ["onRender"];
 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 getOwnedByText = function getOwnedByText(context, textPrefix) {
+  if (!(0, _platformFeatureFlags.fg)('bandicoots-smart-card-teamwork-context')) {
+    return context.ownedBy;
+  }
+  return textPrefix ? "".concat(textPrefix, " ").concat(context.ownedBy).trim() : context.ownedBy;
+};
 var OwnedByElement = function OwnedByElement(props) {
   var context = (0, _flexibleUiContext.useFlexibleUiContext)();
-  var data = context ? (0, _common.toFormattedTextProps)(_messages.messages.owned_by, context.ownedBy) : null;
+  var data = context ? (0, _common.toFormattedTextProps)(_messages.messages.owned_by, getOwnedByText(context, props === null || props === void 0 ? void 0 : props.textPrefix)) : null;
   var _ref = props || {},
     onRender = _ref.onRender,
     restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);

package/dist/cjs/view/FlexibleCard/external.js

@@ -4,7 +4,20 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.toActionProps = exports.VoteCountElement = exports.ViewCountElement = exports.UnresolvedAction = exports.TitleElement = exports.TargetBranchElement = exports.SubscriberCountElement = exports.SubTasksProgressElement = exports.StoryPointsElement = exports.StateElement = exports.SourceBranchElement = exports.SnippetElement = exports.SentOnElement = exports.ReadTimeElement = exports.ReactCountElement = exports.ProviderElement = exports.ProgrammingLanguageElement = exports.PriorityElement = exports.PreviewElement = exports.PreviewAction = exports.OwnedByGroupElement = exports.OwnedByElement = exports.ModifiedOnElement = exports.ModifiedByElement = exports.LocationElement = exports.LinkIconElement = exports.LatestCommitElement = exports.FollowAction = exports.DueOnElement = exports.DownloadAction = exports.CustomAction = exports.CreatedOnElement = exports.CreatedByElement = exports.CopyLinkAction = exports.CommentCountElement = exports.CollaboratorGroupElement = exports.ChecklistProgressElement = exports.AuthorGroupElement = exports.AttachmentCountElement = exports.AssignedToGroupElement = exports.AssignedToElement = void 0;
+exports.CustomAction = exports.CreatedOnElement = exports.CreatedByElement = exports.CopyLinkAction = exports.CommentCountElement = exports.CollaboratorGroupElement = exports.ChecklistProgressElement = exports.AuthorGroupElement = exports.AttachmentCountElement = exports.AssignedToGroupElement = exports.AssignedToElement = void 0;
+Object.defineProperty(exports, "CustomByAccessTypeElement", {
+  enumerable: true,
+  get: function get() {
+    return _elements.CustomByAccessTypeElement;
+  }
+});
+Object.defineProperty(exports, "CustomByStatusElement", {
+  enumerable: true,
+  get: function get() {
+    return _elements.CustomByStatusElement;
+  }
+});
+exports.toActionProps = exports.VoteCountElement = exports.ViewCountElement = exports.UnresolvedAction = exports.TitleElement = exports.TargetBranchElement = exports.SubscriberCountElement = exports.SubTasksProgressElement = exports.StoryPointsElement = exports.StateElement = exports.SourceBranchElement = exports.SnippetElement = exports.SentOnElement = exports.ReadTimeElement = exports.ReactCountElement = exports.ProviderElement = exports.ProgrammingLanguageElement = exports.PriorityElement = exports.PreviewElement = exports.PreviewAction = exports.OwnedByGroupElement = exports.OwnedByElement = exports.ModifiedOnElement = exports.ModifiedByElement = exports.LocationElement = exports.LinkIconElement = exports.LatestCommitElement = exports.FollowAction = exports.DueOnElement = exports.DownloadAction = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
@@ -80,18 +93,22 @@ var ModifiedOnElement = exports.ModifiedOnElement = function ModifiedOnElement(p
     return /*#__PURE__*/_react.default.createElement(_elements.ModifiedOn, {
       hideDatePrefix: props === null || props === void 0 ? void 0 : props.hideDatePrefix,
       color: props === null || props === void 0 ? void 0 : props.color,
-      onRender: props === null || props === void 0 ? void 0 : props.onRender
+      onRender: props === null || props === void 0 ? void 0 : props.onRender,
+      fontSize: props === null || props === void 0 ? void 0 : props.fontSize
     });
   }
   return /*#__PURE__*/_react.default.createElement(_elements.ModifiedOn, null);
 };
 var OwnedByElement = exports.OwnedByElement = function OwnedByElement(props) {
   if ((0, _platformFeatureFlags.fg)('platform-linking-additional-flexible-element-props')) {
-    return /*#__PURE__*/_react.default.createElement(_elements.OwnedBy, {
+    return /*#__PURE__*/_react.default.createElement(_elements.OwnedBy, (0, _extends2.default)({
       hideFormat: props === null || props === void 0 ? void 0 : props.hideFormat,
       color: props === null || props === void 0 ? void 0 : props.color,
       onRender: props === null || props === void 0 ? void 0 : props.onRender
-    });
+    }, (0, _platformFeatureFlags.fg)('bandicoots-smart-card-teamwork-context') ? {
+      textPrefix: props === null || props === void 0 ? void 0 : props.textPrefix,
+      fontSize: props === null || props === void 0 ? void 0 : props.fontSize
+    } : undefined));
   }
   return /*#__PURE__*/_react.default.createElement(_elements.OwnedBy, null);
 };
@@ -164,7 +181,10 @@ var TitleElement = exports.TitleElement = function TitleElement(props) {
     hideTooltip: props === null || props === void 0 ? void 0 : props.hideTooltip,
     maxLines: props === null || props === void 0 ? void 0 : props.maxLines,
     target: props === null || props === void 0 ? void 0 : props.target
-  }, props !== null && props !== void 0 && props.text ? {
+  }, (0, _platformFeatureFlags.fg)('bandicoots-smart-card-teamwork-context') ? {
+    theme: props === null || props === void 0 ? void 0 : props.theme,
+    size: props === null || props === void 0 ? void 0 : props.size
+  } : undefined, props !== null && props !== void 0 && props.text ? {
     text: props === null || props === void 0 ? void 0 : props.text
   } : undefined));
 };

package/dist/cjs/view/FlexibleCard/utils.js

@@ -18,7 +18,10 @@ var _extractProviderIcon = require("../../extractors/flexible/icon/extract-provi
 var _messages = require("../../messages");
 var _utils = require("../../utils");
 var _jsonld = require("../../utils/jsonld");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var getContextByStatus = exports.getContextByStatus = function getContextByStatus(params) {
+  var _response$meta;
   var _ref = params !== null && params !== void 0 ? params : {},
     onClick = _ref.onClick,
     response = _ref.response,
@@ -42,7 +45,7 @@ var getContextByStatus = exports.getContextByStatus = function getContextByStatu
     case _constants.SmartLinkStatus.Errored:
     case _constants.SmartLinkStatus.Fallback:
     default:
-      return {
+      return _objectSpread({
         url: url,
         title: (0, _platformFeatureFlags.fg)('platform-linking-flexible-card-context') ? undefined : url,
         linkIcon: (0, _icon.extractErrorIcon)(response, status),
@@ -50,7 +53,11 @@ var getContextByStatus = exports.getContextByStatus = function getContextByStatu
         preview: (0, _extractPreview.extractSmartLinkPreviewImage)(response),
         provider: (0, _extractProviderIcon.extractSmartLinkProviderIcon)(response),
         actions: (0, _platformFeatureFlags.fg)('platform-linking-flexible-card-unresolved-action') ? (0, _defineProperty2.default)({}, _constants.InternalActionName.UnresolvedAction, getRetryOptions(url, status, response, params.onAuthorize)) : undefined
-      };
+      }, (0, _platformFeatureFlags.fg)('bandicoots-smart-card-teamwork-context') ? {
+        meta: {
+          accessType: response === null || response === void 0 || (_response$meta = response.meta) === null || _response$meta === void 0 || (_response$meta = _response$meta.requestAccess) === null || _response$meta === void 0 ? void 0 : _response$meta.accessType
+        }
+      } : undefined);
   }
 };
 var getForbiddenMessageKey = function getForbiddenMessageKey(meta) {
@@ -72,7 +79,7 @@ var getForbiddenMessageKey = function getForbiddenMessageKey(meta) {
   }
 };
 var getRetryOptions = exports.getRetryOptions = function getRetryOptions(url, status, response, onAuthorize) {
-  var _response$meta, _access$action, _access$buttonDisable;
+  var _response$meta2, _access$action, _access$buttonDisable;
   var provider = (0, _linkExtractors.extractSmartLinkProvider)(response);
   var context = provider === null || provider === void 0 ? void 0 : provider.text;
   var values = context ? {
@@ -80,7 +87,7 @@ var getRetryOptions = exports.getRetryOptions = function getRetryOptions(url, st
   } : undefined;
   switch (status) {
     case _constants.SmartLinkStatus.Forbidden:
-      var meta = (_response$meta = response === null || response === void 0 ? void 0 : response.meta) !== null && _response$meta !== void 0 ? _response$meta : (0, _jsonld.getForbiddenJsonLd)().meta;
+      var meta = (_response$meta2 = response === null || response === void 0 ? void 0 : response.meta) !== null && _response$meta2 !== void 0 ? _response$meta2 : (0, _jsonld.getForbiddenJsonLd)().meta;
       var access = (0, _context.extractRequestAccessContextImproved)({
         jsonLd: meta,
         url: url,

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

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

package/dist/es2019/index.js

@@ -14,7 +14,7 @@ export { loadingPlaceholderClassName } from './view/CardWithUrl/component-lazy/L
 // Flexible UI
 export { ActionName, ElementName, MediaPlacement, SmartLinkDirection, SmartLinkPosition, SmartLinkSize, SmartLinkTheme } from './constants';
 export { MetadataBlock, PreviewBlock, SnippetBlock, TitleBlock, FooterBlock, CustomBlock } from './view/FlexibleCard/components/blocks';
-export { AssignedToElement, AssignedToGroupElement, AttachmentCountElement, AuthorGroupElement, ChecklistProgressElement, CollaboratorGroupElement, CommentCountElement, CreatedOnElement, CreatedByElement, DueOnElement, LatestCommitElement, LinkIconElement, LocationElement, ModifiedByElement, ModifiedOnElement, OwnedByElement, OwnedByGroupElement, PreviewElement, PriorityElement, ProgrammingLanguageElement, ProviderElement, ReactCountElement, ReadTimeElement, SentOnElement, SnippetElement, SourceBranchElement, StateElement, StoryPointsElement, SubscriberCountElement, SubTasksProgressElement, TargetBranchElement, TitleElement, ViewCountElement, VoteCountElement } from './view/FlexibleCard/external';
+export { AssignedToElement, AssignedToGroupElement, AttachmentCountElement, AuthorGroupElement, ChecklistProgressElement, CollaboratorGroupElement, CommentCountElement, CreatedOnElement, CreatedByElement, DueOnElement, LatestCommitElement, LinkIconElement, LocationElement, ModifiedByElement, ModifiedOnElement, OwnedByElement, OwnedByGroupElement, PreviewElement, PriorityElement, ProgrammingLanguageElement, ProviderElement, ReactCountElement, ReadTimeElement, SentOnElement, SnippetElement, SourceBranchElement, StateElement, StoryPointsElement, SubscriberCountElement, SubTasksProgressElement, TargetBranchElement, TitleElement, ViewCountElement, VoteCountElement, CustomByAccessTypeElement, CustomByStatusElement } from './view/FlexibleCard/external';
 export { CopyLinkAction, CustomAction, DownloadAction, FollowAction, PreviewAction, UnresolvedAction } from './view/FlexibleCard/external';
 /** @deprecated {@link https://hello.atlassian.net/browse/ENGHEALTH-661 Internal documentation for deprecation (no external access)} */
 export { editorCardProvider, EditorCardProvider } from '@atlaskit/link-provider';

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: "38.13.2"
+  packageVersion: "38.13.3"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/es2019/view/FlexibleCard/components/elements/common/base-date-time-element/index.compiled.css

@@ -1,4 +1,6 @@
+._11c81ixg{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._18m915vq{overflow-y:hidden}
 ._1bto1l2s{text-overflow:ellipsis}

package/dist/es2019/view/FlexibleCard/components/elements/common/base-date-time-element/index.js

@@ -24,6 +24,12 @@ const typeToDescriptorMap = {
     absolute: messages.sent_on_absolute
   }
 };
+const fontOverrideStyleMap = {
+  'font.body': "_11c82smr",
+  'font.body.large': "_11c81ixg",
+  'font.body.small': "_11c81o8v",
+  'font.body.UNSAFE_small': "_11c8dcr7"
+};
 /**
  * A base element that displays an ISO Timestamp in text.
  * @internal
@@ -40,7 +46,8 @@ const BaseDateTimeElement = ({
   testId = 'smart-element-date-time',
   text,
   hideDatePrefix = false,
-  color
+  color,
+  fontSize
 }) => {
   const {
     formatRelativeTime,
@@ -91,7 +98,7 @@ const BaseDateTimeElement = ({
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
-    className: ax([!fg('platform-linking-visual-refresh-v1') && "_11c8dcr7 _1reo15vq _18m915vq _syaz131l _1e0ccj1k _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k1j6v", fg('platform-linking-visual-refresh-v1') && "_11c81o8v _1reo15vq _18m915vq _syaz1gjq _1e0ccj1k _1ul9idpf _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k7vkz", className])
+    className: ax([!fg('platform-linking-visual-refresh-v1') && "_11c8dcr7 _1reo15vq _18m915vq _syaz131l _1e0ccj1k _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k1j6v", fg('platform-linking-visual-refresh-v1') && "_11c81o8v _1reo15vq _18m915vq _syaz1gjq _1e0ccj1k _1ul9idpf _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k7vkz", fontSize !== undefined && fg('bandicoots-smart-card-teamwork-context') && fontOverrideStyleMap[fontSize], className])
   }, content);
 };
 export default BaseDateTimeElement;

package/dist/es2019/view/FlexibleCard/components/elements/common/base-text-element/index.compiled.css

@@ -1,4 +1,6 @@
+._11c81ixg{font:var(--ds-font-body-large,normal 400 1pc/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._11c82smr{font:var(--ds-font-body,normal 400 14px/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11c8dcr7{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._18m915vq{overflow-y:hidden}
 ._1bto1l2s{text-overflow:ellipsis}

package/dist/es2019/view/FlexibleCard/components/elements/common/base-text-element/index.js

@@ -7,6 +7,12 @@ import { getFormattedMessage } from '../../../utils';
 // TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
 const baseStyleOld = null;
 const baseStyle = null;
+const fontOverrideStyleMap = {
+  'font.body': "_11c82smr",
+  'font.body.large': "_11c81ixg",
+  'font.body.small': "_11c81o8v",
+  'font.body.UNSAFE_small': "_11c8dcr7"
+};
 /**
  * A base element that displays some Text.
  * @internal
@@ -21,7 +27,8 @@ export const BaseTextElement = ({
   className,
   testId = 'smart-element-text',
   hideFormat = false,
-  color
+  color,
+  fontSize
 }) => {
   if (!message && !content) {
     return null;
@@ -36,7 +43,7 @@ export const BaseTextElement = ({
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
-    className: ax([!fg('platform-linking-visual-refresh-v1') && "_11c8dcr7 _1reo15vq _18m915vq _syaz131l _o5724jg8 _1e0ccj1k _1bto1l2s _1nmz1hna _sudp1e54", fg('platform-linking-visual-refresh-v1') && "_11c81o8v _1reo15vq _18m915vq _syaz1gjq _o5724jg8 _1e0ccj1k _1ul9idpf _1bto1l2s _1nmz1hna _sudp1e54", "_1yyjr31u _102k1dud", className]),
+    className: ax([!fg('platform-linking-visual-refresh-v1') && "_11c8dcr7 _1reo15vq _18m915vq _syaz131l _o5724jg8 _1e0ccj1k _1bto1l2s _1nmz1hna _sudp1e54", fg('platform-linking-visual-refresh-v1') && "_11c81o8v _1reo15vq _18m915vq _syaz1gjq _o5724jg8 _1e0ccj1k _1ul9idpf _1bto1l2s _1nmz1hna _sudp1e54", fontSize !== undefined && fg('bandicoots-smart-card-teamwork-context') && fontOverrideStyleMap[fontSize], "_1yyjr31u _102k1dud", className]),
     style: {
       color: color && fg('platform-linking-additional-flexible-element-props') ? color : undefined,
       "--_1erfju8": ix(maxLines)

package/dist/es2019/view/FlexibleCard/components/elements/custom-by-access-type-element/index.js

@@ -0,0 +1,28 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { useFlexibleCardContext } from '../../../../../state/flexible-ui-context';
+import { BaseTextElement } from '../common';
+const CustomElementByAccessType = ({
+  className,
+  testId = 'custom-by-access-type-element',
+  ...props
+}) => {
+  var _context$data, _context$data$meta, _props;
+  const context = useFlexibleCardContext();
+  const accessType = context === null || context === void 0 ? void 0 : (_context$data = context.data) === null || _context$data === void 0 ? void 0 : (_context$data$meta = _context$data.meta) === null || _context$data$meta === void 0 ? void 0 : _context$data$meta.accessType;
+  const text = (_props = props[accessType]) !== null && _props !== void 0 ? _props : props.fallback;
+  if (!text) {
+    return null;
+  }
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+    React.createElement(BaseTextElement, _extends({}, props, {
+      content: text,
+      className: className,
+      testId: testId,
+      hideFormat: true
+    }))
+  );
+};
+export default CustomElementByAccessType;

package/dist/es2019/view/FlexibleCard/components/elements/custom-by-status-element/index.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { useFlexibleCardContext } from '../../../../../state/flexible-ui-context';
+const CustomByStatusElement = ({
+  className,
+  testId = 'custom-by-status-element',
+  ...props
+}) => {
+  const context = useFlexibleCardContext();
+  const status = context === null || context === void 0 ? void 0 : context.status;
+  if (!status) {
+    return null;
+  }
+  const component = props[status];
+  if (!component) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("span", {
+    "data-separator": true,
+    "data-smart-element": "custom-element",
+    "data-smart-element-text": true,
+    "data-testid": testId
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+    ,
+    className: className
+  }, component);
+};
+export default CustomByStatusElement;

package/dist/es2019/view/FlexibleCard/components/elements/index.js

@@ -32,4 +32,6 @@ export { default as TargetBranch } from './target-branch-element';
 export { default as Title } from './title-element';
 export { default as ViewCount } from './view-count-element';
 export { default as VoteCount } from './vote-count-element';
-export { default as AppliedToComponentsCount } from './applied-to-components-count-element';
+export { default as AppliedToComponentsCount } from './applied-to-components-count-element';
+export { default as CustomByAccessTypeElement } from './custom-by-access-type-element';
+export { default as CustomByStatusElement } from './custom-by-status-element';

package/dist/es2019/view/FlexibleCard/components/elements/owned-by-element/index.js

@@ -5,9 +5,15 @@ import { ElementName } from '../../../../../constants';
 import { messages } from '../../../../../messages';
 import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
 import { BaseTextElement, toFormattedTextProps } from '../common';
+const getOwnedByText = (context, textPrefix) => {
+  if (!fg('bandicoots-smart-card-teamwork-context')) {
+    return context.ownedBy;
+  }
+  return textPrefix ? `${textPrefix} ${context.ownedBy}`.trim() : context.ownedBy;
+};
 const OwnedByElement = props => {
   const context = useFlexibleUiContext();
-  const data = context ? toFormattedTextProps(messages.owned_by, context.ownedBy) : null;
+  const data = context ? toFormattedTextProps(messages.owned_by, getOwnedByText(context, props === null || props === void 0 ? void 0 : props.textPrefix)) : null;
   const {
     onRender,
     ...restProps

package/dist/es2019/view/FlexibleCard/external.js

@@ -49,18 +49,22 @@ export const ModifiedOnElement = props => {
     return /*#__PURE__*/React.createElement(ModifiedOn, {
       hideDatePrefix: props === null || props === void 0 ? void 0 : props.hideDatePrefix,
       color: props === null || props === void 0 ? void 0 : props.color,
-      onRender: props === null || props === void 0 ? void 0 : props.onRender
+      onRender: props === null || props === void 0 ? void 0 : props.onRender,
+      fontSize: props === null || props === void 0 ? void 0 : props.fontSize
     });
   }
   return /*#__PURE__*/React.createElement(ModifiedOn, null);
 };
 export const OwnedByElement = props => {
   if (fg('platform-linking-additional-flexible-element-props')) {
-    return /*#__PURE__*/React.createElement(OwnedBy, {
+    return /*#__PURE__*/React.createElement(OwnedBy, _extends({
       hideFormat: props === null || props === void 0 ? void 0 : props.hideFormat,
       color: props === null || props === void 0 ? void 0 : props.color,
       onRender: props === null || props === void 0 ? void 0 : props.onRender
-    });
+    }, fg('bandicoots-smart-card-teamwork-context') ? {
+      textPrefix: props === null || props === void 0 ? void 0 : props.textPrefix,
+      fontSize: props === null || props === void 0 ? void 0 : props.fontSize
+    } : undefined));
   }
   return /*#__PURE__*/React.createElement(OwnedBy, null);
 };
@@ -108,7 +112,10 @@ export const TitleElement = props => /*#__PURE__*/React.createElement(Title, _ex
   hideTooltip: props === null || props === void 0 ? void 0 : props.hideTooltip,
   maxLines: props === null || props === void 0 ? void 0 : props.maxLines,
   target: props === null || props === void 0 ? void 0 : props.target
-}, props !== null && props !== void 0 && props.text ? {
+}, fg('bandicoots-smart-card-teamwork-context') ? {
+  theme: props === null || props === void 0 ? void 0 : props.theme,
+  size: props === null || props === void 0 ? void 0 : props.size
+} : undefined, props !== null && props !== void 0 && props.text ? {
   text: props === null || props === void 0 ? void 0 : props.text
 } : undefined));
 export const ViewCountElement = () => /*#__PURE__*/React.createElement(ViewCount, null);
@@ -131,4 +138,5 @@ export const CustomAction = props => /*#__PURE__*/React.createElement(CustomActi
 export const DownloadAction = props => /*#__PURE__*/React.createElement(DownloadActionComponent, toActionProps(props));
 export const FollowAction = props => /*#__PURE__*/React.createElement(FollowActionComponent, toActionProps(props));
 export const PreviewAction = props => /*#__PURE__*/React.createElement(PreviewActionComponent, toActionProps(props));
-export const UnresolvedAction = () => /*#__PURE__*/React.createElement(UnresolvedActionComponent, null);
+export const UnresolvedAction = () => /*#__PURE__*/React.createElement(UnresolvedActionComponent, null);
+export { CustomByAccessTypeElement, CustomByStatusElement } from './components/elements';