@atlaskit/renderer 133.9.1 → 133.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # @atlaskit/renderer
2
2
 
3
+ ## 133.10.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`a3cf50efa20a6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a3cf50efa20a6) -
8
+ Added 10% sampling rate to started and rendered events to reduce gasv3 costs
9
+
10
+ ### Patch Changes
11
+
12
+ - [`70c2fc6f4a1b0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/70c2fc6f4a1b0) -
13
+ Fix some complex nested table scenarios
14
+ - Updated dependencies
15
+
3
16
  ## 133.9.1
4
17
 
5
18
  ### Patch Changes
@@ -1612,6 +1612,18 @@ var tableContentModeStyles = (0, _react.css)((0, _defineProperty2.default)((0, _
1612
1612
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
1613
1613
  width: 'unset !important'
1614
1614
  }));
1615
+
1616
+ // Gated behind `platform_editor_table_renderer_fix_2`. Scopes `:has()` to the
1617
+ // container's OWN table (direct child) so a nested content-mode table (e.g. inside
1618
+ // an Excerpt macro) no longer blows out its non-content ancestor container.
1619
+ var tableContentModeScopedStyles = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(_consts.RendererCssClassName.DOCUMENT, " .").concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, ":has(> table[data-initial-width-mode=\"content\"]),\n\t.").concat(_consts.RendererCssClassName.DOCUMENT, " .").concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, ":has(> .").concat(_styles.TableSharedCssClassName.TABLE_NODE_WRAPPER, " > table[data-initial-width-mode=\"content\"]),\n\t.").concat(_consts.RendererCssClassName.DOCUMENT, " .").concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, ":has(> .").concat(_styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table[data-initial-width-mode=\"content\"])"), {
1620
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
1621
+ width: 'max-content !important',
1622
+ maxWidth: 'var(--renderer-table-max-width)'
1623
+ }), ".".concat(_consts.RendererCssClassName.DOCUMENT, " table[data-initial-width-mode=\"content\"] > colgroup > col"), {
1624
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
1625
+ width: 'unset !important'
1626
+ }));
1615
1627
  var tableContentModeNestedTableStyles = (0, _react.css)((0, _defineProperty2.default)({}, ".".concat(_consts.RendererCssClassName.DOCUMENT, " table[data-initial-width-mode=\"content\"] > tbody > tr > :is(th, td) .").concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, " > table,\n\t\t.").concat(_consts.RendererCssClassName.DOCUMENT, " table[data-initial-width-mode=\"content\"] > tbody > tr > :is(th, td) .").concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, " > .").concat(_styles.TableSharedCssClassName.TABLE_NODE_WRAPPER, " > table,\n\t\t.").concat(_consts.RendererCssClassName.DOCUMENT, " table[data-initial-width-mode=\"content\"] > tbody > tr > :is(th, td) .").concat(_styles.TableSharedCssClassName.TABLE_CONTAINER, " > .").concat(_styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table"), {
1616
1628
  width: 'max-content !important',
1617
1629
  maxWidth: '100%'
@@ -2258,7 +2270,7 @@ var RendererStyleContainer = exports.RendererStyleContainer = function RendererS
2258
2270
  // this should be placed after baseOtherStyles
2259
2271
  (0, _expValEquals.expValEquals)('platform_editor_render_bodied_extension_as_inline', 'isEnabled', true) && ((0, _expValEquals.expValEquals)('platform_editor_remove_important_in_render_ext', 'isEnabled', true) ? extensionAsInlineStyle : oldExtensionAsInlineStyle), inlineExtensionRendererMarginFix, allowNestedHeaderLinks && ((0, _expValEquals.expValEquals)('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? alignedHeadingAnchorStyle : alignedHeadingAnchorStyleDuplicateAnchor), mediaSingleSharedStyle,
2260
2272
  // merge firstWrappedMediaStyles with mediaSingleSharedStyle when clean up platform_editor_fix_media_in_renderer
2261
- (0, _platformFeatureFlags.fg)('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) && roundedTableOuterBorderOverlayStyles, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_table_q4_patch_1') && roundedTableRemixBlockHighlightStyles, (0, _expValEquals.expValEquals)('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && tableContentModeStyles, (0, _expValEquals.expValEquals)('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_table_nested_renderer_fix') && tableContentModeNestedTableStyles, tableRendererHeaderStylesForTableCellOnly, (0, _platformFeatureFlags.fg)('platform_editor_bordered_panel_nested_in_table') && tableRendererNestedPanelStyles, isBackgroundClipBrowserFixNeeded() && tableStylesBackGroundClipForGeckoForTableCellOnly, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') ? firstNodeWithNotMarginTopWithNestedDnD : firstNodeWithNotMarginTop, rendererTableStyles, (0, _table.isStickyScrollbarEnabled)(appearance) && stickyScrollbarStyles, rendererTableHeaderEqualHeightStylesForTableCellOnly, allowColumnSorting && rendererTableSortableColumnStyles, allowColumnSorting && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_table_menu_updates', 'isEnabled', true) && rendererTableSortableColumnValignStyles, allowColumnSorting && allowNestedHeaderLinks && ((0, _expValEquals.expValEquals)('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinks : rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinksDuplicateAnchor), rendererTableColumnStyles, stickyHeaderStyles, codeBlockAndLayoutStyles, columnLayoutSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveRendererStyles, isAdvancedLayoutsOn && layoutSectionForAdvancedLayoutsStyles, !useBlockRenderForCodeBlock && gridRenderForCodeBlockStyles, browser.safari && codeBlockInListSafariFixStyles, appearance === 'full-page' && !isPreviewPanelResponsivenessOn && responsiveBreakoutWidth, appearance === 'full-page' && isPreviewPanelResponsivenessOn && responsiveBreakoutWidthWithReducedPadding, (appearance === 'full-width' || appearance === 'max' && ((0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) || (0, _expValEquals.expValEquals)('confluence_max_width_content_appearance', 'isEnabled', true))) && responsiveBreakoutWidthFullWidth, (0, _expValEquals.expValEquals)('platform_editor_lovability_emoji_scaling', 'isEnabled', true) ? contentMode === 'compact' ? scaledDenseEmojiStyles : scaledEmojiStyles : contentMode === 'compact' ? denseStyles : undefined, contentMode === 'compact' ? scaledDenseUnicodeEmojiStylesNew : scaledUnicodeEmojiStylesNew, (0, _experiments.editorExperiment)('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && isInsideSyncBlock ? syncBlockRendererStyles : null, isInsideSyncBlock && (0, _experiments.editorExperiment)('platform_synced_block', true) && tableFakeBorderStyles, isInsideSyncBlock && (0, _experiments.editorExperiment)('platform_synced_block', true) && (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? roundedTableFakeBorderOverlayStyles : null, (0, _expValEquals.expValEquals)('platform_editor_hide_extension_renderer_support', 'isEnabled', true) && hideExtensionStyles],
2273
+ (0, _platformFeatureFlags.fg)('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) && roundedTableOuterBorderOverlayStyles, (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_table_q4_patch_1') && roundedTableRemixBlockHighlightStyles, (0, _expValEquals.expValEquals)('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && ((0, _platformFeatureFlags.fg)('platform_editor_table_renderer_fix_2') ? tableContentModeScopedStyles : tableContentModeStyles), (0, _expValEquals.expValEquals)('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_table_nested_renderer_fix') && tableContentModeNestedTableStyles, tableRendererHeaderStylesForTableCellOnly, (0, _platformFeatureFlags.fg)('platform_editor_bordered_panel_nested_in_table') && tableRendererNestedPanelStyles, isBackgroundClipBrowserFixNeeded() && tableStylesBackGroundClipForGeckoForTableCellOnly, (0, _platformFeatureFlags.fg)('platform_editor_nested_dnd_styles_changes') ? firstNodeWithNotMarginTopWithNestedDnD : firstNodeWithNotMarginTop, rendererTableStyles, (0, _table.isStickyScrollbarEnabled)(appearance) && stickyScrollbarStyles, rendererTableHeaderEqualHeightStylesForTableCellOnly, allowColumnSorting && rendererTableSortableColumnStyles, allowColumnSorting && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_table_menu_updates', 'isEnabled', true) && rendererTableSortableColumnValignStyles, allowColumnSorting && allowNestedHeaderLinks && ((0, _expValEquals.expValEquals)('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinks : rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinksDuplicateAnchor), rendererTableColumnStyles, stickyHeaderStyles, codeBlockAndLayoutStyles, columnLayoutSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveRendererStyles, isAdvancedLayoutsOn && layoutSectionForAdvancedLayoutsStyles, !useBlockRenderForCodeBlock && gridRenderForCodeBlockStyles, browser.safari && codeBlockInListSafariFixStyles, appearance === 'full-page' && !isPreviewPanelResponsivenessOn && responsiveBreakoutWidth, appearance === 'full-page' && isPreviewPanelResponsivenessOn && responsiveBreakoutWidthWithReducedPadding, (appearance === 'full-width' || appearance === 'max' && ((0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) || (0, _expValEquals.expValEquals)('confluence_max_width_content_appearance', 'isEnabled', true))) && responsiveBreakoutWidthFullWidth, (0, _expValEquals.expValEquals)('platform_editor_lovability_emoji_scaling', 'isEnabled', true) ? contentMode === 'compact' ? scaledDenseEmojiStyles : scaledEmojiStyles : contentMode === 'compact' ? denseStyles : undefined, contentMode === 'compact' ? scaledDenseUnicodeEmojiStylesNew : scaledUnicodeEmojiStylesNew, (0, _experiments.editorExperiment)('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && isInsideSyncBlock ? syncBlockRendererStyles : null, isInsideSyncBlock && (0, _experiments.editorExperiment)('platform_synced_block', true) && tableFakeBorderStyles, isInsideSyncBlock && (0, _experiments.editorExperiment)('platform_synced_block', true) && (0, _expValEquals.expValEquals)('platform_editor_table_q4_loveability', 'isEnabled', true) ? roundedTableFakeBorderOverlayStyles : null, (0, _expValEquals.expValEquals)('platform_editor_hide_extension_renderer_support', 'isEnabled', true) && hideExtensionStyles],
2262
2274
  "data-testid": testId
2263
2275
  }, children);
2264
2276
  };
@@ -70,9 +70,9 @@ var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
70
70
 
71
71
  // we want to calculate all the table widths (which causes reflows) after the renderer has finished loading to mitigate performance impact
72
72
  var TABLE_INFO_TIMEOUT = 10000;
73
- var RENDER_EVENT_SAMPLE_RATE = 0.2;
73
+ var RENDER_EVENT_SAMPLE_RATE = 0.1;
74
74
  var packageName = "@atlaskit/renderer";
75
- var packageVersion = "133.9.0";
75
+ var packageVersion = "133.9.1";
76
76
  var setAsQueryContainerStyles = (0, _react2.css)({
77
77
  containerName: 'ak-renderer-wrapper',
78
78
  containerType: 'inline-size'
@@ -346,14 +346,17 @@ var RendererFunctionalComponent = exports.RendererFunctionalComponent = function
346
346
  var heightWidthAnalyticsRicID;
347
347
  var heightWidthAnalyticsRafID;
348
348
  var handleAnalytics = function handleAnalytics() {
349
- _fireAnalyticsEvent({
350
- action: _analytics.ACTION.STARTED,
351
- actionSubject: _analytics.ACTION_SUBJECT.RENDERER,
352
- attributes: {
353
- platform: _events.PLATFORM.WEB
354
- },
355
- eventType: _analytics.EVENT_TYPE.UI
356
- });
349
+ if (!(0, _platformFeatureFlags.fg)('platform_renderer_sample_high_volume_events') || Math.random() < RENDER_EVENT_SAMPLE_RATE) {
350
+ _fireAnalyticsEvent({
351
+ action: _analytics.ACTION.STARTED,
352
+ actionSubject: _analytics.ACTION_SUBJECT.RENDERER,
353
+ attributes: {
354
+ platform: _events.PLATFORM.WEB,
355
+ sampleRate: (0, _platformFeatureFlags.fg)('platform_renderer_sample_high_volume_events') ? RENDER_EVENT_SAMPLE_RATE : 1
356
+ },
357
+ eventType: _analytics.EVENT_TYPE.UI
358
+ });
359
+ }
357
360
  rafID = requestAnimationFrame(function () {
358
361
  (0, _performanceMeasures.stopMeasure)("Renderer Render Time: ".concat(id), function (duration) {
359
362
  var _analyticsEventSeveri, _analyticsEventSeveri2;
@@ -373,15 +376,13 @@ var RendererFunctionalComponent = exports.RendererFunctionalComponent = function
373
376
  ttfb: (0, _navigation.getResponseEndTime)(),
374
377
  nodes: (0, _countNodes.countNodes)(props.document),
375
378
  nestedRendererType: (0, _experiments.editorExperiment)('platform_synced_block', true) ? nestedRendererType : undefined,
376
- severity: severity
379
+ severity: severity,
380
+ sampleRate: (0, _platformFeatureFlags.fg)('platform_renderer_sample_high_volume_events') ? RENDER_EVENT_SAMPLE_RATE : 1
377
381
  },
378
382
  eventType: _analytics.EVENT_TYPE.OPERATIONAL
379
383
  };
380
- _fireAnalyticsEvent(event);
381
- if ((0, _expValEquals.expValEquals)('platform_editor_sample_renderer_rendered_event', 'isEnabled', true) && Math.random() < RENDER_EVENT_SAMPLE_RATE) {
382
- _fireAnalyticsEvent(_objectSpread(_objectSpread({}, event), {}, {
383
- action: _analytics.ACTION.RENDERED_SAMPLED
384
- }));
384
+ if (!(0, _platformFeatureFlags.fg)('platform_renderer_sample_high_volume_events') || Math.random() < RENDER_EVENT_SAMPLE_RATE) {
385
+ _fireAnalyticsEvent(event);
385
386
  }
386
387
  }
387
388
 
@@ -2006,6 +2006,25 @@ const tableContentModeStyles = css({
2006
2006
  width: 'unset !important'
2007
2007
  }
2008
2008
  });
2009
+
2010
+ // Gated behind `platform_editor_table_renderer_fix_2`. Scopes `:has()` to the
2011
+ // container's OWN table (direct child) so a nested content-mode table (e.g. inside
2012
+ // an Excerpt macro) no longer blows out its non-content ancestor container.
2013
+ const tableContentModeScopedStyles = css({
2014
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
2015
+ [`.${RendererCssClassName.DOCUMENT} .${TableSharedCssClassName.TABLE_CONTAINER}:has(> table[data-initial-width-mode="content"]),
2016
+ .${RendererCssClassName.DOCUMENT} .${TableSharedCssClassName.TABLE_CONTAINER}:has(> .${TableSharedCssClassName.TABLE_NODE_WRAPPER} > table[data-initial-width-mode="content"]),
2017
+ .${RendererCssClassName.DOCUMENT} .${TableSharedCssClassName.TABLE_CONTAINER}:has(> .${TableSharedCssClassName.TABLE_STICKY_WRAPPER} > table[data-initial-width-mode="content"])`]: {
2018
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
2019
+ width: 'max-content !important',
2020
+ maxWidth: 'var(--renderer-table-max-width)'
2021
+ },
2022
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
2023
+ [`.${RendererCssClassName.DOCUMENT} table[data-initial-width-mode="content"] > colgroup > col`]: {
2024
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
2025
+ width: 'unset !important'
2026
+ }
2027
+ });
2009
2028
  const tableContentModeNestedTableStyles = css({
2010
2029
  // Nested tables may sit inside expands, extensions, or other blocks within the parent cell.
2011
2030
  [`.${RendererCssClassName.DOCUMENT} table[data-initial-width-mode="content"] > tbody > tr > :is(th, td) .${TableSharedCssClassName.TABLE_CONTAINER} > table,
@@ -2876,7 +2895,7 @@ export const RendererStyleContainer = props => {
2876
2895
  // this should be placed after baseOtherStyles
2877
2896
  expValEquals('platform_editor_render_bodied_extension_as_inline', 'isEnabled', true) && (expValEquals('platform_editor_remove_important_in_render_ext', 'isEnabled', true) ? extensionAsInlineStyle : oldExtensionAsInlineStyle), inlineExtensionRendererMarginFix, allowNestedHeaderLinks && (expValEquals('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? alignedHeadingAnchorStyle : alignedHeadingAnchorStyleDuplicateAnchor), mediaSingleSharedStyle,
2878
2897
  // merge firstWrappedMediaStyles with mediaSingleSharedStyle when clean up platform_editor_fix_media_in_renderer
2879
- fg('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && roundedTableOuterBorderOverlayStyles, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && fg('platform_editor_table_q4_patch_1') && roundedTableRemixBlockHighlightStyles, expValEquals('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && tableContentModeStyles, expValEquals('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && fg('platform_editor_table_nested_renderer_fix') && tableContentModeNestedTableStyles, tableRendererHeaderStylesForTableCellOnly, fg('platform_editor_bordered_panel_nested_in_table') && tableRendererNestedPanelStyles, isBackgroundClipBrowserFixNeeded() && tableStylesBackGroundClipForGeckoForTableCellOnly, fg('platform_editor_nested_dnd_styles_changes') ? firstNodeWithNotMarginTopWithNestedDnD : firstNodeWithNotMarginTop, rendererTableStyles, isStickyScrollbarEnabled(appearance) && stickyScrollbarStyles, rendererTableHeaderEqualHeightStylesForTableCellOnly, allowColumnSorting && rendererTableSortableColumnStyles, allowColumnSorting && expValEqualsNoExposure('platform_editor_table_menu_updates', 'isEnabled', true) && rendererTableSortableColumnValignStyles, allowColumnSorting && allowNestedHeaderLinks && (expValEquals('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinks : rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinksDuplicateAnchor), rendererTableColumnStyles, stickyHeaderStyles, codeBlockAndLayoutStyles, columnLayoutSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveRendererStyles, isAdvancedLayoutsOn && layoutSectionForAdvancedLayoutsStyles, !useBlockRenderForCodeBlock && gridRenderForCodeBlockStyles, browser.safari && codeBlockInListSafariFixStyles, appearance === 'full-page' && !isPreviewPanelResponsivenessOn && responsiveBreakoutWidth, appearance === 'full-page' && isPreviewPanelResponsivenessOn && responsiveBreakoutWidthWithReducedPadding, (appearance === 'full-width' || appearance === 'max' && (expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true))) && responsiveBreakoutWidthFullWidth, expValEquals('platform_editor_lovability_emoji_scaling', 'isEnabled', true) ? contentMode === 'compact' ? scaledDenseEmojiStyles : scaledEmojiStyles : contentMode === 'compact' ? denseStyles : undefined, contentMode === 'compact' ? scaledDenseUnicodeEmojiStylesNew : scaledUnicodeEmojiStylesNew, editorExperiment('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles, editorExperiment('platform_synced_block', true) && isInsideSyncBlock ? syncBlockRendererStyles : null, isInsideSyncBlock && editorExperiment('platform_synced_block', true) && tableFakeBorderStyles, isInsideSyncBlock && editorExperiment('platform_synced_block', true) && expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? roundedTableFakeBorderOverlayStyles : null, expValEquals('platform_editor_hide_extension_renderer_support', 'isEnabled', true) && hideExtensionStyles],
2898
+ fg('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && roundedTableOuterBorderOverlayStyles, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && fg('platform_editor_table_q4_patch_1') && roundedTableRemixBlockHighlightStyles, expValEquals('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && (fg('platform_editor_table_renderer_fix_2') ? tableContentModeScopedStyles : tableContentModeStyles), expValEquals('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && fg('platform_editor_table_nested_renderer_fix') && tableContentModeNestedTableStyles, tableRendererHeaderStylesForTableCellOnly, fg('platform_editor_bordered_panel_nested_in_table') && tableRendererNestedPanelStyles, isBackgroundClipBrowserFixNeeded() && tableStylesBackGroundClipForGeckoForTableCellOnly, fg('platform_editor_nested_dnd_styles_changes') ? firstNodeWithNotMarginTopWithNestedDnD : firstNodeWithNotMarginTop, rendererTableStyles, isStickyScrollbarEnabled(appearance) && stickyScrollbarStyles, rendererTableHeaderEqualHeightStylesForTableCellOnly, allowColumnSorting && rendererTableSortableColumnStyles, allowColumnSorting && expValEqualsNoExposure('platform_editor_table_menu_updates', 'isEnabled', true) && rendererTableSortableColumnValignStyles, allowColumnSorting && allowNestedHeaderLinks && (expValEquals('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinks : rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinksDuplicateAnchor), rendererTableColumnStyles, stickyHeaderStyles, codeBlockAndLayoutStyles, columnLayoutSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveRendererStyles, isAdvancedLayoutsOn && layoutSectionForAdvancedLayoutsStyles, !useBlockRenderForCodeBlock && gridRenderForCodeBlockStyles, browser.safari && codeBlockInListSafariFixStyles, appearance === 'full-page' && !isPreviewPanelResponsivenessOn && responsiveBreakoutWidth, appearance === 'full-page' && isPreviewPanelResponsivenessOn && responsiveBreakoutWidthWithReducedPadding, (appearance === 'full-width' || appearance === 'max' && (expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true))) && responsiveBreakoutWidthFullWidth, expValEquals('platform_editor_lovability_emoji_scaling', 'isEnabled', true) ? contentMode === 'compact' ? scaledDenseEmojiStyles : scaledEmojiStyles : contentMode === 'compact' ? denseStyles : undefined, contentMode === 'compact' ? scaledDenseUnicodeEmojiStylesNew : scaledUnicodeEmojiStylesNew, editorExperiment('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles, editorExperiment('platform_synced_block', true) && isInsideSyncBlock ? syncBlockRendererStyles : null, isInsideSyncBlock && editorExperiment('platform_synced_block', true) && tableFakeBorderStyles, isInsideSyncBlock && editorExperiment('platform_synced_block', true) && expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? roundedTableFakeBorderOverlayStyles : null, expValEquals('platform_editor_hide_extension_renderer_support', 'isEnabled', true) && hideExtensionStyles],
2880
2899
  "data-testid": testId
2881
2900
  }, children);
2882
2901
  };
@@ -56,9 +56,9 @@ export const DEGRADED_SEVERITY_THRESHOLD = 3000;
56
56
 
57
57
  // we want to calculate all the table widths (which causes reflows) after the renderer has finished loading to mitigate performance impact
58
58
  const TABLE_INFO_TIMEOUT = 10000;
59
- const RENDER_EVENT_SAMPLE_RATE = 0.2;
59
+ const RENDER_EVENT_SAMPLE_RATE = 0.1;
60
60
  const packageName = "@atlaskit/renderer";
61
- const packageVersion = "133.9.0";
61
+ const packageVersion = "133.9.1";
62
62
  const setAsQueryContainerStyles = css({
63
63
  containerName: 'ak-renderer-wrapper',
64
64
  containerType: 'inline-size'
@@ -336,14 +336,17 @@ export const RendererFunctionalComponent = props => {
336
336
  let heightWidthAnalyticsRicID;
337
337
  let heightWidthAnalyticsRafID;
338
338
  const handleAnalytics = () => {
339
- fireAnalyticsEvent({
340
- action: ACTION.STARTED,
341
- actionSubject: ACTION_SUBJECT.RENDERER,
342
- attributes: {
343
- platform: PLATFORM.WEB
344
- },
345
- eventType: EVENT_TYPE.UI
346
- });
339
+ if (!fg('platform_renderer_sample_high_volume_events') || Math.random() < RENDER_EVENT_SAMPLE_RATE) {
340
+ fireAnalyticsEvent({
341
+ action: ACTION.STARTED,
342
+ actionSubject: ACTION_SUBJECT.RENDERER,
343
+ attributes: {
344
+ platform: PLATFORM.WEB,
345
+ sampleRate: fg('platform_renderer_sample_high_volume_events') ? RENDER_EVENT_SAMPLE_RATE : 1
346
+ },
347
+ eventType: EVENT_TYPE.UI
348
+ });
349
+ }
347
350
  rafID = requestAnimationFrame(() => {
348
351
  stopMeasure(`Renderer Render Time: ${id}`, duration => {
349
352
  var _analyticsEventSeveri, _analyticsEventSeveri2;
@@ -363,16 +366,13 @@ export const RendererFunctionalComponent = props => {
363
366
  ttfb: getResponseEndTime(),
364
367
  nodes: countNodes(props.document),
365
368
  nestedRendererType: editorExperiment('platform_synced_block', true) ? nestedRendererType : undefined,
366
- severity
369
+ severity,
370
+ sampleRate: fg('platform_renderer_sample_high_volume_events') ? RENDER_EVENT_SAMPLE_RATE : 1
367
371
  },
368
372
  eventType: EVENT_TYPE.OPERATIONAL
369
373
  };
370
- fireAnalyticsEvent(event);
371
- if (expValEquals('platform_editor_sample_renderer_rendered_event', 'isEnabled', true) && Math.random() < RENDER_EVENT_SAMPLE_RATE) {
372
- fireAnalyticsEvent({
373
- ...event,
374
- action: ACTION.RENDERED_SAMPLED
375
- });
374
+ if (!fg('platform_renderer_sample_high_volume_events') || Math.random() < RENDER_EVENT_SAMPLE_RATE) {
375
+ fireAnalyticsEvent(event);
376
376
  }
377
377
  }
378
378
 
@@ -1605,6 +1605,18 @@ var tableContentModeStyles = css(_defineProperty(_defineProperty({}, ".".concat(
1605
1605
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
1606
1606
  width: 'unset !important'
1607
1607
  }));
1608
+
1609
+ // Gated behind `platform_editor_table_renderer_fix_2`. Scopes `:has()` to the
1610
+ // container's OWN table (direct child) so a nested content-mode table (e.g. inside
1611
+ // an Excerpt macro) no longer blows out its non-content ancestor container.
1612
+ var tableContentModeScopedStyles = css(_defineProperty(_defineProperty({}, ".".concat(RendererCssClassName.DOCUMENT, " .").concat(TableSharedCssClassName.TABLE_CONTAINER, ":has(> table[data-initial-width-mode=\"content\"]),\n\t.").concat(RendererCssClassName.DOCUMENT, " .").concat(TableSharedCssClassName.TABLE_CONTAINER, ":has(> .").concat(TableSharedCssClassName.TABLE_NODE_WRAPPER, " > table[data-initial-width-mode=\"content\"]),\n\t.").concat(RendererCssClassName.DOCUMENT, " .").concat(TableSharedCssClassName.TABLE_CONTAINER, ":has(> .").concat(TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table[data-initial-width-mode=\"content\"])"), {
1613
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
1614
+ width: 'max-content !important',
1615
+ maxWidth: 'var(--renderer-table-max-width)'
1616
+ }), ".".concat(RendererCssClassName.DOCUMENT, " table[data-initial-width-mode=\"content\"] > colgroup > col"), {
1617
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
1618
+ width: 'unset !important'
1619
+ }));
1608
1620
  var tableContentModeNestedTableStyles = css(_defineProperty({}, ".".concat(RendererCssClassName.DOCUMENT, " table[data-initial-width-mode=\"content\"] > tbody > tr > :is(th, td) .").concat(TableSharedCssClassName.TABLE_CONTAINER, " > table,\n\t\t.").concat(RendererCssClassName.DOCUMENT, " table[data-initial-width-mode=\"content\"] > tbody > tr > :is(th, td) .").concat(TableSharedCssClassName.TABLE_CONTAINER, " > .").concat(TableSharedCssClassName.TABLE_NODE_WRAPPER, " > table,\n\t\t.").concat(RendererCssClassName.DOCUMENT, " table[data-initial-width-mode=\"content\"] > tbody > tr > :is(th, td) .").concat(TableSharedCssClassName.TABLE_CONTAINER, " > .").concat(TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table"), {
1609
1621
  width: 'max-content !important',
1610
1622
  maxWidth: '100%'
@@ -2251,7 +2263,7 @@ export var RendererStyleContainer = function RendererStyleContainer(props) {
2251
2263
  // this should be placed after baseOtherStyles
2252
2264
  expValEquals('platform_editor_render_bodied_extension_as_inline', 'isEnabled', true) && (expValEquals('platform_editor_remove_important_in_render_ext', 'isEnabled', true) ? extensionAsInlineStyle : oldExtensionAsInlineStyle), inlineExtensionRendererMarginFix, allowNestedHeaderLinks && (expValEquals('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? alignedHeadingAnchorStyle : alignedHeadingAnchorStyleDuplicateAnchor), mediaSingleSharedStyle,
2253
2265
  // merge firstWrappedMediaStyles with mediaSingleSharedStyle when clean up platform_editor_fix_media_in_renderer
2254
- fg('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && roundedTableOuterBorderOverlayStyles, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && fg('platform_editor_table_q4_patch_1') && roundedTableRemixBlockHighlightStyles, expValEquals('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && tableContentModeStyles, expValEquals('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && fg('platform_editor_table_nested_renderer_fix') && tableContentModeNestedTableStyles, tableRendererHeaderStylesForTableCellOnly, fg('platform_editor_bordered_panel_nested_in_table') && tableRendererNestedPanelStyles, isBackgroundClipBrowserFixNeeded() && tableStylesBackGroundClipForGeckoForTableCellOnly, fg('platform_editor_nested_dnd_styles_changes') ? firstNodeWithNotMarginTopWithNestedDnD : firstNodeWithNotMarginTop, rendererTableStyles, isStickyScrollbarEnabled(appearance) && stickyScrollbarStyles, rendererTableHeaderEqualHeightStylesForTableCellOnly, allowColumnSorting && rendererTableSortableColumnStyles, allowColumnSorting && expValEqualsNoExposure('platform_editor_table_menu_updates', 'isEnabled', true) && rendererTableSortableColumnValignStyles, allowColumnSorting && allowNestedHeaderLinks && (expValEquals('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinks : rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinksDuplicateAnchor), rendererTableColumnStyles, stickyHeaderStyles, codeBlockAndLayoutStyles, columnLayoutSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveRendererStyles, isAdvancedLayoutsOn && layoutSectionForAdvancedLayoutsStyles, !useBlockRenderForCodeBlock && gridRenderForCodeBlockStyles, browser.safari && codeBlockInListSafariFixStyles, appearance === 'full-page' && !isPreviewPanelResponsivenessOn && responsiveBreakoutWidth, appearance === 'full-page' && isPreviewPanelResponsivenessOn && responsiveBreakoutWidthWithReducedPadding, (appearance === 'full-width' || appearance === 'max' && (expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true))) && responsiveBreakoutWidthFullWidth, expValEquals('platform_editor_lovability_emoji_scaling', 'isEnabled', true) ? contentMode === 'compact' ? scaledDenseEmojiStyles : scaledEmojiStyles : contentMode === 'compact' ? denseStyles : undefined, contentMode === 'compact' ? scaledDenseUnicodeEmojiStylesNew : scaledUnicodeEmojiStylesNew, editorExperiment('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles, editorExperiment('platform_synced_block', true) && isInsideSyncBlock ? syncBlockRendererStyles : null, isInsideSyncBlock && editorExperiment('platform_synced_block', true) && tableFakeBorderStyles, isInsideSyncBlock && editorExperiment('platform_synced_block', true) && expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? roundedTableFakeBorderOverlayStyles : null, expValEquals('platform_editor_hide_extension_renderer_support', 'isEnabled', true) && hideExtensionStyles],
2266
+ fg('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && roundedTableOuterBorderOverlayStyles, expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) && fg('platform_editor_table_q4_patch_1') && roundedTableRemixBlockHighlightStyles, expValEquals('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && (fg('platform_editor_table_renderer_fix_2') ? tableContentModeScopedStyles : tableContentModeStyles), expValEquals('platform_editor_table_fit_to_content_auto_convert', 'isEnabled', true) && fg('platform_editor_table_nested_renderer_fix') && tableContentModeNestedTableStyles, tableRendererHeaderStylesForTableCellOnly, fg('platform_editor_bordered_panel_nested_in_table') && tableRendererNestedPanelStyles, isBackgroundClipBrowserFixNeeded() && tableStylesBackGroundClipForGeckoForTableCellOnly, fg('platform_editor_nested_dnd_styles_changes') ? firstNodeWithNotMarginTopWithNestedDnD : firstNodeWithNotMarginTop, rendererTableStyles, isStickyScrollbarEnabled(appearance) && stickyScrollbarStyles, rendererTableHeaderEqualHeightStylesForTableCellOnly, allowColumnSorting && rendererTableSortableColumnStyles, allowColumnSorting && expValEqualsNoExposure('platform_editor_table_menu_updates', 'isEnabled', true) && rendererTableSortableColumnValignStyles, allowColumnSorting && allowNestedHeaderLinks && (expValEquals('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinks : rendererTableHeaderEqualHeightStylesAllowNestedHeaderLinksDuplicateAnchor), rendererTableColumnStyles, stickyHeaderStyles, codeBlockAndLayoutStyles, columnLayoutSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveSharedStyle, isAdvancedLayoutsOn && columnLayoutResponsiveRendererStyles, isAdvancedLayoutsOn && layoutSectionForAdvancedLayoutsStyles, !useBlockRenderForCodeBlock && gridRenderForCodeBlockStyles, browser.safari && codeBlockInListSafariFixStyles, appearance === 'full-page' && !isPreviewPanelResponsivenessOn && responsiveBreakoutWidth, appearance === 'full-page' && isPreviewPanelResponsivenessOn && responsiveBreakoutWidthWithReducedPadding, (appearance === 'full-width' || appearance === 'max' && (expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true))) && responsiveBreakoutWidthFullWidth, expValEquals('platform_editor_lovability_emoji_scaling', 'isEnabled', true) ? contentMode === 'compact' ? scaledDenseEmojiStyles : scaledEmojiStyles : contentMode === 'compact' ? denseStyles : undefined, contentMode === 'compact' ? scaledDenseUnicodeEmojiStylesNew : scaledUnicodeEmojiStylesNew, editorExperiment('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles, editorExperiment('platform_synced_block', true) && isInsideSyncBlock ? syncBlockRendererStyles : null, isInsideSyncBlock && editorExperiment('platform_synced_block', true) && tableFakeBorderStyles, isInsideSyncBlock && editorExperiment('platform_synced_block', true) && expValEquals('platform_editor_table_q4_loveability', 'isEnabled', true) ? roundedTableFakeBorderOverlayStyles : null, expValEquals('platform_editor_hide_extension_renderer_support', 'isEnabled', true) && hideExtensionStyles],
2255
2267
  "data-testid": testId
2256
2268
  }, children);
2257
2269
  };
@@ -61,9 +61,9 @@ export var DEGRADED_SEVERITY_THRESHOLD = 3000;
61
61
 
62
62
  // we want to calculate all the table widths (which causes reflows) after the renderer has finished loading to mitigate performance impact
63
63
  var TABLE_INFO_TIMEOUT = 10000;
64
- var RENDER_EVENT_SAMPLE_RATE = 0.2;
64
+ var RENDER_EVENT_SAMPLE_RATE = 0.1;
65
65
  var packageName = "@atlaskit/renderer";
66
- var packageVersion = "133.9.0";
66
+ var packageVersion = "133.9.1";
67
67
  var setAsQueryContainerStyles = css({
68
68
  containerName: 'ak-renderer-wrapper',
69
69
  containerType: 'inline-size'
@@ -337,14 +337,17 @@ export var RendererFunctionalComponent = function RendererFunctionalComponent(pr
337
337
  var heightWidthAnalyticsRicID;
338
338
  var heightWidthAnalyticsRafID;
339
339
  var handleAnalytics = function handleAnalytics() {
340
- _fireAnalyticsEvent({
341
- action: ACTION.STARTED,
342
- actionSubject: ACTION_SUBJECT.RENDERER,
343
- attributes: {
344
- platform: PLATFORM.WEB
345
- },
346
- eventType: EVENT_TYPE.UI
347
- });
340
+ if (!fg('platform_renderer_sample_high_volume_events') || Math.random() < RENDER_EVENT_SAMPLE_RATE) {
341
+ _fireAnalyticsEvent({
342
+ action: ACTION.STARTED,
343
+ actionSubject: ACTION_SUBJECT.RENDERER,
344
+ attributes: {
345
+ platform: PLATFORM.WEB,
346
+ sampleRate: fg('platform_renderer_sample_high_volume_events') ? RENDER_EVENT_SAMPLE_RATE : 1
347
+ },
348
+ eventType: EVENT_TYPE.UI
349
+ });
350
+ }
348
351
  rafID = requestAnimationFrame(function () {
349
352
  stopMeasure("Renderer Render Time: ".concat(id), function (duration) {
350
353
  var _analyticsEventSeveri, _analyticsEventSeveri2;
@@ -364,15 +367,13 @@ export var RendererFunctionalComponent = function RendererFunctionalComponent(pr
364
367
  ttfb: getResponseEndTime(),
365
368
  nodes: countNodes(props.document),
366
369
  nestedRendererType: editorExperiment('platform_synced_block', true) ? nestedRendererType : undefined,
367
- severity: severity
370
+ severity: severity,
371
+ sampleRate: fg('platform_renderer_sample_high_volume_events') ? RENDER_EVENT_SAMPLE_RATE : 1
368
372
  },
369
373
  eventType: EVENT_TYPE.OPERATIONAL
370
374
  };
371
- _fireAnalyticsEvent(event);
372
- if (expValEquals('platform_editor_sample_renderer_rendered_event', 'isEnabled', true) && Math.random() < RENDER_EVENT_SAMPLE_RATE) {
373
- _fireAnalyticsEvent(_objectSpread(_objectSpread({}, event), {}, {
374
- action: ACTION.RENDERED_SAMPLED
375
- }));
375
+ if (!fg('platform_renderer_sample_high_volume_events') || Math.random() < RENDER_EVENT_SAMPLE_RATE) {
376
+ _fireAnalyticsEvent(event);
376
377
  }
377
378
  }
378
379
 
@@ -15,6 +15,7 @@ export declare enum MODE {
15
15
  }
16
16
  type RendererStartAEP = AEP<ACTION.STARTED, ACTION_SUBJECT.RENDERER, undefined, {
17
17
  platform: PLATFORM.WEB;
18
+ sampleRate?: number;
18
19
  }, EVENT_TYPE.UI>;
19
20
  type RendererRenderedAEP = AEP<ACTION.RENDERED, ACTION_SUBJECT.RENDERER, undefined, {
20
21
  distortedDuration: boolean;
@@ -24,6 +25,7 @@ type RendererRenderedAEP = AEP<ACTION.RENDERED, ACTION_SUBJECT.RENDERER, undefin
24
25
  platform: PLATFORM.WEB;
25
26
  severity?: SEVERITY;
26
27
  ttfb?: number;
28
+ sampleRate?: number;
27
29
  }, EVENT_TYPE.OPERATIONAL>;
28
30
  type RendererRenderedSampledAEP = AEP<ACTION.RENDERED_SAMPLED, ACTION_SUBJECT.RENDERER, undefined, {
29
31
  distortedDuration: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "133.9.1",
3
+ "version": "133.10.0",
4
4
  "description": "Renderer component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -67,7 +67,7 @@
67
67
  "@atlaskit/status": "^5.4.0",
68
68
  "@atlaskit/task-decision": "^21.4.0",
69
69
  "@atlaskit/theme": "^26.1.0",
70
- "@atlaskit/tmp-editor-statsig": "^122.0.0",
70
+ "@atlaskit/tmp-editor-statsig": "^123.0.0",
71
71
  "@atlaskit/tokens": "^15.5.0",
72
72
  "@atlaskit/tooltip": "^23.1.0",
73
73
  "@atlaskit/visually-hidden": "^4.1.0",
@@ -177,12 +177,18 @@
177
177
  "platform_editor_content_mode_button_mvp": {
178
178
  "type": "boolean"
179
179
  },
180
+ "platform_renderer_sample_high_volume_events": {
181
+ "type": "boolean"
182
+ },
180
183
  "platform_editor_nested_dnd_styles_changes": {
181
184
  "type": "boolean"
182
185
  },
183
186
  "platform_editor_table_q4_patch_1": {
184
187
  "type": "boolean"
185
188
  },
189
+ "platform_editor_table_renderer_fix_2": {
190
+ "type": "boolean"
191
+ },
186
192
  "platform_editor_comments_api_manager": {
187
193
  "type": "boolean"
188
194
  },