@atlaskit/editor-plugin-table 2.7.1 → 2.8.0

package/dist/es2019/plugins/table/utils/analytics.js

@@ -1,5 +1,9 @@
+import { useEffect, useRef } from 'react';
+import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { findTable, getSelectionRect } from '@atlaskit/editor-tables/utils';
+import { hasTableBeenResized } from '../pm-plugins/table-resizing/utils';
+import { getTableWidth } from '../utils';
 export function getSelectedTableInfo(selection) {
   let map;
   let totalRowCount = 0;
@@ -54,4 +58,130 @@ export const withEditorAnalyticsAPI = payload => editorAnalyticsAPI => {
     }
     return true;
   }, view);
+};
+export const generateResizedPayload = props => {
+  var _props$originalNode$a;
+  const tableMap = TableMap.get(props.resizedNode);
+  return {
+    action: TABLE_ACTION.RESIZED,
+    actionSubject: ACTION_SUBJECT.TABLE,
+    eventType: EVENT_TYPE.TRACK,
+    attributes: {
+      newWidth: props.resizedNode.attrs.width,
+      prevWidth: (_props$originalNode$a = props.originalNode.attrs.width) !== null && _props$originalNode$a !== void 0 ? _props$originalNode$a : null,
+      nodeSize: props.resizedNode.nodeSize,
+      totalTableWidth: hasTableBeenResized(props.resizedNode) ? getTableWidth(props.resizedNode) : null,
+      totalRowCount: tableMap.height,
+      totalColumnCount: tableMap.width
+    }
+  };
+};
+export const reduceResizeFrameRateSamples = frameRateSamples => {
+  if (frameRateSamples.length > 1) {
+    const frameRateSum = frameRateSamples.reduce((sum, frameRate, index) => {
+      if (index === 0) {
+        return sum;
+      } else {
+        return sum + frameRate;
+      }
+    }, 0);
+    const averageFrameRate = Math.round(frameRateSum / (frameRateSamples.length - 1));
+    return [frameRateSamples[0], averageFrameRate];
+  } else {
+    return frameRateSamples;
+  }
+};
+export const generateResizeFrameRatePayloads = props => {
+  const reducedResizeFrameRateSamples = reduceResizeFrameRateSamples(props.frameRateSamples);
+  return reducedResizeFrameRateSamples.map((frameRateSample, index) => ({
+    action: TABLE_ACTION.RESIZE_PERF_SAMPLING,
+    actionSubject: ACTION_SUBJECT.TABLE,
+    eventType: EVENT_TYPE.OPERATIONAL,
+    attributes: {
+      frameRate: frameRateSample,
+      nodeSize: props.originalNode.nodeSize,
+      docSize: props.docSize,
+      isInitialSample: index === 0
+    }
+  }));
+};
+
+/**
+ * Measures the framerate of a component over a given time period.
+ */
+export const useMeasureFramerate = (config = {}) => {
+  const {
+    maxSamples = 10,
+    minFrames = 5,
+    minTimeMs = 500,
+    sampleRateMs = 1000,
+    timeoutMs = 200
+  } = config;
+  let frameCount = useRef(0);
+  let lastTime = useRef(0);
+  let timeoutId = useRef();
+  let frameRateSamples = useRef([]);
+  useEffect(() => {
+    return () => {
+      if (timeoutId.current) {
+        clearTimeout(timeoutId.current);
+      }
+    };
+  }, []);
+  const startMeasure = () => {
+    frameCount.current = 0;
+    lastTime.current = performance.now();
+  };
+
+  /**
+   * Returns an array of frame rate samples as integers.
+   */
+  const endMeasure = () => {
+    const samples = frameRateSamples.current;
+    frameRateSamples.current = [];
+    return samples;
+  };
+  const sampleFrameRate = (delay = 0) => {
+    const currentTime = performance.now();
+    const deltaTime = currentTime - lastTime.current - delay;
+    const isValidSample = deltaTime > minTimeMs && frameCount.current >= minFrames;
+    if (isValidSample) {
+      const frameRate = Math.round(frameCount.current / (deltaTime / 1000));
+      frameRateSamples.current.push(frameRate);
+    }
+    frameCount.current = 0;
+    lastTime.current = 0;
+  };
+
+  /**
+   * Counts the number of frames that occur within a given time period. Intended to be called
+   * inside a `requestAnimationFrame` callback.
+   */
+  const countFrames = () => {
+    if (frameRateSamples.current.length >= maxSamples && timeoutId.current) {
+      clearTimeout(timeoutId.current);
+      return;
+    }
+
+    /**
+     * Allows us to keep counting frames even if `startMeasure` is not called
+     */
+    if (lastTime.current === 0) {
+      lastTime.current = performance.now();
+    }
+    frameCount.current++;
+    if (timeoutId.current) {
+      clearTimeout(timeoutId.current);
+    }
+    if (performance.now() - lastTime.current > sampleRateMs) {
+      sampleFrameRate();
+    } else {
+      timeoutId.current = setTimeout(() => sampleFrameRate(timeoutMs), timeoutMs);
+    }
+  };
+  return {
+    startMeasure,
+    endMeasure,
+    countFrames
+  };
 };

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "2.7.1",
+	"version": "2.8.0",
 	"sideEffects": false
 }

