@atlaskit/react-ufo 4.0.2 → 4.1.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/ufo-interaction-ignore
 
+## 4.1.0
+
+### Minor Changes
+
+- [#185569](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/185569)
+  [`1c7b682d3bd6a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1c7b682d3bd6a) -
+  Adds UFOCustomCohortData component and addUFOCustomCohortData function to separate cohorting data
+  (important for analytics) from general debugging data.
+
+## 4.0.3
+
+### Patch Changes
+
+- [#186813](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/186813)
+  [`b0dd8177f1f10`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b0dd8177f1f10) -
+  HOT-119287 only produce critical metrics for root and successful interaction
+
 ## 4.0.2
 
 ### Patch Changes

package/custom-cohort-data/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "@atlaskit/react-ufo/custom-cohort-data",
+  "main": "../dist/cjs/custom-cohort-data/index.js",
+  "module": "../dist/esm/custom-cohort-data/index.js",
+  "module:es2019": "../dist/es2019/custom-cohort-data/index.js",
+  "sideEffects": false,
+  "types": "../dist/types/custom-cohort-data/index.d.ts",
+  "typesVersions": {
+    ">=4.5 <5.4": {
+      "*": [
+        "../dist/types-ts4.5/custom-cohort-data/index.d.ts"
+      ]
+    }
+  }
+}

package/dist/cjs/create-payload/critical-metrics-payload/index.js

@@ -9,6 +9,7 @@ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"))
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _rootMetrics = require("./root-metrics");
 var _createSegmentMetrics = require("./segment-metrics/create-segment-metrics");
 function createCriticalMetricsPayloads(_x, _x2, _x3) {
@@ -21,13 +22,15 @@ function _createCriticalMetricsPayloads() {
       while (1) switch (_context.prev = _context.next) {
         case 0:
           _context.next = 2;
-          return Promise.all([(0, _rootMetrics.createRootCriticalMetricsPayload)(interactionId, interaction, vcMetrics), (0, _createSegmentMetrics.createSegmentMetricsPayloads)(interactionId, interaction)]);
+          return Promise.all([(0, _rootMetrics.createRootCriticalMetricsPayload)(interactionId, interaction, vcMetrics), (0, _platformFeatureFlags.fg)('platform_ufo_segment_critical_metrics') ? (0, _createSegmentMetrics.createSegmentMetricsPayloads)(interactionId, interaction) : []]);
         case 2:
           _yield$Promise$all = _context.sent;
           _yield$Promise$all2 = (0, _slicedToArray2.default)(_yield$Promise$all, 2);
           rootPayload = _yield$Promise$all2[0];
           segmentPayloads = _yield$Promise$all2[1];
-          return _context.abrupt("return", [rootPayload].concat((0, _toConsumableArray2.default)(segmentPayloads)));
+          return _context.abrupt("return", [rootPayload].concat((0, _toConsumableArray2.default)(segmentPayloads)).filter(function (v) {
+            return v != null;
+          }));
         case 7:
         case "end":
           return _context.stop();

package/dist/cjs/create-payload/critical-metrics-payload/root-metrics.js

@@ -57,11 +57,17 @@ function _createRootCriticalMetricsPayload() {
           pageVisibilityAtTTI = getPageVisibilityUpToTTI(interaction);
           pageVisibilityAtTTAI = (0, _getPageVisibilityUpToTtai.default)(interaction);
           interactionStatus = (0, _getInteractionStatus.default)(interaction);
+          if (!(interactionStatus.originalInteractionStatus !== 'SUCCEEDED')) {
+            _context.next = 9;
+            break;
+          }
+          return _context.abrupt("return", null);
+        case 9:
           newUFOName = (0, _utils.sanitizeUfoName)(ufoName); // Get performance metrics
           ttai = (0, _getTtai.default)(interaction);
-          _context.next = 11;
+          _context.next = 13;
           return (0, _getPaintMetrics.default)(type, end);
-        case 11:
+        case 13:
           paintMetrics = _context.sent;
           navigationMetrics = (0, _getNavigationMetrics.default)(type);
           ssrSuccess = (0, _getSsrSuccess.default)(type); // Calculate BM3 metrics (TTI and FMP) directly
@@ -74,14 +80,14 @@ function _createRootCriticalMetricsPayload() {
           }); // Use provided vcMetrics or calculate if not provided
           _context.t0 = vcMetrics;
           if (_context.t0) {
-            _context.next = 23;
+            _context.next = 25;
             break;
           }
-          _context.next = 22;
+          _context.next = 24;
           return (0, _getVcMetrics.default)(interaction);
-        case 22:
+        case 24:
           _context.t0 = _context.sent;
-        case 23:
+        case 25:
           finalVCMetrics = _context.t0;
           ttvc = (_finalVCMetrics$ufoV = finalVCMetrics['ufo:vc:rev']) === null || _finalVCMetrics$ufoV === void 0 ? void 0 : _finalVCMetrics$ufoV.map(function (revision) {
             if (revision['metric:vc90'] === null || revision.clean !== true) {
@@ -170,7 +176,7 @@ function _createRootCriticalMetricsPayload() {
             }
           };
           return _context.abrupt("return", payload);
-        case 30:
+        case 32:
         case "end":
           return _context.stop();
       }

package/dist/cjs/create-payload/critical-metrics-payload/segment-metrics/create-segment-metrics.js

@@ -26,7 +26,7 @@ function createSegmentMetricsPayloads(_x, _x2) {
 function _createSegmentMetricsPayloads() {
   _createSegmentMetricsPayloads = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(interactionId, interaction) {
     var _interaction$cohortin;
-    var config, browserMetadata, cohortingCustomData, pageVisibilityAtTTAI, knownSegments, reactProfilerTimings, rate, routeName, previousInteractionName, isPreviousInteractionAborted, abortedByInteractionName, segmentsByName, _iterator, _step, _loop, _ret, payloads, _iterator2, _step2, _loop2;
+    var config, browserMetadata, cohortingCustomData, pageVisibilityAtTTAI, knownSegments, reactProfilerTimings, rate, routeName, previousInteractionName, isPreviousInteractionAborted, abortedByInteractionName, segmentsByName, _iterator, _step, _loop, _ret, payloads, _iterator2, _step2, _loop2, _ret2;
     return _regenerator.default.wrap(function _callee$(_context3) {
       while (1) switch (_context3.prev = _context3.next) {
         case 0:
@@ -148,13 +148,19 @@ function _createSegmentMetricsPayloads() {
                     _context2.next = 8;
                     break;
                   }
-                  return _context2.abrupt("return", 1);
+                  return _context2.abrupt("return", 0);
                 case 8:
                   lastTiming = segmentProfilerTimings[segmentProfilerTimings.length - 1];
                   startTime = isRootSegment ? interaction.start : firstMountTiming.startTime;
                   endTime = lastTiming.commitTime;
                   ttai = Math.round(endTime - startTime);
                   _getSegmentStatus = (0, _getSegmentStatus2.default)(interaction, segment), status = _getSegmentStatus.status, segmentAbortReason = _getSegmentStatus.abortReason;
+                  if (!(status !== 'SUCCEEDED')) {
+                    _context2.next = 15;
+                    break;
+                  }
+                  return _context2.abrupt("return", 0);
+                case 15:
                   properties = _objectSpread({
                     // Basic metadata
                     'event:hostname': ((_window$location = window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) || 'unknown',
@@ -206,7 +212,7 @@ function _createSegmentMetricsPayloads() {
                     }
                   };
                   payloads.push(payload);
-                case 16:
+                case 18:
                 case "end":
                   return _context2.stop();
               }
@@ -215,37 +221,38 @@ function _createSegmentMetricsPayloads() {
           _iterator2.s();
         case 32:
           if ((_step2 = _iterator2.n()).done) {
-            _context3.next = 38;
+            _context3.next = 39;
             break;
           }
           return _context3.delegateYield(_loop2(), "t2", 34);
         case 34:
-          if (!_context3.t2) {
-            _context3.next = 36;
+          _ret2 = _context3.t2;
+          if (!(_ret2 === 0)) {
+            _context3.next = 37;
             break;
           }
-          return _context3.abrupt("continue", 36);
-        case 36:
+          return _context3.abrupt("continue", 37);
+        case 37:
           _context3.next = 32;
           break;
-        case 38:
-          _context3.next = 43;
+        case 39:
+          _context3.next = 44;
           break;
-        case 40:
-          _context3.prev = 40;
+        case 41:
+          _context3.prev = 41;
           _context3.t3 = _context3["catch"](29);
           _iterator2.e(_context3.t3);
-        case 43:
-          _context3.prev = 43;
+        case 44:
+          _context3.prev = 44;
           _iterator2.f();
-          return _context3.finish(43);
-        case 46:
-          return _context3.abrupt("return", payloads);
+          return _context3.finish(44);
         case 47:
+          return _context3.abrupt("return", payloads);
+        case 48:
         case "end":
           return _context3.stop();
       }
-    }, _callee, null, [[9, 21, 24, 27], [29, 40, 43, 46]]);
+    }, _callee, null, [[9, 21, 24, 27], [29, 41, 44, 47]]);
   }));
   return _createSegmentMetricsPayloads.apply(this, arguments);
 }

package/dist/cjs/custom-cohort-data/index.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.addUFOCustomCohortData = addUFOCustomCohortData;
+exports.default = UFOCustomCohortData;
+var _react = require("react");
+var _interactionContext = _interopRequireDefault(require("../interaction-context"));
+var _interactionIdContext = require("../interaction-id-context");
+var _interactionMetrics = require("../interaction-metrics");
+function UFOCustomCohortData(_ref) {
+  var dataKey = _ref.dataKey,
+    value = _ref.value;
+  var interactionContext = (0, _react.useContext)(_interactionContext.default);
+  (0, _react.useMemo)(function () {
+    if (!interactionContext) {
+      return;
+    }
+    var interactionId = (0, _interactionIdContext.getInteractionId)();
+    var currentInteractionId = interactionId.current;
+    if (!currentInteractionId) {
+      return;
+    }
+    (0, _interactionMetrics.addCohortingCustomData)(currentInteractionId, dataKey, value);
+  }, [dataKey, value, interactionContext]);
+  return null;
+}
+function addUFOCustomCohortData(key, value) {
+  var interactionId = (0, _interactionIdContext.getInteractionId)();
+  var currentInteractionId = interactionId.current;
+  if (!currentInteractionId) {
+    return;
+  }
+  (0, _interactionMetrics.addCohortingCustomData)(currentInteractionId, key, value);
+}

package/dist/cjs/custom-cohort-data/types.js

@@ -0,0 +1 @@
+"use strict";

package/dist/cjs/vc/vc-observer-new/viewport-observer/index.js

@@ -17,7 +17,7 @@ var _rllPlaceholders = require("../../vc-observer/observers/rll-placeholders");
 var _intersectionObserver = require("./intersection-observer");
 var _mutationObserver = _interopRequireDefault(require("./mutation-observer"));
 var _performanceObserver = _interopRequireDefault(require("./performance-observer"));
-var _getComponentNameAndChildProps = require("./utils/get-component-name-and-child-props");
+var _checkWithinComponentAndExtractChildProps = _interopRequireDefault(require("./utils/check-within-component-and-extract-child-props"));
 var _isInVcIgnoreIfNoLayoutShiftMarker = _interopRequireDefault(require("./utils/is-in-vc-ignore-if-no-layout-shift-marker"));
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -125,7 +125,7 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
               _context2.prev = 4;
               _loop = /*#__PURE__*/_regenerator.default.mark(function _loop() {
                 var _this$intersectionObs8;
-                var addedNodeRef, addedNode, ssrState, SSRStateEnum, _this$intersectionObs, _this$intersectionObs2, ssrPlaceholderHandler, result, _this$intersectionObs3, _result, _this$intersectionObs4, sameDeletedNode, isInIgnoreLsMarker, isNoLsMarkerEnabled, _this$intersectionObs5, _this$intersectionObs6, _checkThirdPartySegme, isWithinThirdPartySegment, ignoredReason, _this$intersectionObs7, assignedReason;
+                var addedNodeRef, addedNode, ssrState, SSRStateEnum, _this$intersectionObs, _this$intersectionObs2, ssrPlaceholderHandler, result, _this$intersectionObs3, _result, _this$intersectionObs4, sameDeletedNode, isInIgnoreLsMarker, isNoLsMarkerEnabled, _this$intersectionObs5, _this$intersectionObs6, _checkWithinComponent, isWithinThirdPartySegment, _this$intersectionObs7;
                 return _regenerator.default.wrap(function _loop$(_context) {
                   while (1) switch (_context.prev = _context.next) {
                     case 0:
@@ -235,17 +235,16 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
                       (_this$intersectionObs6 = _this.intersectionObserver) === null || _this$intersectionObs6 === void 0 || _this$intersectionObs6.watchAndTag(addedNode, 'mutation:media');
                       return _context.abrupt("return", 0);
                     case 45:
-                      _checkThirdPartySegme = (0, _getComponentNameAndChildProps.checkThirdPartySegmentWithIgnoreReason)(addedNode), isWithinThirdPartySegment = _checkThirdPartySegme.isWithinThirdPartySegment, ignoredReason = _checkThirdPartySegme.ignoredReason;
+                      _checkWithinComponent = (0, _checkWithinComponentAndExtractChildProps.default)(addedNode, 'UFOThirdPartySegment'), isWithinThirdPartySegment = _checkWithinComponent.isWithin;
                       if (!isWithinThirdPartySegment) {
-                        _context.next = 50;
+                        _context.next = 49;
                         break;
                       }
-                      assignedReason = (0, _getComponentNameAndChildProps.createMutationTypeWithIgnoredReason)(ignoredReason || 'third-party-element');
-                      (_this$intersectionObs7 = _this.intersectionObserver) === null || _this$intersectionObs7 === void 0 || _this$intersectionObs7.watchAndTag(addedNode, assignedReason);
+                      (_this$intersectionObs7 = _this.intersectionObserver) === null || _this$intersectionObs7 === void 0 || _this$intersectionObs7.watchAndTag(addedNode, 'mutation:third-party-element');
                       return _context.abrupt("return", 0);
-                    case 50:
+                    case 49:
                       (_this$intersectionObs8 = _this.intersectionObserver) === null || _this$intersectionObs8 === void 0 || _this$intersectionObs8.watchAndTag(addedNode, createElementMutationsWatcher(removedNodeRects));
-                    case 51:
+                    case 50:
                     case "end":
                       return _context.stop();
                   }
@@ -333,13 +332,11 @@ var ViewportObserver = exports.default = /*#__PURE__*/function () {
             }
           };
         }
-        var _checkThirdPartySegme2 = (0, _getComponentNameAndChildProps.checkThirdPartySegmentWithIgnoreReason)(target),
-          isWithinThirdPartySegment = _checkThirdPartySegme2.isWithinThirdPartySegment,
-          ignoredReason = _checkThirdPartySegme2.ignoredReason;
+        var _checkWithinComponent2 = (0, _checkWithinComponentAndExtractChildProps.default)(target, 'UFOThirdPartySegment'),
+          isWithinThirdPartySegment = _checkWithinComponent2.isWithin;
         if (isWithinThirdPartySegment) {
-          var assignedReason = (0, _getComponentNameAndChildProps.createMutationTypeWithIgnoredReason)(ignoredReason || 'third-party-element');
           return {
-            type: assignedReason,
+            type: 'mutation:third-party-element',
             mutationData: {
               attributeName: attributeName,
               oldValue: oldValue,

package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/{get-component-name-and-child-props.js → check-within-component-and-extract-child-props.js}

@@ -4,22 +4,13 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.checkThirdPartySegmentWithIgnoreReason = checkThirdPartySegmentWithIgnoreReason;
-exports.checkWithinComponentAndExtractChildProps = checkWithinComponentAndExtractChildProps;
-exports.createMutationTypeWithIgnoredReason = createMutationTypeWithIgnoredReason;
+exports.default = checkWithinComponentAndExtractChildProps;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _findReactFiber = _interopRequireDefault(require("./find-react-fiber"));
+var _getComponentName = _interopRequireDefault(require("./get-component-name"));
 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; }
-// Helper function to find React fiber on an element
-var findReactFiber = function findReactFiber(element) {
-  var key = Object.keys(element).find(function (key) {
-    return key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$');
-  });
-  return key ? element[key] : null;
-};
-
 // Using the React Fiber tree to traverse up the DOM and check if a node is within a specific component
 // and extract child component props if needed.
 function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
@@ -28,13 +19,13 @@ function checkWithinComponentAndExtractChildProps(node, targetComponentName, chi
     // Walk up the DOM tree to find React fiber (handles non-React-rendered elements)
     var currentElement = node;
     while (currentElement && !fiber) {
-      fiber = findReactFiber(currentElement);
+      fiber = (0, _findReactFiber.default)(currentElement);
       if (!fiber) {
         currentElement = currentElement.parentElement;
       }
     }
   } else {
-    fiber = findReactFiber(node);
+    fiber = (0, _findReactFiber.default)(node);
   }
 
   // If no React fiber found, return false
@@ -48,14 +39,7 @@ function checkWithinComponentAndExtractChildProps(node, targetComponentName, chi
   var currentFiber = fiber;
   var childProp;
   while (currentFiber) {
-    var componentName = void 0;
-    if (currentFiber.type) {
-      if (typeof currentFiber.type === 'function') {
-        componentName = currentFiber.type.displayName || currentFiber.type.name;
-      } else if ((0, _typeof2.default)(currentFiber.type) === 'object' && (currentFiber.type.displayName || currentFiber.type.name)) {
-        componentName = currentFiber.type.displayName || currentFiber.type.name;
-      }
-    }
+    var componentName = (0, _getComponentName.default)(currentFiber);
 
     // Check if this is a child component we're looking for
     if (childComponentConfig && componentName === childComponentConfig.componentName) {
@@ -79,21 +63,4 @@ function checkWithinComponentAndExtractChildProps(node, targetComponentName, chi
   return {
     isWithin: false
   };
-}
-
-// Check if the node is within a UFOThirdPartySegment and extract any UFOIgnoreHolds reason
-function checkThirdPartySegmentWithIgnoreReason(node) {
-  var result = checkWithinComponentAndExtractChildProps(node, 'UFOThirdPartySegment', {
-    componentName: 'UFOIgnoreHolds',
-    propName: 'reason'
-  });
-  return {
-    isWithinThirdPartySegment: result.isWithin,
-    ignoredReason: result.childProp
-  };
-}
-
-// Helper function to create mutation type from UFOIgnoreHoldsReason
-function createMutationTypeWithIgnoredReason(reason) {
-  return "mutation:".concat(reason);
 }

package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = findReactFiber;
+// Helper function to find React fiber on an element
+function findReactFiber(element) {
+  // Use for...in loop instead of Object.keys().find() to avoid creating an array
+  for (var key in element) {
+    if (key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$')) {
+      return element[key];
+    }
+  }
+  return null;
+}

package/dist/cjs/vc/vc-observer-new/viewport-observer/utils/get-component-name.js

@@ -0,0 +1,19 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = getComponentName;
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+// Helper function to extract component name from fiber
+function getComponentName(fiber) {
+  var type = fiber === null || fiber === void 0 ? void 0 : fiber.type;
+  if (!type) {
+    return undefined;
+  }
+  if (typeof type === 'function' || (0, _typeof2.default)(type) === 'object') {
+    return type.displayName || type.name;
+  }
+  return undefined;
+}

package/dist/es2019/create-payload/critical-metrics-payload/index.js

@@ -1,6 +1,7 @@
+import { fg } from '@atlaskit/platform-feature-flags';
 import { createRootCriticalMetricsPayload } from './root-metrics';
 import { createSegmentMetricsPayloads } from './segment-metrics/create-segment-metrics';
 export async function createCriticalMetricsPayloads(interactionId, interaction, vcMetrics) {
-  const [rootPayload, segmentPayloads] = await Promise.all([createRootCriticalMetricsPayload(interactionId, interaction, vcMetrics), createSegmentMetricsPayloads(interactionId, interaction)]);
-  return [rootPayload, ...segmentPayloads];
+  const [rootPayload, segmentPayloads] = await Promise.all([createRootCriticalMetricsPayload(interactionId, interaction, vcMetrics), fg('platform_ufo_segment_critical_metrics') ? createSegmentMetricsPayloads(interactionId, interaction) : []]);
+  return [rootPayload, ...segmentPayloads].filter(v => v != null);
 }

package/dist/es2019/create-payload/critical-metrics-payload/root-metrics.js

@@ -50,6 +50,10 @@ export async function createRootCriticalMetricsPayload(interactionId, interactio
   const pageVisibilityAtTTI = getPageVisibilityUpToTTI(interaction);
   const pageVisibilityAtTTAI = getPageVisibilityUpToTTAI(interaction);
   const interactionStatus = getInteractionStatus(interaction);
+  if (interactionStatus.originalInteractionStatus !== 'SUCCEEDED') {
+    // To reduce payload sent from the client, we don't send critical perf metrics for non-success interactions
+    return null;
+  }
   const newUFOName = sanitizeUfoName(ufoName);
 
   // Get performance metrics

package/dist/es2019/create-payload/critical-metrics-payload/segment-metrics/create-segment-metrics.js

@@ -97,6 +97,10 @@ export async function createSegmentMetricsPayloads(interactionId, interaction) {
       status,
       abortReason: segmentAbortReason
     } = getSegmentStatus(interaction, segment);
+    if (status !== 'SUCCEEDED') {
+      // To reduce payload sent from the client, we don't send critical perf metrics for non-success interactions
+      continue;
+    }
     const properties = {
       // Basic metadata
       'event:hostname': ((_window$location = window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) || 'unknown',

package/dist/es2019/custom-cohort-data/index.js

@@ -0,0 +1,30 @@
+import { useContext, useMemo } from 'react';
+import UFOInteractionContext from '../interaction-context';
+import { getInteractionId } from '../interaction-id-context';
+import { addCohortingCustomData } from '../interaction-metrics';
+export default function UFOCustomCohortData({
+  dataKey,
+  value
+}) {
+  const interactionContext = useContext(UFOInteractionContext);
+  useMemo(() => {
+    if (!interactionContext) {
+      return;
+    }
+    const interactionId = getInteractionId();
+    const currentInteractionId = interactionId.current;
+    if (!currentInteractionId) {
+      return;
+    }
+    addCohortingCustomData(currentInteractionId, dataKey, value);
+  }, [dataKey, value, interactionContext]);
+  return null;
+}
+export function addUFOCustomCohortData(key, value) {
+  const interactionId = getInteractionId();
+  const currentInteractionId = interactionId.current;
+  if (!currentInteractionId) {
+    return;
+  }
+  addCohortingCustomData(currentInteractionId, key, value);
+}

package/dist/es2019/vc/vc-observer-new/viewport-observer/index.js

@@ -6,7 +6,7 @@ import { RLLPlaceholderHandlers } from '../../vc-observer/observers/rll-placehol
 import { createIntersectionObserver } from './intersection-observer';
 import createMutationObserver from './mutation-observer';
 import createPerformanceObserver from './performance-observer';
-import { checkThirdPartySegmentWithIgnoreReason, createMutationTypeWithIgnoredReason } from './utils/get-component-name-and-child-props';
+import checkWithinComponentAndExtractChildProps from './utils/check-within-component-and-extract-child-props';
 import isInVCIgnoreIfNoLayoutShiftMarker from './utils/is-in-vc-ignore-if-no-layout-shift-marker';
 function isElementVisible(element) {
   if (!(element instanceof HTMLElement)) {
@@ -186,13 +186,11 @@ export default class ViewportObserver {
           continue;
         }
         const {
-          isWithinThirdPartySegment,
-          ignoredReason
-        } = checkThirdPartySegmentWithIgnoreReason(addedNode);
+          isWithin: isWithinThirdPartySegment
+        } = checkWithinComponentAndExtractChildProps(addedNode, 'UFOThirdPartySegment');
         if (isWithinThirdPartySegment) {
           var _this$intersectionObs7;
-          const assignedReason = createMutationTypeWithIgnoredReason(ignoredReason || 'third-party-element');
-          (_this$intersectionObs7 = this.intersectionObserver) === null || _this$intersectionObs7 === void 0 ? void 0 : _this$intersectionObs7.watchAndTag(addedNode, assignedReason);
+          (_this$intersectionObs7 = this.intersectionObserver) === null || _this$intersectionObs7 === void 0 ? void 0 : _this$intersectionObs7.watchAndTag(addedNode, 'mutation:third-party-element');
           continue;
         }
         (_this$intersectionObs8 = this.intersectionObserver) === null || _this$intersectionObs8 === void 0 ? void 0 : _this$intersectionObs8.watchAndTag(addedNode, createElementMutationsWatcher(removedNodeRects));
@@ -245,13 +243,11 @@ export default class ViewportObserver {
           };
         }
         const {
-          isWithinThirdPartySegment,
-          ignoredReason
-        } = checkThirdPartySegmentWithIgnoreReason(target);
+          isWithin: isWithinThirdPartySegment
+        } = checkWithinComponentAndExtractChildProps(target, 'UFOThirdPartySegment');
         if (isWithinThirdPartySegment) {
-          const assignedReason = createMutationTypeWithIgnoredReason(ignoredReason || 'third-party-element');
           return {
-            type: assignedReason,
+            type: 'mutation:third-party-element',
             mutationData: {
               attributeName,
               oldValue,

package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/{get-component-name-and-child-props.js → check-within-component-and-extract-child-props.js}

@@ -1,13 +1,10 @@
 import { fg } from '@atlaskit/platform-feature-flags';
-// Helper function to find React fiber on an element
-const findReactFiber = element => {
-  const key = Object.keys(element).find(key => key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$'));
-  return key ? element[key] : null;
-};
+import findReactFiber from './find-react-fiber';
+import getComponentName from './get-component-name';
 
 // Using the React Fiber tree to traverse up the DOM and check if a node is within a specific component
 // and extract child component props if needed.
-export function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
+export default function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
   let fiber = null;
   if (fg('platform_ufo_handle_non_react_element_for_3p')) {
     // Walk up the DOM tree to find React fiber (handles non-React-rendered elements)
@@ -33,14 +30,7 @@ export function checkWithinComponentAndExtractChildProps(node, targetComponentNa
   let currentFiber = fiber;
   let childProp;
   while (currentFiber) {
-    let componentName;
-    if (currentFiber.type) {
-      if (typeof currentFiber.type === 'function') {
-        componentName = currentFiber.type.displayName || currentFiber.type.name;
-      } else if (typeof currentFiber.type === 'object' && (currentFiber.type.displayName || currentFiber.type.name)) {
-        componentName = currentFiber.type.displayName || currentFiber.type.name;
-      }
-    }
+    const componentName = getComponentName(currentFiber);
 
     // Check if this is a child component we're looking for
     if (childComponentConfig && componentName === childComponentConfig.componentName) {
@@ -65,21 +55,4 @@ export function checkWithinComponentAndExtractChildProps(node, targetComponentNa
   return {
     isWithin: false
   };
-}
-
-// Check if the node is within a UFOThirdPartySegment and extract any UFOIgnoreHolds reason
-export function checkThirdPartySegmentWithIgnoreReason(node) {
-  const result = checkWithinComponentAndExtractChildProps(node, 'UFOThirdPartySegment', {
-    componentName: 'UFOIgnoreHolds',
-    propName: 'reason'
-  });
-  return {
-    isWithinThirdPartySegment: result.isWithin,
-    ignoredReason: result.childProp
-  };
-}
-
-// Helper function to create mutation type from UFOIgnoreHoldsReason
-export function createMutationTypeWithIgnoredReason(reason) {
-  return `mutation:${reason}`;
 }

package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.js

@@ -0,0 +1,10 @@
+// Helper function to find React fiber on an element
+export default function findReactFiber(element) {
+  // Use for...in loop instead of Object.keys().find() to avoid creating an array
+  for (const key in element) {
+    if (key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$')) {
+      return element[key];
+    }
+  }
+  return null;
+}

package/dist/es2019/vc/vc-observer-new/viewport-observer/utils/get-component-name.js

@@ -0,0 +1,11 @@
+// Helper function to extract component name from fiber
+export default function getComponentName(fiber) {
+  const type = fiber === null || fiber === void 0 ? void 0 : fiber.type;
+  if (!type) {
+    return undefined;
+  }
+  if (typeof type === 'function' || typeof type === 'object') {
+    return type.displayName || type.name;
+  }
+  return undefined;
+}

package/dist/esm/create-payload/critical-metrics-payload/index.js

@@ -2,6 +2,7 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
+import { fg } from '@atlaskit/platform-feature-flags';
 import { createRootCriticalMetricsPayload } from './root-metrics';
 import { createSegmentMetricsPayloads } from './segment-metrics/create-segment-metrics';
 export function createCriticalMetricsPayloads(_x, _x2, _x3) {
@@ -14,13 +15,15 @@ function _createCriticalMetricsPayloads() {
       while (1) switch (_context.prev = _context.next) {
         case 0:
           _context.next = 2;
-          return Promise.all([createRootCriticalMetricsPayload(interactionId, interaction, vcMetrics), createSegmentMetricsPayloads(interactionId, interaction)]);
+          return Promise.all([createRootCriticalMetricsPayload(interactionId, interaction, vcMetrics), fg('platform_ufo_segment_critical_metrics') ? createSegmentMetricsPayloads(interactionId, interaction) : []]);
         case 2:
           _yield$Promise$all = _context.sent;
           _yield$Promise$all2 = _slicedToArray(_yield$Promise$all, 2);
           rootPayload = _yield$Promise$all2[0];
           segmentPayloads = _yield$Promise$all2[1];
-          return _context.abrupt("return", [rootPayload].concat(_toConsumableArray(segmentPayloads)));
+          return _context.abrupt("return", [rootPayload].concat(_toConsumableArray(segmentPayloads)).filter(function (v) {
+            return v != null;
+          }));
         case 7:
         case "end":
           return _context.stop();

package/dist/esm/create-payload/critical-metrics-payload/root-metrics.js

@@ -51,11 +51,17 @@ function _createRootCriticalMetricsPayload() {
           pageVisibilityAtTTI = getPageVisibilityUpToTTI(interaction);
           pageVisibilityAtTTAI = getPageVisibilityUpToTTAI(interaction);
           interactionStatus = getInteractionStatus(interaction);
+          if (!(interactionStatus.originalInteractionStatus !== 'SUCCEEDED')) {
+            _context.next = 9;
+            break;
+          }
+          return _context.abrupt("return", null);
+        case 9:
           newUFOName = sanitizeUfoName(ufoName); // Get performance metrics
           ttai = getTTAI(interaction);
-          _context.next = 11;
+          _context.next = 13;
           return getPaintMetrics(type, end);
-        case 11:
+        case 13:
           paintMetrics = _context.sent;
           navigationMetrics = getNavigationMetrics(type);
           ssrSuccess = getSSRSuccess(type); // Calculate BM3 metrics (TTI and FMP) directly
@@ -68,14 +74,14 @@ function _createRootCriticalMetricsPayload() {
           }); // Use provided vcMetrics or calculate if not provided
           _context.t0 = vcMetrics;
           if (_context.t0) {
-            _context.next = 23;
+            _context.next = 25;
             break;
           }
-          _context.next = 22;
+          _context.next = 24;
           return getVCMetrics(interaction);
-        case 22:
+        case 24:
           _context.t0 = _context.sent;
-        case 23:
+        case 25:
           finalVCMetrics = _context.t0;
           ttvc = (_finalVCMetrics$ufoV = finalVCMetrics['ufo:vc:rev']) === null || _finalVCMetrics$ufoV === void 0 ? void 0 : _finalVCMetrics$ufoV.map(function (revision) {
             if (revision['metric:vc90'] === null || revision.clean !== true) {
@@ -164,7 +170,7 @@ function _createRootCriticalMetricsPayload() {
             }
           };
           return _context.abrupt("return", payload);
-        case 30:
+        case 32:
         case "end":
           return _context.stop();
       }

package/dist/esm/create-payload/critical-metrics-payload/segment-metrics/create-segment-metrics.js

@@ -19,7 +19,7 @@ export function createSegmentMetricsPayloads(_x, _x2) {
 function _createSegmentMetricsPayloads() {
   _createSegmentMetricsPayloads = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(interactionId, interaction) {
     var _interaction$cohortin;
-    var config, browserMetadata, cohortingCustomData, pageVisibilityAtTTAI, knownSegments, reactProfilerTimings, rate, routeName, previousInteractionName, isPreviousInteractionAborted, abortedByInteractionName, segmentsByName, _iterator, _step, _loop, _ret, payloads, _iterator2, _step2, _loop2;
+    var config, browserMetadata, cohortingCustomData, pageVisibilityAtTTAI, knownSegments, reactProfilerTimings, rate, routeName, previousInteractionName, isPreviousInteractionAborted, abortedByInteractionName, segmentsByName, _iterator, _step, _loop, _ret, payloads, _iterator2, _step2, _loop2, _ret2;
     return _regeneratorRuntime.wrap(function _callee$(_context3) {
       while (1) switch (_context3.prev = _context3.next) {
         case 0:
@@ -141,13 +141,19 @@ function _createSegmentMetricsPayloads() {
                     _context2.next = 8;
                     break;
                   }
-                  return _context2.abrupt("return", 1);
+                  return _context2.abrupt("return", 0);
                 case 8:
                   lastTiming = segmentProfilerTimings[segmentProfilerTimings.length - 1];
                   startTime = isRootSegment ? interaction.start : firstMountTiming.startTime;
                   endTime = lastTiming.commitTime;
                   ttai = Math.round(endTime - startTime);
                   _getSegmentStatus = getSegmentStatus(interaction, segment), status = _getSegmentStatus.status, segmentAbortReason = _getSegmentStatus.abortReason;
+                  if (!(status !== 'SUCCEEDED')) {
+                    _context2.next = 15;
+                    break;
+                  }
+                  return _context2.abrupt("return", 0);
+                case 15:
                   properties = _objectSpread({
                     // Basic metadata
                     'event:hostname': ((_window$location = window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) || 'unknown',
@@ -199,7 +205,7 @@ function _createSegmentMetricsPayloads() {
                     }
                   };
                   payloads.push(payload);
-                case 16:
+                case 18:
                 case "end":
                   return _context2.stop();
               }
@@ -208,37 +214,38 @@ function _createSegmentMetricsPayloads() {
           _iterator2.s();
         case 32:
           if ((_step2 = _iterator2.n()).done) {
-            _context3.next = 38;
+            _context3.next = 39;
             break;
           }
           return _context3.delegateYield(_loop2(), "t2", 34);
         case 34:
-          if (!_context3.t2) {
-            _context3.next = 36;
+          _ret2 = _context3.t2;
+          if (!(_ret2 === 0)) {
+            _context3.next = 37;
             break;
           }
-          return _context3.abrupt("continue", 36);
-        case 36:
+          return _context3.abrupt("continue", 37);
+        case 37:
           _context3.next = 32;
           break;
-        case 38:
-          _context3.next = 43;
+        case 39:
+          _context3.next = 44;
           break;
-        case 40:
-          _context3.prev = 40;
+        case 41:
+          _context3.prev = 41;
           _context3.t3 = _context3["catch"](29);
           _iterator2.e(_context3.t3);
-        case 43:
-          _context3.prev = 43;
+        case 44:
+          _context3.prev = 44;
           _iterator2.f();
-          return _context3.finish(43);
-        case 46:
-          return _context3.abrupt("return", payloads);
+          return _context3.finish(44);
         case 47:
+          return _context3.abrupt("return", payloads);
+        case 48:
         case "end":
           return _context3.stop();
       }
-    }, _callee, null, [[9, 21, 24, 27], [29, 40, 43, 46]]);
+    }, _callee, null, [[9, 21, 24, 27], [29, 41, 44, 47]]);
   }));
   return _createSegmentMetricsPayloads.apply(this, arguments);
 }

package/dist/esm/custom-cohort-data/index.js

@@ -0,0 +1,29 @@
+import { useContext, useMemo } from 'react';
+import UFOInteractionContext from '../interaction-context';
+import { getInteractionId } from '../interaction-id-context';
+import { addCohortingCustomData } from '../interaction-metrics';
+export default function UFOCustomCohortData(_ref) {
+  var dataKey = _ref.dataKey,
+    value = _ref.value;
+  var interactionContext = useContext(UFOInteractionContext);
+  useMemo(function () {
+    if (!interactionContext) {
+      return;
+    }
+    var interactionId = getInteractionId();
+    var currentInteractionId = interactionId.current;
+    if (!currentInteractionId) {
+      return;
+    }
+    addCohortingCustomData(currentInteractionId, dataKey, value);
+  }, [dataKey, value, interactionContext]);
+  return null;
+}
+export function addUFOCustomCohortData(key, value) {
+  var interactionId = getInteractionId();
+  var currentInteractionId = interactionId.current;
+  if (!currentInteractionId) {
+    return;
+  }
+  addCohortingCustomData(currentInteractionId, key, value);
+}

package/dist/esm/vc/vc-observer-new/viewport-observer/index.js

@@ -13,7 +13,7 @@ import { RLLPlaceholderHandlers } from '../../vc-observer/observers/rll-placehol
 import { createIntersectionObserver } from './intersection-observer';
 import createMutationObserver from './mutation-observer';
 import createPerformanceObserver from './performance-observer';
-import { checkThirdPartySegmentWithIgnoreReason, createMutationTypeWithIgnoredReason } from './utils/get-component-name-and-child-props';
+import checkWithinComponentAndExtractChildProps from './utils/check-within-component-and-extract-child-props';
 import isInVCIgnoreIfNoLayoutShiftMarker from './utils/is-in-vc-ignore-if-no-layout-shift-marker';
 function isElementVisible(element) {
   if (!(element instanceof HTMLElement)) {
@@ -118,7 +118,7 @@ var ViewportObserver = /*#__PURE__*/function () {
               _context2.prev = 4;
               _loop = /*#__PURE__*/_regeneratorRuntime.mark(function _loop() {
                 var _this$intersectionObs8;
-                var addedNodeRef, addedNode, ssrState, SSRStateEnum, _this$intersectionObs, _this$intersectionObs2, ssrPlaceholderHandler, result, _this$intersectionObs3, _result, _this$intersectionObs4, sameDeletedNode, isInIgnoreLsMarker, isNoLsMarkerEnabled, _this$intersectionObs5, _this$intersectionObs6, _checkThirdPartySegme, isWithinThirdPartySegment, ignoredReason, _this$intersectionObs7, assignedReason;
+                var addedNodeRef, addedNode, ssrState, SSRStateEnum, _this$intersectionObs, _this$intersectionObs2, ssrPlaceholderHandler, result, _this$intersectionObs3, _result, _this$intersectionObs4, sameDeletedNode, isInIgnoreLsMarker, isNoLsMarkerEnabled, _this$intersectionObs5, _this$intersectionObs6, _checkWithinComponent, isWithinThirdPartySegment, _this$intersectionObs7;
                 return _regeneratorRuntime.wrap(function _loop$(_context) {
                   while (1) switch (_context.prev = _context.next) {
                     case 0:
@@ -228,17 +228,16 @@ var ViewportObserver = /*#__PURE__*/function () {
                       (_this$intersectionObs6 = _this.intersectionObserver) === null || _this$intersectionObs6 === void 0 || _this$intersectionObs6.watchAndTag(addedNode, 'mutation:media');
                       return _context.abrupt("return", 0);
                     case 45:
-                      _checkThirdPartySegme = checkThirdPartySegmentWithIgnoreReason(addedNode), isWithinThirdPartySegment = _checkThirdPartySegme.isWithinThirdPartySegment, ignoredReason = _checkThirdPartySegme.ignoredReason;
+                      _checkWithinComponent = checkWithinComponentAndExtractChildProps(addedNode, 'UFOThirdPartySegment'), isWithinThirdPartySegment = _checkWithinComponent.isWithin;
                       if (!isWithinThirdPartySegment) {
-                        _context.next = 50;
+                        _context.next = 49;
                         break;
                       }
-                      assignedReason = createMutationTypeWithIgnoredReason(ignoredReason || 'third-party-element');
-                      (_this$intersectionObs7 = _this.intersectionObserver) === null || _this$intersectionObs7 === void 0 || _this$intersectionObs7.watchAndTag(addedNode, assignedReason);
+                      (_this$intersectionObs7 = _this.intersectionObserver) === null || _this$intersectionObs7 === void 0 || _this$intersectionObs7.watchAndTag(addedNode, 'mutation:third-party-element');
                       return _context.abrupt("return", 0);
-                    case 50:
+                    case 49:
                       (_this$intersectionObs8 = _this.intersectionObserver) === null || _this$intersectionObs8 === void 0 || _this$intersectionObs8.watchAndTag(addedNode, createElementMutationsWatcher(removedNodeRects));
-                    case 51:
+                    case 50:
                     case "end":
                       return _context.stop();
                   }
@@ -326,13 +325,11 @@ var ViewportObserver = /*#__PURE__*/function () {
             }
           };
         }
-        var _checkThirdPartySegme2 = checkThirdPartySegmentWithIgnoreReason(target),
-          isWithinThirdPartySegment = _checkThirdPartySegme2.isWithinThirdPartySegment,
-          ignoredReason = _checkThirdPartySegme2.ignoredReason;
+        var _checkWithinComponent2 = checkWithinComponentAndExtractChildProps(target, 'UFOThirdPartySegment'),
+          isWithinThirdPartySegment = _checkWithinComponent2.isWithin;
         if (isWithinThirdPartySegment) {
-          var assignedReason = createMutationTypeWithIgnoredReason(ignoredReason || 'third-party-element');
           return {
-            type: assignedReason,
+            type: 'mutation:third-party-element',
             mutationData: {
               attributeName: attributeName,
               oldValue: oldValue,

package/dist/esm/vc/vc-observer-new/viewport-observer/utils/{get-component-name-and-child-props.js → check-within-component-and-extract-child-props.js}

@@ -1,19 +1,13 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _typeof from "@babel/runtime/helpers/typeof";
 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) { _defineProperty(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; }
 import { fg } from '@atlaskit/platform-feature-flags';
-// Helper function to find React fiber on an element
-var findReactFiber = function findReactFiber(element) {
-  var key = Object.keys(element).find(function (key) {
-    return key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$');
-  });
-  return key ? element[key] : null;
-};
+import findReactFiber from './find-react-fiber';
+import getComponentName from './get-component-name';
 
 // Using the React Fiber tree to traverse up the DOM and check if a node is within a specific component
 // and extract child component props if needed.
-export function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
+export default function checkWithinComponentAndExtractChildProps(node, targetComponentName, childComponentConfig) {
   var fiber = null;
   if (fg('platform_ufo_handle_non_react_element_for_3p')) {
     // Walk up the DOM tree to find React fiber (handles non-React-rendered elements)
@@ -39,14 +33,7 @@ export function checkWithinComponentAndExtractChildProps(node, targetComponentNa
   var currentFiber = fiber;
   var childProp;
   while (currentFiber) {
-    var componentName = void 0;
-    if (currentFiber.type) {
-      if (typeof currentFiber.type === 'function') {
-        componentName = currentFiber.type.displayName || currentFiber.type.name;
-      } else if (_typeof(currentFiber.type) === 'object' && (currentFiber.type.displayName || currentFiber.type.name)) {
-        componentName = currentFiber.type.displayName || currentFiber.type.name;
-      }
-    }
+    var componentName = getComponentName(currentFiber);
 
     // Check if this is a child component we're looking for
     if (childComponentConfig && componentName === childComponentConfig.componentName) {
@@ -70,21 +57,4 @@ export function checkWithinComponentAndExtractChildProps(node, targetComponentNa
   return {
     isWithin: false
   };
-}
-
-// Check if the node is within a UFOThirdPartySegment and extract any UFOIgnoreHolds reason
-export function checkThirdPartySegmentWithIgnoreReason(node) {
-  var result = checkWithinComponentAndExtractChildProps(node, 'UFOThirdPartySegment', {
-    componentName: 'UFOIgnoreHolds',
-    propName: 'reason'
-  });
-  return {
-    isWithinThirdPartySegment: result.isWithin,
-    ignoredReason: result.childProp
-  };
-}
-
-// Helper function to create mutation type from UFOIgnoreHoldsReason
-export function createMutationTypeWithIgnoredReason(reason) {
-  return "mutation:".concat(reason);
 }

package/dist/esm/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.js

@@ -0,0 +1,10 @@
+// Helper function to find React fiber on an element
+export default function findReactFiber(element) {
+  // Use for...in loop instead of Object.keys().find() to avoid creating an array
+  for (var key in element) {
+    if (key.startsWith('__reactFiber$') || key.startsWith('__reactInternalInstance$')) {
+      return element[key];
+    }
+  }
+  return null;
+}

package/dist/esm/vc/vc-observer-new/viewport-observer/utils/get-component-name.js

@@ -0,0 +1,12 @@
+import _typeof from "@babel/runtime/helpers/typeof";
+// Helper function to extract component name from fiber
+export default function getComponentName(fiber) {
+  var type = fiber === null || fiber === void 0 ? void 0 : fiber.type;
+  if (!type) {
+    return undefined;
+  }
+  if (typeof type === 'function' || _typeof(type) === 'object') {
+    return type.displayName || type.name;
+  }
+  return undefined;
+}

package/dist/types/create-payload/critical-metrics-payload/root-metrics.d.ts

@@ -4,4 +4,4 @@ import type { CriticalMetricsPayload } from './types';
 export type { CriticalMetricsPayload, CriticalMetricsPayloadProperties } from './types';
 export declare function createRootCriticalMetricsPayload(interactionId: string, interaction: InteractionMetrics, vcMetrics?: VCResult & {
     'metric:vc90'?: number | null;
-}): Promise<CriticalMetricsPayload>;
+}): Promise<CriticalMetricsPayload | null>;

package/dist/types/custom-cohort-data/index.d.ts

@@ -0,0 +1,4 @@
+import type { UFOCustomCohortDataProps } from './types';
+export type { UFOCustomCohortDataProps } from './types';
+export default function UFOCustomCohortData({ dataKey, value }: UFOCustomCohortDataProps): null;
+export declare function addUFOCustomCohortData(key: string, value: number | boolean | string | null | undefined): void;

package/dist/types/custom-cohort-data/types.d.ts

@@ -0,0 +1,4 @@
+export type UFOCustomCohortDataProps = {
+    dataKey: string;
+    value: number | boolean | string | null | undefined;
+};

package/dist/types/vc/vc-observer-new/viewport-observer/utils/check-within-component-and-extract-child-props.d.ts

@@ -0,0 +1,8 @@
+export default function checkWithinComponentAndExtractChildProps<T = string>(node: HTMLElement, targetComponentName: string, childComponentConfig?: {
+    componentName: string;
+    propName: string;
+    extractValue?: (props: any) => T;
+}): {
+    isWithin: boolean;
+    childProp?: T;
+};

package/dist/types/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.d.ts

@@ -0,0 +1 @@
+export default function findReactFiber(element: HTMLElement): any;

package/dist/types/vc/vc-observer-new/viewport-observer/utils/get-component-name.d.ts

@@ -0,0 +1 @@
+export default function getComponentName(fiber: any): string | undefined;

package/dist/types-ts4.5/create-payload/critical-metrics-payload/root-metrics.d.ts

@@ -4,4 +4,4 @@ import type { CriticalMetricsPayload } from './types';
 export type { CriticalMetricsPayload, CriticalMetricsPayloadProperties } from './types';
 export declare function createRootCriticalMetricsPayload(interactionId: string, interaction: InteractionMetrics, vcMetrics?: VCResult & {
     'metric:vc90'?: number | null;
-}): Promise<CriticalMetricsPayload>;
+}): Promise<CriticalMetricsPayload | null>;

package/dist/types-ts4.5/custom-cohort-data/index.d.ts

@@ -0,0 +1,4 @@
+import type { UFOCustomCohortDataProps } from './types';
+export type { UFOCustomCohortDataProps } from './types';
+export default function UFOCustomCohortData({ dataKey, value }: UFOCustomCohortDataProps): null;
+export declare function addUFOCustomCohortData(key: string, value: number | boolean | string | null | undefined): void;

package/dist/types-ts4.5/custom-cohort-data/types.d.ts

@@ -0,0 +1,4 @@
+export type UFOCustomCohortDataProps = {
+    dataKey: string;
+    value: number | boolean | string | null | undefined;
+};

package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/check-within-component-and-extract-child-props.d.ts

@@ -0,0 +1,8 @@
+export default function checkWithinComponentAndExtractChildProps<T = string>(node: HTMLElement, targetComponentName: string, childComponentConfig?: {
+    componentName: string;
+    propName: string;
+    extractValue?: (props: any) => T;
+}): {
+    isWithin: boolean;
+    childProp?: T;
+};

package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/find-react-fiber.d.ts

@@ -0,0 +1 @@
+export default function findReactFiber(element: HTMLElement): any;

package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/get-component-name.d.ts

@@ -0,0 +1 @@
+export default function getComponentName(fiber: any): string | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/react-ufo",
-	"version": "4.0.2",
+	"version": "4.1.0",
 	"description": "Parts of React UFO that are publicly available",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -35,6 +35,7 @@
 		"./create-payload": "./src/create-payload/index.ts",
 		"./create-post-interaction-log-payload": "./src/create-post-interaction-log-payload/index.ts",
 		"./custom-data": "./src/custom-data/index.ts",
+		"./custom-cohort-data": "./src/custom-cohort-data/index.ts",
 		"./custom-mark": "./src/custom-mark/index.ts",
 		"./custom-spans": "./src/custom-spans/index.ts",
 		"./custom-timings": "./src/custom-timings/index.ts",
@@ -214,6 +215,9 @@
 		},
 		"platform_ufo_handle_non_react_element_for_3p": {
 			"type": "boolean"
+		},
+		"platform_ufo_segment_critical_metrics": {
+			"type": "boolean"
 		}
 	}
 }

package/dist/types/vc/vc-observer-new/viewport-observer/utils/get-component-name-and-child-props.d.ts

@@ -1,15 +0,0 @@
-import type { UFOIgnoreHoldsReason } from '../../../../ignore-holds';
-import type { VCObserverEntryType } from '../../types';
-export declare function checkWithinComponentAndExtractChildProps<T = string>(node: HTMLElement, targetComponentName: string, childComponentConfig?: {
-    componentName: string;
-    propName: string;
-    extractValue?: (props: any) => T;
-}): {
-    isWithin: boolean;
-    childProp?: T;
-};
-export declare function checkThirdPartySegmentWithIgnoreReason(node: HTMLElement): {
-    isWithinThirdPartySegment: boolean;
-    ignoredReason?: UFOIgnoreHoldsReason;
-};
-export declare function createMutationTypeWithIgnoredReason(reason: UFOIgnoreHoldsReason): VCObserverEntryType;

package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/utils/get-component-name-and-child-props.d.ts

@@ -1,15 +0,0 @@
-import type { UFOIgnoreHoldsReason } from '../../../../ignore-holds';
-import type { VCObserverEntryType } from '../../types';
-export declare function checkWithinComponentAndExtractChildProps<T = string>(node: HTMLElement, targetComponentName: string, childComponentConfig?: {
-    componentName: string;
-    propName: string;
-    extractValue?: (props: any) => T;
-}): {
-    isWithin: boolean;
-    childProp?: T;
-};
-export declare function checkThirdPartySegmentWithIgnoreReason(node: HTMLElement): {
-    isWithinThirdPartySegment: boolean;
-    ignoredReason?: UFOIgnoreHoldsReason;
-};
-export declare function createMutationTypeWithIgnoredReason(reason: UFOIgnoreHoldsReason): VCObserverEntryType;