@atlaskit/smart-card 44.7.0 → 44.7.1

package/dist/esm/state/hooks/use-social-proof-experiment/index.js

@@ -0,0 +1,41 @@
+import { useMemo } from 'react';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+import useSocialProof from '../use-social-proof';
+var TIER_THRESHOLD = 30;
+
+/**
+ * Returns enrollment and treatment state for the social proof unauth block card experiment.
+ *
+ * Delegates data-fetching to `useSocialProof` (Sasha's shared service layer),
+ * which handles cloudId resolution, TAP trait fetch, localStorage caching,
+ * request deduping, and sync reads.
+ *
+ * This hook adds the experiment/cohort layer on top:
+ * - Only fires exposure (via editorExperiment) when data has loaded.
+ * - Derives `tier` and `isTreatment` for rendering decisions.
+ *
+ * Expected to be called only inside the fg-enabled branch (via componentWithFG).
+ *
+ * @param extensionKey - The extensionKey of the current 3P provider (e.g. 'google-object-provider').
+ */
+var useSocialProofExperiment = function useSocialProofExperiment(extensionKey) {
+  var baseUriWithNoTrailingSlash = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  var _useSocialProof = useSocialProof(extensionKey, true, baseUriWithNoTrailingSlash),
+    connectedPct = _useSocialProof.connectedPct,
+    isEnabled = _useSocialProof.isEnabled,
+    isLoading = _useSocialProof.isLoading;
+  return useMemo(function () {
+    var hasSocialProofData = connectedPct !== undefined;
+
+    // Only fire exposure when data has loaded (prevents exposure inflation)
+    var isTreatment = isEnabled && !isLoading && hasSocialProofData ? editorExperiment('social_proof_3p_unauth_block_exp', true) : false;
+    var tier = connectedPct !== undefined && connectedPct >= TIER_THRESHOLD ? 'not-low' : 'low';
+    return {
+      isTreatment: isTreatment,
+      tier: tier,
+      connectedPct: connectedPct,
+      isLoading: isLoading
+    };
+  }, [isEnabled, isLoading, connectedPct]);
+};
+export default useSocialProofExperiment;

package/dist/esm/state/services/current-site-cloud-id/index.js

@@ -5,32 +5,38 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { StorageClient } from '@atlaskit/frontend-utilities/storage-client';
 import { request } from '@atlaskit/linking-common';
-
-/**
- * Logical key shape matches smart-card storage conventions (see personalization-service). {@link StorageClient}
- * stores rows as `<clientKey>_<itemKey>` with `clientKey === '@atlaskit/smart-card'` and
- * `itemKey === 'site-cloud-id:v1'` (no further scope segments; unlike `pct-map:v1:`, this is a single fixed row).
- */
-var SMART_CARD_STORAGE_SCOPE = '@atlaskit/smart-card';
-export var CURRENT_SITE_CLOUD_ID_STORAGE_ITEM_KEY = 'site-cloud-id:v1';
+var SMART_CARD_STORAGE_SCOPE = 'smart-card-social-proof';
+export var CURRENT_SITE_CLOUD_ID_STORAGE_ITEM_KEY_PREFIX = 'site-cloud-id:v1:';
+export var CURRENT_SITE_CLOUD_ID_TTL_MS = 24 * 60 * 60 * 1000;
 var smartCardStorage = new StorageClient(SMART_CARD_STORAGE_SCOPE);
+function normalizeBaseUri() {
+  var baseUriWithNoTrailingSlash = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  return baseUriWithNoTrailingSlash.replace(/\/$/, '');
+}
+function cloudIdStorageItemKey() {
+  var baseUriWithNoTrailingSlash = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  return "".concat(CURRENT_SITE_CLOUD_ID_STORAGE_ITEM_KEY_PREFIX).concat(encodeURIComponent(normalizeBaseUri(baseUriWithNoTrailingSlash)));
+}
 
 /** Keys written by this service in localStorage when using {@link smartCardStorage}. */