package/dist/esm/plugins/table/nodeviews/TableResizer.js

@@ -4,39 +4,20 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 import rafSchd from 'raf-schd';
-import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
 import { getGuidelinesWithHighlights } from '@atlaskit/editor-common/guideline';
 import { ResizerNext } from '@atlaskit/editor-common/resizer';
 import { resizerHandleShadowClassName } from '@atlaskit/editor-common/styles';
-import { TableMap } from '@atlaskit/editor-tables';
 import { findTable } from '@atlaskit/editor-tables/utils';
-import { COLUMN_MIN_WIDTH, getColgroupChildrenLength, hasTableBeenResized, previewScaleTable, scaleTable } from '../pm-plugins/table-resizing/utils';
+import { COLUMN_MIN_WIDTH, getColgroupChildrenLength, previewScaleTable, scaleTable } from '../pm-plugins/table-resizing/utils';
 import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
 import { TABLE_HIGHLIGHT_GAP, TABLE_SNAP_GAP } from '../ui/consts';
-import { getTableWidth } from '../utils';
+import { generateResizedPayload, generateResizeFrameRatePayloads, useMeasureFramerate } from '../utils/analytics';
 import { defaultGuidelines, defaultGuidelineWidths } from '../utils/guidelines';
 import { findClosestSnap } from '../utils/snapping';
 var handles = {
   right: true
 };
 var tableHandleMarginTop = 12;
