@atlaskit/react-ufo 1.0.1 → 2.0.0

package/dist/cjs/resource-timing/common/utils/resource-timing-buffer.js

@@ -0,0 +1,111 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.resourceTimingBuffer = exports.filterResourceTimings = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _roundNumber = require("../../../round-number");
+var getPerformanceObject = function getPerformanceObject() {
+  var _window;
+  return ((_window = window) !== null && _window !== void 0 ? _window : {}).performance;
+};
+var getPerformanceObserverObject = function getPerformanceObserverObject() {
+  var _window2;
+  return ((_window2 = window) !== null && _window2 !== void 0 ? _window2 : {}).PerformanceObserver;
+};
+var resourceTimingBuffer = exports.resourceTimingBuffer = {
+  timings: [],
+  maxSize: 1000,
+  observer: null,
+  transformResource: function transformResource(entry) {
+    var _entry$serverTiming, _entry$serverTiming2;
+    var duration = (0, _roundNumber.roundEpsilon)(entry.duration);
+
+    // prioritising atl-edge
+    var totalBackendTimeEntry = ((_entry$serverTiming = entry.serverTiming) === null || _entry$serverTiming === void 0 ? void 0 : _entry$serverTiming.find(function (timing) {
+      return timing.name === 'atl-edge';
+    })) || ((_entry$serverTiming2 = entry.serverTiming) === null || _entry$serverTiming2 === void 0 ? void 0 : _entry$serverTiming2.find(
+    // timing name should come from per-product config in the future
+    function (timing) {
+      return timing.name === 'total' || timing.name === 'filter-request-papi';
+    }));
+    var serverTime = totalBackendTimeEntry ? (0, _roundNumber.roundEpsilon)(totalBackendTimeEntry.duration) : undefined;
+    var networkTime = serverTime ? duration - serverTime : undefined;
+    return {
+      name: entry.name,
+      initiatorType: entry.initiatorType,
+      transferSize: entry.transferSize,
+      startTime: (0, _roundNumber.roundEpsilon)(entry.startTime),
+      duration: (0, _roundNumber.roundEpsilon)(entry.duration),
+      fetchStart: (0, _roundNumber.roundEpsilon)(entry.fetchStart || 0),
+      workerStart: (0, _roundNumber.roundEpsilon)(entry.workerStart || 0),
+      responseStart: (0, _roundNumber.roundEpsilon)(entry.responseStart || 0),
+      requestStart: (0, _roundNumber.roundEpsilon)(entry.requestStart || 0),
+      serverTime: serverTime,
+      networkTime: networkTime,
+      encodedSize: (0, _roundNumber.roundEpsilon)(entry.encodedBodySize),
+      decodedSize: (0, _roundNumber.roundEpsilon)(entry.decodedBodySize)
+    };
+  },
+  start: function start() {
+    var _performance$getEntri;
+    var performance = getPerformanceObject();
+    var PerformanceObserver = getPerformanceObserverObject();
+    if (!PerformanceObserver || !performance || typeof PerformanceObserver === 'undefined') {
+      return;
+    }
+    if (resourceTimingBuffer.observer) {
+      return;
+    }
+    var resources = (_performance$getEntri = performance.getEntriesByType) === null || _performance$getEntri === void 0 ? void 0 : _performance$getEntri.call(performance, 'resource');
+    if (resources) {
+      resourceTimingBuffer.timings = resources.map(function (resource) {
+        return resourceTimingBuffer.transformResource(resource);
+      });
+    }
+    resourceTimingBuffer.observer = new PerformanceObserver(resourceTimingBuffer.addTimings);
+    resourceTimingBuffer.observer.observe({
+      entryTypes: ['resource']
+    });
+  },
+  stop: function stop() {
+    if (resourceTimingBuffer.observer) {
+      resourceTimingBuffer.observer.disconnect();
+      resourceTimingBuffer.observer = null;
+    }
+    resourceTimingBuffer.timings = [];
+  },
+  addTimings: function addTimings(list) {
+    var _resourceTimingBuffer;
+    var entries = list.getEntries().map(function (entry) {
+      return resourceTimingBuffer.transformResource(entry);
+    });
+    var overflow = resourceTimingBuffer.timings.length + entries.length;
+    if (overflow > resourceTimingBuffer.maxSize) {
+      var fieldsToRemove = overflow - resourceTimingBuffer.maxSize;
+      resourceTimingBuffer.timings.splice(0, fieldsToRemove);
+    }
+    (_resourceTimingBuffer = resourceTimingBuffer.timings).push.apply(_resourceTimingBuffer, (0, _toConsumableArray2.default)(entries));
+  }
+};
+var isValidTiming = function isValidTiming(timing, startTime, endTime) {
+  return timing.startTime >= startTime && timing.startTime + timing.duration <= endTime;
+};
+var filterResourceTimings = exports.filterResourceTimings = function filterResourceTimings(startTime, endTime) {
+  var performance = getPerformanceObject();
+  var PerformanceObserver = getPerformanceObserverObject();
+  if (!PerformanceObserver || !resourceTimingBuffer.observer) {
+    var resources = performance === null || performance === void 0 ? void 0 : performance.getEntriesByType('resource');
+    if (resources) {
+      return resources.filter(function (timing) {
+        return isValidTiming(timing, startTime, endTime);
+      });
+    }
+    return null;
+  }
+  return resourceTimingBuffer.timings.filter(function (timing) {
+    return isValidTiming(timing, startTime, endTime);
+  });
+};

