@atlaskit/react-ufo 3.12.4 → 3.13.0

package/dist/esm/vc/vc-observer-new/metric-calculator/percentile-calc/index.js

@@ -1,55 +1,2 @@
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import calcUsingCanvas from './canvas-heatmap';
-import calcUsingOldHeatmap from './heatmap';
-import calcUsingRectSweepingLine from './rect-sweeping-line';
-function calculateTTVCPercentiles(_x) {
-  return _calculateTTVCPercentiles.apply(this, arguments);
-}
-function _calculateTTVCPercentiles() {
-  _calculateTTVCPercentiles = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(arg) {
-    var algo, vcDetails, _vcDetails, _vcDetails2;
-    return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) switch (_context.prev = _context.next) {
-        case 0:
-          algo = 'canvas_heatmap';
-          if (!(algo === 'canvas_heatmap')) {
-            _context.next = 6;
-            break;
-          }
-          _context.next = 4;
-          return calcUsingCanvas(arg);
-        case 4:
-          vcDetails = _context.sent;
-          return _context.abrupt("return", vcDetails);
-        case 6:
-          if (!(algo === 'rect_sweeping')) {
-            _context.next = 11;
-            break;
-          }
-          _context.next = 9;
-          return calcUsingRectSweepingLine(arg);
-        case 9:
-          _vcDetails = _context.sent;
-          return _context.abrupt("return", _vcDetails);
-        case 11:
-          if (!(algo === 'old_heatmap')) {
-            _context.next = 16;
-            break;
-          }
-          _context.next = 14;
-          return calcUsingOldHeatmap(arg);
-        case 14:
-          _vcDetails2 = _context.sent;
-          return _context.abrupt("return", _vcDetails2);
-        case 16:
-          throw new Error('unexpected Error algo not chosen correctly');
-        case 17:
-        case "end":
-          return _context.stop();
-      }
-    }, _callee);
-  }));
-  return _calculateTTVCPercentiles.apply(this, arguments);
-}
-export default calculateTTVCPercentiles;
+export { default as calculateTTVCPercentiles } from './canvas-heatmap';
+export { calculateTTVCPercentilesWithDebugInfo } from './canvas-heatmap';

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

