@atlaskit/renderer 123.4.0 → 123.4.1

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/renderer
 
+## 123.4.1
+
+### Patch Changes
+
+- [`a77acd87fef67`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a77acd87fef67) -
+  EDITOR-1391 add new analytics event which logs editor width and all table widths on the page once
+  after page is loaded in both editor and renderer. remove previous implementation in width plugin.
+- Updated dependencies
+
 ## 123.4.0
 
 ### Minor Changes

package/dist/cjs/analytics/enums.js

@@ -34,6 +34,7 @@ var ACTION = exports.ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["UNSUPPORTED_CONTENT_LEVELS_TRACKING_SUCCEEDED"] = "unsupportedContentLevelsTrackingSucceeded";
   ACTION["UNSUPPORTED_CONTENT_LEVELS_TRACKING_ERRORED"] = "unsupportedContentLevelsTrackingErrored";
   ACTION["MEDIA_LINK_TRANSFORMED"] = "mediaLinkTransformed";
+  ACTION["TABLE_WIDTH_INFO"] = "tableWidthInfo";
   return ACTION;
 }({});
 var ACTION_SUBJECT = exports.ACTION_SUBJECT = /*#__PURE__*/function (ACTION_SUBJECT) {

package/dist/cjs/ui/Renderer/analytics-utils.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getWidthInfoPayload = void 0;
+var _analytics = require("@atlaskit/editor-common/analytics");
+var getWidthInfoPayload = exports.getWidthInfoPayload = function getWidthInfoPayload(renderer) {
+  var tablesInfo = [];
+  var tableWrappers = renderer.querySelectorAll('.pm-table-wrapper');
+  tableWrappers.forEach(function (tableWrapper) {
+    var table = tableWrapper.querySelector(':scope > table');
+    if (table) {
+      var isNestedTable = Boolean(table.closest('td, th'));
+      tablesInfo.push({
+        tableWidth: table.scrollWidth,
+        hasScrollbar: tableWrapper.clientWidth < table.scrollWidth,
+        isNestedTable: isNestedTable
+      });
+    }
+  });
+  return {
+    action: _analytics.TABLE_ACTION.TABLE_WIDTH_INFO,
+    actionSubject: _analytics.ACTION_SUBJECT.TABLE,
+    attributes: {
+      editorWidth: renderer.scrollWidth,
+      tableWidthInfo: tablesInfo,
+      mode: _analytics.MODE.RENDERER
+    },
+    eventType: _analytics.EVENT_TYPE.OPERATIONAL
+  };
+};

package/dist/cjs/ui/Renderer/index.js

@@ -52,6 +52,8 @@ var _rendererHelper = require("./rendererHelper");
 var _useMemoFromPropsDerivative = require("./useMemoFromPropsDerivative");
 var _PortalContext = require("./PortalContext");
 var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
+var _analyticsUtils = require("./analytics-utils");
 var _excluded = ["portal"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 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; }
@@ -62,6 +64,9 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
 var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
+
+// we want to calculate all the table widths (which causes reflows) after the renderer has finished loading to mitigate performance impact
+var TABLE_WIDTH_INFO_TIMEOUT = 10000;
 var packageName = "@atlaskit/renderer";
 var packageVersion = "0.0.0-development";
 var setAsQueryContainerStyles = (0, _react2.css)({
@@ -322,6 +327,9 @@ var RendererFunctionalComponent = exports.RendererFunctionalComponent = function
     analyticsEventSeverityTracking = props.analyticsEventSeverityTracking;
   (0, _react.useEffect)(function () {
     var rafID;
+    var widthAnalyticsSetTimeoutID;
+    var widthAnalyticsRicID;
+    var widthAnalyticsRafID;
     var handleAnalytics = function handleAnalytics() {
       _fireAnalyticsEvent({
         action: _analytics.ACTION.STARTED,
@@ -361,12 +369,39 @@ var RendererFunctionalComponent = exports.RendererFunctionalComponent = function
         });
         anchorLinkAnalytics();
       });
+      if ((0, _expValEquals.expValEquals)('platform_editor_editor_width_analytics', 'isEnabled', true)) {
+        // send statistics about the widths of the tables on the page for alerting
+        widthAnalyticsSetTimeoutID = setTimeout(function () {
+          var requestIdleCallbackFn = function requestIdleCallbackFn() {
+            var _props$innerRef;
+            var renderer = (_props$innerRef = props.innerRef) === null || _props$innerRef === void 0 || (_props$innerRef = _props$innerRef.current) === null || _props$innerRef === void 0 ? void 0 : _props$innerRef.querySelector('.ak-renderer-document');
+            if (renderer) {
+              _fireAnalyticsEvent((0, _analyticsUtils.getWidthInfoPayload)(renderer));
+            }
+          };
+          if (window && typeof window.requestIdleCallback === 'function') {
+            widthAnalyticsRicID = window.requestIdleCallback(requestIdleCallbackFn);
+          } else if (window && typeof window.requestAnimationFrame === 'function') {
+            // requestIdleCallback is not supported in safari, fallback to requestAnimationFrame
+            widthAnalyticsRafID = window.requestAnimationFrame(requestIdleCallbackFn);
+          }
+        }, TABLE_WIDTH_INFO_TIMEOUT);
+      }
     };
     handleAnalytics();
     return function () {
       if (rafID) {
         window.cancelAnimationFrame(rafID);
       }
+      if (widthAnalyticsSetTimeoutID) {
+        window.clearTimeout(widthAnalyticsSetTimeoutID);
+      }
+      if (widthAnalyticsRafID) {
+        window.cancelAnimationFrame(widthAnalyticsRafID);
+      }
+      if (widthAnalyticsRicID) {
+        window.cancelIdleCallback(widthAnalyticsRicID);
+      }
 
       // if this is the ProviderFactory which was created in constructor
       // it's safe to destroy it on Renderer unmount

package/dist/es2019/analytics/enums.js

@@ -28,6 +28,7 @@ export let ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["UNSUPPORTED_CONTENT_LEVELS_TRACKING_SUCCEEDED"] = "unsupportedContentLevelsTrackingSucceeded";
   ACTION["UNSUPPORTED_CONTENT_LEVELS_TRACKING_ERRORED"] = "unsupportedContentLevelsTrackingErrored";
   ACTION["MEDIA_LINK_TRANSFORMED"] = "mediaLinkTransformed";
+  ACTION["TABLE_WIDTH_INFO"] = "tableWidthInfo";
   return ACTION;
 }({});
 export let ACTION_SUBJECT = /*#__PURE__*/function (ACTION_SUBJECT) {

package/dist/es2019/ui/Renderer/analytics-utils.js

@@ -0,0 +1,26 @@
+import { TABLE_ACTION, ACTION_SUBJECT, EVENT_TYPE, MODE } from '@atlaskit/editor-common/analytics';
+export const getWidthInfoPayload = renderer => {
+  const tablesInfo = [];
+  const tableWrappers = renderer.querySelectorAll('.pm-table-wrapper');
+  tableWrappers.forEach(tableWrapper => {
+    const table = tableWrapper.querySelector(':scope > table');
+    if (table) {
+      const isNestedTable = Boolean(table.closest('td, th'));
+      tablesInfo.push({
+        tableWidth: table.scrollWidth,
+        hasScrollbar: tableWrapper.clientWidth < table.scrollWidth,
+        isNestedTable
+      });
+    }
+  });
+  return {
+    action: TABLE_ACTION.TABLE_WIDTH_INFO,
+    actionSubject: ACTION_SUBJECT.TABLE,
+    attributes: {
+      editorWidth: renderer.scrollWidth,
+      tableWidthInfo: tablesInfo,
+      mode: MODE.RENDERER
+    },
+    eventType: EVENT_TYPE.OPERATIONAL
+  };
+};

package/dist/es2019/ui/Renderer/index.js

@@ -46,8 +46,13 @@ import { removeEmptySpaceAroundContent } from './rendererHelper';
 import { useMemoFromPropsDerivative } from './useMemoFromPropsDerivative';
 import { PortalContext } from './PortalContext';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { getWidthInfoPayload } from './analytics-utils';
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
+
+// we want to calculate all the table widths (which causes reflows) after the renderer has finished loading to mitigate performance impact
+const TABLE_WIDTH_INFO_TIMEOUT = 10000;
 const packageName = "@atlaskit/renderer";
 const packageVersion = "0.0.0-development";
 const setAsQueryContainerStyles = css({
@@ -312,6 +317,9 @@ export const RendererFunctionalComponent = props => {
   } = props;
   useEffect(() => {
     let rafID;
+    let widthAnalyticsSetTimeoutID;
+    let widthAnalyticsRicID;
+    let widthAnalyticsRafID;
     const handleAnalytics = () => {
       fireAnalyticsEvent({
         action: ACTION.STARTED,
@@ -351,12 +359,39 @@ export const RendererFunctionalComponent = props => {
         });
         anchorLinkAnalytics();
       });
+      if (expValEquals('platform_editor_editor_width_analytics', 'isEnabled', true)) {
+        // send statistics about the widths of the tables on the page for alerting
+        widthAnalyticsSetTimeoutID = setTimeout(() => {
+          const requestIdleCallbackFn = () => {
+            var _props$innerRef, _props$innerRef$curre;
+            const renderer = (_props$innerRef = props.innerRef) === null || _props$innerRef === void 0 ? void 0 : (_props$innerRef$curre = _props$innerRef.current) === null || _props$innerRef$curre === void 0 ? void 0 : _props$innerRef$curre.querySelector('.ak-renderer-document');
+            if (renderer) {
+              fireAnalyticsEvent(getWidthInfoPayload(renderer));
+            }
+          };
+          if (window && typeof window.requestIdleCallback === 'function') {
+            widthAnalyticsRicID = window.requestIdleCallback(requestIdleCallbackFn);
+          } else if (window && typeof window.requestAnimationFrame === 'function') {
+            // requestIdleCallback is not supported in safari, fallback to requestAnimationFrame
+            widthAnalyticsRafID = window.requestAnimationFrame(requestIdleCallbackFn);
+          }
+        }, TABLE_WIDTH_INFO_TIMEOUT);
+      }
     };
     handleAnalytics();
     return () => {
       if (rafID) {
         window.cancelAnimationFrame(rafID);
       }
+      if (widthAnalyticsSetTimeoutID) {
+        window.clearTimeout(widthAnalyticsSetTimeoutID);
+      }
+      if (widthAnalyticsRafID) {
+        window.cancelAnimationFrame(widthAnalyticsRafID);
+      }
+      if (widthAnalyticsRicID) {
+        window.cancelIdleCallback(widthAnalyticsRicID);
+      }
 
       // if this is the ProviderFactory which was created in constructor
       // it's safe to destroy it on Renderer unmount

package/dist/esm/analytics/enums.js

@@ -28,6 +28,7 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["UNSUPPORTED_CONTENT_LEVELS_TRACKING_SUCCEEDED"] = "unsupportedContentLevelsTrackingSucceeded";
   ACTION["UNSUPPORTED_CONTENT_LEVELS_TRACKING_ERRORED"] = "unsupportedContentLevelsTrackingErrored";
   ACTION["MEDIA_LINK_TRANSFORMED"] = "mediaLinkTransformed";
+  ACTION["TABLE_WIDTH_INFO"] = "tableWidthInfo";
   return ACTION;
 }({});
 export var ACTION_SUBJECT = /*#__PURE__*/function (ACTION_SUBJECT) {

package/dist/esm/ui/Renderer/analytics-utils.js

@@ -0,0 +1,26 @@
+import { TABLE_ACTION, ACTION_SUBJECT, EVENT_TYPE, MODE } from '@atlaskit/editor-common/analytics';
+export var getWidthInfoPayload = function getWidthInfoPayload(renderer) {
+  var tablesInfo = [];
+  var tableWrappers = renderer.querySelectorAll('.pm-table-wrapper');
+  tableWrappers.forEach(function (tableWrapper) {
+    var table = tableWrapper.querySelector(':scope > table');
+    if (table) {
+      var isNestedTable = Boolean(table.closest('td, th'));
+      tablesInfo.push({
+        tableWidth: table.scrollWidth,
+        hasScrollbar: tableWrapper.clientWidth < table.scrollWidth,
+        isNestedTable: isNestedTable
+      });
+    }
+  });
+  return {
+    action: TABLE_ACTION.TABLE_WIDTH_INFO,
+    actionSubject: ACTION_SUBJECT.TABLE,
+    attributes: {
+      editorWidth: renderer.scrollWidth,
+      tableWidthInfo: tablesInfo,
+      mode: MODE.RENDERER
+    },
+    eventType: EVENT_TYPE.OPERATIONAL
+  };
+};

package/dist/esm/ui/Renderer/index.js

@@ -51,8 +51,13 @@ import { removeEmptySpaceAroundContent } from './rendererHelper';
 import { useMemoFromPropsDerivative } from './useMemoFromPropsDerivative';
 import { PortalContext } from './PortalContext';
 import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { getWidthInfoPayload } from './analytics-utils';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
+
+// we want to calculate all the table widths (which causes reflows) after the renderer has finished loading to mitigate performance impact
+var TABLE_WIDTH_INFO_TIMEOUT = 10000;
 var packageName = "@atlaskit/renderer";
 var packageVersion = "0.0.0-development";
 var setAsQueryContainerStyles = css({
@@ -313,6 +318,9 @@ export var RendererFunctionalComponent = function RendererFunctionalComponent(pr
     analyticsEventSeverityTracking = props.analyticsEventSeverityTracking;
   useEffect(function () {
     var rafID;
+    var widthAnalyticsSetTimeoutID;
+    var widthAnalyticsRicID;
+    var widthAnalyticsRafID;
     var handleAnalytics = function handleAnalytics() {
       _fireAnalyticsEvent({
         action: ACTION.STARTED,
@@ -352,12 +360,39 @@ export var RendererFunctionalComponent = function RendererFunctionalComponent(pr
         });
         anchorLinkAnalytics();
       });
+      if (expValEquals('platform_editor_editor_width_analytics', 'isEnabled', true)) {
+        // send statistics about the widths of the tables on the page for alerting
+        widthAnalyticsSetTimeoutID = setTimeout(function () {
+          var requestIdleCallbackFn = function requestIdleCallbackFn() {
+            var _props$innerRef;
+            var renderer = (_props$innerRef = props.innerRef) === null || _props$innerRef === void 0 || (_props$innerRef = _props$innerRef.current) === null || _props$innerRef === void 0 ? void 0 : _props$innerRef.querySelector('.ak-renderer-document');
+            if (renderer) {
+              _fireAnalyticsEvent(getWidthInfoPayload(renderer));
+            }
+          };
+          if (window && typeof window.requestIdleCallback === 'function') {
+            widthAnalyticsRicID = window.requestIdleCallback(requestIdleCallbackFn);
+          } else if (window && typeof window.requestAnimationFrame === 'function') {
+            // requestIdleCallback is not supported in safari, fallback to requestAnimationFrame
+            widthAnalyticsRafID = window.requestAnimationFrame(requestIdleCallbackFn);
+          }
+        }, TABLE_WIDTH_INFO_TIMEOUT);
+      }
     };
     handleAnalytics();
     return function () {
       if (rafID) {
         window.cancelAnimationFrame(rafID);
       }
+      if (widthAnalyticsSetTimeoutID) {
+        window.clearTimeout(widthAnalyticsSetTimeoutID);
+      }
+      if (widthAnalyticsRafID) {
+        window.cancelAnimationFrame(widthAnalyticsRafID);
+      }
+      if (widthAnalyticsRicID) {
+        window.cancelIdleCallback(widthAnalyticsRicID);
+      }
 
       // if this is the ProviderFactory which was created in constructor
       // it's safe to destroy it on Renderer unmount

package/dist/types/analytics/enums.d.ts

@@ -26,7 +26,8 @@ export declare enum ACTION {
     CREATE_NOT_ALLOWED = "createNotAllowed",
     UNSUPPORTED_CONTENT_LEVELS_TRACKING_SUCCEEDED = "unsupportedContentLevelsTrackingSucceeded",
     UNSUPPORTED_CONTENT_LEVELS_TRACKING_ERRORED = "unsupportedContentLevelsTrackingErrored",
-    MEDIA_LINK_TRANSFORMED = "mediaLinkTransformed"
+    MEDIA_LINK_TRANSFORMED = "mediaLinkTransformed",
+    TABLE_WIDTH_INFO = "tableWidthInfo"
 }
 export declare enum ACTION_SUBJECT {
     RENDERER = "renderer",

package/dist/types/analytics/events.d.ts

@@ -1,4 +1,4 @@
-import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, OperationalAEP } from '@atlaskit/editor-common/analytics';
+import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, OperationalAEP, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
 import type { AEP } from './enums';
 import type { SortOrder } from '@atlaskit/editor-common/types';
 import type { SEVERITY, UNSUPPORTED_CONTENT_LEVEL_SEVERITY, UnsupportedContentPayload, UnsupportedContentTooltipPayload } from '@atlaskit/editor-common/utils';
@@ -77,6 +77,15 @@ type TableSortColumnAEP = AEP<ACTION.SORT_COLUMN, ACTION_SUBJECT.TABLE, undefine
     platform: PLATFORM.WEB;
     sortOrder: SortOrder;
 }, EVENT_TYPE.TRACK>;
+type TableWidthInfoAEP = AEP<TABLE_ACTION.TABLE_WIDTH_INFO, ACTION_SUBJECT.TABLE, undefined, {
+    editorWidth: number;
+    mode: MODE.RENDERER;
+    tableWidthInfo: Array<{
+        hasScrollbar: boolean;
+        isNestedTable: boolean;
+        tableWidth: number;
+    }>;
+}, EVENT_TYPE.OPERATIONAL>;
 type VisitLinkAEP = AEP<ACTION.VISITED, ACTION_SUBJECT.LINK, undefined, {
     mode: MODE.RENDERER;
     platform: PLATFORM.WEB;
@@ -109,6 +118,6 @@ declare enum RESOLVE_METHOD {
 type AnnotationAEP = AEP<AnnotationActionType, ACTION_SUBJECT.ANNOTATION, ACTION_SUBJECT_ID.INLINE_COMMENT, AnnotationAEPAttributes, undefined>;
 type MediaLnkTransformedAEP = AEP<ACTION.MEDIA_LINK_TRANSFORMED, ACTION_SUBJECT.RENDERER, undefined, undefined, EVENT_TYPE.OPERATIONAL>;
 type NestedTableTransformedAEP = OperationalAEP<ACTION.NESTED_TABLE_TRANSFORMED, ACTION_SUBJECT.RENDERER, undefined, undefined>;
-export type AnalyticsEventPayload<T = void> = RendererStartAEP | RendererRenderedAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | CodeBlockCopyAEP | CodeBlockWrapAEP | HeadingAnchorLinkButtonAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP | NestedTableTransformedAEP;
+export type AnalyticsEventPayload<T = void> = RendererStartAEP | RendererRenderedAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | CodeBlockCopyAEP | CodeBlockWrapAEP | HeadingAnchorLinkButtonAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | TableWidthInfoAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP | NestedTableTransformedAEP;
 export type FireAnalyticsCallback = <T = void>(payload: AnalyticsEventPayload<T>) => void | undefined;
 export {};

package/dist/types/ui/Renderer/analytics-utils.d.ts

@@ -0,0 +1,2 @@
+import type { AnalyticsEventPayload } from '../../analytics/events';
+export declare const getWidthInfoPayload: (renderer: HTMLElement) => AnalyticsEventPayload;

package/dist/types-ts4.5/analytics/enums.d.ts

@@ -26,7 +26,8 @@ export declare enum ACTION {
     CREATE_NOT_ALLOWED = "createNotAllowed",
     UNSUPPORTED_CONTENT_LEVELS_TRACKING_SUCCEEDED = "unsupportedContentLevelsTrackingSucceeded",
     UNSUPPORTED_CONTENT_LEVELS_TRACKING_ERRORED = "unsupportedContentLevelsTrackingErrored",
-    MEDIA_LINK_TRANSFORMED = "mediaLinkTransformed"
+    MEDIA_LINK_TRANSFORMED = "mediaLinkTransformed",
+    TABLE_WIDTH_INFO = "tableWidthInfo"
 }
 export declare enum ACTION_SUBJECT {
     RENDERER = "renderer",

package/dist/types-ts4.5/analytics/events.d.ts

@@ -1,4 +1,4 @@
-import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, OperationalAEP } from '@atlaskit/editor-common/analytics';
+import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, OperationalAEP, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
 import type { AEP } from './enums';
 import type { SortOrder } from '@atlaskit/editor-common/types';
 import type { SEVERITY, UNSUPPORTED_CONTENT_LEVEL_SEVERITY, UnsupportedContentPayload, UnsupportedContentTooltipPayload } from '@atlaskit/editor-common/utils';
@@ -77,6 +77,15 @@ type TableSortColumnAEP = AEP<ACTION.SORT_COLUMN, ACTION_SUBJECT.TABLE, undefine
     platform: PLATFORM.WEB;
     sortOrder: SortOrder;
 }, EVENT_TYPE.TRACK>;
+type TableWidthInfoAEP = AEP<TABLE_ACTION.TABLE_WIDTH_INFO, ACTION_SUBJECT.TABLE, undefined, {
+    editorWidth: number;
+    mode: MODE.RENDERER;
+    tableWidthInfo: Array<{
+        hasScrollbar: boolean;
+        isNestedTable: boolean;
+        tableWidth: number;
+    }>;
+}, EVENT_TYPE.OPERATIONAL>;
 type VisitLinkAEP = AEP<ACTION.VISITED, ACTION_SUBJECT.LINK, undefined, {
     mode: MODE.RENDERER;
     platform: PLATFORM.WEB;
@@ -109,6 +118,6 @@ declare enum RESOLVE_METHOD {
 type AnnotationAEP = AEP<AnnotationActionType, ACTION_SUBJECT.ANNOTATION, ACTION_SUBJECT_ID.INLINE_COMMENT, AnnotationAEPAttributes, undefined>;
 type MediaLnkTransformedAEP = AEP<ACTION.MEDIA_LINK_TRANSFORMED, ACTION_SUBJECT.RENDERER, undefined, undefined, EVENT_TYPE.OPERATIONAL>;
 type NestedTableTransformedAEP = OperationalAEP<ACTION.NESTED_TABLE_TRANSFORMED, ACTION_SUBJECT.RENDERER, undefined, undefined>;
-export type AnalyticsEventPayload<T = void> = RendererStartAEP | RendererRenderedAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | CodeBlockCopyAEP | CodeBlockWrapAEP | HeadingAnchorLinkButtonAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP | NestedTableTransformedAEP;
+export type AnalyticsEventPayload<T = void> = RendererStartAEP | RendererRenderedAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | CodeBlockCopyAEP | CodeBlockWrapAEP | HeadingAnchorLinkButtonAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | TableWidthInfoAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP | NestedTableTransformedAEP;
 export type FireAnalyticsCallback = <T = void>(payload: AnalyticsEventPayload<T>) => void | undefined;
 export {};

package/dist/types-ts4.5/ui/Renderer/analytics-utils.d.ts

@@ -0,0 +1,2 @@
+import type { AnalyticsEventPayload } from '../../analytics/events';
+export declare const getWidthInfoPayload: (renderer: HTMLElement) => AnalyticsEventPayload;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "123.4.0",
+	"version": "123.4.1",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -51,12 +51,12 @@
 		"@atlaskit/media-viewer": "^52.4.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/platform-feature-flags-react": "^0.3.0",
-		"@atlaskit/react-ufo": "^4.8.0",
-		"@atlaskit/smart-card": "^42.0.0",
+		"@atlaskit/react-ufo": "^4.9.0",
+		"@atlaskit/smart-card": "^42.1.0",
 		"@atlaskit/status": "^3.0.0",
 		"@atlaskit/task-decision": "^19.2.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^12.27.0",
+		"@atlaskit/tmp-editor-statsig": "^12.28.0",
 		"@atlaskit/tokens": "^6.3.0",
 		"@atlaskit/tooltip": "^20.4.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
@@ -70,7 +70,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^109.11.0",
+		"@atlaskit/editor-common": "^109.12.0",
 		"@atlaskit/link-provider": "^4.0.0",
 		"@atlaskit/media-core": "^37.0.0",
 		"react": "^18.2.0",