@atlaskit/smart-card 45.20.6 → 45.21.0

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

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getContextByStatus = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _constants = require("../../constants");
+var _flexible = _interopRequireDefault(require("../../extractors/flexible"));
+var _extractHostName = require("../../extractors/flexible/extract-host-name");
+var _extractLinkTitle = _interopRequireDefault(require("../../extractors/flexible/extract-link-title"));
+var _extractProvider = _interopRequireDefault(require("../../extractors/flexible/extract-provider"));
+var _extractSmartLinkPreviewImage = require("../../extractors/flexible/extract-smart-link-preview-image");
+var _extractErrorIcon = require("../../extractors/flexible/icon/extract-error-icon");
+var _getRetryOptions = require("./getRetryOptions");
+var getContextByStatus = exports.getContextByStatus = function getContextByStatus(params) {
+  var _response$meta;
+  var _ref = params !== null && params !== void 0 ? params : {},
+    onClick = _ref.onClick,
+    response = _ref.response,
+    status = _ref.status,
+    url = _ref.url;
+  switch (status) {
+    case _constants.SmartLinkStatus.Pending:
+    case _constants.SmartLinkStatus.Resolving:
+      return {
+        linkTitle: (0, _extractLinkTitle.default)(status, url, response, onClick),
+        url: url
+      };
+    case _constants.SmartLinkStatus.Resolved:
+      return (0, _flexible.default)(params);
+    case _constants.SmartLinkStatus.Unauthorized:
+    case _constants.SmartLinkStatus.Forbidden:
+    case _constants.SmartLinkStatus.NotFound:
+    case _constants.SmartLinkStatus.Errored:
+    case _constants.SmartLinkStatus.Fallback:
+    default:
+      return {
+        url: url,
+        linkIcon: (0, _extractErrorIcon.extractErrorIcon)(response, status),
+        linkTitle: (0, _extractLinkTitle.default)(status, url, response, onClick),
+        preview: (0, _extractSmartLinkPreviewImage.extractSmartLinkPreviewImage)(response),
+        provider: (0, _extractProvider.default)(response),
+        actions: (0, _defineProperty2.default)({}, _constants.InternalActionName.UnresolvedAction, (0, _getRetryOptions.getRetryOptions)(url, status, response, params.onAuthorize)),
+        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
+        },
+        hostName: (0, _extractHostName.extractHostName)(response)
+      };
+  }
+};

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

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getRetryOptions = void 0;
+var _extractSmartLinkProvider = require("@atlaskit/link-extractors/extract-smart-link-provider");
+var _fg = require("@atlaskit/platform-feature-flags/fg");
+var _constants = require("../../constants");
+var _extractAccessContext = require("../../extractors/common/context/extractAccessContext");
+var _messages = require("../../messages");
+var _handleOnClick = require("../../utils/handle-on-click");
+var _getForbiddenJsonLd = require("../../utils/get-forbidden-json-ld");
+var getForbiddenMessageKey = function getForbiddenMessageKey(meta) {
+  var _meta$requestAccess;
+  var accessType = meta === null || meta === void 0 || (_meta$requestAccess = meta.requestAccess) === null || _meta$requestAccess === void 0 ? void 0 : _meta$requestAccess.accessType;
+  switch (accessType) {
+    case 'DIRECT_ACCESS':
+      return (0, _fg.fg)('confluence-issue-terminology-refresh') ? 'join_to_viewIssueTermRefresh' : 'join_to_view';
+    case 'REQUEST_ACCESS':
+      return (0, _fg.fg)('confluence-issue-terminology-refresh') ? 'request_access_to_viewIssueTermRefresh' : 'request_access_to_view';
+    case 'PENDING_REQUEST_EXISTS':
+      return 'pending_request';
+    case 'FORBIDDEN':
+      return 'forbidden_access';
+    case 'DENIED_REQUEST_EXISTS':
+      return 'request_denied';
+    default:
+      return 'restricted_link';
+  }
+};
+var getRetryOptions = exports.getRetryOptions = function getRetryOptions(url, status, response, onAuthorize) {
+  var _response$meta, _access$action, _access$buttonDisable;
+  var provider = (0, _extractSmartLinkProvider.extractSmartLinkProvider)(response);
+  var context = provider === null || provider === void 0 ? void 0 : provider.text;
+  var values = context ? {
+    context: context
+  } : 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, _getForbiddenJsonLd.getForbiddenJsonLd)().meta;
+      var access = (0, _extractAccessContext.extractRequestAccessContextImproved)({
+        jsonLd: meta,
+        url: url,
+        product: context !== null && context !== void 0 ? context : ''
+      });
+      var messageKey = getForbiddenMessageKey(meta);
+      var descriptor = _messages.messages[messageKey];
+      var retry = onAuthorize || (access === null || access === void 0 || (_access$action = access.action) === null || _access$action === void 0 ? void 0 : _access$action.promise);
+      var onClick = retry && !((_access$buttonDisable = access === null || access === void 0 ? void 0 : access.buttonDisabled) !== null && _access$buttonDisable !== void 0 ? _access$buttonDisable : false) ? (0, _handleOnClick.handleOnClick)(retry) : undefined;
+      return {
+        descriptor: descriptor,
+        onClick: onClick,
+        values: values
+      };
+    case _constants.SmartLinkStatus.Unauthorized:
+      return onAuthorize ? {
+        descriptor: _messages.messages.connect_link_account_card_name,
+        onClick: (0, _handleOnClick.handleOnClick)(onAuthorize),
+        values: values
+      } : undefined;
+    case _constants.SmartLinkStatus.NotFound:
+      return {
+        descriptor: _messages.messages.cannot_find_link
+      };
+  }
+};

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

