@atlaskit/react-ufo 2.4.7 → 2.5.1

package/dist/es2019/interaction-metrics-init/index.js

@@ -2,7 +2,7 @@ import { unstable_IdlePriority as idlePriority, unstable_scheduleCallback as sch
 import { startLighthouseObserver } from '../additional-payload';
 import { setUFOConfig } from '../config';
 import { setupHiddenTimingCapture } from '../hidden-timing';
-import { experimentalInteractionLog, postInteractionLog, sinkExperimentalHandler, sinkInteractionHandler, sinkPostInteractionLogHandler } from '../interaction-metrics';
+import { postInteractionLog, sinkInteractionHandler, sinkPostInteractionLogHandler } from '../interaction-metrics';
 import { getVCObserver } from '../vc';
 let initialized = false;
 function sinkInteraction(instance, payloadPackage) {
@@ -15,14 +15,6 @@ function sinkInteraction(instance, payloadPackage) {
     });
   });
 }
-function sinkExperimentalInteractionMetrics(instance, payloadPackage) {
-  sinkExperimentalHandler((interactionId, interaction) => {
-    scheduleCallback(idlePriority, () => {
-      const payload = payloadPackage.createExperimentalInteractionMetricsPayload(interactionId, interaction);
-      instance.sendOperationalEvent(payload);
-    });
-  });
-}
 function sinkPostInteractionLog(instance, createPostInteractionLogPayload) {
   sinkPostInteractionLogHandler(logOutput => {
     scheduleCallback(idlePriority, () => {
@@ -53,32 +45,27 @@ export const init = (analyticsWebClientAsync, config) => {
     postInteractionLog.startVCObserver({
       startTime: 0
     });
-    experimentalInteractionLog.initializeVCObserver(vcOptions).startVCObserver({
-      startTime: 0
-    });
   }
   setupHiddenTimingCapture();
   startLighthouseObserver();
   initialized = true;
-  Promise.all([analyticsWebClientAsync, import( /* webpackChunkName: "create-payloads" */'../create-payload'), import( /* webpackChunkName: "create-experimental-interaction-metrics-payload" */'../create-experimental-interaction-metrics-payload'), import( /* webpackChunkName: "create-post-interaction-log-payload" */'../create-post-interaction-log-payload')]).then(([awc, payloadPackage, createExperimentalInteractionMetricsPayload, createPostInteractionLogPayloadPackage]) => {
+  Promise.all([analyticsWebClientAsync,
+  // eslint-disable-next-line import/dynamic-import-chunkname
+  import( /* webpackChunkName: "create-payloads" */'../create-payload'),
+  // eslint-disable-next-line import/dynamic-import-chunkname
+  import( /* webpackChunkName: "create-post-intreaction-log-payload" */'../create-post-interaction-log-payload')]).then(([awc, payloadPackage, createPostInteractionLogPayloadPackage]) => {
     if (awc.getAnalyticsWebClientPromise) {
       awc.getAnalyticsWebClientPromise().then(client => {
-        var _config$experimentalI, _config$postInteracti;
+        var _config$postInteracti;
         const instance = client.getInstance();
         sinkInteraction(instance, payloadPackage);
-        if (config !== null && config !== void 0 && (_config$experimentalI = config.experimentalInteractionMetrics) !== null && _config$experimentalI !== void 0 && _config$experimentalI.enabled) {
-          sinkExperimentalInteractionMetrics(instance, createExperimentalInteractionMetricsPayload);
-        }
         if ((_config$postInteracti = config.postInteractionLog) !== null && _config$postInteracti !== void 0 && _config$postInteracti.enabled) {
           sinkPostInteractionLog(instance, createPostInteractionLogPayloadPackage.default);
         }
       });
     } else if (awc.sendOperationalEvent) {
-      var _config$experimentalI2, _config$postInteracti2;
+      var _config$postInteracti2;
       sinkInteraction(awc, payloadPackage);
-      if (config !== null && config !== void 0 && (_config$experimentalI2 = config.experimentalInteractionMetrics) !== null && _config$experimentalI2 !== void 0 && _config$experimentalI2.enabled) {
-        sinkExperimentalInteractionMetrics(awc, createExperimentalInteractionMetricsPayload);
-      }
       if ((_config$postInteracti2 = config.postInteractionLog) !== null && _config$postInteracti2 !== void 0 && _config$postInteracti2.enabled) {
         sinkPostInteractionLog(awc, createPostInteractionLogPayloadPackage.default);
       }

package/dist/es2019/load-hold/UFOLoadHold.js

@@ -22,7 +22,8 @@ const useLayoutEffectSAFE = typeof window === 'undefined' ? useEffect : useLayou
  *   return (
  *     <>
  *       <Skeleton />
- *       <UFOLoadHold name="card" />
+ *       <UFOLoadHold name="card">
+ *     </UFOLoadHold>
  *   )
  * }
  * ```
@@ -56,8 +57,8 @@ export default function UFOLoadHold({
   // react-18: useId instead
   const context = useContext(UFOInteractionContext);
   useLayoutEffectSAFE(() => {
-    if (hold && context != null) {
-      return context.hold(name, experimental);
+    if (hold && !experimental && context != null) {
+      return context.hold(name);
     }
   }, [hold, context, name]);
 

package/dist/es2019/segment/segment.js

@@ -67,13 +67,15 @@ export default function UFOSegment({
         }
       }
     }
-    function _internalHold(labelStack, name, experimental = false) {
+    function _internalHold(labelStack, name
+    // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+    ) {
       if (interactionId.current != null) {
         if (parentContext) {
-          return parentContext._internalHold(labelStack, name, experimental);
+          return parentContext._internalHold(labelStack, name);
         } else {
           const capturedInteractionId = interactionId.current;
-          const disposeHold = addHold(interactionId.current, labelStack, name, experimental);
+          const disposeHold = addHold(interactionId.current, labelStack, name);
           return () => {
             if (capturedInteractionId === interactionId.current) {
               disposeHold();
@@ -82,7 +84,9 @@ export default function UFOSegment({
         }
       }
     }
-    function _internalHoldByID(labelStack, id, name, remove) {
+    function _internalHoldByID(labelStack, id, name, remove
+    // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+    ) {
       if (interactionId.current != null) {
         if (parentContext) {
           parentContext._internalHoldByID(labelStack, name, id, remove);
@@ -104,8 +108,10 @@ export default function UFOSegment({
     }
     return {
       labelStack,
-      hold(name = 'unknown', experimental) {
-        return this._internalHold(this.labelStack, name, experimental);
+      hold(name = 'unknown'
+      // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+      ) {
+        return this._internalHold(this.labelStack, name);
       },
       addHoldByID(labelStack, id, name = 'unknown') {
         this._internalHoldByID(labelStack, id, name, false);

package/dist/es2019/trace-pageload/index.js

@@ -5,7 +5,7 @@ import { getActiveTrace } from '../experience-trace-id-context';
 import { DefaultInteractionID } from '../interaction-id-context';
 import { abort, addHoldByID, addNewInteraction, getActiveInteraction, removeHoldByID, updatePageLoadInteractionName } from '../interaction-metrics';
 import UFORouteName from '../route-name-context';
-export const AWAITING_PAGELOAD_NAME = 'awaiting_pageload_name';
+const AWAITING_PAGELOAD_NAME = 'awaiting_pageload_name';
 export default function traceUFOPageLoad(ufoName, routeName = ufoName) {
   const activeInteraction = getActiveInteraction();
   if (activeInteraction && !ufoName) {

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

@@ -1,4 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { fg } from '@atlaskit/platform-feature-flags';
 import { attachAbortListeners } from './attachAbortListeners';
 import { getViewportHeight, getViewportWidth } from './getViewport';
 import { Observers } from './observers';
@@ -51,7 +52,7 @@ export class VCObserver {
       const info = this.abortReason.info !== '' ? ` ${this.abortReason.info}` : '';
       return `${this.abortReason.reason}${info}`;
     });
-    _defineProperty(this, "getVCRawData", () => {
+    _defineProperty(this, "getVCRawData", stopTime => {
       this.measureStart();
       if (!this.active) {
         this.measureStop();
@@ -60,6 +61,19 @@ export class VCObserver {
       this.stop();
       const abortReasonInfo = this.getAbortReasonInfo();
       this.measureStop();
+      let componentsLog = {};
+      if (stopTime && fg('ufo-remove-vc-component-observations-after-ttai')) {
+        Object.entries(this.componentsLog).forEach(([_timestamp, value]) => {
+          const timestamp = Number(_timestamp);
+          if (stopTime > timestamp) {
+            componentsLog[timestamp] = value;
+          }
+        });
+      } else {
+        componentsLog = {
+          ...this.componentsLog
+        };
+      }
       return {
         abortReasonInfo,
         abortReason: {
@@ -69,9 +83,7 @@ export class VCObserver {
         heatmapNext: this.heatmapNext,
         outOfBoundaryInfo: this.outOfBoundaryInfo,
         totalTime: Math.round(this.totalTime + this.observers.getTotalTime()),
-        componentsLog: {
-          ...this.componentsLog
-        },
+        componentsLog,
         viewport: {
           ...this.viewport
         },
@@ -91,7 +103,7 @@ export class VCObserver {
       const startTime = performance.now();
       // add local measurement
       const fullPrefix = prefix !== undefined && prefix !== '' ? `${prefix}:` : '';
-      const rawData = vc !== undefined ? vc : this.getVCRawData();
+      const rawData = vc !== undefined ? vc : this.getVCRawData(stop);
       if (rawData === null) {
         return {};
       }

package/dist/esm/additional-payload/utils/lighthouse-metrics/utils/buffer/index.js

@@ -1,7 +1,6 @@
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _EntriesBuffer;
 import { PerformanceObserverEntryTypes } from '../../const';
 export var BufferWithMaxLength = /*#__PURE__*/function () {
   function BufferWithMaxLength() {
@@ -11,7 +10,7 @@ export var BufferWithMaxLength = /*#__PURE__*/function () {
     _defineProperty(this, "full", false);
     this.maxLength = maxLength;
   }
-  _createClass(BufferWithMaxLength, [{
+  return _createClass(BufferWithMaxLength, [{
     key: "push",
     value: function push(item) {
       if (this.full || this.maxLength === this.buffer.length) {
@@ -26,6 +25,5 @@ export var BufferWithMaxLength = /*#__PURE__*/function () {
       return this.buffer;
     }
   }]);
-  return BufferWithMaxLength;
 }();
-export var EntriesBuffer = (_EntriesBuffer = {}, _defineProperty(_EntriesBuffer, PerformanceObserverEntryTypes.LongTask, new BufferWithMaxLength()), _defineProperty(_EntriesBuffer, PerformanceObserverEntryTypes.LayoutShift, new BufferWithMaxLength()), _EntriesBuffer);
+export var EntriesBuffer = _defineProperty(_defineProperty({}, PerformanceObserverEntryTypes.LongTask, new BufferWithMaxLength()), PerformanceObserverEntryTypes.LayoutShift, new BufferWithMaxLength());

package/dist/esm/common/constants.js

@@ -1,2 +1,4 @@
 import { fg } from '@atlaskit/platform-feature-flags';
-export var REACT_UFO_VERSION = fg('react-ufo-payload-segment-compressed') ? '2.0.0' : '1.0.1';
+
+// eslint-disable-next-line @atlaskit/platform/no-module-level-eval
+export var REACT_UFO_VERSION = fg('enable-react-ufo-payload-segment-compressed') ? '2.0.0' : '1.0.1';

package/dist/esm/config/index.js

@@ -64,34 +64,13 @@ export function getInteractionRate(name, interactionKind) {
     return 0;
   }
 }
-export function getExperimentalInteractionRate(name, interactionType) {
-  try {
-    if (!config) {
-      return 0;
-    }
-    var _config2 = config,
-      experimentalInteractionMetrics = _config2.experimentalInteractionMetrics;
-    if (!(experimentalInteractionMetrics !== null && experimentalInteractionMetrics !== void 0 && experimentalInteractionMetrics.enabled)) {
-      return 0;
-    }
-    if (experimentalInteractionMetrics.rates && typeof experimentalInteractionMetrics.rates[name] === 'number') {
-      return experimentalInteractionMetrics.rates[name];
-    }
-    if (experimentalInteractionMetrics.kind && typeof experimentalInteractionMetrics.kind[interactionType] === 'number') {
-      return experimentalInteractionMetrics.kind[interactionType];
-    }
-    return 0;
-  } catch (e) {
-    return 0;
-  }
-}
 export function getPostInteractionRate(name, interactionType) {
   try {
     if (!config) {
       return 0;
     }
-    var _config3 = config,
-      postInteractionLog = _config3.postInteractionLog;
+    var _config2 = config,
+      postInteractionLog = _config2.postInteractionLog;
     if (!(postInteractionLog !== null && postInteractionLog !== void 0 && postInteractionLog.enabled)) {
       return 0;
     }
@@ -111,8 +90,8 @@ export function getCapabilityRate(capability) {
     if (!config) {
       return 0;
     }
-    var _config4 = config,
-      capabilityRate = _config4.capability;
+    var _config3 = config,
+      capabilityRate = _config3.capability;
     if (capabilityRate != null) {
       var rate = capabilityRate[capability];
       if (rate != null) {
@@ -131,8 +110,8 @@ export function getTypingPerformanceTracingMethod() {
     if (!config) {
       return defaultMethod;
     }
-    var _config5 = config,
-      typingMethod = _config5.typingMethod;
+    var _config4 = config,
+      typingMethod = _config4.typingMethod;
     if (typingMethod != null && validTypingMethods.find(function (m) {
       return m === typingMethod;
     })) {
@@ -151,8 +130,8 @@ export function getAwaitBM3TTIList() {
     if (!config) {
       return [];
     }
-    var _config6 = config,
-      awaitBM3TTI = _config6.awaitBM3TTI;
+    var _config5 = config,
+      awaitBM3TTI = _config5.awaitBM3TTI;
     if (awaitBM3TTI != null) {
       return awaitBM3TTI;
     } else {
@@ -169,8 +148,8 @@ export function getRemovePageSegmentsUFOPrefixes() {
     if (!config) {
       return false;
     }
-    var _config7 = config,
-      removePageSegmentsUFOPrefixes = _config7.removePageSegmentsUFOPrefixes;
+    var _config6 = config,
+      removePageSegmentsUFOPrefixes = _config6.removePageSegmentsUFOPrefixes;
     if (removePageSegmentsUFOPrefixes != null) {
       return removePageSegmentsUFOPrefixes;
     } else {
@@ -187,8 +166,8 @@ export function getRemoveInteractionsUFOPrefixes() {
     if (!config) {
       return false;
     }
-    var _config8 = config,
-      removeInteractionsUFOPrefixes = _config8.removeInteractionsUFOPrefixes;
+    var _config7 = config,
+      removeInteractionsUFOPrefixes = _config7.removeInteractionsUFOPrefixes;
     if (removeInteractionsUFOPrefixes != null) {
       return removeInteractionsUFOPrefixes;
     } else {
@@ -208,8 +187,8 @@ export function getUfoNameOverrides() {
     if (!config) {
       return undefined;
     }
-    var _config9 = config,
-      ufoNameOverrides = _config9.ufoNameOverrides;
+    var _config8 = config,
+      ufoNameOverrides = _config8.ufoNameOverrides;
     if (ufoNameOverrides != null) {
       return ufoNameOverrides;
     }
@@ -225,8 +204,8 @@ export function getDoNotAbortActivePressInteraction() {
     if (!config) {
       return undefined;
     }
-    var _config10 = config,
-      doNotAbortActivePressInteraction = _config10.doNotAbortActivePressInteraction;
+    var _config9 = config,
+      doNotAbortActivePressInteraction = _config9.doNotAbortActivePressInteraction;
     return doNotAbortActivePressInteraction;
   } catch (e) {
     return undefined;
@@ -239,8 +218,8 @@ export function getDoNotAbortActivePressInteractionOnTransition() {
     if (!config) {
       return undefined;
     }
-    var _config11 = config,
-      doNotAbortActivePressInteractionOnTransition = _config11.doNotAbortActivePressInteractionOnTransition;
+    var _config10 = config,
+      doNotAbortActivePressInteractionOnTransition = _config10.doNotAbortActivePressInteractionOnTransition;
     return doNotAbortActivePressInteractionOnTransition;
   } catch (e) {
     return undefined;

package/dist/esm/create-payload/common/utils/index.js

@@ -2,13 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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; }
 /* eslint-disable @typescript-eslint/no-non-null-asserted-optional-chain */
-
 import { REACT_UFO_VERSION } from '../../../common/constants';
-import { getConfig } from '../../../config';
-import { getPageVisibilityState } from '../../../hidden-timing';
-import { experimentalInteractionLog, postInteractionLog } from '../../../interaction-metrics';
-import * as ssr from '../../../ssr';
-import { getVCObserver } from '../../../vc';
 export var sanitizeUfoName = function sanitizeUfoName(name) {
   return name.replace(/_/g, '-');
 };
@@ -65,77 +59,4 @@ export function optimizeLabelStack(labelStack) {
       s: ls.segmentId
     } : {});
   });
-}
-export var getInteractionStatus = function getInteractionStatus(interaction) {
-  var originalInteractionStatus = interaction.abortReason ? 'ABORTED' : 'SUCCEEDED';
-  var hasBm3TTI = interaction.apdex.length > 0;
-  var overrideStatus = hasBm3TTI ? 'SUCCEEDED' : originalInteractionStatus;
-  return {
-    originalInteractionStatus: originalInteractionStatus,
-    overrideStatus: overrideStatus
-  };
-};
-export var getPageVisibilityUpToTTAI = function getPageVisibilityUpToTTAI(interaction) {
-  var start = interaction.start,
-    end = interaction.end;
-  return getPageVisibilityState(start, end);
-};
-export var calculateVCMetrics = function calculateVCMetrics(interaction, prefix, getVCResultFn) {
-  var _interaction$apdex;
-  var result = getVCResultFn({
-    start: interaction.start,
-    stop: interaction.end,
-    tti: (_interaction$apdex = interaction.apdex) === null || _interaction$apdex === void 0 || (_interaction$apdex = _interaction$apdex[0]) === null || _interaction$apdex === void 0 ? void 0 : _interaction$apdex.stopTime,
-    prefix: prefix,
-    vc: interaction.vc
-  });
-  var VC = result === null || result === void 0 ? void 0 : result['metrics:vc'];
-  if (!VC || !(result !== null && result !== void 0 && result["".concat(prefix, ":vc:clean")])) {
-    return result;
-  }
-  var interactionStatus = getInteractionStatus(interaction);
-  var pageVisibilityUpToTTAI = getPageVisibilityUpToTTAI(interaction);
-  if (interactionStatus.originalInteractionStatus !== 'SUCCEEDED' || pageVisibilityUpToTTAI !== 'visible') {
-    return result;
-  }
-  return result;
-};
-export function getSSRDoneTimeValue(config) {
-  var _config$ssr, _config$ssr2;
-  return config !== null && config !== void 0 && (_config$ssr = config.ssr) !== null && _config$ssr !== void 0 && _config$ssr.getSSRDoneTime ? config === null || config === void 0 || (_config$ssr2 = config.ssr) === null || _config$ssr2 === void 0 ? void 0 : _config$ssr2.getSSRDoneTime() : ssr.getSSRDoneTime();
-}
-export var getVCMetrics = function getVCMetrics(interaction) {
-  var _config$vc, _result$metricsVc;
-  var config = getConfig();
-  if (!(config !== null && config !== void 0 && (_config$vc = config.vc) !== null && _config$vc !== void 0 && _config$vc.enabled)) {
-    return {};
-  }
-  if (interaction.type !== 'page_load' && interaction.type !== 'transition') {
-    return {};
-  }
-  var ssr = interaction.type === 'page_load' && config !== null && config !== void 0 && config.ssr ? {
-    ssr: getSSRDoneTimeValue(config)
-  } : null;
-  postInteractionLog.setVCObserverSSRConfig(ssr);
-  var result = calculateVCMetrics(interaction, 'ufo', getVCObserver().getVCResult);
-  return _objectSpread(_objectSpread({}, result), {}, {
-    'metric:vc90': result === null || result === void 0 || (_result$metricsVc = result['metrics:vc']) === null || _result$metricsVc === void 0 ? void 0 : _result$metricsVc['90']
-  });
-};
-export var getExperimentalVCMetrics = function getExperimentalVCMetrics(interaction) {
-  if (experimentalInteractionLog.vcObserver) {
-    var _result$metricsVc2;
-    var result = calculateVCMetrics(interaction, 'ufo-experimental', experimentalInteractionLog.vcObserver.getVCResult);
-    return _objectSpread(_objectSpread({}, result), {}, {
-      'metric:experimental:vc90': result === null || result === void 0 || (_result$metricsVc2 = result['metrics:vc']) === null || _result$metricsVc2 === void 0 ? void 0 : _result$metricsVc2['90']
-    });
-  }
-  return null;
-};
-export var getTTAI = function getTTAI(interaction) {
-  var start = interaction.start,
-    end = interaction.end;
-  var interactionStatus = getInteractionStatus(interaction);
-  var pageVisibilityUpToTTAI = getPageVisibilityUpToTTAI(interaction);
-  return interactionStatus.originalInteractionStatus === 'SUCCEEDED' && pageVisibilityUpToTTAI === 'visible' ? Math.round(end - start) : undefined;
-};
+}