-export var CURRENT_SITE_CLOUD_ID_LOCAL_STORAGE_KEY = "".concat(SMART_CARD_STORAGE_SCOPE, "_").concat(CURRENT_SITE_CLOUD_ID_STORAGE_ITEM_KEY);
+export var getCurrentSiteCloudIdLocalStorageKey = function getCurrentSiteCloudIdLocalStorageKey() {
+  var baseUriWithNoTrailingSlash = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  return "".concat(SMART_CARD_STORAGE_SCOPE, "_").concat(cloudIdStorageItemKey(baseUriWithNoTrailingSlash));
+};
+
+/** Backwards-compatible default-scope key for existing tests and external assertions. */
+export var CURRENT_SITE_CLOUD_ID_LOCAL_STORAGE_KEY = getCurrentSiteCloudIdLocalStorageKey();
 export var CurrentSiteCloudIdService = /*#__PURE__*/function () {
   function CurrentSiteCloudIdService() {
     _classCallCheck(this, CurrentSiteCloudIdService);
-    /**
-     * Holds the shared tenant_info work: one in-flight fetch, then (on success) a settled promise for the session cloud
-     * id so later callers never trigger another `tenant_info` in the same page lifetime (until {@link clearCache}).
-     */
-    _defineProperty(this, "tenantInfoInflightPromise", null);
+    _defineProperty(this, "tenantInfoInflightPromises", new Map());
   }
   return _createClass(CurrentSiteCloudIdService, [{
     key: "readStoredCloudId",
     value: function readStoredCloudId() {
+      var baseUriWithNoTrailingSlash = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
       try {
-        var cloudId = smartCardStorage.getItem(CURRENT_SITE_CLOUD_ID_STORAGE_ITEM_KEY);
+        var cloudId = smartCardStorage.getItem(cloudIdStorageItemKey(baseUriWithNoTrailingSlash));
         if (typeof cloudId !== 'string' || !cloudId || cloudId === 'undefined') {
           return undefined;
         }
@@ -41,12 +47,12 @@ export var CurrentSiteCloudIdService = /*#__PURE__*/function () {
     }
   }, {
     key: "writeStoredCloudId",
-    value: function writeStoredCloudId(cloudId) {
+    value: function writeStoredCloudId(baseUriWithNoTrailingSlash, cloudId) {
       if (!cloudId) {
         return;
       }
       try {
-        smartCardStorage.setItemWithExpiry(CURRENT_SITE_CLOUD_ID_STORAGE_ITEM_KEY, cloudId);
+        smartCardStorage.setItemWithExpiry(cloudIdStorageItemKey(baseUriWithNoTrailingSlash), cloudId, CURRENT_SITE_CLOUD_ID_TTL_MS);
       } catch (_unused2) {
         // Quota, private-mode, SSR, etc. — same intent as personalization-service.
       }
@@ -55,67 +61,62 @@ export var CurrentSiteCloudIdService = /*#__PURE__*/function () {
     key: "ensureTenantInfoInflightStarted",
     value: function ensureTenantInfoInflightStarted(baseUriWithNoTrailingSlash) {
       var _this = this;
-      if (this.tenantInfoInflightPromise !== null) {
-        return;
+      var baseUri = normalizeBaseUri(baseUriWithNoTrailingSlash);
+      var existing = this.tenantInfoInflightPromises.get(baseUri);
+      if (existing) {
+        return existing;
       }
-      this.tenantInfoInflightPromise = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var promise = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
         var response, cloudId;
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
               _context.prev = 0;
               _context.next = 3;
-              return request('get', baseUriWithNoTrailingSlash + '/_edge/tenant_info');
+              return request('get', "".concat(baseUri, "/_edge/tenant_info"));
             case 3:
               response = _context.sent;
               cloudId = response === null || response === void 0 ? void 0 : response.cloudId;
               if (cloudId) {
-                _this.writeStoredCloudId(cloudId);
+                _this.writeStoredCloudId(baseUri, cloudId);
               }
-              return _context.abrupt("return", cloudId ? cloudId : _this.readStoredCloudId());
+              return _context.abrupt("return", cloudId ? cloudId : _this.readStoredCloudId(baseUri));
             case 9:
               _context.prev = 9;
               _context.t0 = _context["catch"](0);
-              _this.tenantInfoInflightPromise = null;
-              return _context.abrupt("return", _this.readStoredCloudId());
-            case 13:
+              return _context.abrupt("return", _this.readStoredCloudId(baseUri));
+            case 12:
+              _context.prev = 12;
+              _this.tenantInfoInflightPromises.delete(baseUri);
+              return _context.finish(12);
+            case 15:
             case "end":
               return _context.stop();
           }
-        }, _callee, null, [[0, 9]]);
+        }, _callee, null, [[0, 9, 12, 15]]);
       }))();
+      this.tenantInfoInflightPromises.set(baseUri, promise);
+      return promise;
     }
 
-    /**
-     * Returns the currently cached cloud id synchronously and starts a background refresh.
-     * The refresh result is persisted for future calls but is not awaited by this call.
-     */
+    /** Pure synchronous read scoped to the given base URI. */
   }, {
-    key: "getCachedCloudIdAndRefresh",
-    value: function getCachedCloudIdAndRefresh() {
-      this.ensureTenantInfoInflightStarted('');
-      return this.readStoredCloudId();
+    key: "getStoredCloudId",
+    value: function getStoredCloudId() {
+      var baseUriWithNoTrailingSlash = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+      return this.readStoredCloudId(baseUriWithNoTrailingSlash);
     }
 
     /** Writes tenant cloud id for tests or callers that intentionally warm storage before edge resolves. */
   }, {
     key: "persistStoredCloudId",
     value: function persistStoredCloudId(cloudId) {
-      this.writeStoredCloudId(cloudId);
+      var baseUriWithNoTrailingSlash = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+      this.writeStoredCloudId(baseUriWithNoTrailingSlash, cloudId);
     }
-
-    /**
-     * When local storage already has a tenant cloud id, it is returned immediately; a background tenant_info refresh
-     * is still kicked off unless one is already in flight.
-     *
-     * Without storage, this awaits the deduped in-flight tenant_info (first concurrent caller chooses the URL;
-     * all share one promise regardless of subsequent `baseUriWithNoTrailingSlash`).
-     *
-     * On network success with no cloud id, or on failure: falls back via {@link readStoredCloudId}.
-     */
   }, {
     key: "get",
-    value: (function () {
+    value: function () {
       var _get = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
         var baseUriWithNoTrailingSlash,
           fromStorage,
@@ -124,16 +125,15 @@ export var CurrentSiteCloudIdService = /*#__PURE__*/function () {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
               baseUriWithNoTrailingSlash = _args2.length > 0 && _args2[0] !== undefined ? _args2[0] : '';
-              fromStorage = this.readStoredCloudId();
-              this.ensureTenantInfoInflightStarted(baseUriWithNoTrailingSlash);
+              fromStorage = this.readStoredCloudId(baseUriWithNoTrailingSlash);
               if (!fromStorage) {
-                _context2.next = 5;
+                _context2.next = 4;
                 break;
               }
               return _context2.abrupt("return", fromStorage);
+            case 4:
+              return _context2.abrupt("return", this.ensureTenantInfoInflightStarted(baseUriWithNoTrailingSlash));
             case 5:
-              return _context2.abrupt("return", this.tenantInfoInflightPromise);
-            case 6:
             case "end":
               return _context2.stop();
           }
@@ -143,33 +143,20 @@ export var CurrentSiteCloudIdService = /*#__PURE__*/function () {
         return _get.apply(this, arguments);
       }
       return get;
-    }() /** Clears session pin and persisted storage so the next {@link get} is a fresh tenant_info fetch. */)
+    }() /** Clears session pin and persisted storage so the next {@link get} is a fresh tenant_info fetch. */
   }, {
     key: "clearCache",
     value: function clearCache() {
-      this.tenantInfoInflightPromise = null;
-      smartCardStorage.removeItem(CURRENT_SITE_CLOUD_ID_STORAGE_ITEM_KEY);
+      this.tenantInfoInflightPromises.clear();
     }
   }]);
 }();
 export var currentSiteCloudIdService = new CurrentSiteCloudIdService();