package/dist/cjs/resource-timing/index.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "configure", {
+  enumerable: true,
+  get: function get() {
+    return _config.configure;
+  }
+});
+Object.defineProperty(exports, "getResourceTimings", {
+  enumerable: true,
+  get: function get() {
+    return _main.getResourceTimings;
+  }
+});
+Object.defineProperty(exports, "startResourceTimingBuffer", {
+  enumerable: true,
+  get: function get() {
+    return _utils.startResourceTimingBuffer;
+  }
+});
+var _config = require("./common/utils/config");
+var _main = require("./main");
+var _utils = require("./utils");

package/dist/cjs/resource-timing/main.js

@@ -0,0 +1,141 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getResourceTimings = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _config = require("../config");
+var _roundNumber = require("../round-number");
+var _config2 = require("./common/utils/config");
+var _resourceTimingBuffer = require("./common/utils/resource-timing-buffer");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var cacheableTypes = ['script', 'link'];
+var resourceTypes = ['fetch', 'xmlhttprequest'];
+var CACHE_NETWORK = 'network';
+var CACHE_MEMORY = 'memory';
+var CACHE_DISK = 'disk';
+
+// eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+var calculateTransferType = function calculateTransferType(type, duration, size) {
+  if (!cacheableTypes.includes(type)) {
+    return CACHE_NETWORK;
+  }
+  if ((size === undefined || size === 0) && duration === 0) {
+    return CACHE_MEMORY;
+  }
+  if (size === 0 && duration > 0) {
+    return CACHE_DISK;
+  }
+  if (size === undefined) {
+    return null;
+  }
+  return CACHE_NETWORK;
+};
+var getWindowObject = function getWindowObject() {
+  return typeof window !== 'undefined' && !!window ? window : undefined;
+};
+var hasAccessToResourceSize = function hasAccessToResourceSize(url, type, entry, hasTimingHeaders) {
+  return !cacheableTypes.includes(type) || url.includes('localhost') || !!getWindowObject() && url.includes(window.location.hostname) || hasTimingHeaders(url, entry);
+};
+var getReportedInitiatorTypes = function getReportedInitiatorTypes(xhrEnabled) {
+  var ufoConfig = (0, _config.getConfig)();
+  if (!(ufoConfig !== null && ufoConfig !== void 0 && ufoConfig.allowedResources)) {
+    if (xhrEnabled) {
+      return ['script', 'link', 'fetch', 'xmlhttprequest'];
+    }
+    return ['script', 'link', 'fetch'];
+  }
+  return ufoConfig.allowedResources;
+};
+var evaluateAccessToResourceTimings = function evaluateAccessToResourceTimings(url, entry) {
+  return !(entry.responseStart === 0 && entry.startTime > entry.responseStart);
+};
+
+// eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+var getSizeObject = function getSizeObject(size) {
+  return size !== undefined ? {
+    size: size
+  } : null;
+};
+var getNetworkData = function getNetworkData(item, eventStart) {
+  var hasTimingHeaders = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : evaluateAccessToResourceTimings;
+  var name = item.name,
+    duration = item.duration,
+    transferSize = item.transferSize,
+    initiatorType = item.initiatorType,
+    responseStart = item.responseStart,
+    requestStart = item.requestStart,
+    serverTime = item.serverTime,
+    networkTime = item.networkTime,
+    encodedSize = item.encodedSize,
+    decodedSize = item.decodedSize;
+  var ttfb = (0, _roundNumber.roundEpsilon)(responseStart - eventStart);
+  if (!hasAccessToResourceSize(name, initiatorType, item, hasTimingHeaders)) {
+    return {};
+  }
+  if (cacheableTypes.includes(initiatorType)) {
+    var transferType = calculateTransferType(initiatorType, duration, transferSize);
+    return _objectSpread({
+      ttfb: ttfb,
+      transferType: transferType,
+      serverTime: serverTime,
+      networkTime: networkTime,
+      encodedSize: encodedSize,
+      decodedSize: decodedSize
+    }, getSizeObject(transferSize));
+  }
+  return _objectSpread({
+    ttfb: ttfb,
+    serverTime: serverTime,
+    networkTime: networkTime,
+    requestStart: requestStart
+  }, getSizeObject(transferSize));
+};
+var getResourceTimings = exports.getResourceTimings = function getResourceTimings(interactionStart, interactionEnd) {
+  var resourceTiming = {};
+  if (interactionStart === null) {
+    return resourceTiming;
+  }
+  var resources = (0, _resourceTimingBuffer.filterResourceTimings)(interactionStart, interactionEnd);
+  if (!(resources !== null && resources !== void 0 && resources.length)) {
+    return resourceTiming;
+  }
+  var _getConfig = (0, _config2.getConfig)(),
+    xhrFilter = _getConfig.xhrFilter,
+    sanitiseEndpoints = _getConfig.sanitiseEndpoints,
+    mapResources = _getConfig.mapResources,
+    hasTimingHeaders = _getConfig.hasTimingHeaders;
+  var reportedInitiatorTypes = getReportedInitiatorTypes(!!xhrFilter);
+  resources.forEach(function (item) {
+    if (!reportedInitiatorTypes.includes(item.initiatorType)) {
+      return;
+    }
+    var name = item.name,
+      startTime = item.startTime,
+      duration = item.duration,
+      workerStart = item.workerStart,
+      fetchStart = item.fetchStart,
+      initiatorType = item.initiatorType;
+    if (!name) {
+      return;
+    }
+    if (initiatorType === 'xmlhttprequest' && (xhrFilter === undefined || xhrFilter(name) === false)) {
+      return;
+    }
+    var url = resourceTypes.includes(initiatorType) ? sanitiseEndpoints(name) : mapResources(name);
+    if (!url || resourceTiming[url]) {
+      return;
+    }
+    resourceTiming[url] = _objectSpread({
+      startTime: (0, _roundNumber.roundEpsilon)(startTime - interactionStart),
+      duration: (0, _roundNumber.roundEpsilon)(duration),
+      workerStart: Math.max((0, _roundNumber.roundEpsilon)(workerStart - interactionStart), 0),
+      fetchStart: Math.max((0, _roundNumber.roundEpsilon)(fetchStart - interactionStart), 0),
+      type: initiatorType
+    }, getNetworkData(item, interactionStart, hasTimingHeaders));
+  });
+  return resourceTiming;
+};