@@ -21,7 +21,7 @@ var _useResolve = _interopRequireDefault(require("../../state/hooks/use-resolve"
 var _useRovoConfig = _interopRequireDefault(require("../../state/hooks/use-rovo-config"));
 var _useSmartLinkCrossProductUrlWrapper = require("../../state/hooks/use-smart-link-cross-product-url-wrapper");
 var _container = _interopRequireDefault(require("./components/container"));
-var _utils = require("./utils");
+var _getContextByStatus = require("./getContextByStatus");
 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); }
 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; }
@@ -85,7 +85,7 @@ var FlexibleCard = function FlexibleCard(_ref) {
   }, [placeholderData, status]);
   var placeHolderStatus = placeholderCardState ? placeholderCardState.status : undefined;
   var context = (0, _react.useMemo)(function () {
-    return (0, _utils.getContextByStatus)(_objectSpread(_objectSpread({
+    return (0, _getContextByStatus.getContextByStatus)(_objectSpread(_objectSpread({
       aiSummaryConfig: aiSummaryConfig,
       appearance: appearance,
       fireEvent: fireEvent,

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

@@ -0,0 +1,63 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HoverCard = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactErrorBoundary = require("react-error-boundary");
+var _reactMagneticDi = require("react-magnetic-di");
+var _withAnalyticsEvents = _interopRequireDefault(require("@atlaskit/analytics-next/withAnalyticsEvents"));
+var _useAnalyticsEvents2 = require("../../common/analytics/generated/use-analytics-events");
+var _constants = require("../../constants");
+var _failUfoExperience = require("../../state/analytics/failUfoExperience");
+var _startUfoExperience = require("../../state/analytics/startUfoExperience");
+var _SmartLinkModalProvider = require("../../state/modal/SmartLinkModalProvider");
+var _useSmartLinkAnalyticsContext = require("../../utils/analytics/useSmartLinkAnalyticsContext");
+var _HoverCardComponent = require("./components/HoverCardComponent");
+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); }
+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 HoverCardWithErrorBoundary = function HoverCardWithErrorBoundary(props) {
+  var _useAnalyticsEvents = (0, _useAnalyticsEvents2.useAnalyticsEvents)(),
+    fireEvent = _useAnalyticsEvents.fireEvent;
+  var url = props.url,
+    id = props.id,
+    children = props.children;
+  var analyticsContext = (0, _useSmartLinkAnalyticsContext.useSmartLinkAnalyticsContext)({
+    display: _constants.CardDisplay.HoverCardPreview,
+    id: id,
+    source: _HoverCardComponent.HOVER_CARD_SOURCE,
+    url: url
+  });
+  var onError = (0, _react.useCallback)(function (error, info) {
+    (0, _startUfoExperience.startUfoExperience)('smart-link-rendered', id || 'NULL');
+    (0, _failUfoExperience.failUfoExperience)('smart-link-rendered', id || 'NULL');
+    (0, _failUfoExperience.failUfoExperience)('smart-link-authenticated', id || 'NULL');
+    fireEvent('ui.smartLink.renderFailed', _objectSpread(_objectSpread({}, analyticsContext === null || analyticsContext === void 0 ? void 0 : analyticsContext.attributes), {}, {
+      display: _constants.CardDisplay.HoverCardPreview,
+      id: id !== null && id !== void 0 ? id : null,
+      error: error,
+      errorInfo: info
+    }));
+  }, [analyticsContext, id, fireEvent]);
+  return /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
+    fallback: children,
+    onError: onError
+  }, /*#__PURE__*/_react.default.createElement(_SmartLinkModalProvider.SmartLinkModalProvider, null, /*#__PURE__*/_react.default.createElement(_HoverCardComponent.HoverCardComponent, props, children)));
+};
+var HoverCardWithoutAnalyticsContext = (0, _withAnalyticsEvents.default)()(HoverCardWithErrorBoundary);
+
+/**
+ * A hover preview component using within smart links,
+ * e.g. inline card's hover preview and auth tooltip, flexible card's hover preview.
+ *
+ * This component contains additional props that smart-card internal components
+ * use to configure hover preview behaviour.
+ */
+var HoverCard = exports.HoverCard = function HoverCard(props) {
+  return /*#__PURE__*/_react.default.createElement(HoverCardWithoutAnalyticsContext, props);
+};

package/dist/cjs/view/HoverCard/StandaloneHoverCard.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StandaloneHoverCard = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _HoverCard = require("./HoverCard");
+/**
+ * A standalone hover preview component
+ */
+var StandaloneHoverCard = exports.StandaloneHoverCard = function StandaloneHoverCard(props) {
+  return /*#__PURE__*/_react.default.createElement(_HoverCard.HoverCard, props);
+};

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

@@ -4,15 +4,11 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.createCustomPopupContainer = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+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 _excluded = ["children", "shouldFitContainer", "shouldRenderToParent"],
-  _excluded2 = ["children", "shouldFitContainer", "shouldRenderToParent"];
-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 _excluded = ["children", "shouldFitContainer", "shouldRenderToParent"];
 /**
  * The purpose of this component is to hide the default Popup border.
  * HoverCard border implementation is in ContentContainer where it can
@@ -27,26 +23,4 @@ var CustomPopupContainer = /*#__PURE__*/_react.default.forwardRef(function (_ref
     ref: ref
   }), children);
 });
-
-/**
- * Factory function to create a CustomPopupContainer with a specific z-index
- */
-var createCustomPopupContainer = exports.createCustomPopupContainer = function createCustomPopupContainer(zIndex) {
-  return /*#__PURE__*/_react.default.forwardRef(
-  // FIXME: ...props spreads all props to the div, including isReferenceHidden, which is not a valid prop for a div.
-  // Find another way but adding exceptions with _, __, ___ etc.
-  function (_ref2, ref) {
-    var children = _ref2.children,
-      _ = _ref2.shouldFitContainer,
-      __ = _ref2.shouldRenderToParent,
-      props = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
-    return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, props, {
-      ref: ref
-    }, zIndex !== undefined && {
-      style: _objectSpread(_objectSpread({}, props.style), {}, {
-        zIndex: zIndex
-      })
-    }), children);
-  });
-};
 var _default = exports.default = CustomPopupContainer;

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

@@ -16,11 +16,11 @@ var _constants = require("../../../constants");
 var _actions = require("../../../state/actions");
 var _renderers = require("../../../state/renderers");
 var _store = require("../../../state/store");
-var _utils = require("../../../utils");
+var _noop = require("../../../utils/noop");
 var _SmartLinkAnalyticsContext = require("../../../utils/analytics/SmartLinkAnalyticsContext");
-var _CustomPopupContainer = require("../components/CustomPopupContainer");
 var _HoverCardContent = _interopRequireDefault(require("../components/HoverCardContent"));
 var _styled = require("../styled");
+var _createCustomPopupContainer = require("./createCustomPopupContainer");
 var _excluded = ["aria-haspopup", "aria-expanded", "aria-controls"];
 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 HOVER_CARD_SOURCE = exports.HOVER_CARD_SOURCE = 'smartLinkPreviewHoverCard';
@@ -254,8 +254,8 @@ var HoverCardComponent = exports.HoverCardComponent = function HoverCardComponen
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
       ,
       className: HOVER_CARD_TRIGGER_WRAPPER,
-      onFocus: _utils.noop,
-      onBlur: _utils.noop,
+      onFocus: _noop.noop,
+      onBlur: _noop.noop,
       role: "none"
     }), children));
   }, [children, initHideCard, initShowCard, onChildClick, onContextMenuClick, setMousePosition, handleKeyDown]);