-
-/**
- * Resolves the current site cloud id through the module-level {@link currentSiteCloudIdService}.
- * Returns a stored cloud id immediately when one exists; otherwise waits for the shared
- * `tenant_info` request and persists the result for subsequent cached reads.
- */
+export function getCurrentSiteCloudIdSync() {
+  var baseUriWithNoTrailingSlash = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  return currentSiteCloudIdService.getStoredCloudId(baseUriWithNoTrailingSlash);
+}
 export var getCurrentSiteCloudId = function getCurrentSiteCloudId() {
   var baseUriWithNoTrailingSlash = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
   return currentSiteCloudIdService.get(baseUriWithNoTrailingSlash);
-};
-
-/**
- * Reads the current site cloud id from browser storage (the `site-cloud-id:v1` row) via the
- * module-level {@link currentSiteCloudIdService} singleton, without awaiting network work.
- * Calling this also starts the shared `tenant_info` refresh in the background when one is not
- * already running, so a later call can observe a refreshed value when available.
- */
-export function getCachedCurrentSiteCloudIdAndRefresh() {
-  return currentSiteCloudIdService.getCachedCloudIdAndRefresh();
-}
+};

package/dist/esm/state/services/personalization/index.js

@@ -6,21 +6,19 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { StorageClient } from '@atlaskit/frontend-utilities/storage-client';
-import { getCurrentSiteCloudId, getCachedCurrentSiteCloudIdAndRefresh } from '../current-site-cloud-id';
+import { getCurrentSiteCloudId, getCurrentSiteCloudIdSync } from '../current-site-cloud-id';
 var BASE_URL = '/gateway/api/tap-delivery/api/v3/personalization';