package/dist/cjs/resource-timing/utils.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.startResourceTimingBuffer = startResourceTimingBuffer;
+var _resourceTimingBuffer = require("./common/utils/resource-timing-buffer");
+function startResourceTimingBuffer() {
+  _resourceTimingBuffer.resourceTimingBuffer.start();
+}

package/dist/cjs/round-number/index.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.roundEpsilon = void 0;
+var roundEpsilon = exports.roundEpsilon = function roundEpsilon(num) {
+  var places = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 3;
+  var factor = Math.pow(10, places);
+  return Math.round((num + Number.EPSILON) * factor) / factor;
+};

package/dist/cjs/route-name/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = getUFORouteName;
+function getUFORouteName(route) {
+  if (route.ufoName != null) {
+    return route.ufoName;
+  }
+  return route.name;
+}

package/dist/cjs/route-name-context/index.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+// The UFORouteName object is a global singleton
+var UFORouteName = {
+  current: null
+};
+var _default = exports.default = UFORouteName;

package/dist/cjs/segment/index.js

@@ -0,0 +1,9 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _segment = _interopRequireDefault(require("./segment"));
+var _default = exports.default = _segment.default;

package/dist/cjs/segment/segment-highlight.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SegmentHighlight = SegmentHighlight;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function SegmentHighlight(_ref) {
+  var segmentName = _ref.segmentName;
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    segmentHighlight = _useState2[0],
+    setSegmentHighlight = _useState2[1];
+  (0, _react.useEffect)(function () {
+    try {
+      var shouldHighlightSegments = sessionStorage.getItem('segmentsHighlight') === 'true';
+      setSegmentHighlight(shouldHighlightSegments);
+    } catch (err) {
+      /* do nothing */
+    }
+  }, []);
+  if (segmentHighlight) {
+    return (
+      /*#__PURE__*/
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
+      _react.default.createElement("span", {
+        "data-segment-name": segmentName,
+        style: {
+          display: 'none'
+        }
+      })
+    );
+  }
+  return null;
+}