@@ -116,7 +116,9 @@ var ViewportObserver = /*#__PURE__*/function () {
     _defineProperty(this, "handleAttributeMutation", function (_ref5) {
       var _this$intersectionObs4;
       var target = _ref5.target,
-        attributeName = _ref5.attributeName;
+        attributeName = _ref5.attributeName,
+        oldValue = _ref5.oldValue,
+        newValue = _ref5.newValue;
       (_this$intersectionObs4 = _this.intersectionObserver) === null || _this$intersectionObs4 === void 0 || _this$intersectionObs4.watchAndTag(target, function (_ref6) {
         var target = _ref6.target,
           rect = _ref6.rect;
@@ -124,7 +126,9 @@ var ViewportObserver = /*#__PURE__*/function () {
           return {
             type: 'mutation:media',
             mutationData: {
-              attributeName: attributeName
+              attributeName: attributeName,
+              oldValue: oldValue,
+              newValue: newValue
             }
           };
         }
@@ -136,7 +140,9 @@ var ViewportObserver = /*#__PURE__*/function () {
           return {
             type: 'mutation:attribute:non-visual-style',
             mutationData: {
-              attributeName: attributeName
+              attributeName: attributeName,
+              oldValue: oldValue,
+              newValue: newValue
             }
           };
         }
@@ -145,14 +151,18 @@ var ViewportObserver = /*#__PURE__*/function () {
           return {
             type: 'mutation:attribute:no-layout-shift',
             mutationData: {
-              attributeName: attributeName
+              attributeName: attributeName,
+              oldValue: oldValue,
+              newValue: newValue
             }
           };
         }
         return {
           type: 'mutation:attribute',
           mutationData: {
-            attributeName: attributeName
+            attributeName: attributeName,
+            oldValue: oldValue,
+            newValue: newValue
           }
         };
       });

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

@@ -36,7 +36,9 @@ function createMutationObserver(_ref) {
             var _mut$attributeName;
             onAttributeMutation({
               target: mut.target,
-              attributeName: (_mut$attributeName = mut.attributeName) !== null && _mut$attributeName !== void 0 ? _mut$attributeName : 'unknown'
+              attributeName: (_mut$attributeName = mut.attributeName) !== null && _mut$attributeName !== void 0 ? _mut$attributeName : 'unknown',
+              oldValue: oldValue,
+              newValue: newValue
             });
           }
           continue;

package/dist/types/config/index.d.ts

@@ -73,6 +73,7 @@ export type Config = {
         readonly selectorConfig?: SelectorConfig;
         readonly ssr?: boolean;
         readonly ssrWhitelist?: string[];
+        readonly ssrEnablePageLayoutPlaceholder?: boolean;
         readonly stopVCAtInteractionFinish?: boolean;
         /**
          * The revisions of TTVC that will be calculated

package/dist/types/vc/types.d.ts

@@ -8,6 +8,7 @@ export type GetVCResultType = {
     ssr?: number;
     vc?: VCRawDataType | null;
     experienceKey: string;
+    interactionId?: string;
 };
 export type SelectorConfig = {
     id: boolean;
@@ -22,6 +23,7 @@ export type VCObserverOptions = {
     devToolsEnabled?: boolean | undefined;
     selectorConfig?: SelectorConfig | undefined;
     isPostInteraction?: boolean;
+    ssrEnablePageLayoutPlaceholder?: boolean;
 };
 export interface VCObserverInterface {
     start(startArg: {

package/dist/types/vc/vc-observer/getVCRevisionDebugDetails.d.ts

@@ -0,0 +1,30 @@
+import type { ComponentsLogType, VCEntryType } from '../../common/vc/types';
+import type { VCObserverEntryType } from '../vc-observer-new/types';
+interface VCRevisionDebugDetails {
+    revision: string;
+    isClean: boolean;
+    abortReason: string | null;
+    vcLogs: Array<{
+        time: number;
+        viewportPercentage: number;
+        entries: Array<{
+            elementName: string;
+            type: VCObserverEntryType;
+            rect: DOMRect;
+            visible: boolean;
+            attributeName?: string | null;
+            oldValue?: string | null;
+            newValue?: string | null;
+        }>;
+    }>;
+    interactionId?: string;
+}
+export declare function getVCRevisionDebugDetails({ revision, isClean, abortReason, VCEntries, componentsLog, interactionId, }: {
+    revision: string;
+    isClean: boolean;
+    abortReason: string | null;
+    VCEntries: VCEntryType[];
+    componentsLog: ComponentsLogType;
+    interactionId?: string;
+}): VCRevisionDebugDetails;
+export {};

package/dist/types/vc/vc-observer/index.d.ts

@@ -41,7 +41,7 @@ export declare class VCObserver implements VCObserverInterface {
         targetName: string;
         ignoreReason: VCIgnoreReason | undefined;
     }[];
-    getVCResult: ({ start, stop, tti, prefix, ssr, vc, isEventAborted, experienceKey, }: GetVCResultType) => Promise<VCResult>;
+    getVCResult: ({ start, stop, tti, prefix, ssr, vc, isEventAborted, experienceKey, interactionId, }: GetVCResultType) => Promise<VCResult>;
     static calculateVC({ heatmap, ssr, componentsLog, viewport, }: {
         heatmap: number[][];
         ssr?: number;

package/dist/types/vc/vc-observer/observers/index.d.ts

@@ -9,6 +9,9 @@ export type SelectorConfig = {
 };
 type ConstructorOptions = {
     selectorConfig: SelectorConfig;
+    SSRConfig?: {
+        enablePageLayoutPlaceholder: boolean;
+    };
 };
 export declare class Observers implements BrowserObservers {
     private intersectionObserver;

package/dist/types/vc/vc-observer/observers/ssr-placeholders/index.d.ts

@@ -11,7 +11,10 @@ export declare class SSRPlaceholderHandlers {
     private reactValidateCallbacks;
     private intersectionObserver;
     private EQUALITY_THRESHOLD;
-    constructor();
+    private enablePageLayoutPlaceholder;
+    constructor(enablePageLayoutPlaceholder?: boolean);
+    private getPlaceholderId;
+    private getPlaceholderReplacementId;
     clear(): void;
     isPlaceholder(element: HTMLElement): boolean;
     isPlaceholderReplacement(element: HTMLElement): boolean;

package/dist/types/vc/vc-observer/observers/ssr-placeholders/ssr-scripts/collectSSRPlaceholderDimensions.d.ts

@@ -1 +1 @@
-export declare function collectSSRPlaceholderDimensions(document: Document, window: Window): void;
+export declare function collectSSRPlaceholderDimensions(document: Document, window: Window, enablePageLayoutPlaceholder?: boolean): void;

package/dist/types/vc/vc-observer-new/index.d.ts

@@ -3,12 +3,14 @@ import { type SelectorConfig } from './get-element-name';
 import type { VCObserverGetVCResultParam } from './types';
 export type VCObserverNewConfig = {
     selectorConfig?: SelectorConfig;
+    isPostInteraction?: boolean;
 };
 export default class VCObserverNew {
     private selectorConfig;
     private viewportObserver;
     private windowEventObserver;
     private entriesTimeline;
+    private isPostInteraction;
     constructor(config: VCObserverNewConfig);
     start({ startTime }: {
         startTime: DOMHighResTimeStamp;

package/dist/types/vc/vc-observer-new/metric-calculator/abstract-base-vc-calculator.d.ts

@@ -10,5 +10,8 @@ export default abstract class AbstractVCCalculatorBase implements VCCalculator {
         isVCClean: boolean;
         dirtyReason?: VCAbortReason;
     };
-    calculate({ startTime, stopTime, orderedEntries, }: VCCalculatorParam): Promise<RevisionPayloadEntry | undefined>;
+    private filterViewportEntries;
+    private calculateBasic;
+    private calculateWithDebugInfo;
+    calculate({ startTime, stopTime, orderedEntries, interactionId, isPostInteraction, }: VCCalculatorParam): Promise<RevisionPayloadEntry | undefined>;
 }

package/dist/types/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/index.d.ts

@@ -1,5 +1,9 @@
 import type { RevisionPayloadVCDetails } from '../../../../../common/vc/types';
-import type { CalcTTVCPercentilesArg } from '../types';
+import type { ViewportEntryData } from '../../../types';
+import type { CalcTTVCPercentilesArg, CalcTTVCPercentilesArgWithDebugInfo, PercentileCalcResult } from '../types';
 declare function calculateTTVCPercentiles({ viewport, orderedEntries, percentiles, startTime, }: CalcTTVCPercentilesArg): Promise<RevisionPayloadVCDetails>;
+declare function calculateTTVCPercentilesWithDebugInfo({ viewport, orderedEntries, startTime, }: CalcTTVCPercentilesArgWithDebugInfo): Promise<PercentileCalcResult>;
 export default calculateTTVCPercentiles;
 export declare function calculatePercentiles(timePixelCounts: Map<DOMHighResTimeStamp, number>, elementMap: ReadonlyMap<DOMHighResTimeStamp, Set<string>>, unorderedPercentiles: number[], totalPixels: number, startTime: DOMHighResTimeStamp): RevisionPayloadVCDetails;
+export declare function calculatePercentilesWithDebugInfo(timePixelCounts: Map<DOMHighResTimeStamp, number>, elementMap: ReadonlyMap<DOMHighResTimeStamp, ViewportEntryData[]>, totalPixels: number, startTime: DOMHighResTimeStamp): PercentileCalcResult;
+export { calculateTTVCPercentilesWithDebugInfo };

package/dist/types/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/test-with-debug-info.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/vc/vc-observer-new/metric-calculator/percentile-calc/index.d.ts

@@ -1,4 +1,2 @@
-import type { RevisionPayloadVCDetails } from '../../../../common/vc/types';
-import type { CalcTTVCPercentilesArg } from './types';
-declare function calculateTTVCPercentiles(arg: CalcTTVCPercentilesArg): Promise<RevisionPayloadVCDetails | null>;
-export default calculateTTVCPercentiles;
+export { default as calculateTTVCPercentiles } from './canvas-heatmap';
+export { calculateTTVCPercentilesWithDebugInfo } from './canvas-heatmap';

package/dist/types/vc/vc-observer-new/metric-calculator/percentile-calc/types.d.ts

@@ -1,11 +1,29 @@
-import type { VCObserverEntry } from '../../types';
+import type { VCObserverEntry, ViewportEntryData } from '../../types';
 export type CalcTTVCPercentilesArg = {
     viewport: {
         width: number;
         height: number;
     };
+    orderedEntries: ReadonlyArray<VCObserverEntry>;
+    percentiles: number[];
     startTime: DOMHighResTimeStamp;
     stopTime: DOMHighResTimeStamp;
+};
+export type CalcTTVCPercentilesArgWithDebugInfo = {
+    viewport: {
+        width: number;
+        height: number;
+    };
     orderedEntries: ReadonlyArray<VCObserverEntry>;
-    percentiles: number[];
+    startTime: DOMHighResTimeStamp;
+    stopTime: DOMHighResTimeStamp;
 };
+export interface PercentileCalcResultItem {
+    time: number;
+    viewportPercentage: number;
+    entries: ViewportEntryData[];
+}
+/**
+ * Ordered by time
+ */
+export type PercentileCalcResult = PercentileCalcResultItem[];

package/dist/types/vc/vc-observer-new/metric-calculator/types.d.ts

@@ -4,6 +4,8 @@ export type VCCalculatorParam = {
     startTime: DOMHighResTimeStamp;
     stopTime: DOMHighResTimeStamp;
     orderedEntries: ReadonlyArray<VCObserverEntry>;
+    interactionId?: string;
+    isPostInteraction: boolean;
 };
 export interface VCCalculator {
     calculate(param: VCCalculatorParam): Promise<RevisionPayloadEntry | undefined>;

package/dist/types/vc/vc-observer-new/types.d.ts

@@ -1,21 +1,25 @@
 import type { ObservedWindowEvent } from './window-event-observer';
 export type VCObserverEntryType = 'mutation:child-element' | 'mutation:remount' | 'mutation:element' | 'mutation:element-replacement' | 'mutation:attribute:no-layout-shift' | 'mutation:attribute:non-visual-style' | 'mutation:attribute' | 'mutation:media' | 'layout-shift' | 'window:event' | 'unknown';
 export type ViewportEntryData = {
+    readonly type: VCObserverEntryType;
     readonly elementName: string;
     readonly rect: DOMRect;
     readonly previousRect?: DOMRect | undefined;
     readonly visible: boolean;
     readonly attributeName?: string | null | undefined;
+    readonly oldValue?: string | null | undefined;
+    readonly newValue?: string | null | undefined;
 };
 export type WindowEventEntryData = {
+    readonly type: VCObserverEntryType;
     readonly eventType: ObservedWindowEvent;
 };
 export type VCObserverEntry = {
     readonly time: DOMHighResTimeStamp;
-    readonly type: VCObserverEntryType;
     readonly data: ViewportEntryData | WindowEventEntryData;
 };
 export type VCObserverGetVCResultParam = {
     start: number;
     stop: number;
+    interactionId?: string;
 };

package/dist/types/vc/vc-observer-new/viewport-observer/mutation-observer/index.d.ts

@@ -2,6 +2,8 @@ export type CreateMutationObserverProps = {
     onAttributeMutation: (props: {
         target: HTMLElement;
         attributeName: string;
+        oldValue?: string | undefined | null;
+        newValue?: string | undefined | null;
     }) => void;
     onMutationFinished?: (props: {
         targets: Array<HTMLElement>;

package/dist/types/vc/vc-observer-new/viewport-observer/types.d.ts

@@ -3,6 +3,8 @@ export type MutationRecordWithTimestamp = MutationRecord & {
 };
 export type AttributeMutationData = {
     attributeName: string;
+    oldValue?: string | undefined | null;
+    newValue?: string | undefined | null;
 };
 /**
  * Add here when there are more type of mutation data

package/dist/types-ts4.5/config/index.d.ts

@@ -73,6 +73,7 @@ export type Config = {
         readonly selectorConfig?: SelectorConfig;
         readonly ssr?: boolean;
         readonly ssrWhitelist?: string[];
+        readonly ssrEnablePageLayoutPlaceholder?: boolean;
         readonly stopVCAtInteractionFinish?: boolean;
         /**
          * The revisions of TTVC that will be calculated

package/dist/types-ts4.5/vc/types.d.ts

@@ -8,6 +8,7 @@ export type GetVCResultType = {
     ssr?: number;
     vc?: VCRawDataType | null;
     experienceKey: string;
+    interactionId?: string;
 };
 export type SelectorConfig = {
     id: boolean;
@@ -22,6 +23,7 @@ export type VCObserverOptions = {
     devToolsEnabled?: boolean | undefined;
     selectorConfig?: SelectorConfig | undefined;
     isPostInteraction?: boolean;
+    ssrEnablePageLayoutPlaceholder?: boolean;
 };
 export interface VCObserverInterface {
     start(startArg: {

package/dist/types-ts4.5/vc/vc-observer/getVCRevisionDebugDetails.d.ts

@@ -0,0 +1,30 @@
+import type { ComponentsLogType, VCEntryType } from '../../common/vc/types';
+import type { VCObserverEntryType } from '../vc-observer-new/types';
+interface VCRevisionDebugDetails {
+    revision: string;
+    isClean: boolean;
+    abortReason: string | null;
+    vcLogs: Array<{
+        time: number;
+        viewportPercentage: number;
+        entries: Array<{
+            elementName: string;
+            type: VCObserverEntryType;
+            rect: DOMRect;
+            visible: boolean;
+            attributeName?: string | null;
+            oldValue?: string | null;
+            newValue?: string | null;
+        }>;
+    }>;
+    interactionId?: string;
+}
+export declare function getVCRevisionDebugDetails({ revision, isClean, abortReason, VCEntries, componentsLog, interactionId, }: {
+    revision: string;
+    isClean: boolean;
+    abortReason: string | null;
+    VCEntries: VCEntryType[];
+    componentsLog: ComponentsLogType;
+    interactionId?: string;
+}): VCRevisionDebugDetails;
+export {};

package/dist/types-ts4.5/vc/vc-observer/index.d.ts

@@ -51,7 +51,7 @@ export declare class VCObserver implements VCObserverInterface {
         targetName: string;
         ignoreReason: VCIgnoreReason | undefined;
     }[];
-    getVCResult: ({ start, stop, tti, prefix, ssr, vc, isEventAborted, experienceKey, }: GetVCResultType) => Promise<VCResult>;
+    getVCResult: ({ start, stop, tti, prefix, ssr, vc, isEventAborted, experienceKey, interactionId, }: GetVCResultType) => Promise<VCResult>;
     static calculateVC({ heatmap, ssr, componentsLog, viewport, }: {
         heatmap: number[][];
         ssr?: number;

package/dist/types-ts4.5/vc/vc-observer/observers/index.d.ts

@@ -9,6 +9,9 @@ export type SelectorConfig = {
 };
 type ConstructorOptions = {
     selectorConfig: SelectorConfig;
+    SSRConfig?: {
+        enablePageLayoutPlaceholder: boolean;
+    };
 };
 export declare class Observers implements BrowserObservers {
     private intersectionObserver;

package/dist/types-ts4.5/vc/vc-observer/observers/ssr-placeholders/index.d.ts

@@ -11,7 +11,10 @@ export declare class SSRPlaceholderHandlers {
     private reactValidateCallbacks;
     private intersectionObserver;
     private EQUALITY_THRESHOLD;
-    constructor();
+    private enablePageLayoutPlaceholder;
+    constructor(enablePageLayoutPlaceholder?: boolean);
+    private getPlaceholderId;
+    private getPlaceholderReplacementId;
     clear(): void;
     isPlaceholder(element: HTMLElement): boolean;
     isPlaceholderReplacement(element: HTMLElement): boolean;

package/dist/types-ts4.5/vc/vc-observer/observers/ssr-placeholders/ssr-scripts/collectSSRPlaceholderDimensions.d.ts

@@ -1 +1 @@
-export declare function collectSSRPlaceholderDimensions(document: Document, window: Window): void;
+export declare function collectSSRPlaceholderDimensions(document: Document, window: Window, enablePageLayoutPlaceholder?: boolean): void;

package/dist/types-ts4.5/vc/vc-observer-new/index.d.ts

@@ -3,12 +3,14 @@ import { type SelectorConfig } from './get-element-name';
 import type { VCObserverGetVCResultParam } from './types';
 export type VCObserverNewConfig = {
     selectorConfig?: SelectorConfig;
+    isPostInteraction?: boolean;
 };
 export default class VCObserverNew {
     private selectorConfig;
     private viewportObserver;
     private windowEventObserver;
     private entriesTimeline;
+    private isPostInteraction;
     constructor(config: VCObserverNewConfig);
     start({ startTime }: {
         startTime: DOMHighResTimeStamp;

package/dist/types-ts4.5/vc/vc-observer-new/metric-calculator/abstract-base-vc-calculator.d.ts

@@ -10,5 +10,8 @@ export default abstract class AbstractVCCalculatorBase implements VCCalculator {
         isVCClean: boolean;
         dirtyReason?: VCAbortReason;
     };
-    calculate({ startTime, stopTime, orderedEntries, }: VCCalculatorParam): Promise<RevisionPayloadEntry | undefined>;
+    private filterViewportEntries;
+    private calculateBasic;
+    private calculateWithDebugInfo;
+    calculate({ startTime, stopTime, orderedEntries, interactionId, isPostInteraction, }: VCCalculatorParam): Promise<RevisionPayloadEntry | undefined>;
 }

package/dist/types-ts4.5/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/index.d.ts

@@ -1,5 +1,9 @@
 import type { RevisionPayloadVCDetails } from '../../../../../common/vc/types';
-import type { CalcTTVCPercentilesArg } from '../types';
+import type { ViewportEntryData } from '../../../types';
+import type { CalcTTVCPercentilesArg, CalcTTVCPercentilesArgWithDebugInfo, PercentileCalcResult } from '../types';
 declare function calculateTTVCPercentiles({ viewport, orderedEntries, percentiles, startTime, }: CalcTTVCPercentilesArg): Promise<RevisionPayloadVCDetails>;
+declare function calculateTTVCPercentilesWithDebugInfo({ viewport, orderedEntries, startTime, }: CalcTTVCPercentilesArgWithDebugInfo): Promise<PercentileCalcResult>;
 export default calculateTTVCPercentiles;
 export declare function calculatePercentiles(timePixelCounts: Map<DOMHighResTimeStamp, number>, elementMap: ReadonlyMap<DOMHighResTimeStamp, Set<string>>, unorderedPercentiles: number[], totalPixels: number, startTime: DOMHighResTimeStamp): RevisionPayloadVCDetails;
+export declare function calculatePercentilesWithDebugInfo(timePixelCounts: Map<DOMHighResTimeStamp, number>, elementMap: ReadonlyMap<DOMHighResTimeStamp, ViewportEntryData[]>, totalPixels: number, startTime: DOMHighResTimeStamp): PercentileCalcResult;
+export { calculateTTVCPercentilesWithDebugInfo };

package/dist/types-ts4.5/vc/vc-observer-new/metric-calculator/percentile-calc/canvas-heatmap/test-with-debug-info.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types-ts4.5/vc/vc-observer-new/metric-calculator/percentile-calc/index.d.ts

@@ -1,4 +1,2 @@
-import type { RevisionPayloadVCDetails } from '../../../../common/vc/types';
-import type { CalcTTVCPercentilesArg } from './types';
-declare function calculateTTVCPercentiles(arg: CalcTTVCPercentilesArg): Promise<RevisionPayloadVCDetails | null>;
-export default calculateTTVCPercentiles;
+export { default as calculateTTVCPercentiles } from './canvas-heatmap';
+export { calculateTTVCPercentilesWithDebugInfo } from './canvas-heatmap';

package/dist/types-ts4.5/vc/vc-observer-new/metric-calculator/percentile-calc/types.d.ts

@@ -1,11 +1,29 @@
-import type { VCObserverEntry } from '../../types';
+import type { VCObserverEntry, ViewportEntryData } from '../../types';
 export type CalcTTVCPercentilesArg = {
     viewport: {
         width: number;
         height: number;
     };
+    orderedEntries: ReadonlyArray<VCObserverEntry>;
+    percentiles: number[];
     startTime: DOMHighResTimeStamp;
     stopTime: DOMHighResTimeStamp;
+};
+export type CalcTTVCPercentilesArgWithDebugInfo = {
+    viewport: {
+        width: number;
+        height: number;
+    };
     orderedEntries: ReadonlyArray<VCObserverEntry>;
-    percentiles: number[];
+    startTime: DOMHighResTimeStamp;
+    stopTime: DOMHighResTimeStamp;
 };
+export interface PercentileCalcResultItem {
+    time: number;
+    viewportPercentage: number;
+    entries: ViewportEntryData[];
+}
+/**
+ * Ordered by time
+ */
+export type PercentileCalcResult = PercentileCalcResultItem[];

package/dist/types-ts4.5/vc/vc-observer-new/metric-calculator/types.d.ts

@@ -4,6 +4,8 @@ export type VCCalculatorParam = {
     startTime: DOMHighResTimeStamp;
     stopTime: DOMHighResTimeStamp;
     orderedEntries: ReadonlyArray<VCObserverEntry>;
+    interactionId?: string;
+    isPostInteraction: boolean;
 };
 export interface VCCalculator {
     calculate(param: VCCalculatorParam): Promise<RevisionPayloadEntry | undefined>;

package/dist/types-ts4.5/vc/vc-observer-new/types.d.ts

@@ -1,21 +1,25 @@
 import type { ObservedWindowEvent } from './window-event-observer';
 export type VCObserverEntryType = 'mutation:child-element' | 'mutation:remount' | 'mutation:element' | 'mutation:element-replacement' | 'mutation:attribute:no-layout-shift' | 'mutation:attribute:non-visual-style' | 'mutation:attribute' | 'mutation:media' | 'layout-shift' | 'window:event' | 'unknown';
 export type ViewportEntryData = {
+    readonly type: VCObserverEntryType;
     readonly elementName: string;
     readonly rect: DOMRect;
     readonly previousRect?: DOMRect | undefined;
     readonly visible: boolean;
     readonly attributeName?: string | null | undefined;
+    readonly oldValue?: string | null | undefined;
+    readonly newValue?: string | null | undefined;
 };
 export type WindowEventEntryData = {
+    readonly type: VCObserverEntryType;
     readonly eventType: ObservedWindowEvent;
 };
 export type VCObserverEntry = {
     readonly time: DOMHighResTimeStamp;
-    readonly type: VCObserverEntryType;
     readonly data: ViewportEntryData | WindowEventEntryData;
 };
 export type VCObserverGetVCResultParam = {
     start: number;
     stop: number;
+    interactionId?: string;
 };

package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/mutation-observer/index.d.ts

@@ -2,6 +2,8 @@ export type CreateMutationObserverProps = {
     onAttributeMutation: (props: {
         target: HTMLElement;
         attributeName: string;
+        oldValue?: string | undefined | null;
+        newValue?: string | undefined | null;
     }) => void;
     onMutationFinished?: (props: {
         targets: Array<HTMLElement>;

package/dist/types-ts4.5/vc/vc-observer-new/viewport-observer/types.d.ts

@@ -3,6 +3,8 @@ export type MutationRecordWithTimestamp = MutationRecord & {
 };
 export type AttributeMutationData = {
     attributeName: string;
+    oldValue?: string | undefined | null;
+    newValue?: string | undefined | null;
 };
 /**
  * Add here when there are more type of mutation data

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/react-ufo",
-	"version": "3.12.4",
+	"version": "3.13.0",
 	"description": "Parts of React UFO that are publicly available",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -162,6 +162,9 @@
 		},
 		"platform_ufo_post_interaction_use_vc_rev": {
 			"type": "boolean"
+		},
+		"platform_ufo_ttvc_v3_devtool": {
+			"type": "boolean"
 		}
 	}
 }