-
-/**
- * Logical key shape: `@atlaskit/smart-card:<feature>:<schema-version>:<scope>` (see smart-card
- * storage conventions). {@link StorageClient} narrows the localStorage key to
- * `<clientKey>_<itemKey>` with `clientKey === '@atlaskit/smart-card'` and
- * `itemKey === 'pct-map:v1:<cloudId>:<traitName>'` (scope segments URI-encoded).
- */
-export var PERSONALIZATION_STORAGE_SCOPE = '@atlaskit/smart-card';
+export var PERSONALIZATION_STORAGE_SCOPE = 'smart-card-social-proof';
 export var PERSONALIZATION_STORAGE_ITEM_KEY_PREFIX = 'pct-map:v1:';
+export var PERSONALIZATION_PROVIDER_PCT_TTL_MS = 24 * 60 * 60 * 1000;
+export var SOCIAL_PROOF_TRAIT_NAME = 'sl_3p_connected_providers_site_pct';
 var smartCardStorage = new StorageClient(PERSONALIZATION_STORAGE_SCOPE);
 
 /** Keys written by this service in localStorage when using {@link smartCardStorage}. */
 var LOCAL_STORAGE_ROW_KEY_PREFIX = "".concat(PERSONALIZATION_STORAGE_SCOPE, "_").concat(PERSONALIZATION_STORAGE_ITEM_KEY_PREFIX);
+function scopedCacheKey(cloudId, traitName) {
+  return "".concat(cloudId, ":").concat(traitName);
+}
 function pctMapStorageItemKey(cloudId, traitName) {
   return "".concat(PERSONALIZATION_STORAGE_ITEM_KEY_PREFIX).concat(encodeURIComponent(cloudId), ":").concat(encodeURIComponent(traitName));
 }