package/dist/cjs/segment/segment.js

@@ -0,0 +1,247 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = UFOSegment;
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _scheduler = require("scheduler");
+var _uuid = require("uuid");
+var _coinflip = _interopRequireDefault(require("../coinflip"));
+var _config = require("../config");
+var _experienceTraceIdContext = require("../experience-trace-id-context");
+var _interactionContext = _interopRequireDefault(require("../interaction-context"));
+var _interactionIdContext = _interopRequireDefault(require("../interaction-id-context"));
+var _interactionMetrics = require("../interaction-metrics");
+var _routeNameContext = _interopRequireDefault(require("../route-name-context"));
+var _shortId = _interopRequireDefault(require("../short-id"));
+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; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != (0, _typeof2.default)(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var tryCompleteHandle;
+var AsyncSegmentHighlight = /*#__PURE__*/(0, _react.lazy)(function () {
+  return Promise.resolve().then(function () {
+    return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_ufo-segment-highlight" */'./segment-highlight'));
+  }).then(function (module) {
+    return {
+      default: module.SegmentHighlight
+    };
+  });
+});
+
+/** A portion of the page we apply measurement to */
+function UFOSegment(_ref) {
+  var _getConfig;
+  var segmentName = _ref.name,
+    children = _ref.children;
+  var parentContext = (0, _react.useContext)(_interactionContext.default);
+  var segmentId = (0, _react.useMemo)(function () {
+    return (0, _shortId.default)();
+  }, []);
+  var labelStack = (0, _react.useMemo)(function () {
+    return parentContext !== null && parentContext !== void 0 && parentContext.labelStack ? [].concat((0, _toConsumableArray2.default)(parentContext.labelStack), [{
+      name: segmentName,
+      segmentId: segmentId
+    }]) : [{
+      name: segmentName,
+      segmentId: segmentId
+    }];
+  }, [parentContext, segmentName, segmentId]);
+  var interactionId = (0, _react.useContext)(_interactionIdContext.default);
+  var interactionContext = (0, _react.useMemo)(function () {
+    (0, _interactionMetrics.addSegment)(labelStack);
+    var lastCompleteEndTime = 0;
+    function complete() {
+      var endTime = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : performance.now();
+      if (interactionId.current) {
+        if (parentContext) {
+          parentContext.complete();
+        } else {
+          var capturedInteractionId = interactionId.current;
+          if (endTime > lastCompleteEndTime) {
+            lastCompleteEndTime = endTime;
+          }
+          if (tryCompleteHandle) {
+            var _cancelAnimationFrame;
+            (_cancelAnimationFrame = cancelAnimationFrame) === null || _cancelAnimationFrame === void 0 || _cancelAnimationFrame(tryCompleteHandle);
+          }
+          (0, _scheduler.unstable_scheduleCallback)(_scheduler.unstable_NormalPriority, function () {
+            if (capturedInteractionId === interactionId.current) {
+              var _document;
+              var isPageVisible = ((_document = document) === null || _document === void 0 ? void 0 : _document.visibilityState) === 'visible';
+              var canDoRAF = typeof requestAnimationFrame !== 'undefined';
+              if (isPageVisible && canDoRAF) {
+                tryCompleteHandle = requestAnimationFrame(function () {
+                  tryCompleteHandle = requestAnimationFrame(function () {
+                    if (capturedInteractionId === interactionId.current) {
+                      (0, _interactionMetrics.tryComplete)(interactionId.current, lastCompleteEndTime);
+                    }
+                  });
+                });
+              } else {
+                (0, _interactionMetrics.tryComplete)(interactionId.current, lastCompleteEndTime);
+              }
+            }
+          });
+        }
+      }
+    }
+    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);
+        } else {
+          var capturedInteractionId = interactionId.current;
+          var disposeHold = (0, _interactionMetrics.addHold)(interactionId.current, labelStack, name);
+          return function () {
+            if (capturedInteractionId === interactionId.current) {
+              disposeHold();
+            }
+          };
+        }
+      }
+    }
+    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);
+          return;
+        }
+        if (!remove) {
+          (0, _interactionMetrics.addHoldByID)(interactionId.current, labelStack, name, id);
+        } else {
+          (0, _interactionMetrics.removeHoldByID)(interactionId.current, id);
+        }
+      }
+    }
+    if (parentContext) {
+      return _objectSpread(_objectSpread({}, parentContext), {}, {
+        labelStack: labelStack,
+        complete: complete
+      });
+    }
+    return {
+      labelStack: labelStack,
+      hold: function hold() {
+        var name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'unknown';
+        return this._internalHold(this.labelStack, name);
+      },
+      addHoldByID: function addHoldByID(labelStack, id) {
+        var name = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'unknown';
+        this._internalHoldByID(labelStack, id, name, false);
+      },
+      removeHoldByID: function removeHoldByID(labelStack, id) {
+        var name = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'unknown';
+        this._internalHoldByID(labelStack, id, name, true);
+      },
+      tracePress: function tracePress() {
+        var name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'unknown';
+        var timestamp = arguments.length > 1 ? arguments[1] : undefined;
+        if (interactionId.current != null) {
+          (0, _interactionMetrics.abortByNewInteraction)(interactionId.current, name);
+        }
+        var rate = (0, _config.getInteractionRate)(name, 'press');
+        if ((0, _coinflip.default)(rate)) {
+          var startTimestamp = timestamp !== null && timestamp !== void 0 ? timestamp : performance.now();
+          var newId = (0, _uuid.v4)();
+          interactionId.current = newId;
+          // covered experiences with tracing instrumentation:
+          // inline-result.global-issue.create-modal.submit
+          // inline-result.global-issue.create-modal-subsequent
+          (0, _experienceTraceIdContext.setInteractionActiveTrace)(newId, 'press');
+          (0, _interactionMetrics.addNewInteraction)(newId, name, 'press', startTimestamp, rate, this.labelStack, _routeNameContext.default.current, (0, _experienceTraceIdContext.getActiveTrace)());
+        }
+      },
+      retainQuery: function retainQuery(info) {
+        if (interactionId.current != null) {
+          (0, _interactionMetrics.addRequestInfo)(interactionId.current, this.labelStack, info);
+        }
+      },
+      addPreload: function addPreload(moduleId, timestamp) {
+        if (interactionId.current != null) {
+          (0, _interactionMetrics.addMark)(interactionId.current, 'bundle_preload', moduleId, this.labelStack, timestamp);
+        }
+      },
+      addLoad: function addLoad(identifier, start, end) {
+        if (interactionId.current != null) {
+          var _this$labelStack = this.labelStack,
+            _labelStack = _this$labelStack === void 0 ? [] : _this$labelStack;
+          (0, _interactionMetrics.addSpan)(interactionId.current, 'bundle_load', identifier, _labelStack, start, end);
+        }
+      },
+      addMark: function addMark(name, timestamp
+      // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+      ) {
+        if (interactionId.current != null) {
+          var time = timestamp !== null && timestamp !== void 0 ? timestamp : performance.now();
+          (0, _interactionMetrics.addMark)(interactionId.current, 'custom', name, this.labelStack, time);
+        }
+      },
+      addCustomData: function addCustomData(customData) {
+        if (interactionId.current != null) {
+          (0, _interactionMetrics.addCustomData)(interactionId.current, this.labelStack, customData);
+        }
+      },
+      addCustomTimings: function addCustomTimings(customTimings) {
+        if (interactionId.current != null) {
+          (0, _interactionMetrics.addCustomTiming)(interactionId.current, this.labelStack, customTimings);
+        }
+      },
+      addApdex: function addApdex(apdexInfo) {
+        if (interactionId.current != null) {
+          var key = apdexInfo.key,
+            stopTime = apdexInfo.stopTime,
+            startTime = apdexInfo.startTime;
+          (0, _interactionMetrics.addApdex)(interactionId.current, {
+            key: key,
+            stopTime: stopTime,
+            startTime: startTime,
+            labelStack: this.labelStack
+          });
+        }
+      },
+      onRender: function onRender(phase, actualDuration, baseDuration, startTime, commitTime) {
+        if (interactionId.current !== null) {
+          (0, _interactionMetrics.addProfilerTimings)(interactionId.current, this.labelStack, phase, actualDuration, baseDuration, startTime, commitTime);
+          this.complete(commitTime);
+        }
+      },
+      _internalHold: _internalHold,
+      _internalHoldByID: _internalHoldByID,
+      complete: complete
+    };
+  }, [parentContext, labelStack, interactionId]);
+  var onRender = (0, _react.useCallback)(function (_id, phase, actualDuration, baseDuration, startTime, commitTime) {
+    interactionContext.onRender(phase, actualDuration, baseDuration, startTime, commitTime);
+  }, [interactionContext]);
+  (0, _react.useEffect)(function () {
+    return function () {
+      (0, _interactionMetrics.removeSegment)(labelStack);
+    };
+  }, [interactionId, parentContext, interactionContext, labelStack]);
+  var reactProfilerId = (0, _react.useMemo)(function () {
+    return labelStack.map(function (l) {
+      return l.name;
+    }).join('/');
+  }, [labelStack]);
+  var enableSegmentHighlighting = (_getConfig = (0, _config.getConfig)()) === null || _getConfig === void 0 ? void 0 : _getConfig.enableSegmentHighlighting;
+  return /*#__PURE__*/_react.default.createElement(_interactionContext.default.Provider, {
+    value: interactionContext
+  }, /*#__PURE__*/_react.default.createElement(_react.Profiler, {
+    id: reactProfilerId,
+    onRender: onRender
+  }, children, enableSegmentHighlighting && /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+    fallback: null
+  }, /*#__PURE__*/_react.default.createElement(AsyncSegmentHighlight, {
+    segmentName: segmentName
+  }))));
+}

package/dist/cjs/set-interaction-error/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.setInteractionError = setInteractionError;
+var _interactionMetrics = require("../interaction-metrics");
+function setInteractionError(interactionName, error) {
+  var interaction = (0, _interactionMetrics.getActiveInteraction)();
+  if (!interaction) {
+    return;
+  }
+  if (interaction.ufoName !== interactionName) {
+    return;
+  }
+  (0, _interactionMetrics.addError)(interaction.id, error.name, null, 'Manual interaction error', error.errorMessage, undefined, true);
+}

package/dist/cjs/short-id/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = generateId;
+function generateId() {
+  var length = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 7;
+  var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+  var result = '';
+  for (var i = 0; i < length; i++) {
+    result += characters.charAt(Math.floor(Math.random() * characters.length));
+  }
+  return result;
+}