@atlaskit/renderer 125.0.1 → 125.1.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/renderer
 
+## 125.1.0
+
+### Minor Changes
+
+- [`e8f5c745198b6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e8f5c745198b6) -
+  add sampled "renderer rendered" event
+
+### Patch Changes
+
+- Updated dependencies
+
+## 125.0.2
+
+### Patch Changes
+
+- [`ba0e1d49e14cb`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ba0e1d49e14cb) -
+  ENGHEALTH-40073: Make tables and extensions focusable if they have overscroll so that they can be
+  interacted with in an accessible way.
+- Updated dependencies
+
 ## 125.0.1
 
 ### Patch Changes

package/dist/cjs/react/nodes/extension.js

@@ -85,7 +85,9 @@ var renderExtension = exports.renderExtension = function renderExtension(content
       "data-testid": "extension--wrapper",
       "data-node-type": "extension"
     }, (0, _react.jsx)("div", {
+      tabIndex: (0, _platformFeatureFlags.fg)('platform_editor_dec_a11y_fixes') ? options.tabIndex : undefined
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+      ,
       className: overflowContainerClass,
       css: [(0, _platformFeatureFlags.fg)('platform_fix_macro_renders_in_layouts') && containerStyle]
     }, content));
@@ -106,7 +108,9 @@ var renderExtension = exports.renderExtension = function renderExtension(content
       "data-layout": layout,
       "data-local-id": localId
     }, (0, _react.jsx)("div", {
+      tabIndex: (0, _platformFeatureFlags.fg)('platform_editor_dec_a11y_fixes') ? options.tabIndex : undefined
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+      ,
       className: overflowContainerClass,
       css: [(0, _platformFeatureFlags.fg)('platform_fix_macro_renders_in_layouts') && containerStyle]
     }, content));
@@ -137,7 +141,8 @@ var Extension = function Extension(props) {
         return renderExtension(result, layout, {
           isTopLevel: path.length < 1,
           handleRef: handleRef,
-          shadowClassNames: shadowClassNames
+          shadowClassNames: shadowClassNames,
+          tabIndex: (0, _platformFeatureFlags.fg)('platform_editor_dec_a11y_fixes') ? props.tabIndex : undefined
         }, undefined, parameters === null || parameters === void 0 ? void 0 : parameters.extensionId, extensionViewportSizes, nodeHeight, localId);
       }
       // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -149,7 +154,8 @@ var Extension = function Extension(props) {
     return renderExtension(text || 'extension', layout, {
       isTopLevel: path.length < 1,
       handleRef: handleRef,
-      shadowClassNames: shadowClassNames
+      shadowClassNames: shadowClassNames,
+      tabIndex: (0, _platformFeatureFlags.fg)('platform_editor_dec_a11y_fixes') ? props.tabIndex : undefined
     }, undefined, parameters === null || parameters === void 0 ? void 0 : parameters.extensionId, extensionViewportSizes, nodeHeight, localId);
   });
 };

package/dist/cjs/react/nodes/table/sticky.js

@@ -257,7 +257,6 @@ var OverflowParent = exports.OverflowParent = /*#__PURE__*/function () {
      * @example
      */
     // Ignored via go/ees005
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
   }, {
     key: "addEventListener",
     value: function addEventListener(type, cb) {
@@ -278,7 +277,6 @@ var OverflowParent = exports.OverflowParent = /*#__PURE__*/function () {
      * @example
      */
     // Ignored via go/ees005
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
   }, {
     key: "removeEventListener",
     value: function removeEventListener(type, cb) {

package/dist/cjs/react/nodes/table.js

@@ -130,13 +130,6 @@ var isHeaderRowEnabled = exports.isHeaderRowEnabled = function isHeaderRowEnable
  * This TableWrapper component was created to make sure that the aria-label can be
  * internationalized without needing to add `intl` to the TableContainer.
  *
- * @param {TableWrapperProps} root0 - The props object.
- * @param {React.ReactNode} root0.children - The table content to render inside the wrapper.
- * @param {React.RefObject<HTMLDivElement>} root0.wrapperRef - Ref to the wrapper div element.
- * @param {(() => void) | undefined} root0.onScroll - Optional scroll event handler.
- * @param {StickyHeaderConfig | undefined} root0.stickyHeaders - Optional sticky header configuration.
- * @returns The rendered table wrapper component.
- * @example
  * <TableWrapper wrapperRef={ref} onScroll={handleScroll} stickyHeaders={config}>
  *   <Table>...</Table>
  * </TableWrapper>
@@ -145,7 +138,8 @@ var TableWrapper = function TableWrapper(_ref2) {
   var children = _ref2.children,
     wrapperRef = _ref2.wrapperRef,
     onScroll = _ref2.onScroll,
-    stickyHeaders = _ref2.stickyHeaders;
+    stickyHeaders = _ref2.stickyHeaders,
+    tabIndex = _ref2.tabIndex;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
   return /*#__PURE__*/_react.default.createElement("div", {
@@ -156,7 +150,7 @@ var TableWrapper = function TableWrapper(_ref2) {
     // Adding tabIndex here because this is a scrollable container and it needs to be focusable so keyboard users can scroll it.
     // eslint-disable-next-line @atlassian/a11y/no-noninteractive-tabindex
     ,
-    tabIndex: 0,
+    tabIndex: tabIndex,
     role: "region",
     "aria-label": formatMessage(_messages.tableMessages.tableScrollRegion)
   }, children);
@@ -560,10 +554,11 @@ var TableContainer = exports.TableContainer = /*#__PURE__*/function (_React$Comp
         tableNode: tableNode,
         rendererAppearance: rendererAppearance,
         allowTableResizing: allowTableResizing
-      }, [children && children[0]]), (0, _platformFeatureFlags.fg)('editor_enghealth_focusable_scrollable_tables') ? /*#__PURE__*/_react.default.createElement(TableWrapper, {
+      }, [children && children[0]]), (0, _platformFeatureFlags.fg)('platform_editor_dec_a11y_fixes') ? /*#__PURE__*/_react.default.createElement(TableWrapper, {
         wrapperRef: this.wrapperRef,
         onScroll: this.props.stickyHeaders ? this.onWrapperScrolled : undefined,
-        stickyHeaders: stickyHeaders
+        stickyHeaders: stickyHeaders,
+        tabIndex: this.props.tabIndex
       }, /*#__PURE__*/_react.default.createElement(_table.Table, {
         innerRef: this.tableRef,
         columnWidths: columnWidths,

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

@@ -68,8 +68,9 @@ 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_INFO_TIMEOUT = 10000;
+var RENDER_EVENT_SAMPLE_RATE = 0.2;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "0.0.0-development";
+var packageVersion = "125.0.2";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'
@@ -348,7 +349,7 @@ var RendererFunctionalComponent = exports.RendererFunctionalComponent = function
           var severity = !!forceSeverityTracking || analyticsEventSeverityTracking !== null && analyticsEventSeverityTracking !== void 0 && analyticsEventSeverityTracking.enabled ? (0, _utils.getAnalyticsEventSeverity)(duration, (_analyticsEventSeveri = analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.severityNormalThreshold) !== null && _analyticsEventSeveri !== void 0 ? _analyticsEventSeveri : NORMAL_SEVERITY_THRESHOLD, (_analyticsEventSeveri2 = analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.severityDegradedThreshold) !== null && _analyticsEventSeveri2 !== void 0 ? _analyticsEventSeveri2 : DEGRADED_SEVERITY_THRESHOLD) : undefined;
           var isTTRTrackingExplicitlyDisabled = (analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.enabled) === false;
           if (!isTTRTrackingExplicitlyDisabled) {
-            _fireAnalyticsEvent({
+            var event = {
               action: _analytics.ACTION.RENDERED,
               actionSubject: _analytics.ACTION_SUBJECT.RENDERER,
               attributes: {
@@ -362,7 +363,13 @@ var RendererFunctionalComponent = exports.RendererFunctionalComponent = function
                 severity: severity
               },
               eventType: _analytics.EVENT_TYPE.OPERATIONAL
-            });
+            };
+            _fireAnalyticsEvent(event);
+            if ((0, _expValEquals.expValEquals)('platform_editor_sample_renderer_rendered_event', 'isEnabled', true) && Math.random() < RENDER_EVENT_SAMPLE_RATE) {
+              _fireAnalyticsEvent(_objectSpread(_objectSpread({}, event), {}, {
+                action: _analytics.ACTION.RENDERED_SAMPLED
+              }));
+            }
           }
 
           // Ignored via go/ees005

package/dist/es2019/react/nodes/extension.js

@@ -69,7 +69,9 @@ export const renderExtension = (content, layout, options = {}, removeOverflow, e
       "data-testid": "extension--wrapper",
       "data-node-type": "extension"
     }, jsx("div", {
+      tabIndex: fg('platform_editor_dec_a11y_fixes') ? options.tabIndex : undefined
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+      ,
       className: overflowContainerClass,
       css: [fg('platform_fix_macro_renders_in_layouts') && containerStyle]
     }, content));
@@ -90,7 +92,9 @@ export const renderExtension = (content, layout, options = {}, removeOverflow, e
     "data-layout": layout,
     "data-local-id": localId
   }, jsx("div", {
+    tabIndex: fg('platform_editor_dec_a11y_fixes') ? options.tabIndex : undefined
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+    ,
     className: overflowContainerClass,
     css: [fg('platform_fix_macro_renders_in_layouts') && containerStyle]
   }, content)));
@@ -121,7 +125,8 @@ const Extension = props => {
         return renderExtension(result, layout, {
           isTopLevel: path.length < 1,
           handleRef,
-          shadowClassNames
+          shadowClassNames,
+          tabIndex: fg('platform_editor_dec_a11y_fixes') ? props.tabIndex : undefined
         }, undefined, parameters === null || parameters === void 0 ? void 0 : parameters.extensionId, extensionViewportSizes, nodeHeight, localId);
       }
       // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -133,7 +138,8 @@ const Extension = props => {
     return renderExtension(text || 'extension', layout, {
       isTopLevel: path.length < 1,
       handleRef,
-      shadowClassNames
+      shadowClassNames,
+      tabIndex: fg('platform_editor_dec_a11y_fixes') ? props.tabIndex : undefined
     }, undefined, parameters === null || parameters === void 0 ? void 0 : parameters.extensionId, extensionViewportSizes, nodeHeight, localId);
   });
 };

package/dist/es2019/react/nodes/table/sticky.js

@@ -254,8 +254,9 @@ export class OverflowParent {
    * @example
    */
   // Ignored via go/ees005
+  addEventListener(type, cb,
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  addEventListener(type, cb, ...args) {
+  ...args) {
     // Ignored via go/ees005
     // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
     this.ref.addEventListener(type, cb, ...args);
@@ -269,8 +270,9 @@ export class OverflowParent {
    * @example
    */
   // Ignored via go/ees005
+  removeEventListener(type, cb,
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  removeEventListener(type, cb, ...args) {
+  ...args) {
     // Ignored via go/ees005
     // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
     this.ref.removeEventListener(type, cb, ...args);

package/dist/es2019/react/nodes/table.js

@@ -99,13 +99,6 @@ export const isHeaderRowEnabled = rows => {
  * This TableWrapper component was created to make sure that the aria-label can be
  * internationalized without needing to add `intl` to the TableContainer.
  *
- * @param {TableWrapperProps} root0 - The props object.
- * @param {React.ReactNode} root0.children - The table content to render inside the wrapper.
- * @param {React.RefObject<HTMLDivElement>} root0.wrapperRef - Ref to the wrapper div element.
- * @param {(() => void) | undefined} root0.onScroll - Optional scroll event handler.
- * @param {StickyHeaderConfig | undefined} root0.stickyHeaders - Optional sticky header configuration.
- * @returns The rendered table wrapper component.
- * @example
  * <TableWrapper wrapperRef={ref} onScroll={handleScroll} stickyHeaders={config}>
  *   <Table>...</Table>
  * </TableWrapper>
@@ -114,7 +107,8 @@ const TableWrapper = ({
   children,
   wrapperRef,
   onScroll,
-  stickyHeaders
+  stickyHeaders,
+  tabIndex
 }) => {
   const {
     formatMessage
@@ -127,7 +121,7 @@ const TableWrapper = ({
     // Adding tabIndex here because this is a scrollable container and it needs to be focusable so keyboard users can scroll it.
     // eslint-disable-next-line @atlassian/a11y/no-noninteractive-tabindex
     ,
-    tabIndex: 0,
+    tabIndex: tabIndex,
     role: "region",
     "aria-label": formatMessage(tableMessages.tableScrollRegion)
   }, children);
@@ -503,10 +497,11 @@ export class TableContainer extends React.Component {
       tableNode: tableNode,
       rendererAppearance: rendererAppearance,
       allowTableResizing: allowTableResizing
-    }, [children && children[0]]), fg('editor_enghealth_focusable_scrollable_tables') ? /*#__PURE__*/React.createElement(TableWrapper, {
+    }, [children && children[0]]), fg('platform_editor_dec_a11y_fixes') ? /*#__PURE__*/React.createElement(TableWrapper, {
       wrapperRef: this.wrapperRef,
       onScroll: this.props.stickyHeaders ? this.onWrapperScrolled : undefined,
-      stickyHeaders: stickyHeaders
+      stickyHeaders: stickyHeaders,
+      tabIndex: this.props.tabIndex
     }, /*#__PURE__*/React.createElement(Table, {
       innerRef: this.tableRef,
       columnWidths: columnWidths,

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

@@ -54,8 +54,9 @@ 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_INFO_TIMEOUT = 10000;
+const RENDER_EVENT_SAMPLE_RATE = 0.2;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "0.0.0-development";
+const packageVersion = "125.0.2";
 const setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'
@@ -340,7 +341,7 @@ export const RendererFunctionalComponent = props => {
           const severity = !!forceSeverityTracking || analyticsEventSeverityTracking !== null && analyticsEventSeverityTracking !== void 0 && analyticsEventSeverityTracking.enabled ? getAnalyticsEventSeverity(duration, (_analyticsEventSeveri = analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.severityNormalThreshold) !== null && _analyticsEventSeveri !== void 0 ? _analyticsEventSeveri : NORMAL_SEVERITY_THRESHOLD, (_analyticsEventSeveri2 = analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.severityDegradedThreshold) !== null && _analyticsEventSeveri2 !== void 0 ? _analyticsEventSeveri2 : DEGRADED_SEVERITY_THRESHOLD) : undefined;
           const isTTRTrackingExplicitlyDisabled = (analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.enabled) === false;
           if (!isTTRTrackingExplicitlyDisabled) {
-            fireAnalyticsEvent({
+            const event = {
               action: ACTION.RENDERED,
               actionSubject: ACTION_SUBJECT.RENDERER,
               attributes: {
@@ -354,7 +355,14 @@ export const RendererFunctionalComponent = props => {
                 severity
               },
               eventType: EVENT_TYPE.OPERATIONAL
-            });
+            };
+            fireAnalyticsEvent(event);
+            if (expValEquals('platform_editor_sample_renderer_rendered_event', 'isEnabled', true) && Math.random() < RENDER_EVENT_SAMPLE_RATE) {
+              fireAnalyticsEvent({
+                ...event,
+                action: ACTION.RENDERED_SAMPLED
+              });
+            }
           }
 
           // Ignored via go/ees005

package/dist/esm/react/nodes/extension.js

@@ -77,7 +77,9 @@ export var renderExtension = function renderExtension(content, layout) {
       "data-testid": "extension--wrapper",
       "data-node-type": "extension"
     }, jsx("div", {
+      tabIndex: fg('platform_editor_dec_a11y_fixes') ? options.tabIndex : undefined
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+      ,
       className: overflowContainerClass,
       css: [fg('platform_fix_macro_renders_in_layouts') && containerStyle]
     }, content));
@@ -98,7 +100,9 @@ export var renderExtension = function renderExtension(content, layout) {
       "data-layout": layout,
       "data-local-id": localId
     }, jsx("div", {
+      tabIndex: fg('platform_editor_dec_a11y_fixes') ? options.tabIndex : undefined
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
+      ,
       className: overflowContainerClass,
       css: [fg('platform_fix_macro_renders_in_layouts') && containerStyle]
     }, content));
@@ -129,7 +133,8 @@ var Extension = function Extension(props) {
         return renderExtension(result, layout, {
           isTopLevel: path.length < 1,
           handleRef: handleRef,
-          shadowClassNames: shadowClassNames
+          shadowClassNames: shadowClassNames,
+          tabIndex: fg('platform_editor_dec_a11y_fixes') ? props.tabIndex : undefined
         }, undefined, parameters === null || parameters === void 0 ? void 0 : parameters.extensionId, extensionViewportSizes, nodeHeight, localId);
       }
       // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -141,7 +146,8 @@ var Extension = function Extension(props) {
     return renderExtension(text || 'extension', layout, {
       isTopLevel: path.length < 1,
       handleRef: handleRef,
-      shadowClassNames: shadowClassNames
+      shadowClassNames: shadowClassNames,
+      tabIndex: fg('platform_editor_dec_a11y_fixes') ? props.tabIndex : undefined
     }, undefined, parameters === null || parameters === void 0 ? void 0 : parameters.extensionId, extensionViewportSizes, nodeHeight, localId);
   });
 };

package/dist/esm/react/nodes/table/sticky.js

@@ -248,7 +248,6 @@ export var OverflowParent = /*#__PURE__*/function () {
      * @example
      */
     // Ignored via go/ees005
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
   }, {
     key: "addEventListener",
     value: function addEventListener(type, cb) {
@@ -269,7 +268,6 @@ export var OverflowParent = /*#__PURE__*/function () {
      * @example
      */
     // Ignored via go/ees005
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
   }, {
     key: "removeEventListener",
     value: function removeEventListener(type, cb) {

package/dist/esm/react/nodes/table.js

@@ -123,13 +123,6 @@ export var isHeaderRowEnabled = function isHeaderRowEnabled(rows) {
  * This TableWrapper component was created to make sure that the aria-label can be
  * internationalized without needing to add `intl` to the TableContainer.
  *
- * @param {TableWrapperProps} root0 - The props object.
- * @param {React.ReactNode} root0.children - The table content to render inside the wrapper.
- * @param {React.RefObject<HTMLDivElement>} root0.wrapperRef - Ref to the wrapper div element.
- * @param {(() => void) | undefined} root0.onScroll - Optional scroll event handler.
- * @param {StickyHeaderConfig | undefined} root0.stickyHeaders - Optional sticky header configuration.
- * @returns The rendered table wrapper component.
- * @example
  * <TableWrapper wrapperRef={ref} onScroll={handleScroll} stickyHeaders={config}>
  *   <Table>...</Table>
  * </TableWrapper>
@@ -138,7 +131,8 @@ var TableWrapper = function TableWrapper(_ref2) {
   var children = _ref2.children,
     wrapperRef = _ref2.wrapperRef,
     onScroll = _ref2.onScroll,
-    stickyHeaders = _ref2.stickyHeaders;
+    stickyHeaders = _ref2.stickyHeaders,
+    tabIndex = _ref2.tabIndex;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
   return /*#__PURE__*/React.createElement("div", {
@@ -149,7 +143,7 @@ var TableWrapper = function TableWrapper(_ref2) {
     // Adding tabIndex here because this is a scrollable container and it needs to be focusable so keyboard users can scroll it.
     // eslint-disable-next-line @atlassian/a11y/no-noninteractive-tabindex
     ,
-    tabIndex: 0,
+    tabIndex: tabIndex,
     role: "region",
     "aria-label": formatMessage(tableMessages.tableScrollRegion)
   }, children);
@@ -553,10 +547,11 @@ export var TableContainer = /*#__PURE__*/function (_React$Component) {
         tableNode: tableNode,
         rendererAppearance: rendererAppearance,
         allowTableResizing: allowTableResizing
-      }, [children && children[0]]), fg('editor_enghealth_focusable_scrollable_tables') ? /*#__PURE__*/React.createElement(TableWrapper, {
+      }, [children && children[0]]), fg('platform_editor_dec_a11y_fixes') ? /*#__PURE__*/React.createElement(TableWrapper, {
         wrapperRef: this.wrapperRef,
         onScroll: this.props.stickyHeaders ? this.onWrapperScrolled : undefined,
-        stickyHeaders: stickyHeaders
+        stickyHeaders: stickyHeaders,
+        tabIndex: this.props.tabIndex
       }, /*#__PURE__*/React.createElement(Table, {
         innerRef: this.tableRef,
         columnWidths: columnWidths,

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

@@ -59,8 +59,9 @@ 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_INFO_TIMEOUT = 10000;
+var RENDER_EVENT_SAMPLE_RATE = 0.2;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "0.0.0-development";
+var packageVersion = "125.0.2";
 var setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'
@@ -339,7 +340,7 @@ export var RendererFunctionalComponent = function RendererFunctionalComponent(pr
           var severity = !!forceSeverityTracking || analyticsEventSeverityTracking !== null && analyticsEventSeverityTracking !== void 0 && analyticsEventSeverityTracking.enabled ? getAnalyticsEventSeverity(duration, (_analyticsEventSeveri = analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.severityNormalThreshold) !== null && _analyticsEventSeveri !== void 0 ? _analyticsEventSeveri : NORMAL_SEVERITY_THRESHOLD, (_analyticsEventSeveri2 = analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.severityDegradedThreshold) !== null && _analyticsEventSeveri2 !== void 0 ? _analyticsEventSeveri2 : DEGRADED_SEVERITY_THRESHOLD) : undefined;
           var isTTRTrackingExplicitlyDisabled = (analyticsEventSeverityTracking === null || analyticsEventSeverityTracking === void 0 ? void 0 : analyticsEventSeverityTracking.enabled) === false;
           if (!isTTRTrackingExplicitlyDisabled) {
-            _fireAnalyticsEvent({
+            var event = {
               action: ACTION.RENDERED,
               actionSubject: ACTION_SUBJECT.RENDERER,
               attributes: {
@@ -353,7 +354,13 @@ export var RendererFunctionalComponent = function RendererFunctionalComponent(pr
                 severity: severity
               },
               eventType: EVENT_TYPE.OPERATIONAL
-            });
+            };
+            _fireAnalyticsEvent(event);
+            if (expValEquals('platform_editor_sample_renderer_rendered_event', 'isEnabled', true) && Math.random() < RENDER_EVENT_SAMPLE_RATE) {
+              _fireAnalyticsEvent(_objectSpread(_objectSpread({}, event), {}, {
+                action: ACTION.RENDERED_SAMPLED
+              }));
+            }
           }
 
           // Ignored via go/ees005

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

@@ -23,6 +23,14 @@ type RendererRenderedAEP = AEP<ACTION.RENDERED, ACTION_SUBJECT.RENDERER, undefin
     severity?: SEVERITY;
     ttfb?: number;
 }, EVENT_TYPE.OPERATIONAL>;
+type RendererRenderedSampledAEP = AEP<ACTION.RENDERED_SAMPLED, ACTION_SUBJECT.RENDERER, undefined, {
+    distortedDuration: boolean;
+    duration: number;
+    nodes: Record<string, number>;
+    platform: PLATFORM.WEB;
+    severity?: SEVERITY;
+    ttfb?: number;
+}, EVENT_TYPE.OPERATIONAL>;
 export type ComponentCrashErrorAEP = OperationalAEP<ACTION.CRASHED, ACTION_SUBJECT.RENDERER, ACTION_SUBJECT_ID, {
     componentStack?: string;
     errorMessage?: string;
@@ -151,6 +159,6 @@ type SyncedBlockGetSourceInfoErrorAEP = OperationalAEP<ACTION.ERROR, ACTION_SUBJ
 type ReferenceSyncedBlockUpdateErrorAEP = OperationalAEP<ACTION.ERROR, ACTION_SUBJECT.SYNCED_BLOCK, ACTION_SUBJECT_ID.REFERENCE_SYNCED_BLOCK_UPDATE, {
     error: string;
 }>;
-export type AnalyticsEventPayload<_T = void> = RendererStartAEP | RendererRenderedAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | CodeBlockCopyAEP | CodeBlockWrapAEP | HeadingAnchorLinkButtonAEP | HoverLabelAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | TableWidthInfoAEP | TableRendererHeightInfoAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP | NestedTableTransformedAEP | MediaRenderErrorEvent | SyncedBlockFetchErrorAEP | SyncedBlockGetSourceInfoErrorAEP | ReferenceSyncedBlockUpdateErrorAEP;
+export type AnalyticsEventPayload<_T = void> = RendererStartAEP | RendererRenderedAEP | RendererRenderedSampledAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | CodeBlockCopyAEP | CodeBlockWrapAEP | HeadingAnchorLinkButtonAEP | HoverLabelAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | TableWidthInfoAEP | TableRendererHeightInfoAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP | NestedTableTransformedAEP | MediaRenderErrorEvent | SyncedBlockFetchErrorAEP | SyncedBlockGetSourceInfoErrorAEP | ReferenceSyncedBlockUpdateErrorAEP;
 export type FireAnalyticsCallback = <T = void>(payload: AnalyticsEventPayload<T>) => void | undefined;
 export {};

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

@@ -23,6 +23,14 @@ type RendererRenderedAEP = AEP<ACTION.RENDERED, ACTION_SUBJECT.RENDERER, undefin
     severity?: SEVERITY;
     ttfb?: number;
 }, EVENT_TYPE.OPERATIONAL>;
+type RendererRenderedSampledAEP = AEP<ACTION.RENDERED_SAMPLED, ACTION_SUBJECT.RENDERER, undefined, {
+    distortedDuration: boolean;
+    duration: number;
+    nodes: Record<string, number>;
+    platform: PLATFORM.WEB;
+    severity?: SEVERITY;
+    ttfb?: number;
+}, EVENT_TYPE.OPERATIONAL>;
 export type ComponentCrashErrorAEP = OperationalAEP<ACTION.CRASHED, ACTION_SUBJECT.RENDERER, ACTION_SUBJECT_ID, {
     componentStack?: string;
     errorMessage?: string;
@@ -151,6 +159,6 @@ type SyncedBlockGetSourceInfoErrorAEP = OperationalAEP<ACTION.ERROR, ACTION_SUBJ
 type ReferenceSyncedBlockUpdateErrorAEP = OperationalAEP<ACTION.ERROR, ACTION_SUBJECT.SYNCED_BLOCK, ACTION_SUBJECT_ID.REFERENCE_SYNCED_BLOCK_UPDATE, {
     error: string;
 }>;
-export type AnalyticsEventPayload<_T = void> = RendererStartAEP | RendererRenderedAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | CodeBlockCopyAEP | CodeBlockWrapAEP | HeadingAnchorLinkButtonAEP | HoverLabelAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | TableWidthInfoAEP | TableRendererHeightInfoAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP | NestedTableTransformedAEP | MediaRenderErrorEvent | SyncedBlockFetchErrorAEP | SyncedBlockGetSourceInfoErrorAEP | ReferenceSyncedBlockUpdateErrorAEP;
+export type AnalyticsEventPayload<_T = void> = RendererStartAEP | RendererRenderedAEP | RendererRenderedSampledAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | CodeBlockCopyAEP | CodeBlockWrapAEP | HeadingAnchorLinkButtonAEP | HoverLabelAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | TableWidthInfoAEP | TableRendererHeightInfoAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP | NestedTableTransformedAEP | MediaRenderErrorEvent | SyncedBlockFetchErrorAEP | SyncedBlockGetSourceInfoErrorAEP | ReferenceSyncedBlockUpdateErrorAEP;
 export type FireAnalyticsCallback = <T = void>(payload: AnalyticsEventPayload<T>) => void | undefined;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "125.0.1",
+	"version": "125.1.0",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -39,11 +39,11 @@
 		"@atlaskit/emoji": "^69.9.0",
 		"@atlaskit/feature-gate-js-client": "^5.5.0",
 		"@atlaskit/icon": "^29.3.0",
-		"@atlaskit/link": "^3.2.0",
+		"@atlaskit/link": "^3.3.0",
 		"@atlaskit/link-datasource": "^4.30.0",
 		"@atlaskit/link-extractors": "^2.4.0",
 		"@atlaskit/linking-common": "^9.9.0",
-		"@atlaskit/media-card": "^79.11.0",
+		"@atlaskit/media-card": "^79.12.0",
 		"@atlaskit/media-client": "^35.7.0",
 		"@atlaskit/media-client-react": "^4.1.0",
 		"@atlaskit/media-common": "^12.3.0",
@@ -53,12 +53,12 @@
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/platform-feature-flags-react": "^0.4.0",
 		"@atlaskit/react-ufo": "^4.16.0",
-		"@atlaskit/smart-card": "^43.17.0",
+		"@atlaskit/smart-card": "^43.19.0",
 		"@atlaskit/status": "^3.0.0",
 		"@atlaskit/task-decision": "^19.2.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^16.3.0",
-		"@atlaskit/tokens": "^9.0.0",
+		"@atlaskit/tmp-editor-statsig": "^16.7.0",
+		"@atlaskit/tokens": "^9.1.0",
 		"@atlaskit/tooltip": "^20.11.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
 		"@babel/runtime": "^7.0.0",
@@ -71,8 +71,8 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^111.0.0",
-		"@atlaskit/link-provider": "^4.0.0",
+		"@atlaskit/editor-common": "^111.4.0",
+		"@atlaskit/link-provider": "^4.1.0",
 		"@atlaskit/media-core": "^37.0.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0"
@@ -81,8 +81,8 @@
 		"@af/integration-testing": "workspace:^",
 		"@af/visual-regression": "workspace:^",
 		"@atlaskit/analytics-gas-types": "^5.1.0",
-		"@atlaskit/checkbox": "^17.2.0",
-		"@atlaskit/link-provider": "^4.0.0",
+		"@atlaskit/checkbox": "^17.3.0",
+		"@atlaskit/link-provider": "^4.1.0",
 		"@atlaskit/link-test-helpers": "^9.0.0",
 		"@atlaskit/media-core": "^37.0.0",
 		"@atlaskit/media-integration-test-helpers": "workspace:^",
@@ -170,9 +170,6 @@
 		"platform_editor_nested_dnd_styles_changes": {
 			"type": "boolean"
 		},
-		"editor_enghealth_focusable_scrollable_tables": {
-			"type": "boolean"
-		},
 		"platform_editor_comments_api_manager": {
 			"type": "boolean"
 		},