-var generateResizedPayload = function generateResizedPayload(props) {
-  var _props$originalNode$a;
-  var tableMap = TableMap.get(props.resizedNode);
-  return {
-    action: TABLE_ACTION.RESIZED,
-    actionSubject: ACTION_SUBJECT.TABLE,
-    eventType: EVENT_TYPE.TRACK,
-    attributes: {
-      newWidth: props.resizedNode.attrs.width,
-      prevWidth: (_props$originalNode$a = props.originalNode.attrs.width) !== null && _props$originalNode$a !== void 0 ? _props$originalNode$a : null,
-      nodeSize: props.resizedNode.nodeSize,
-      totalTableWidth: hasTableBeenResized(props.resizedNode) ? getTableWidth(props.resizedNode) : null,
-      totalRowCount: tableMap.height,
-      totalColumnCount: tableMap.width
-    }
-  };
-};
 var getResizerHandleHeight = function getResizerHandleHeight(tableRef) {
   var tableHeight = tableRef === null || tableRef === void 0 ? void 0 : tableRef.clientHeight;
   var handleHeightSize = 'small';
@@ -79,6 +60,10 @@ export var TableResizer = function TableResizer(_ref) {
     setSnappingEnabled = _useState2[1];
   var resizerMinWidth = getResizerMinWidth(node);
   var handleHeightSize = getResizerHandleHeight(tableRef);
+  var _useMeasureFramerate = useMeasureFramerate(),
+    startMeasure = _useMeasureFramerate.startMeasure,
+    endMeasure = _useMeasureFramerate.endMeasure,
+    countFrames = _useMeasureFramerate.countFrames;
   var updateActiveGuidelines = useCallback(function (_ref2) {
     var gap = _ref2.gap,
       keys = _ref2.keys;
@@ -93,13 +78,14 @@ export var TableResizer = function TableResizer(_ref) {
     } : undefined;
   }, [snappingEnabled]);
   var handleResizeStart = useCallback(function () {
+    startMeasure();
     var dispatch = editorView.dispatch,
       tr = editorView.state.tr;
     dispatch(tr.setMeta(tableWidthPluginKey, {
       resizing: true
     }));
     setSnappingEnabled(displayGuideline(defaultGuidelines));
-  }, [displayGuideline, editorView]);
+  }, [displayGuideline, editorView, startMeasure]);
   var handleResizeStop = useCallback(function (originalState, delta) {
     var newWidth = originalState.width + delta.width;
     var state = editorView.state,
@@ -108,8 +94,20 @@ export var TableResizer = function TableResizer(_ref) {
     var tr = state.tr.setMeta(tableWidthPluginKey, {
       resizing: false
     });
+    var frameRateSamples = endMeasure();
+    if (frameRateSamples.length > 0) {
+      var resizeFrameRatePayloads = generateResizeFrameRatePayloads({
+        docSize: state.doc.nodeSize,
+        frameRateSamples: frameRateSamples,
+        originalNode: node
+      });
+      resizeFrameRatePayloads.forEach(function (payload) {
+        var _attachAnalyticsEvent;
+        (_attachAnalyticsEvent = attachAnalyticsEvent(payload)) === null || _attachAnalyticsEvent === void 0 ? void 0 : _attachAnalyticsEvent(tr);
+      });
+    }
     if (typeof pos === 'number') {
-      var _attachAnalyticsEvent;
+      var _attachAnalyticsEvent2;
       tr = tr.setNodeMarkup(pos, undefined, _objectSpread(_objectSpread({}, node.attrs), {}, {
         width: newWidth
       }));
@@ -121,10 +119,10 @@ export var TableResizer = function TableResizer(_ref) {
         parentWidth: newWidth
       }, editorView.domAtPos.bind(editorView))(tr);
       var scaledNode = tr.doc.nodeAt(pos);
-      (_attachAnalyticsEvent = attachAnalyticsEvent(generateResizedPayload({
+      (_attachAnalyticsEvent2 = attachAnalyticsEvent(generateResizedPayload({
         originalNode: node,
         resizedNode: scaledNode
-      }))) === null || _attachAnalyticsEvent === void 0 ? void 0 : _attachAnalyticsEvent(tr);
+      }))) === null || _attachAnalyticsEvent2 === void 0 ? void 0 : _attachAnalyticsEvent2(tr);
     }
     dispatch(tr);
 
@@ -132,8 +130,9 @@ export var TableResizer = function TableResizer(_ref) {
     displayGuideline([]);
     updateWidth(newWidth);
     return newWidth;
-  }, [updateWidth, editorView, getPos, node, tableRef, displayGuideline, attachAnalyticsEvent]);
+  }, [updateWidth, editorView, getPos, node, tableRef, displayGuideline, attachAnalyticsEvent, endMeasure]);
   var handleResize = useCallback(function (originalState, delta) {
+    countFrames();
     var newWidth = originalState.width + delta.width;
     var pos = getPos();
     if (typeof pos !== 'number') {
@@ -148,7 +147,7 @@ export var TableResizer = function TableResizer(_ref) {
     updateActiveGuidelines(findClosestSnap(newWidth, defaultGuidelineWidths, defaultGuidelines, TABLE_HIGHLIGHT_GAP));
     updateWidth(newWidth);
     return newWidth;
-  }, [editorView, getPos, node, tableRef, updateWidth, updateActiveGuidelines]);
+  }, [editorView, getPos, node, tableRef, updateWidth, updateActiveGuidelines, countFrames]);
   var scheduleResize = useMemo(function () {
     return rafSchd(handleResize);
   }, [handleResize]);

package/dist/esm/plugins/table/toolbar.js