@@ -72,53 +70,46 @@ export var PersonalizationService = /*#__PURE__*/function () {
     _defineProperty(this, "cache", new Map());
   }
   return _createClass(PersonalizationService, [{
-    key: "getCachedProviderPctMapAndRefresh",
-    value:
-    /**
-     * Returns the currently cached provider percentage map synchronously and starts a background refresh.
-     * The refresh result is persisted for future calls but is not awaited by this call.
-     */
-    function getCachedProviderPctMapAndRefresh(traitName) {
-      var cloudId = getCachedCurrentSiteCloudIdAndRefresh();
-      var fromStorage = cloudId && this.readStoredProviderPctMap(cloudId, traitName) || null;
-      void this.getProviderPctMap(traitName);
-      return fromStorage;
+    key: "getProviderPctMapSync",
+    value: /** Pure synchronous read for an explicit cloud id / trait pair. */
+    function getProviderPctMapSync(cloudId, traitName) {
+      if (!cloudId) {
+        return null;
+      }
+      return this.readStoredProviderPctMap(cloudId, traitName);
     }
   }, {
     key: "getProviderPctMap",
     value: function () {
-      var _getProviderPctMap = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(traitName) {
+      var _getProviderPctMap = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(cloudId, traitName) {
         var _this = this;
-        var cachedPromise, promise;
+        var cacheKey, cachedPromise, promise, retryablePromise;
         return _regeneratorRuntime.wrap(function _callee2$(_context2) {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
-              cachedPromise = this.cache.get(traitName);
+              if (cloudId) {
+                _context2.next = 2;
+                break;
+              }
+              return _context2.abrupt("return", undefined);
+            case 2:
+              cacheKey = scopedCacheKey(cloudId, traitName);
+              cachedPromise = this.cache.get(cacheKey);
               if (!cachedPromise) {
-                _context2.next = 3;
+                _context2.next = 6;
                 break;
               }
               return _context2.abrupt("return", cachedPromise);
-            case 3:
+            case 6:
               promise = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-                var cloudId, traits, trait, mapped;
+                var traits, trait, mapped;
                 return _regeneratorRuntime.wrap(function _callee$(_context) {
                   while (1) switch (_context.prev = _context.next) {
                     case 0:
                       _context.prev = 0;
                       _context.next = 3;
-                      return getCurrentSiteCloudId();
-                    case 3:
-                      cloudId = _context.sent;
-                      if (cloudId) {
-                        _context.next = 6;
-                        break;
-                      }
-                      return _context.abrupt("return", undefined);
-                    case 6:
-                      _context.next = 8;
                       return fetchSiteTraits(cloudId);
-                    case 8:
+                    case 3:
                       traits = _context.sent;
                       trait = traits.find(function (t) {
                         return t.name === traitName;
@@ -128,25 +119,28 @@ export var PersonalizationService = /*#__PURE__*/function () {
                         _this.writeStoredProviderPctMap(cloudId, traitName, mapped);
                       }
                       return _context.abrupt("return", mapped);
-                    case 15:
-                      _context.prev = 15;
+                    case 10:
+                      _context.prev = 10;
                       _context.t0 = _context["catch"](0);
                       return _context.abrupt("return", undefined);
-                    case 18:
+                    case 13:
                     case "end":
                       return _context.stop();
                   }
-                }, _callee, null, [[0, 15]]);
+                }, _callee, null, [[0, 10]]);
               }))();
-              this.cache.set(traitName, promise);
-              return _context2.abrupt("return", promise);
-            case 6:
+              retryablePromise = promise.finally(function () {
+                _this.cache.delete(cacheKey);
+              });
+              this.cache.set(cacheKey, retryablePromise);
+              return _context2.abrupt("return", retryablePromise);
+            case 10:
             case "end":
               return _context2.stop();
           }
         }, _callee2, this);
       }));
-      function getProviderPctMap(_x2) {
+      function getProviderPctMap(_x2, _x3) {
         return _getProviderPctMap.apply(this, arguments);
       }
       return getProviderPctMap;
@@ -168,7 +162,7 @@ export var PersonalizationService = /*#__PURE__*/function () {
     key: "writeStoredProviderPctMap",
     value: function writeStoredProviderPctMap(cloudId, traitName, map) {
       try {
-        smartCardStorage.setItemWithExpiry(pctMapStorageItemKey(cloudId, traitName), map);
+        smartCardStorage.setItemWithExpiry(pctMapStorageItemKey(cloudId, traitName), map, PERSONALIZATION_PROVIDER_PCT_TTL_MS);
       } catch (_unused3) {
         // Quota, private-mode, etc.
       }
@@ -237,22 +231,25 @@ export var PersonalizationService = /*#__PURE__*/function () {
   }]);
 }();
 export var personalizationService = new PersonalizationService();
