@atlaskit/smart-card 38.3.0 → 38.4.2

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @atlaskit/smart-card
 
+## 38.4.2
+
+### Patch Changes
+
+- [#159004](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/159004)
+  [`350a4ab0a5375`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/350a4ab0a5375) -
+  Refactor FlexibleCard context, merge into one context
+
+## 38.4.1
+
+### Patch Changes
+
+- [#159077](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/159077)
+  [`6b2c9fe5e676b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6b2c9fe5e676b) -
+  Add anchor ref to smartlink link component
+
+## 38.4.0
+
+### Minor Changes
+
+- [#157647](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/157647)
+  [`dad03e6a309bb`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/dad03e6a309bb) -
+  Refactor FlexibleCard element directory
+
 ## 38.3.0
 
 ### Minor Changes

package/compass.yml

@@ -19,23 +19,11 @@ links:
   - name: '#help-twg-linking-platform'
     type: CHAT_CHANNEL
     url: 'https://atlassian.enterprise.slack.com/archives/CFKGAQZRV'
-  - name: 'On-Call Schedule'
+  - name: null
     type: ON_CALL
     url: 'https://atlassian.app.opsgenie.com/settings/schedule/detail/b9c8b313-dd6d-4a41-8eeb-d7a9df55be9d'
   - name: source code
     type: REPOSITORY
     url: 'https://bitbucket.org/atlassian/atlassian-frontend/src/master/packages/linking-platform/smart-card'
-customFields:
-  - name: 'FinOps_COGS_Cost_Center'
-    type: single_select
-    value: 'a681c808-9c58-45e5-9b3a-b5cc330c4b3a'
-  - name: 'FinOps_R&D_Cost_Center'
-    type: single_select
-    value: 'd9c71b12-1c77-4c68-a769-ba0e26bc8cac'
-  - name: 'FinOps_Service_Group'
-    type: single_select
-    value: '9120e03c-440b-489d-ac42-07903a2c611d'
-  - name: 'business-unit'
-    type: text
-    value: 'Eng - X Product Collab'
+customFields: []
 relationships: {}

package/dist/cjs/state/flexible-ui-context/index.js

@@ -3,22 +3,42 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useFlexibleUiOptionContext = exports.useFlexibleUiContext = exports.FlexibleUiOptionContext = exports.FlexibleUiContext = void 0;
+exports.useFlexibleUiOptionContext = exports.useFlexibleUiContext = exports.useFlexibleCardContext = exports.FlexibleUiOptionContext = exports.FlexibleUiContext = exports.FlexibleCardContext = void 0;
 var _react = require("react");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 /**
  * This provides the data that will be used by Smart Links Flexible UI to populate it's
  * underlying elements.
  */
+var FlexibleCardContext = exports.FlexibleCardContext = /*#__PURE__*/(0, _react.createContext)(undefined);
+var useFlexibleCardContext = exports.useFlexibleCardContext = function useFlexibleCardContext() {
+  return (0, _react.useContext)(FlexibleCardContext);
+};
+
+/**
+ * This provides the data that will be used by Smart Links Flexible UI to populate it's
+ * underlying elements.
+ * @deprecated Remove on cleanup of platform-linking-flexible-card-context
+ */
 var FlexibleUiContext = exports.FlexibleUiContext = /*#__PURE__*/(0, _react.createContext)(undefined);
 var useFlexibleUiContext = exports.useFlexibleUiContext = function useFlexibleUiContext() {
-  return (0, _react.useContext)(FlexibleUiContext);
+  var _useFlexibleCardConte;
+  return (0, _platformFeatureFlags.fg)('platform-linking-flexible-card-context') ? // eslint-disable-next-line react-hooks/rules-of-hooks
+  (_useFlexibleCardConte = useFlexibleCardContext()) === null || _useFlexibleCardConte === void 0 ? void 0 : _useFlexibleCardConte.data :
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  (0, _react.useContext)(FlexibleUiContext);
 };
 
 /**
  * This provides the ui options that will be used by Smart Links Flexible UI
  * to render its underlying elements.
+ * @deprecated Remove on cleanup of platform-linking-flexible-card-context
  */
 var FlexibleUiOptionContext = exports.FlexibleUiOptionContext = /*#__PURE__*/(0, _react.createContext)(undefined);
 var useFlexibleUiOptionContext = exports.useFlexibleUiOptionContext = function useFlexibleUiOptionContext() {
-  return (0, _react.useContext)(FlexibleUiOptionContext);
+  var _useFlexibleCardConte2;
+  return (0, _platformFeatureFlags.fg)('platform-linking-flexible-card-context') ? // eslint-disable-next-line react-hooks/rules-of-hooks
+  (_useFlexibleCardConte2 = useFlexibleCardContext()) === null || _useFlexibleCardConte2 === void 0 ? void 0 : _useFlexibleCardConte2.ui :
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  (0, _react.useContext)(FlexibleUiOptionContext);
 };

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.3.0"
+  packageVersion: "38.4.2"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/cjs/view/BlockCard/views/ErroredView.js

@@ -11,7 +11,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireWildcard(require("react"));
 var _warning = _interopRequireDefault(require("@atlaskit/icon/core/migration/warning"));
 var _messages = require("../../../messages");
-var _text = _interopRequireDefault(require("../../FlexibleCard/components/elements/text"));
+var _baseTextElement = _interopRequireDefault(require("../../FlexibleCard/components/elements/common/base-text-element"));
 var _RetryAction = require("../actions/RetryAction");
 var _unresolvedView = _interopRequireDefault(require("./unresolved-view"));
 var _withFlexibleUIBlockCardStyle = require("./utils/withFlexibleUIBlockCardStyle");
@@ -39,7 +39,7 @@ var ErroredView = function ErroredView(_ref) {
     color: "var(--ds-icon-warning, #E56910)",
     LEGACY_size: "small",
     testId: "".concat(testId, "-warning-icon")
-  }), /*#__PURE__*/_react.default.createElement(_text.default, {
+  }), /*#__PURE__*/_react.default.createElement(_baseTextElement.default, {
     maxLines: 3,
     message: {
       descriptor: _messages.messages.could_not_load_link

package/dist/cjs/view/BlockCard/views/ForbiddenView.js

@@ -25,7 +25,7 @@ var _extractHostname = _interopRequireDefault(require("../../../extractors/commo
 var _messages = require("../../../messages");
 var _intlUtils = require("../../../utils/intl-utils");
 var _jsonld = require("../../../utils/jsonld");
-var _text = _interopRequireDefault(require("../../FlexibleCard/components/elements/text"));
+var _baseTextElement = _interopRequireDefault(require("../../FlexibleCard/components/elements/common/base-text-element"));
 var _ForbiddenAction = require("../actions/ForbiddenAction");
 var _unresolvedView = _interopRequireDefault(require("./unresolved-view"));
 var _withFlexibleUIBlockCardStyle = require("./utils/withFlexibleUIBlockCardStyle");
@@ -98,7 +98,7 @@ var ForbiddenView = function ForbiddenView(_ref) {
     LEGACY_fallbackIcon: _lock.default,
     LEGACY_size: "small",
     testId: "".concat(testId, "-lock-icon")
-  }), /*#__PURE__*/React.createElement(_text.default, {
+  }), /*#__PURE__*/React.createElement(_baseTextElement.default, {
     maxLines: 3,
     message: {
       descriptor: (0, _intlUtils.toMessage)(_messages.messages.invalid_permissions_description, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.descriptiveMessageKey),

package/dist/cjs/view/BlockCard/views/NotFoundView.js

@@ -19,7 +19,7 @@ var _lock = _interopRequireDefault(require("@atlaskit/icon/glyph/lock"));
 var _linkExtractors = require("@atlaskit/link-extractors");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _messages = require("../../../messages");
-var _text = _interopRequireDefault(require("../../FlexibleCard/components/elements/text"));
+var _baseTextElement = _interopRequireDefault(require("../../FlexibleCard/components/elements/common/base-text-element"));
 var _unresolvedView = _interopRequireDefault(require("./unresolved-view"));
 var _withFlexibleUIBlockCardStyle = require("./utils/withFlexibleUIBlockCardStyle");
 var _excluded = ["testId"];
@@ -63,7 +63,7 @@ var NotFoundView = function NotFoundView(_ref) {
     LEGACY_fallbackIcon: _lock.default,
     LEGACY_size: "small",
     testId: "".concat(testId, "-lock-icon")
-  }), /*#__PURE__*/React.createElement(_text.default, {
+  }), /*#__PURE__*/React.createElement(_baseTextElement.default, {
     message: description,
     testId: "".concat(testId, "-message"),
     maxLines: 3,

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

@@ -15,7 +15,7 @@ var _tokens = require("@atlaskit/tokens");
 var _constants = require("../../constants");
 var _useInvokeClientAction = _interopRequireDefault(require("../../state/hooks/use-invoke-client-action"));
 var _utils = require("../../utils");
-var _icon = _interopRequireDefault(require("../FlexibleCard/components/elements/icon"));
+var _iconElement = _interopRequireDefault(require("../FlexibleCard/components/elements/icon-element"));
 var _analytics = _interopRequireDefault(require("./components/analytics"));
 var _embedContent = _interopRequireDefault(require("./components/embed-content"));
 var _errorBoundary = _interopRequireDefault(require("./components/error-boundary"));
@@ -114,7 +114,7 @@ var EmbedModal = function EmbedModal(_ref) {
     label: title
   } : {}), /*#__PURE__*/_react.default.createElement(_linkInfo.default, {
     icon: linkIcon && {
-      icon: /*#__PURE__*/_react.default.createElement(_icon.default, (0, _extends2.default)({}, linkIcon, {
+      icon: /*#__PURE__*/_react.default.createElement(_iconElement.default, (0, _extends2.default)({}, linkIcon, {
         size: _constants.SmartLinkSize.Large
       })),
       isFlexibleUi: true

package/dist/cjs/view/FlexibleCard/components/blocks/title-block/index.js

@@ -22,7 +22,7 @@ var _actionGroup = _interopRequireDefault(require("../action-group"));
 var _errored = _interopRequireDefault(require("./errored"));
 var _resolved = _interopRequireDefault(require("./resolved"));
 var _resolving = _interopRequireDefault(require("./resolving"));
-var _excluded = ["actions", "anchorTarget", "hideTitleTooltip", "maxLines", "onActionMenuOpenChange", "onClick", "status", "showActionOnHover", "testId", "text", "icon", "theme", "hideRetry", "metadataPosition", "hideIcon", "className"];
+var _excluded = ["actions", "anchorTarget", "hideTitleTooltip", "maxLines", "onActionMenuOpenChange", "onClick", "status", "showActionOnHover", "testId", "text", "icon", "theme", "hideRetry", "metadataPosition", "hideIcon", "className", "anchorRef"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var actionStyles = null;
@@ -76,6 +76,7 @@ var TitleBlock = function TitleBlock(_ref) {
     _ref$hideIcon = _ref.hideIcon,
     hideIcon = _ref$hideIcon === void 0 ? false : _ref$hideIcon,
     className = _ref.className,
+    anchorRef = _ref.anchorRef,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   if (!(0, _platformFeatureFlags.fg)('platform-linking-flexible-card-unresolved-action')) {
     if (hideRetry && props.retry) {
@@ -109,7 +110,8 @@ var TitleBlock = function TitleBlock(_ref) {
     onClick: onClick,
     onMouseDown: onMouseDown,
     target: anchorTarget,
-    theme: theme
+    theme: theme,
+    anchorRef: anchorRef
   }, overrideText));
   var Component = getTitleBlockViewComponent(status);
   return /*#__PURE__*/React.createElement(Component, (0, _extends2.default)({}, props, {

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

@@ -324,7 +324,11 @@ var Container = function Container(_ref5) {
     theme = _ref5$theme === void 0 ? _constants.SmartLinkTheme.Link : _ref5$theme;
   var padding = hidePadding ? (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') ? '0px' : '0rem' : getPadding(size);
   var gap = getGap(size);
-  var context = (0, _react.useContext)(_flexibleUiContext.FlexibleUiContext);
+  var context = (0, _platformFeatureFlags.fg)('platform-linking-flexible-card-context') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  (0, _flexibleUiContext.useFlexibleUiContext)() :
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  (0, _react.useContext)(_flexibleUiContext.FlexibleUiContext);
   var _getChildrenOptions = getChildrenOptions(children, context),
     previewOnLeft = _getChildrenOptions.previewOnLeft,
     previewOnRight = _getChildrenOptions.previewOnRight;

package/dist/cjs/view/FlexibleCard/components/elements/{applied-to-components-count → applied-to-components-count-element}/index.js

@@ -9,16 +9,21 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../../../../constants");
 var _messages = require("../../../../../messages");
 var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
-var _badge = _interopRequireDefault(require("../badge"));
+var _common = require("../common");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-var AppliedToComponentsCount = function AppliedToComponentsCount(props) {
+var AppliedToComponentsCountElement = function AppliedToComponentsCountElement(props) {
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
-  var context = (0, _react.useContext)(_flexibleUiContext.FlexibleUiContext);
+  var context = (0, _platformFeatureFlags.fg)('platform-linking-flexible-card-context') ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  (0, _flexibleUiContext.useFlexibleUiContext)() :
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  (0, _react.useContext)(_flexibleUiContext.FlexibleUiContext);
   if (
   // Check for null and undefined, render if it's 0.
   (context === null || context === void 0 ? void 0 : context.appliedToComponentsCount) === null || (context === null || context === void 0 ? void 0 : context.appliedToComponentsCount) === undefined) {
@@ -27,9 +32,9 @@ var AppliedToComponentsCount = function AppliedToComponentsCount(props) {
   var label = formatMessage(_messages.messages.compass_applied_components_count, {
     numberOfComponents: context.appliedToComponentsCount
   });
-  return /*#__PURE__*/_react.default.createElement(_badge.default, (0, _extends2.default)({
+  return /*#__PURE__*/_react.default.createElement(_common.BaseBadgeElement, (0, _extends2.default)({
     icon: _constants.IconType.Component,
     label: label
   }, props));
 };
-var _default = exports.default = AppliedToComponentsCount;
+var _default = exports.default = AppliedToComponentsCountElement;

package/dist/cjs/view/FlexibleCard/components/elements/{atlaskit-badge → atlaskit-badge-element}/index.js

@@ -25,7 +25,7 @@ var badgeStyles = null;
  * @see StoryPoints
  * */
 
-var AtlaskitBadge = function AtlaskitBadge(_ref) {
+var AtlaskitElementBadge = function AtlaskitElementBadge(_ref) {
   var value = _ref.value,
     name = _ref.name,
     className = _ref.className,
@@ -43,4 +43,4 @@ var AtlaskitBadge = function AtlaskitBadge(_ref) {
     className: (0, _runtime.ax)([!(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_4cvr1h6o _1e0c116y", (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_4cvr1h6o _1e0c116y _1ul91ns9", className])
   }), /*#__PURE__*/React.createElement(_badge.default, null, value));
 };
-var _default = exports.default = AtlaskitBadge;
+var _default = exports.default = AtlaskitElementBadge;

package/dist/cjs/view/FlexibleCard/components/elements/{avatar-group → common/base-avatar-group-element}/index.js

@@ -16,14 +16,13 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _reactIntlNext = require("react-intl-next");
 var _avatarGroup = _interopRequireDefault(require("@atlaskit/avatar-group"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _constants = require("../../../../../constants");
-var _messages = require("../../../../../messages");
-var _utils = require("../../utils");
+var _constants = require("../../../../../../constants");
+var _messages = require("../../../../../../messages");
+var _utils = require("../../../utils");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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 MAX_COUNT = 4;
 var styles = null;
 var stylesMap = {
   xlarge: "_1e0c116y _1kvxu2gc _102oidpf",
@@ -43,19 +42,18 @@ var getPersonNameWithPrefix = function getPersonNameWithPrefix(elementName, pers
       return personName;
   }
 };
-
 /**
  * A base element that displays a group of avatars.
  * @internal
- * @param {AvatarGroupProps} AvatarGroupProps - The props necessary for the AvatarGroup.
+ * @param {BaseAvatarGroupElementProps} BaseAvatarGroupElementProps - The props necessary for the AvatarGroup.
  * @see AuthorGroup
  * @see CollaboratorGroup
  */
-var AvatarGroup = function AvatarGroup(_ref) {
+var BaseAvatarGroup = function BaseAvatarGroup(_ref) {
   var _ref$items = _ref.items,
     items = _ref$items === void 0 ? [] : _ref$items,
     _ref$maxCount = _ref.maxCount,
-    maxCount = _ref$maxCount === void 0 ? MAX_COUNT : _ref$maxCount,
+    maxCount = _ref$maxCount === void 0 ? 4 : _ref$maxCount,
     name = _ref.name,
     className = _ref.className,
     _ref$size = _ref.size,
@@ -107,4 +105,4 @@ var AvatarGroup = function AvatarGroup(_ref) {
     testId: testId
   }));
 };
-var _default = exports.default = AvatarGroup;
+var _default = exports.default = BaseAvatarGroup;

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

@@ -12,14 +12,15 @@ var _runtime = require("@compiled/react/runtime");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
+var _linkingCommon = require("@atlaskit/linking-common");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
-var _constants = require("../../../../../constants");
-var _messages = require("../../../../../messages");
-var _atlaskitIcon = _interopRequireDefault(require("../../common/atlaskit-icon"));
-var _imageIcon = _interopRequireDefault(require("../../common/image-icon"));
-var _withOverrideCss = require("../../common/with-override-css");
-var _utils = require("../../utils");
+var _constants = require("../../../../../../constants");
+var _messages = require("../../../../../../messages");
+var _atlaskitIcon = _interopRequireDefault(require("../../../common/atlaskit-icon"));
+var _imageIcon = _interopRequireDefault(require("../../../common/image-icon"));
+var _withOverrideCss = require("../../../common/with-override-css");
+var _utils = require("../../../utils");
 var _messageMapper;
 /* eslint-disable @atlaskit/design-system/use-tokens-typography */
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -66,11 +67,10 @@ var renderImageIcon = function renderImageIcon(url, testId) {
     });
   }
 };
-
 /**
  * A base element that displays some text with an associated icon.
  * @internal
- * @param {BadgeProps} BadgeProps - The props necessary for the Badge.
+ * @param {BaseBadgeElementProps} BaseBadgeElementProps - The props necessary for the Badge.
  * @see CommentCount
  * @see ViewCount
  * @see ReactCount
@@ -80,7 +80,7 @@ var renderImageIcon = function renderImageIcon(url, testId) {
  * @see ProgrammingLanguage
  * @see Provider
  */
-var BadgeRefreshNew = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+var BaseBadgeRefreshNew = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var _ref$appearance = _ref.appearance,
     appearance = _ref$appearance === void 0 ? 'default' : _ref$appearance,
     _ref$hideIcon = _ref.hideIcon,
@@ -117,8 +117,8 @@ var BadgeRefreshNew = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
 });
 
 // On cleanup of platform-linking-visual-refresh-v1, this should become
-// export default withOverrideCss(Badge);
-var BadgeRefreshNewWithOverrideCss = (0, _withOverrideCss.withOverrideCss)(BadgeRefreshNew);
+// export default withOverrideCss(BaseBadgeElement);
+var BaseBadgeElementRefreshNewWithOverrideCss = (0, _withOverrideCss.withOverrideCss)(BaseBadgeRefreshNew);
 
 /**
  * A base element that displays some text with an associated icon.
@@ -133,7 +133,7 @@ var BadgeRefreshNewWithOverrideCss = (0, _withOverrideCss.withOverrideCss)(Badge
  * @see ProgrammingLanguage
  * @see Provider
  */
-var BadgeCompiledNew = function BadgeCompiledNew(_ref2) {
+var BaseBadgeElementCompiledNew = function BaseBadgeElementCompiledNew(_ref2) {
   var _ref2$hideIcon = _ref2.hideIcon,
     hideIcon = _ref2$hideIcon === void 0 ? false : _ref2$hideIcon,
     icon = _ref2.icon,
@@ -162,11 +162,6 @@ var BadgeCompiledNew = function BadgeCompiledNew(_ref2) {
     className: (0, _runtime.ax)(["_11c8dcr7 _syaz131l _19bv1xvx _s7n4nkob"])
   }, formattedMessageOrLabel));
 };
-var Badge = function Badge(props) {
-  if ((0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1')) {
-    return /*#__PURE__*/_react.default.createElement(BadgeRefreshNewWithOverrideCss, props);
-  } else {
-    return /*#__PURE__*/_react.default.createElement(BadgeCompiledNew, props);
-  }
-};
-var _default = exports.default = Badge;
+var _default = exports.default = (0, _linkingCommon.withFeatureFlaggedComponent)(BaseBadgeElementCompiledNew, BaseBadgeElementRefreshNewWithOverrideCss, function () {
+  return (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1');
+});

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

@@ -14,7 +14,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _intlUtils = require("@formatjs/intl-utils");
 var _reactIntlNext = require("react-intl-next");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _messages = require("../../../../../messages");
+var _messages = require("../../../../../../messages");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 // TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
@@ -34,16 +34,15 @@ var typeToDescriptorMap = {
     absolute: _messages.messages.sent_on_absolute
   }
 };
-
 /**
  * A base element that displays an ISO Timestamp in text.
  * @internal
- * @param {DateTimeProps} DateTimeProps - The props necessary for the DateTime element.
+ * @param {BaseDateTimeProps} BaseDateTimeProps - The props necessary for the DateTime element.
  * @see CreatedOn
  * @see ModifiedOn
  * @see SentOn
  */
-var DateTime = function DateTime(_ref) {
+var BaseDateTimeElement = function BaseDateTimeElement(_ref) {
   var date = _ref.date,
     name = _ref.name,
     className = _ref.className,
@@ -104,4 +103,4 @@ var DateTime = function DateTime(_ref) {
     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])
   }, content);
 };
-var _default = exports.default = DateTime;
+var _default = exports.default = BaseDateTimeElement;

package/dist/cjs/view/FlexibleCard/components/elements/{link → common/base-link-element}/index.js

@@ -12,9 +12,9 @@ var _runtime = require("@compiled/react/runtime");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
-var _constants = require("../../../../../constants");
-var _useLinkClicked = require("../../../../../state/analytics/useLinkClicked");
-var _utils = require("../../utils");
+var _constants = require("../../../../../../constants");
+var _useLinkClicked = require("../../../../../../state/analytics/useLinkClicked");
+var _utils = require("../../../utils");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /* eslint-disable @compiled/shorthand-property-sorting */
@@ -72,14 +72,13 @@ var themeStyleMap = {
   black: "_syaz1gjq _9oik1r31 _1bnx8stv _jf4cnqa1 _30l31gjq _9h8h1fxt",
   link: "_syaz14q2 _9oik1r31 _1bnx8stv _jf4cnqa1 _30l314q2 _9h8h16c2"
 };
-
 /**
  * A base element that represent an anchor.
  * @internal
- * @param {LinkProps} LinkProps - The props necessary for the Link element.
+ * @param {BaseLinkElementProps} BaseLinkElementProps - The props necessary for the Link element.
  * @see LinkIcon
  */
-var Link = function Link(_ref) {
+var BaseLinkElement = function BaseLinkElement(_ref) {
   var hideTooltip = _ref.hideTooltip,
     _ref$maxLines = _ref.maxLines,
     maxLines = _ref$maxLines === void 0 ? DEFAULT_MAX_LINES : _ref$maxLines,
@@ -95,7 +94,8 @@ var Link = function Link(_ref) {
     url = _ref.url,
     onClick = _ref.onClick,
     _ref$target = _ref.target,
-    target = _ref$target === void 0 ? '_blank' : _ref$target;
+    target = _ref$target === void 0 ? '_blank' : _ref$target,
+    anchorRef = _ref.anchorRef;
   var onMouseDown = (0, _useLinkClicked.useMouseDownEvent)();
   var hasSpace = (0, _react.useMemo)(function () {
     return text ? (0, _utils.hasWhiteSpace)(text) : false;
@@ -114,9 +114,11 @@ var Link = function Link(_ref) {
     // click issues in Confluence and Trello which rely on it not being set unless necessary.
   }, target !== '_self' && {
     target: target
+  }, {
+    ref: anchorRef
   }), text);
   return /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _runtime.ax)(["_16jlkb7n _1o9zkb7n _i0dl1wug"])
   }, hideTooltip || text === undefined ? anchor : withTooltip(anchor, text, testId));
 };
-var _default = exports.default = Link;
+var _default = exports.default = BaseLinkElement;

package/dist/cjs/view/FlexibleCard/components/elements/{lozenge → common/base-lozenge-element}/index.js

@@ -14,20 +14,19 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
+var _flexibleUiContext = require("../../../../../../state/flexible-ui-context");
 var _lozengeAction = _interopRequireDefault(require("./lozenge-action"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var stylesOld = null;
 var styles = null;
-
 /**
  * A base element that displays a Lozenge.
  * @internal
- * @param {LozengeProps} LozengeProps - The props necessary for the Lozenge element.
+ * @param {BaseLozengeElementProps} BaseLozengeElementProps - The props necessary for the Lozenge element.
  * @see State
  */
-var Lozenge = function Lozenge(_ref) {
+var BaseLozengeElement = function BaseLozengeElement(_ref) {
   var action = _ref.action,
     _ref$appearance = _ref.appearance,
     appearance = _ref$appearance === void 0 ? 'default' : _ref$appearance,
@@ -65,4 +64,4 @@ var Lozenge = function Lozenge(_ref) {
     className: (0, _runtime.ax)([!(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_1e0c116y _vwz41kw7", (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && "_1e0c116y _1ul91ns9", className])
   }), lozenge);
 };
-var _default = exports.default = Lozenge;
+var _default = exports.default = BaseLozengeElement;

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

@@ -13,13 +13,13 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = _interopRequireWildcard(require("react"));
 var _dropdownMenu = _interopRequireDefault(require("@atlaskit/dropdown-menu"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _useAnalyticsEvents2 = require("../../../../../../common/analytics/generated/use-analytics-events");
-var _extractLozengeActionItems = _interopRequireDefault(require("../../../../../../extractors/action/extract-lozenge-action-items"));
-var _useInvoke = _interopRequireDefault(require("../../../../../../state/hooks/use-invoke"));
-var _utils = require("../../../../../../state/hooks/use-invoke/utils");
-var _useResolve = _interopRequireDefault(require("../../../../../../state/hooks/use-resolve"));
-var _createStatusUpdateRequest = _interopRequireDefault(require("../../../../../../utils/actions/create-status-update-request"));
-var _analytics = require("../../../../../../utils/analytics/analytics");
+var _useAnalyticsEvents2 = require("../../../../../../../common/analytics/generated/use-analytics-events");
+var _extractLozengeActionItems = _interopRequireDefault(require("../../../../../../../extractors/action/extract-lozenge-action-items"));
+var _useInvoke = _interopRequireDefault(require("../../../../../../../state/hooks/use-invoke"));
+var _utils = require("../../../../../../../state/hooks/use-invoke/utils");
+var _useResolve = _interopRequireDefault(require("../../../../../../../state/hooks/use-resolve"));
+var _createStatusUpdateRequest = _interopRequireDefault(require("../../../../../../../utils/actions/create-status-update-request"));
+var _analytics = require("../../../../../../../utils/analytics/analytics");
 var _errorBoundary = _interopRequireDefault(require("./error-boundary"));
 var _lozengeActionAnalytics = require("./lozenge-action-analytics");
 var _lozengeActionError = _interopRequireDefault(require("./lozenge-action-error"));

package/dist/cjs/view/FlexibleCard/components/elements/{lozenge → common/base-lozenge-element}/lozenge-action/lozenge-action-error/index.js

@@ -16,10 +16,10 @@ var _dropdownMenu = require("@atlaskit/dropdown-menu");
 var _error = _interopRequireDefault(require("@atlaskit/icon/core/migration/error"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _colors = require("@atlaskit/theme/colors");
-var _useAnalyticsEvents2 = require("../../../../../../../common/analytics/generated/use-analytics-events");
-var _messages = require("../../../../../../../messages");
-var _useInvokeClientAction = _interopRequireDefault(require("../../../../../../../state/hooks/use-invoke-client-action"));
-var _utils = require("../../../../utils");
+var _useAnalyticsEvents2 = require("../../../../../../../../common/analytics/generated/use-analytics-events");
+var _messages = require("../../../../../../../../messages");
+var _useInvokeClientAction = _interopRequireDefault(require("../../../../../../../../state/hooks/use-invoke-client-action"));
+var _utils = require("../../../../../utils");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var MAX_LINE_NUMBER = 8;

package/dist/cjs/view/FlexibleCard/components/elements/{lozenge → common/base-lozenge-element}/lozenge-action/lozenge-action-error/types.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LozengeActionErrorMessages = void 0;
-var _messages = require("../../../../../../../messages");
+var _messages = require("../../../../../../../../messages");
 var LozengeActionErrorMessages = exports.LozengeActionErrorMessages = {
   noData: {
     descriptor: _messages.messages['status_change_permission_error']