@@ -299,10 +299,8 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
       if (tableObject && pluginState.editorHasFocus && !isWidthResizing) {
         var nodeType = state.schema.nodes.table;
         var menu = getToolbarMenuConfig(config, pluginState, intl, editorAnalyticsAPI);
-        var _ref3 = getEditorFeatureFlags() || {},
-          tableCellOptionsInFloatingToolbar = _ref3.tableCellOptionsInFloatingToolbar;
-        var cellItems = getCellItems(config, state, getEditorView(), intl, getEditorContainerWidth, editorAnalyticsAPI, tableCellOptionsInFloatingToolbar);
-        var colorPicker = getColorPicker(state, menu, intl, editorAnalyticsAPI, tableCellOptionsInFloatingToolbar);
+        var cellItems = getCellItems(config, state, getEditorView(), intl, getEditorContainerWidth, editorAnalyticsAPI);
+        var colorPicker = getColorPicker(state, menu, intl, editorAnalyticsAPI);
 
         // Check if we need to show confirm dialog for delete button
         var confirmDialog;
@@ -391,26 +389,24 @@ var separator = function separator(hidden) {
     hidden: hidden
   };
 };
-var getCellItems = function getCellItems(pluginConfig, state, view, _ref4, getEditorContainerWidth, editorAnalyticsAPI, tableCellOptionsInFloatingToolbar) {
-  var formatMessage = _ref4.formatMessage;
-  if (pluginConfig.allowCellOptionsInFloatingToolbar || tableCellOptionsInFloatingToolbar) {
-    var initialSelectionRect = getClosestSelectionRect(state);
-    if (initialSelectionRect) {
-      var cellOptions = getToolbarCellOptionsConfig(state, view, initialSelectionRect, {
-        formatMessage: formatMessage
-      }, getEditorContainerWidth, editorAnalyticsAPI);
-      return [cellOptions, separator(cellOptions.hidden)];
-    }
+var getCellItems = function getCellItems(pluginConfig, state, view, _ref3, getEditorContainerWidth, editorAnalyticsAPI) {
+  var formatMessage = _ref3.formatMessage;
+  var initialSelectionRect = getClosestSelectionRect(state);
+  if (initialSelectionRect) {
+    var cellOptions = getToolbarCellOptionsConfig(state, view, initialSelectionRect, {
+      formatMessage: formatMessage
+    }, getEditorContainerWidth, editorAnalyticsAPI);
+    return [cellOptions, separator(cellOptions.hidden)];
   }
   return [];
 };
-var getColorPicker = function getColorPicker(state, menu, _ref5, editorAnalyticsAPI, tableCellOptionsInFloatingToolbar) {
+var getColorPicker = function getColorPicker(state, menu, _ref4, editorAnalyticsAPI) {
   var _node$attrs;
-  var formatMessage = _ref5.formatMessage;
+  var formatMessage = _ref4.formatMessage;
   var _getPluginState2 = getPluginState(state),
     targetCellPosition = _getPluginState2.targetCellPosition,
     pluginConfig = _getPluginState2.pluginConfig;
-  if (!pluginConfig.allowBackgroundColor || !tableCellOptionsInFloatingToolbar) {
+  if (!pluginConfig.allowBackgroundColor) {
     return [];
   }
   var node = targetCellPosition ? state.doc.nodeAt(targetCellPosition) : undefined;

package/dist/esm/plugins/table/utils/analytics.js

@@ -1,5 +1,9 @@
+import { useEffect, useRef } from 'react';
+import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import { findTable, getSelectionRect } from '@atlaskit/editor-tables/utils';
+import { hasTableBeenResized } from '../pm-plugins/table-resizing/utils';
+import { getTableWidth } from '../utils';
 export function getSelectedTableInfo(selection) {
   var map;
   var totalRowCount = 0;
@@ -59,4 +63,139 @@ export var withEditorAnalyticsAPI = function withEditorAnalyticsAPI(payload) {
       };
     };
   };
+};
+export var generateResizedPayload = function generateResizedPayload(props) {
+  var _props$originalNode$a;
+  var tableMap = TableMap.get(props.resizedNode);
+  return {
+    action: TABLE_ACTION.RESIZED,
+    actionSubject: ACTION_SUBJECT.TABLE,
+    eventType: EVENT_TYPE.TRACK,
+    attributes: {
+      newWidth: props.resizedNode.attrs.width,
+      prevWidth: (_props$originalNode$a = props.originalNode.attrs.width) !== null && _props$originalNode$a !== void 0 ? _props$originalNode$a : null,
+      nodeSize: props.resizedNode.nodeSize,
+      totalTableWidth: hasTableBeenResized(props.resizedNode) ? getTableWidth(props.resizedNode) : null,
+      totalRowCount: tableMap.height,
+      totalColumnCount: tableMap.width
+    }
+  };
+};
+export var reduceResizeFrameRateSamples = function reduceResizeFrameRateSamples(frameRateSamples) {
+  if (frameRateSamples.length > 1) {
+    var frameRateSum = frameRateSamples.reduce(function (sum, frameRate, index) {
+      if (index === 0) {
+        return sum;
+      } else {
+        return sum + frameRate;
+      }
+    }, 0);
+    var averageFrameRate = Math.round(frameRateSum / (frameRateSamples.length - 1));
+    return [frameRateSamples[0], averageFrameRate];
+  } else {
+    return frameRateSamples;
+  }
+};
+export var generateResizeFrameRatePayloads = function generateResizeFrameRatePayloads(props) {
+  var reducedResizeFrameRateSamples = reduceResizeFrameRateSamples(props.frameRateSamples);
+  return reducedResizeFrameRateSamples.map(function (frameRateSample, index) {
+    return {
+      action: TABLE_ACTION.RESIZE_PERF_SAMPLING,
+      actionSubject: ACTION_SUBJECT.TABLE,
+      eventType: EVENT_TYPE.OPERATIONAL,
+      attributes: {
+        frameRate: frameRateSample,
+        nodeSize: props.originalNode.nodeSize,
+        docSize: props.docSize,
+        isInitialSample: index === 0
+      }
+    };
+  });
+};
+
+/**
+ * Measures the framerate of a component over a given time period.
+ */
+export var useMeasureFramerate = function useMeasureFramerate() {
+  var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var _config$maxSamples = config.maxSamples,
+    maxSamples = _config$maxSamples === void 0 ? 10 : _config$maxSamples,
+    _config$minFrames = config.minFrames,
+    minFrames = _config$minFrames === void 0 ? 5 : _config$minFrames,
+    _config$minTimeMs = config.minTimeMs,
+    minTimeMs = _config$minTimeMs === void 0 ? 500 : _config$minTimeMs,
+    _config$sampleRateMs = config.sampleRateMs,
+    sampleRateMs = _config$sampleRateMs === void 0 ? 1000 : _config$sampleRateMs,
+    _config$timeoutMs = config.timeoutMs,
+    timeoutMs = _config$timeoutMs === void 0 ? 200 : _config$timeoutMs;
+  var frameCount = useRef(0);
+  var lastTime = useRef(0);
+  var timeoutId = useRef();
+  var frameRateSamples = useRef([]);
+  useEffect(function () {
+    return function () {
+      if (timeoutId.current) {
+        clearTimeout(timeoutId.current);
+      }
+    };
+  }, []);
+  var startMeasure = function startMeasure() {
+    frameCount.current = 0;
+    lastTime.current = performance.now();
+  };
+
+  /**
+   * Returns an array of frame rate samples as integers.
+   */
+  var endMeasure = function endMeasure() {
+    var samples = frameRateSamples.current;
+    frameRateSamples.current = [];
+    return samples;
+  };
+  var sampleFrameRate = function sampleFrameRate() {
+    var delay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+    var currentTime = performance.now();
+    var deltaTime = currentTime - lastTime.current - delay;
+    var isValidSample = deltaTime > minTimeMs && frameCount.current >= minFrames;
+    if (isValidSample) {
+      var frameRate = Math.round(frameCount.current / (deltaTime / 1000));
+      frameRateSamples.current.push(frameRate);
+    }
+    frameCount.current = 0;
+    lastTime.current = 0;
+  };
+
+  /**
+   * Counts the number of frames that occur within a given time period. Intended to be called
+   * inside a `requestAnimationFrame` callback.
+   */
+  var countFrames = function countFrames() {
+    if (frameRateSamples.current.length >= maxSamples && timeoutId.current) {
+      clearTimeout(timeoutId.current);
+      return;
+    }
+
+    /**
+     * Allows us to keep counting frames even if `startMeasure` is not called
+     */
+    if (lastTime.current === 0) {
+      lastTime.current = performance.now();
+    }
+    frameCount.current++;
+    if (timeoutId.current) {
+      clearTimeout(timeoutId.current);
+    }
+    if (performance.now() - lastTime.current > sampleRateMs) {
+      sampleFrameRate();
+    } else {
+      timeoutId.current = setTimeout(function () {
+        return sampleFrameRate(timeoutMs);
+      }, timeoutMs);
+    }
+  };
+  return {
+    startMeasure: startMeasure,
+    endMeasure: endMeasure,
+    countFrames: countFrames
+  };
 };

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "2.7.1",
+	"version": "2.8.0",
 	"sideEffects": false
 }

package/dist/types/plugins/table/types.d.ts

@@ -38,7 +38,6 @@ export interface PluginConfig {
     permittedLayouts?: PermittedLayoutsDescriptor;
     allowControls?: boolean;
     stickyHeaders?: boolean;
-    allowCellOptionsInFloatingToolbar?: boolean;
     tableCellOptimization?: boolean;
     tableRenderOptimization?: boolean;
     stickyHeadersOptimization?: boolean;

package/dist/types/plugins/table/utils/analytics.d.ts

@@ -1,5 +1,6 @@
-import type { AnalyticsEventPayload, AnalyticsEventPayloadCallback, EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+import type { AnalyticsEventPayload, AnalyticsEventPayloadCallback, EditorAnalyticsAPI, TableEventPayload } from '@atlaskit/editor-common/analytics';
 import { HigherOrderCommand } from '@atlaskit/editor-common/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import { Selection } from '@atlaskit/editor-prosemirror/state';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 export declare function getSelectedTableInfo(selection: Selection): {
@@ -16,3 +17,29 @@ export declare function getSelectedCellInfo(selection: Selection): {
     totalCells: number;
 };
 export declare const withEditorAnalyticsAPI: (payload: AnalyticsEventPayload | AnalyticsEventPayloadCallback) => (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => HigherOrderCommand;
+interface UseMeasureFramerateConfig {
+    maxSamples?: number;
+    minFrames?: number;
+    minTimeMs?: number;
+    sampleRateMs?: number;
+    timeoutMs?: number;
+}
+export declare const generateResizedPayload: (props: {
+    originalNode: PMNode;
+    resizedNode: PMNode;
+}) => TableEventPayload;
+export declare const reduceResizeFrameRateSamples: (frameRateSamples: number[]) => number[];
+export declare const generateResizeFrameRatePayloads: (props: {
+    docSize: number;
+    frameRateSamples: number[];
+    originalNode: PMNode;
+}) => TableEventPayload[];
+/**
+ * Measures the framerate of a component over a given time period.
+ */
+export declare const useMeasureFramerate: (config?: UseMeasureFramerateConfig) => {
+    startMeasure: () => void;
+    endMeasure: () => number[];
+    countFrames: () => void;
+};
+export {};

package/dist/types-ts4.5/plugins/table/types.d.ts

@@ -38,7 +38,6 @@ export interface PluginConfig {
     permittedLayouts?: PermittedLayoutsDescriptor;
     allowControls?: boolean;
     stickyHeaders?: boolean;
-    allowCellOptionsInFloatingToolbar?: boolean;
     tableCellOptimization?: boolean;
     tableRenderOptimization?: boolean;
     stickyHeadersOptimization?: boolean;

package/dist/types-ts4.5/plugins/table/utils/analytics.d.ts

@@ -1,5 +1,6 @@
-import type { AnalyticsEventPayload, AnalyticsEventPayloadCallback, EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+import type { AnalyticsEventPayload, AnalyticsEventPayloadCallback, EditorAnalyticsAPI, TableEventPayload } from '@atlaskit/editor-common/analytics';
 import { HigherOrderCommand } from '@atlaskit/editor-common/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import { Selection } from '@atlaskit/editor-prosemirror/state';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 export declare function getSelectedTableInfo(selection: Selection): {
@@ -16,3 +17,29 @@ export declare function getSelectedCellInfo(selection: Selection): {
     totalCells: number;
 };
 export declare const withEditorAnalyticsAPI: (payload: AnalyticsEventPayload | AnalyticsEventPayloadCallback) => (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => HigherOrderCommand;
+interface UseMeasureFramerateConfig {
+    maxSamples?: number;
+    minFrames?: number;
+    minTimeMs?: number;
+    sampleRateMs?: number;
+    timeoutMs?: number;
+}
+export declare const generateResizedPayload: (props: {
+    originalNode: PMNode;
+    resizedNode: PMNode;
+}) => TableEventPayload;
+export declare const reduceResizeFrameRateSamples: (frameRateSamples: number[]) => number[];
+export declare const generateResizeFrameRatePayloads: (props: {
+    docSize: number;
+    frameRateSamples: number[];
+    originalNode: PMNode;
+}) => TableEventPayload[];
+/**
+ * Measures the framerate of a component over a given time period.
+ */
+export declare const useMeasureFramerate: (config?: UseMeasureFramerateConfig) => {
+    startMeasure: () => void;
+    endMeasure: () => number[];
+    countFrames: () => void;
+};
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-table",
-  "version": "2.7.1",
+  "version": "2.8.0",
   "description": "Table plugin for the @atlaskit/editor",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@atlaskit/adf-schema": "^28.0.0",
-    "@atlaskit/editor-common": "^74.40.0",
+    "@atlaskit/editor-common": "^74.42.0",
     "@atlaskit/editor-palette": "1.5.1",
     "@atlaskit/editor-plugin-analytics": "^0.1.0",
     "@atlaskit/editor-plugin-content-insertion": "^0.0.7",
@@ -67,6 +67,7 @@
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
     "@atlassian/feature-flags-test-utils": "^0.1.2",
     "@testing-library/react": "^12.1.5",
+    "@testing-library/react-hooks": "^8.0.1",
     "raf-stub": "^2.0.1",
     "typescript": "~4.9.5"
   },

package/report.api.md

@@ -41,8 +41,6 @@ interface PluginConfig {
   // (undocumented)
   allowBackgroundColor?: boolean;
   // (undocumented)
-  allowCellOptionsInFloatingToolbar?: boolean;
-  // (undocumented)
   allowCollapse?: boolean;
   // (undocumented)
   allowColumnResizing?: boolean;

package/src/__tests__/integration/floating-toolbar.ts

@@ -35,7 +35,6 @@ BrowserTestCase(
         advanced: true,
         allowColumnSorting: true,
         allowDistributeColumns: true,
-        allowCellOptionsInFloatingToolbar: true,
       },
       defaultValue: basicTable,
     });
@@ -91,7 +90,6 @@ BrowserTestCase(
         advanced: true,
         allowColumnSorting: true,
         allowDistributeColumns: true,
-        allowCellOptionsInFloatingToolbar: true,
       },
       defaultValue: basicTable,
     });
@@ -138,7 +136,6 @@ BrowserTestCase(
       allowTables: {
         allowColumnSorting: true,
         allowDistributeColumns: true,
-        allowCellOptionsInFloatingToolbar: true,
       },
       defaultValue: basicTable,
     });
@@ -185,7 +182,6 @@ BrowserTestCase(
       allowTables: {
         allowColumnSorting: true,
         allowDistributeColumns: true,
-        allowCellOptionsInFloatingToolbar: true,
       },
       defaultValue: documentWithMergedCells,
     });
@@ -247,7 +243,6 @@ BrowserTestCase(
       allowTables: {
         allowColumnSorting: true,
         allowDistributeColumns: true,
-        allowCellOptionsInFloatingToolbar: true,
       },
       defaultValue: basicTableWithMergedCell,
     });
@@ -295,7 +290,6 @@ BrowserTestCase(
       allowTables: {
         allowColumnSorting: true,
         allowDistributeColumns: true,
-        allowCellOptionsInFloatingToolbar: true,
       },
       defaultValue: basicTableWithMergedCell,
     });
@@ -343,7 +337,6 @@ BrowserTestCase(
       allowTables: {
         allowColumnSorting: true,
         allowDistributeColumns: true,
-        allowCellOptionsInFloatingToolbar: true,
       },
       defaultValue: basicTable,
     });