-
-/**
- * Resolves the provider percentage map for a TAP Delivery trait through the module-level
- * {@link personalizationService}. Work is deduped per trait name for the page lifetime, and a
- * successful response is persisted by cloud id and trait name for later cached reads.
- */
-export var getProviderPctMap = function getProviderPctMap(traitName) {
-  return personalizationService.getProviderPctMap(traitName);
+export var getProviderPctMap = function getProviderPctMap(cloudId, traitName) {
+  return personalizationService.getProviderPctMap(cloudId, traitName);
 };
+export function getProviderPctMapSync(cloudId, traitName) {
+  return personalizationService.getProviderPctMapSync(cloudId, traitName);
+}
 
 /**
- * Reads the provider percentage map for a trait from browser storage via the module-level
- * {@link personalizationService} singleton, without awaiting network work.
- * Calling this also starts the trait-scoped shared refresh in the background, so a later call can
- * use a refreshed value when it becomes available.
+ * Backwards-compatible cache-first helper for inline-card social proof callers.
+ *
+ * Reads the persisted provider percentage map synchronously using the current site cloud id, then
+ * starts a background refresh for subsequent mounts. The async result intentionally does not affect
+ * the current call site, matching the warm-cache-only rendering contract.
  */
 export function getCachedProviderPctMapAndRefresh(traitName) {
-  return personalizationService.getCachedProviderPctMapAndRefresh(traitName);
+  var cloudId = getCurrentSiteCloudIdSync();
+  var providerPctMap = getProviderPctMapSync(cloudId, traitName);
+  void getCurrentSiteCloudId().then(function (resolvedCloudId) {
+    void getProviderPctMap(resolvedCloudId, traitName);
+  });
+  return providerPctMap;
 }

package/dist/esm/utils/analytics/analytics.js

@@ -4,7 +4,7 @@ export var ANALYTICS_CHANNEL = 'media';
 export var context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card" || '',
-  packageVersion: "44.6.1" || ''
+  packageVersion: "44.7.0" || ''
 };
 export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/esm/view/BlockCard/views/SocialProofMessage.js

@@ -0,0 +1,29 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { FormattedMessage } from 'react-intl';
+import { Box, Text } from '@atlaskit/primitives/compiled';
+import { messages } from '../../../messages';
+// TODO: remove when social-proof-3p-unauth-block-fg is cleaned up
+var SocialProofMessage = function SocialProofMessage(_ref) {
+  var tier = _ref.tier,
+    connectedPct = _ref.connectedPct,
+    providerName = _ref.providerName,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'smart-block-social-proof-message' : _ref$testId;
+  var message = tier === 'not-low' ? messages.pre_auth_block_social_proof_not_low : messages.pre_auth_block_social_proof_low;
+  return /*#__PURE__*/React.createElement(Box, {
+    testId: testId
+  }, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, message, {
+    values: {
+      percentage: connectedPct !== null && connectedPct !== void 0 ? connectedPct : 0,
+      provider: providerName,
+      b: function b(chunks) {
+        return /*#__PURE__*/React.createElement(Text, {
+          as: "strong",
+          weight: "bold"
+        }, chunks);
+      }
+    }
+  })));
+};
+export default SocialProofMessage;

package/dist/esm/view/BlockCard/views/UnauthorisedView.js

@@ -1,19 +1,26 @@
 /* UnauthorisedView.tsx generated by @compiled/babel-plugin v0.39.1 */
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _extends from "@babel/runtime/helpers/extends";
-var _excluded = ["testId"];
+var _excluded = ["content", "providerName", "testId"],
+  _excluded2 = ["testId"],
+  _excluded3 = ["testId"];
 import "./UnauthorisedView.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { useCallback, useMemo } from 'react';
 import { FormattedMessage } from 'react-intl';
+import { di } from 'react-magnetic-di';
+import { AnalyticsContext } from '@atlaskit/analytics-next';
 import { extractSmartLinkProvider } from '@atlaskit/link-extractors';