@@ -263,7 +263,7 @@ var HoverCardComponent = exports.HoverCardComponent = function HoverCardComponen
   // Within the Popup component, if shouldRenderToParent, the zIndex prop is ignored
   // as it is assumed that the custom popup container has the desired styles
   function () {
-    return (0, _CustomPopupContainer.createCustomPopupContainer)(shouldRenderToParent ? zIndex : undefined);
+    return (0, _createCustomPopupContainer.createCustomPopupContainer)(shouldRenderToParent ? zIndex : undefined);
   }, [zIndex, shouldRenderToParent]);
   return /*#__PURE__*/_react.default.createElement(_popup.Popup, {
     testId: "hover-card",

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

@@ -11,22 +11,26 @@ var _react = _interopRequireWildcard(require("react"));
 var _AnalyticsContext = _interopRequireDefault(require("@atlaskit/analytics-next/AnalyticsContext"));
 var _useAnalyticsEvents2 = require("@atlaskit/analytics-next/useAnalyticsEvents");
 var _linkProvider = require("@atlaskit/link-provider");
-var _fg = require("@atlaskit/platform-feature-flags/fg");
 var _componentWithCondition = require("@atlaskit/platform-feature-flags-react/component-with-condition");
 var _functionUnionWithCondition = require("@atlaskit/platform-feature-flags-react/function-union-with-condition");
+var _fg = require("@atlaskit/platform-feature-flags/fg");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _useAnalyticsEvents3 = require("../../../common/analytics/generated/use-analytics-events");
 var _constants = require("../../../constants");
-var _helpers = require("../../../state/helpers");
+var _getClickUrl2 = require("../../../state/getClickUrl");
+var _getDefinitionId = require("../../../state/getDefinitionId");
+var _getExtensionKey = require("../../../state/getExtensionKey");
+var _getServices = require("../../../state/getServices");
 var _useRovoConfig2 = _interopRequireDefault(require("../../../state/hooks/use-rovo-config"));
 var _useSmartLinkCrossProductUrlWrapper = require("../../../state/hooks/use-smart-link-cross-product-url-wrapper");
 var _store = require("../../../state/store");
-var _utils = require("../../../utils");
-var _aiSummary = require("../../../utils/ai-summary");
-var _click = require("../../../utils/analytics/click");
-var _clickHelpers = require("../../../utils/click-helpers");
+var _isSpecialEvent = require("../../../utils/is-special-event");
+var _fireLinkClickedEvent = require("../../../utils/analytics/fireLinkClickedEvent");
+var _getAnchorAttributesFromEvent = require("../../../utils/get-anchor-attributes-from-event");
+var _getIsAiSummaryEnabled = require("../../../utils/get-is-ai-summary-enabled");
+var _updateAnchorHref = require("../../../utils/update-anchor-href");
 var _styled = require("../styled");
-var _utils2 = require("../utils");
+var _utils = require("../utils");
 var _ContentContainer = _interopRequireDefault(require("./ContentContainer"));
 var _forbidden = _interopRequireDefault(require("./views/forbidden"));
 var _resolved = _interopRequireDefault(require("./views/resolved"));
@@ -46,7 +50,7 @@ var useIsResolvedView = function useIsResolvedView(_ref) {
 var useServices = function useServices(_ref2) {
   var url = _ref2.url;
   var linkState = (0, _store.useSmartCardState)(url);
-  var services = (0, _helpers.getServices)(linkState.details);
+  var services = (0, _getServices.getServices)(linkState.details);
   return services;
 };
 var useIsUnauthorisedView = function useIsUnauthorisedView(_ref3) {
@@ -83,18 +87,18 @@ var HoverCardContent = function HoverCardContent(_ref4) {
   var _useAnalyticsEvents = (0, _useAnalyticsEvents3.useAnalyticsEvents)(),
     fireEvent = _useAnalyticsEvents.fireEvent;
   var extensionKey = (0, _react.useMemo)(function () {
-    return (0, _helpers.getExtensionKey)(cardState.details);
+    return (0, _getExtensionKey.getExtensionKey)(cardState.details);
   }, [cardState.details]);
   var linkState = (0, _store.useSmartCardState)(url);
   var linkStatus = (_linkState$status = linkState.status) !== null && _linkState$status !== void 0 ? _linkState$status : 'pending';
   var definitionId = (0, _react.useMemo)(function () {
-    return (0, _helpers.getDefinitionId)(cardState.details);
+    return (0, _getDefinitionId.getDefinitionId)(cardState.details);
   }, [cardState.details]);
   var _useSmartLinkContext = (0, _linkProvider.useSmartLinkContext)(),
     isAdminHubAIEnabled = _useSmartLinkContext.isAdminHubAIEnabled,
     product = _useSmartLinkContext.product;
-  var isAISummaryEnabled = (0, _aiSummary.getIsAISummaryEnabled)(isAdminHubAIEnabled, cardState.details);
-  var services = (0, _helpers.getServices)(linkState.details);
+  var isAISummaryEnabled = (0, _getIsAiSummaryEnabled.getIsAISummaryEnabled)(isAdminHubAIEnabled, cardState.details);
+  var services = (0, _getServices.getServices)(linkState.details);
   var appendCrossProductAnalyticsParams = (0, _useSmartLinkCrossProductUrlWrapper.useSmartLinkCrossProductUrlWrapperGated)({
     details: linkState.details
   });
@@ -141,7 +145,7 @@ var HoverCardContent = function HoverCardContent(_ref4) {
   var getDestinationUrl = (0, _react.useCallback)(function () {
     var _getClickUrl, _appendCrossProductAn;
     // FIXME: destinationUrl should be rendered in the DOM anchor href instead of derived at click time
-    var preferredUrl = (_getClickUrl = (0, _helpers.getClickUrl)(url, linkState.details)) !== null && _getClickUrl !== void 0 ? _getClickUrl : url;
+    var preferredUrl = (_getClickUrl = (0, _getClickUrl2.getClickUrl)(url, linkState.details)) !== null && _getClickUrl !== void 0 ? _getClickUrl : url;
     return (_appendCrossProductAn = appendCrossProductAnalyticsParams(preferredUrl)) !== null && _appendCrossProductAn !== void 0 ? _appendCrossProductAn : preferredUrl;
   }, [appendCrossProductAnalyticsParams, linkState.details, url]);
 
@@ -149,14 +153,14 @@ var HoverCardContent = function HoverCardContent(_ref4) {
   // Scope is limited to 3P click analytics to keep the experiment focused.
   var onAuxClick = (0, _react.useCallback)(function (event) {
     var destinationUrl = getDestinationUrl();
-    (0, _clickHelpers.updateAnchorHref)(event, destinationUrl);
+    (0, _updateAnchorHref.updateAnchorHref)(event, destinationUrl);
   }, [getDestinationUrl]);
 
   // Right-click handler to trigger fire3PClickEvent on right-clicks.
   // Scope is limited to 3P click analytics to keep the experiment focused.
   var onContextMenu = (0, _react.useCallback)(function (event) {
     var destinationUrl = getDestinationUrl();
-    (0, _clickHelpers.updateAnchorHref)(event, destinationUrl);
+    (0, _updateAnchorHref.updateAnchorHref)(event, destinationUrl);
   }, [getDestinationUrl]);
   var onClick = (0, _react.useCallback)(function (event) {
     if ((0, _fg.fg)('platform_smartlink_xpc_url_wrapping')) {
@@ -166,23 +170,23 @@ var HoverCardContent = function HoverCardContent(_ref4) {
       // server-side. Falls back to the original `url` prop if the event target is
       // not an anchor element.
       event.preventDefault();
-      var _getAnchorAttributesF = (0, _clickHelpers.getAnchorAttributesFromEvent)(event),
+      var _getAnchorAttributesF = (0, _getAnchorAttributesFromEvent.getAnchorAttributesFromEvent)(event),
         target = _getAnchorAttributesF.target;
       var destinationUrl = getDestinationUrl();
-      (0, _clickHelpers.updateAnchorHref)(event, destinationUrl);
+      (0, _updateAnchorHref.updateAnchorHref)(event, destinationUrl);
       window.open(destinationUrl, target);
     }
-    var isModifierKeyPressed = (0, _utils.isSpecialEvent)(event);
+    var isModifierKeyPressed = (0, _isSpecialEvent.isSpecialEvent)(event);
     fireEvent('ui.smartLink.clicked.titleGoToLink', {
       id: id,
       display: _constants.CardDisplay.HoverCardPreview,
       isModifierKeyPressed: isModifierKeyPressed,
       definitionId: definitionId !== null && definitionId !== void 0 ? definitionId : null
     });
-    (0, _click.fireLinkClickedEvent)(createAnalyticsEvent)(event);
+    (0, _fireLinkClickedEvent.fireLinkClickedEvent)(createAnalyticsEvent)(event);
   }, [createAnalyticsEvent, getDestinationUrl, id, fireEvent, definitionId]);
   var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
-  var _getMetadata = (0, _utils2.getMetadata)(extensionKey, data),
+  var _getMetadata = (0, _utils.getMetadata)(extensionKey, data),
     subtitle = _getMetadata.subtitle;
   var titleMaxLines = subtitle && subtitle.length > 0 ? 1 : 2;
   var titleBlockProps = {

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

@@ -9,8 +9,8 @@ exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
-var _extractPreview = require("../../../extractors/flexible/extract-preview");
-var _blocks = require("../../FlexibleCard/components/blocks");
+var _extractSmartLinkPreviewImage = require("../../../extractors/flexible/extract-smart-link-preview-image");
+var _previewBlock = _interopRequireDefault(require("../../FlexibleCard/components/blocks/preview-block"));
 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); }
 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; }
@@ -55,7 +55,7 @@ var ImagePreview = function ImagePreview(_ref) {
   var onPreviewTransitionEnd = (0, _react.useCallback)(function () {
     setShowPreview(false);
   }, []);
-  return showPreview && (0, _extractPreview.extractSmartLinkPreviewImage)(response) ? /*#__PURE__*/_react.default.createElement(_blocks.PreviewBlock, {
+  return showPreview && (0, _extractSmartLinkPreviewImage.extractSmartLinkPreviewImage)(response) ? /*#__PURE__*/_react.default.createElement(_previewBlock.default, {
     onError: onPreviewError,
     ignoreContainerPadding: true,
     onTransitionEnd: onPreviewTransitionEnd,

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

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createCustomPopupContainer = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _excluded = ["children", "shouldFitContainer", "shouldRenderToParent"];
+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; }
+/**
+ * Factory function to create a CustomPopupContainer with a specific z-index
+ */
+var createCustomPopupContainer = exports.createCustomPopupContainer = function createCustomPopupContainer(zIndex) {
+  return /*#__PURE__*/_react.default.forwardRef(
+  // FIXME: ...props spreads all props to the div, including isReferenceHidden, which is not a valid prop for a div.
+  // Find another way but adding exceptions with _, __, ___ etc.
+  function (_ref, ref) {
+    var children = _ref.children,
+      _ = _ref.shouldFitContainer,
+      __ = _ref.shouldRenderToParent,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+    return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, props, {
+      ref: ref
+    }, zIndex !== undefined && {
+      style: _objectSpread(_objectSpread({}, props.style), {}, {
+        zIndex: zIndex
+      })
+    }), children);
+  });
+};

package/dist/cjs/view/HoverCard/components/views/forbidden/index.js

@@ -19,7 +19,8 @@ var _extractAccessContext = require("../../../../../extractors/common/context/ex
 var _extractHostname = _interopRequireDefault(require("../../../../../extractors/common/hostname/extractHostname"));
 var _messages = require("../../../../../messages");
 var _FlexibleCard = _interopRequireDefault(require("../../../../FlexibleCard"));
-var _blocks = require("../../../../FlexibleCard/components/blocks");
+var _block = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/block"));
+var _previewBlock = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/preview-block"));
 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 titleBlockStyles = null;
 var mainTextStyles = null;
@@ -52,18 +53,18 @@ var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
   }
   return /*#__PURE__*/React.createElement(_FlexibleCard.default, (0, _extends2.default)({}, flexibleCardProps, {
     testId: testId
-  }), /*#__PURE__*/React.createElement(_blocks.PreviewBlock, {
+  }), /*#__PURE__*/React.createElement(_previewBlock.default, {
     ignoreContainerPadding: true,
     testId: testId,
     className: (0, _runtime.ax)(["_13li1mok _qrwq1mok _otyru2gc"])
-  }), /*#__PURE__*/React.createElement(_blocks.CustomBlock, {
+  }), /*#__PURE__*/React.createElement(_block.default, {
     testId: "".concat(testId, "-title"),
     className: (0, _runtime.ax)(["_1bah1h6o _k48p1pd9 _19pku2gc"])
   }, /*#__PURE__*/React.createElement(_reactIntl.FormattedMessage, (0, _extends2.default)({}, _messages.messages[titleMessageKey], {
     values: {
       product: product
     }
-  }))), /*#__PURE__*/React.createElement(_blocks.CustomBlock, {
+  }))), /*#__PURE__*/React.createElement(_block.default, {
     testId: "".concat(testId, "-content"),
     className: (0, _runtime.ax)(["_11c8wadc _1e0c1nu9 _1bah1h6o _19pkze3t _y3gn1h6o"])
   }, /*#__PURE__*/React.createElement(_reactIntl.FormattedMessage, (0, _extends2.default)({}, _messages.messages[descriptiveMessageKey], {
@@ -71,7 +72,7 @@ var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
       product: product,
       hostname: hostname
     }
-  }))), action && /*#__PURE__*/React.createElement(_blocks.CustomBlock, {
+  }))), action && /*#__PURE__*/React.createElement(_block.default, {
     className: (0, _runtime.ax)(["_1bah1h6o _19pku2gc"])
   }, /*#__PURE__*/React.createElement(_button.default, {
     testId: "".concat(testId, "-button"),

package/dist/cjs/view/HoverCard/components/views/resolved/index.js

@@ -14,10 +14,15 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactMagneticDi = require("react-magnetic-di");
 var _useAnalyticsEvents2 = require("../../../../../common/analytics/generated/use-analytics-events");
 var _constants = require("../../../../../constants");
-var _analytics = require("../../../../../state/analytics");
+var _succeedUfoExperience = require("../../../../../state/analytics/succeedUfoExperience");
 var _useAiSummaryAction = _interopRequireDefault(require("../../../../../state/hooks/use-ai-summary-action"));
 var _FlexibleCard = _interopRequireDefault(require("../../../../FlexibleCard"));
-var _blocks = require("../../../../FlexibleCard/components/blocks");
+var _actionBlock = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/action-block"));
+var _aiFooterBlock = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/ai-footer-block"));
+var _aiSummaryBlock = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/ai-summary-block"));
+var _metadataBlock = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/metadata-block"));
+var _snippetBlock = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/snippet-block"));
+var _titleBlock = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/title-block"));
 var _utils = require("../../../utils");
 var _ImagePreview = _interopRequireDefault(require("../../ImagePreview"));
 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); }
@@ -39,13 +44,13 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
   (0, _react.useEffect)(function () {
     // Since this hover view is only rendered on resolved status,
     // there is no need to check for statuses.
-    (0, _analytics.succeedUfoExperience)('smart-link-rendered', id || 'NULL', {
+    (0, _succeedUfoExperience.succeedUfoExperience)('smart-link-rendered', id || 'NULL', {
       extensionKey: extensionKey,
       display: _constants.CardDisplay.HoverCardPreview
     });
 
     // UFO will disregard this if authentication experience has not yet been started
-    (0, _analytics.succeedUfoExperience)('smart-link-authenticated', id || 'NULL', {
+    (0, _succeedUfoExperience.succeedUfoExperience)('smart-link-authenticated', id || 'NULL', {
       display: _constants.CardDisplay.HoverCardPreview
     });
     fireEvent('ui.smartLink.renderSuccess', {
@@ -68,31 +73,31 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
     fallbackElementHeight: snippetHeight.current,
     response: cardState.details
   });
-  var snippet = imagePreview ? null : /*#__PURE__*/_react.default.createElement(_blocks.SnippetBlock, {
+  var snippet = imagePreview ? null : /*#__PURE__*/_react.default.createElement(_snippetBlock.default, {
     className: (0, _runtime.ax)(["_ca0q1b66"])
   });
   var aiSummaryMinHeight = snippet ? snippetHeight.current : 0;
-  return /*#__PURE__*/_react.default.createElement(_FlexibleCard.default, flexibleCardProps, imagePreview, /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, (0, _extends2.default)({}, titleBlockProps, {
+  return /*#__PURE__*/_react.default.createElement(_FlexibleCard.default, flexibleCardProps, imagePreview, /*#__PURE__*/_react.default.createElement(_titleBlock.default, (0, _extends2.default)({}, titleBlockProps, {
     metadataPosition: _constants.SmartLinkPosition.Top,
     className: (0, _runtime.ax)(["_zulpu2gc _quenze3t _oebj1txw _13mh1pd9"])
-  })), /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, {
+  })), /*#__PURE__*/_react.default.createElement(_metadataBlock.default, {
     primary: primary,
     secondary: secondary,
     maxLines: 1,
     size: _constants.SmartLinkSize.Medium
-  }), isAISummaryEnabled ? /*#__PURE__*/_react.default.createElement(_blocks.AISummaryBlock, {
+  }), isAISummaryEnabled ? /*#__PURE__*/_react.default.createElement(_aiSummaryBlock.default, {
     aiSummaryMinHeight: aiSummaryMinHeight,
     placeholder: snippet
-  }) : snippet, /*#__PURE__*/_react.default.createElement(_blocks.SnippetBlock, {
+  }) : snippet, /*#__PURE__*/_react.default.createElement(_snippetBlock.default, {
     testId: "hidden-snippet",
     onRender: onSnippetRender,
     blockRef: snippetBlockRef,
     isHidden: true,
     className: (0, _runtime.ax)(["_3um015vq _kqswstnw"])
-  }), /*#__PURE__*/_react.default.createElement(_blocks.ActionBlock, {
+  }), /*#__PURE__*/_react.default.createElement(_actionBlock.default, {
     onClick: onActionClick,
     spaceInline: "space.100",
     className: (0, _runtime.ax)(["_n3td1b66"])
-  }), /*#__PURE__*/_react.default.createElement(_blocks.AIFooterBlock, null));
+  }), /*#__PURE__*/_react.default.createElement(_aiFooterBlock.default, null));
 };
 var _default = exports.default = HoverCardResolvedView;

package/dist/cjs/view/HoverCard/components/views/resolving/index.js

@@ -10,10 +10,10 @@ require("./index.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
-var _loadingSkeleton = require("../../../../common/loading-skeleton");
-var _blocks = require("../../../../FlexibleCard/components/blocks");
 var _actionGroup = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/action-group"));
+var _block = _interopRequireDefault(require("../../../../FlexibleCard/components/blocks/block"));
 var _common = require("../../../../FlexibleCard/components/elements/common");
+var _loadingSkeleton = require("../../../../common/loading-skeleton");
 var _styled = require("../../../styled");
 var loadingViewContainer = null;
 var skeletonContainer = null;
@@ -35,7 +35,7 @@ var HoverCardLoadingView = function HoverCardLoadingView(_ref) {
     className: (0, _runtime.ax)(["_1e0c1txw _2lx21bp4 _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi"])
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _runtime.ax)(["_zulpud5o _1e0c1txw _2lx21bp4 _4cvr1h6o"])
-  }, /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, (0, _extends2.default)({}, titleBlockProps, {
+  }, /*#__PURE__*/_react.default.createElement(_block.default, (0, _extends2.default)({}, titleBlockProps, {
     testId: "".concat(testId, "-title-block"),
     className: (0, _runtime.ax)(["_zulpu2gc _1bsb1osq"])
   }), /*#__PURE__*/_react.default.createElement(_common.BaseIconElement, {