+import { useSmartLinkContext } from '@atlaskit/link-provider';
+import { componentWithFG } from '@atlaskit/platform-feature-flags-react';
 import { Box } from '@atlaskit/primitives/compiled';
 import { useAnalyticsEvents } from '../../../common/analytics/generated/use-analytics-events';
 import { ElementName, SmartLinkDirection, SmartLinkSize, SmartLinkWidth } from '../../../constants';
 import { messages } from '../../../messages';
 import { useFlexibleCardContext } from '../../../state/flexible-ui-context';
 import { hasAuthScopeOverrides } from '../../../state/helpers';
+import useSocialProofExperiment from '../../../state/hooks/use-social-proof-experiment';
 import UnauthorisedViewContent from '../../common/UnauthorisedViewContent';
 import FlexibleCard from '../../FlexibleCard';
 import ActionGroup from '../../FlexibleCard/components/blocks/action-group';
@@ -23,6 +30,7 @@ import { renderElementItems } from '../../FlexibleCard/components/blocks/utils';
 import { LinkIcon, Title } from '../../FlexibleCard/components/elements';
 import { AuthorizeAction } from '../actions/AuthorizeAction';
 import unauthIllustrationGeneral from './assets/general@2x.png';
+import SocialProofMessage from './SocialProofMessage';
 import { FlexibleCardUiOptions, titleBlockOptions } from './utils';
 import { withFlexibleUIBlockCardStyle } from './utils/withFlexibleUIBlockCardStyle';
 var contentStyles = null;
@@ -161,15 +169,12 @@ var UnauthorisedBlock = function UnauthorisedBlock(_ref) {
  * @see SmartLinkStatus
  * @see FlexibleCardProps
  */
-var UnauthorisedView = function UnauthorisedView(_ref3) {
-  var _extractSmartLinkProv;
-  var _ref3$testId = _ref3.testId,
-    testId = _ref3$testId === void 0 ? 'smart-block-unauthorized-view' : _ref3$testId,
+var UnauthorisedViewFrame = function UnauthorisedViewFrame(_ref3) {
+  var content = _ref3.content,
+    providerName = _ref3.providerName,
+    testId = _ref3.testId,
     props = _objectWithoutProperties(_ref3, _excluded);
-  var cardState = props.cardState,
-    onAuthorize = props.onAuthorize;
-  var providerName = (_extractSmartLinkProv = extractSmartLinkProvider(cardState.details)) === null || _extractSmartLinkProv === void 0 ? void 0 : _extractSmartLinkProv.text;
-  var isProductIntegrationSupported = hasAuthScopeOverrides(cardState.details);
+  var onAuthorize = props.onAuthorize;
   var _useAnalyticsEvents = useAnalyticsEvents(),
     fireEvent = _useAnalyticsEvents.fireEvent;
   var handleAuthorize = useCallback(function () {
@@ -178,17 +183,6 @@ var UnauthorisedView = function UnauthorisedView(_ref3) {
       onAuthorize();
     }
   }, [onAuthorize, fireEvent]);
-  var content = useMemo(function () {
-    return onAuthorize ? /*#__PURE__*/React.createElement(UnauthorisedViewContent, {
-      providerName: providerName,
-      isProductIntegrationSupported: isProductIntegrationSupported,
-      testId: testId
-    }) : /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[providerName ? 'unauthorised_account_description' : 'unauthorised_account_description_no_provider'], {
-      values: {
-        context: providerName
-      }
-    }));
-  }, [isProductIntegrationSupported, onAuthorize, providerName, testId]);
   var actions = useMemo(function () {
     return onAuthorize ? [AuthorizeAction(handleAuthorize, providerName)] : [];
   }, [handleAuthorize, onAuthorize, providerName]);
@@ -209,5 +203,76 @@ var UnauthorisedView = function UnauthorisedView(_ref3) {
     className: ax(["_11c8fhey _syazi7uo _19pku2gc", actions.length > 0 && "_1reo15vq _18m915vq _otyrpxbi _p12f1osq _o5721q9c _1bto1l2s"])
   }, content)));
 };
+var UnauthorisedViewBase = function UnauthorisedViewBase(_ref4) {
+  var _extractSmartLinkProv;
+  var _ref4$testId = _ref4.testId,
+    testId = _ref4$testId === void 0 ? 'smart-block-unauthorized-view' : _ref4$testId,
+    props = _objectWithoutProperties(_ref4, _excluded2);
+  var cardState = props.cardState,
+    onAuthorize = props.onAuthorize;
+  var providerName = (_extractSmartLinkProv = extractSmartLinkProvider(cardState.details)) === null || _extractSmartLinkProv === void 0 ? void 0 : _extractSmartLinkProv.text;
+  var isProductIntegrationSupported = hasAuthScopeOverrides(cardState.details);
+  var content = useMemo(function () {
+    return onAuthorize ? /*#__PURE__*/React.createElement(UnauthorisedViewContent, {
+      providerName: providerName,
+      isProductIntegrationSupported: isProductIntegrationSupported,
+      testId: testId
+    }) : /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[providerName ? 'unauthorised_account_description' : 'unauthorised_account_description_no_provider'], {
+      values: {
+        context: providerName
+      }
+    }));
+  }, [isProductIntegrationSupported, onAuthorize, providerName, testId]);
+  return /*#__PURE__*/React.createElement(UnauthorisedViewFrame, _extends({}, props, {
+    content: content,
+    providerName: providerName,
+    testId: testId
+  }));
+};
+
+/**
+ * Experiment wrapper: fires social proof exposure and renders social proof UI when FG is on.
+ * TODO: remove when social-proof-3p-unauth-block-fg is cleaned up
+ */
+var UnauthorisedViewWithExperiment = function UnauthorisedViewWithExperiment(_ref5) {
+  var _props$cardState, _extractSmartLinkProv2;
+  var _ref5$testId = _ref5.testId,
+    testId = _ref5$testId === void 0 ? 'smart-block-unauthorized-view' : _ref5$testId,
+    props = _objectWithoutProperties(_ref5, _excluded3);
+  var extensionKey = (_props$cardState = props.cardState) === null || _props$cardState === void 0 || (_props$cardState = _props$cardState.details) === null || _props$cardState === void 0 || (_props$cardState = _props$cardState.meta) === null || _props$cardState === void 0 ? void 0 : _props$cardState.key;
+  var providerName = (_extractSmartLinkProv2 = extractSmartLinkProvider(props.cardState.details)) === null || _extractSmartLinkProv2 === void 0 ? void 0 : _extractSmartLinkProv2.text;
+  var _useSmartLinkContext = useSmartLinkContext(),
+    connections = _useSmartLinkContext.connections;
+  var _useSocialProofExperi = useSocialProofExperiment(providerName ? extensionKey : undefined, connections.client.baseUrlOverride),
+    isTreatment = _useSocialProofExperi.isTreatment,
+    tier = _useSocialProofExperi.tier,
+    connectedPct = _useSocialProofExperi.connectedPct;
+  if (!isTreatment || !providerName) {
+    return /*#__PURE__*/React.createElement(UnauthorisedViewBase, _extends({}, props, {
+      testId: testId
+    }));
+  }
+  return /*#__PURE__*/React.createElement(AnalyticsContext, {
+    data: {
+      attributes: {
+        experiment: 'social_proof_3p_unauth_block_exp',
+        cohort: 'treatment',
+        tier: tier
+      }
+    }
+  }, /*#__PURE__*/React.createElement(UnauthorisedViewFrame, _extends({}, props, {
+    content: /*#__PURE__*/React.createElement(SocialProofMessage, {
+      tier: tier,
+      connectedPct: connectedPct,
+      providerName: providerName
+    }),
+    providerName: providerName,
+    testId: testId
+  })));
+};
+var UnauthorisedViewWithoutExperiment = function UnauthorisedViewWithoutExperiment(props) {
+  return /*#__PURE__*/React.createElement(UnauthorisedViewBase, props);
+};
+var UnauthorisedView = componentWithFG('social-proof-3p-unauth-block-fg', UnauthorisedViewWithExperiment, UnauthorisedViewWithoutExperiment);
 var _default_1 = withFlexibleUIBlockCardStyle(UnauthorisedView);
 export default _default_1;

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

@@ -15,7 +15,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "44.6.1",
+  packageVersion: "44.7.0",
   componentName: 'linkUrl'
 };
 var Anchor = withLinkClickedEvent('a');