@atlaskit/renderer 128.9.0 → 128.9.1

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @atlaskit/renderer
 
+## 128.9.1
+
+### Patch Changes
+
+- [`571ae3a14ac53`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/571ae3a14ac53) -
+  Refresh cache for an inline smart card in renderer if it's not been fetched before
+- [`eaf073b7563c8`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/eaf073b7563c8) -
+  Fix nested table column overflow in syncBlock by using saved table width as scaling target,
+  aligning with bodiedSyncBlock behaviour
+- Updated dependencies
+
 ## 128.9.0
 
 ### Minor Changes

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

@@ -22,6 +22,7 @@ var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _editorSmartLinkDraggable = require("@atlaskit/editor-smart-link-draggable");
+var _providerFactory = require("@atlaskit/editor-common/provider-factory");
 var _fallback = require("./fallback");
 var _SmartCardStorage = require("../../ui/SmartCardStorage");
 var _getCardClickHandler = require("../utils/getCardClickHandler");
@@ -154,6 +155,7 @@ var InlineCard = function InlineCard(props) {
     onSetLinkTarget = props.onSetLinkTarget;
   var portal = (0, _PortalContext.usePortal)(props);
   var cardContext = (0, _linkProvider.useSmartCardContext)();
+  var provider = (0, _providerFactory.useProvider)('cardProvider');
   var SuspenseWrapperForUrl = smartLinks === null || smartLinks === void 0 ? void 0 : smartLinks.SuspenseWrapperForUrl;
 
   // Helper fn to conditionally wrap cards when suspense boundary is passed in via product
@@ -204,6 +206,21 @@ var InlineCard = function InlineCard(props) {
       throw err;
     }
   };
+  (0, _react.useEffect)(function () {
+    if ((0, _expValEquals.expValEquals)('platform_editor_smartlink_local_cache', 'isEnabled', true) && url) {
+      // Refresh cache in the background
+      provider === null || provider === void 0 || provider.then(function (providerInstance) {
+        var _refreshCache, _ref5;
+        (_refreshCache = (_ref5 = providerInstance).refreshCache) === null || _refreshCache === void 0 || _refreshCache.call(_ref5, {
+          // It's ok to cast any resourceUrl to inlineCard here, because only URL is important for the request.
+          type: 'inlineCard',
+          attrs: {
+            url: url
+          }
+        });
+      });
+    }
+  }, [provider, url]);
   var MaybeOverlay = cardContext !== null && cardContext !== void 0 && cardContext.value ? OverlayWithCardContext : HoverLinkOverlayNoop;
   if ((ssr || cardState && (0, _expValEquals.expValEquals)('platform_editor_smartlink_local_cache', 'isEnabled', true)) && url && !(0, _experiments.editorExperiment)('platform_editor_preview_panel_linking_exp', true, {
     exposure: true

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

@@ -1,13 +1,15 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.colWidthSum = exports.Colgroup = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _styles = require("@atlaskit/editor-common/styles");
+var _ui = require("@atlaskit/editor-common/ui");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _nodeWidth = require("@atlaskit/editor-common/node-width");
@@ -15,6 +17,7 @@ var _useFeatureFlags = require("../../../use-feature-flags");
 var _rendererContext = require("../../../renderer-context");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 // we allow scaling down column widths by no more than 30%
@@ -32,7 +35,8 @@ var isTableColumnResized = function isTableColumnResized(columnWidths) {
 var fixColumnWidth = function fixColumnWidth(_ref) {
   var columnWidth = _ref.columnWidth,
     zeroWidthColumnsCount = _ref.zeroWidthColumnsCount,
-    scaleDownPercent = _ref.scaleDownPercent;
+    scaleDownPercent = _ref.scaleDownPercent,
+    skipMinWidth = _ref.skipMinWidth;
   if (columnWidth === 0) {
     return columnWidth;
   }
@@ -40,11 +44,14 @@ var fixColumnWidth = function fixColumnWidth(_ref) {
   // If the tables total width (including no zero widths col or cols without width) is less than the current layout
   // We scale up the columns to meet the minimum of the table layout.
   if (zeroWidthColumnsCount === 0 && scaleDownPercent) {
-    return Math.max(Math.floor((1 - scaleDownPercent) * columnWidth), _styles.tableCellMinWidth);
+    var scaled = Math.floor((1 - scaleDownPercent) * columnWidth);
+    return skipMinWidth ? scaled : Math.max(scaled, _styles.tableCellMinWidth);
   }
-  return Math.max(
-  // We need to take tableCellBorderWidth, to avoid unnecessary overflow.
-  columnWidth - _styles.tableCellBorderWidth, zeroWidthColumnsCount ? _editorSharedStyles.akEditorTableLegacyCellMinWidth : _styles.tableCellMinWidth);
+  var adjusted = columnWidth - _styles.tableCellBorderWidth;
+  if (skipMinWidth) {
+    return adjusted;
+  }
+  return Math.max(adjusted, zeroWidthColumnsCount ? _editorSharedStyles.akEditorTableLegacyCellMinWidth : _styles.tableCellMinWidth);
 };
 var calcScalePercent = function calcScalePercent(_ref2) {
   var renderWidth = _ref2.renderWidth,
@@ -63,6 +70,93 @@ var colWidthSum = exports.colWidthSum = function colWidthSum(columnWidths) {
     return curr + prev;
   }, 0);
 };
+
+/**
+ * Returns the data-column available width: total width minus the fixed number column if enabled.
+ */
+var getDataColumnWidth = function getDataColumnWidth(totalWidth, isNumberColumnEnabled) {
+  return isNumberColumnEnabled ? totalWidth - _editorSharedStyles.akEditorTableNumberColumnWidth : totalWidth;
+};
+
+/**
+ * Scales column widths proportionally to fit within availableWidth, matching the editor's
+ * scaleTableTo(): floors each column to the nearest pixel, then redistributes any rounding
+ * remainder to the first column that can absorb it without going below tableCellMinWidth.
+ */
+var scaleColumnsToWidth = function scaleColumnsToWidth(columnWidths, availableWidth) {
+  var rawTotalWidth = columnWidths.reduce(function (sum, w) {
+    return sum + w;
+  }, 0);
+  var scaleFactor = availableWidth / rawTotalWidth;
+  var scaledWidths = columnWidths.map(function (colWidth) {
+    return Math.max(Math.floor(colWidth * scaleFactor), _styles.tableCellMinWidth);
+  });
+  var totalScaled = scaledWidths.reduce(function (sum, w) {
+    return sum + w;
+  }, 0);
+  var diff = availableWidth - totalScaled;
+  if (diff !== 0 && Math.abs(diff) < _styles.tableCellMinWidth) {
+    for (var i = 0; i < scaledWidths.length; i++) {
+      if (scaledWidths[i] + diff > _styles.tableCellMinWidth) {
+        scaledWidths[i] += diff;
+        break;
+      }
+    }
+  }
+  return scaledWidths.map(function (width) {
+    return {
+      width: "".concat(width, "px")
+    };
+  });
+};
+
+/**
+ * Computes column widths for tables inside sync blocks, matching the editor's scaleTableTo() exactly.
+ * Returns null if the flag is off or not inside a sync block.
+ *
+ * For nested tables (isInsideOfTable=true, gated by platform_synced_block_patch_9), we use
+ * getTableContainerWidth(tableNode) as the reference — the width the editor saved, which already
+ * accounts for the parent cell's available space (colwidth minus tableCellPadding * 2).
+ * This matches bodiedSyncBlock where isRendererNested=false, so renderScaleDownColgroup uses
+ * getTableContainerWidth(tableNode). For syncBlock the nested renderer has isRendererNested=true,
+ * which incorrectly overrides tableContainerWidth with renderWidth (the full container), causing
+ * overflow by 2 * tableCellPadding (16px).
+ */
+var renderSyncBlockColgroup = function renderSyncBlockColgroup(_ref3) {
+  var isInsideOfSyncBlock = _ref3.isInsideOfSyncBlock,
+    isInsideOfTable = _ref3.isInsideOfTable,
+    tableNode = _ref3.tableNode,
+    columnWidths = _ref3.columnWidths,
+    isNumberColumnEnabled = _ref3.isNumberColumnEnabled,
+    renderWidthProp = _ref3.renderWidth,
+    contextWidth = _ref3.contextWidth;
+  if (!isInsideOfSyncBlock || !(0, _platformFeatureFlags.fg)('platform_synced_block_patch_9')) {
+    return null;
+  }
+  var rawTotalWidth = columnWidths.reduce(function (sum, w) {
+    return sum + w;
+  }, 0);
+  if (isInsideOfTable) {
+    return null;
+  }
+
+  // SSR / first render before WidthContext measures. Output % of original ADF proportions so
+  // columns are stable — the CSS container query (100cqw) handles actual scaling width.
+  if (contextWidth <= 0 && renderWidthProp <= 0) {
+    var fullTableWidth = isNumberColumnEnabled ? rawTotalWidth + _editorSharedStyles.akEditorTableNumberColumnWidth : rawTotalWidth;
+    return columnWidths.map(function (colWidth) {
+      return {
+        width: "".concat(colWidth / fullTableWidth * 100, "%")
+      };
+    });
+  }
+
+  // contextWidth measures the sync block content area. Subtract 2 to match the editor's
+  // getParentNodeWidth() border offset. Fall back to renderWidthProp for the non-CSS path.
+  var effectiveRenderWidth = contextWidth > 0 ? contextWidth - 2 : renderWidthProp;
+  var availableWidth = getDataColumnWidth(effectiveRenderWidth, isNumberColumnEnabled);
+  return scaleColumnsToWidth(columnWidths, availableWidth);
+};
 var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
   var _props$tableNode;
   var columnWidths = props.columnWidths,
@@ -76,7 +170,9 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     isTableScalingEnabled = props.isTableScalingEnabled,
     isTableFixedColumnWidthsOptionEnabled = props.isTableFixedColumnWidthsOptionEnabled,
     allowTableResizing = props.allowTableResizing,
-    isTopLevelRenderer = props.isTopLevelRenderer;
+    isTopLevelRenderer = props.isTopLevelRenderer,
+    isInsideOfSyncBlock = props.isInsideOfSyncBlock;
+  var skipMinWidth = (0, _platformFeatureFlags.fg)('platform_synced_block_patch_9') && !!(isInsideOfTable && isInsideOfSyncBlock);
   if (!columnWidths || columnWidths.every(function (width) {
     return width === 0;
   }) && (0, _platformFeatureFlags.fg)('platform_editor_numbered_column_in_include')) {
@@ -183,7 +279,8 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
       return fixColumnWidth({
         columnWidth: width,
         zeroWidthColumnsCount: zeroWidthColumnsCount,
-        scaleDownPercent: scaleDownPercent
+        scaleDownPercent: scaleDownPercent,
+        skipMinWidth: skipMinWidth
       }) || cellMinWidth;
     });
     var sumFixedColumnWidths = colWidthSum(fixedColWidths);
@@ -210,7 +307,8 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     var width = fixColumnWidth({
       columnWidth: colWidth,
       zeroWidthColumnsCount: zeroWidthColumnsCount,
-      scaleDownPercent: scaleDownPercent
+      scaleDownPercent: scaleDownPercent,
+      skipMinWidth: skipMinWidth
     }) || cellMinWidth;
     var style = width ? {
       width: "".concat(width, "px")
@@ -219,18 +317,38 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
   });
 };
 var Colgroup = exports.Colgroup = function Colgroup(props) {
-  var _ref3;
+  var _ref4, _renderSyncBlockColgr;
   var _useRendererContext = (0, _rendererContext.useRendererContext)(),
-    isTopLevelRenderer = _useRendererContext.isTopLevelRenderer;
+    isTopLevelRenderer = _useRendererContext.isTopLevelRenderer,
+    nestedRendererType = _useRendererContext.nestedRendererType;
   var columnWidths = props.columnWidths,
     isNumberColumnEnabled = props.isNumberColumnEnabled;
+  var _useContext = (0, _react.useContext)(_ui.WidthContext),
+    contextWidth = _useContext.width;
   var flags = (0, _useFeatureFlags.useFeatureFlags)();
   if (!columnWidths) {
     return null;
   }
-  var isTableFixedColumnWidthsOptionEnabled = (_ref3 = (0, _platformFeatureFlags.fg)('platform_editor_table_fixed_column_width_prop') ? props.allowFixedColumnWidthOption : flags && 'tableWithFixedColumnWidthsOption' in flags && flags.tableWithFixedColumnWidthsOption) !== null && _ref3 !== void 0 ? _ref3 : false;
-  var colStyles = renderScaleDownColgroup(_objectSpread(_objectSpread({}, props), {}, {
+  var isTableFixedColumnWidthsOptionEnabled = (_ref4 = (0, _platformFeatureFlags.fg)('platform_editor_table_fixed_column_width_prop') ? props.allowFixedColumnWidthOption : flags && 'tableWithFixedColumnWidthsOption' in flags && flags.tableWithFixedColumnWidthsOption) !== null && _ref4 !== void 0 ? _ref4 : false;
+
+  // For referenced sync blocks, nestedRendererType='syncedBlock' is set via RendererContextProvider
+  // in AKRendererWrapper. ReactSerializer is a class and cannot read React context, so we detect
+  // it here in the Colgroup component via useRendererContext() instead of prop-drilling.
+  var isInsideOfSyncBlock = nestedRendererType === 'syncedBlock';
+
+  // renderSyncBlockColgroup returns null when not applicable (flag off, SSR, not a sync block),
+  // in which case ?? falls back to the standard renderScaleDownColgroup path.
+  var colStyles = (_renderSyncBlockColgr = renderSyncBlockColgroup({
+    isInsideOfSyncBlock: isInsideOfSyncBlock,
+    isInsideOfTable: !!props.isInsideOfTable,
+    tableNode: props.tableNode,
+    columnWidths: columnWidths,
+    isNumberColumnEnabled: !!isNumberColumnEnabled,
+    renderWidth: props.renderWidth,
+    contextWidth: contextWidth
+  })) !== null && _renderSyncBlockColgr !== void 0 ? _renderSyncBlockColgr : renderScaleDownColgroup(_objectSpread(_objectSpread({}, props), {}, {
     isTopLevelRenderer: isTopLevelRenderer,
+    isInsideOfSyncBlock: isInsideOfSyncBlock,
     isTableScalingEnabled: props.rendererAppearance === 'full-page' || props.rendererAppearance === 'full-width' || props.rendererAppearance === 'max' && ((0, _expValEquals.expValEquals)('editor_tinymce_full_width_mode', 'isEnabled', true) || (0, _expValEquals.expValEquals)('confluence_max_width_content_appearance', 'isEnabled', true)) || props.rendererAppearance === 'comment' && (0, _experiments.editorExperiment)('support_table_in_comment', true, {
       exposure: true
     }) || props.rendererAppearance === 'comment' && (0, _experiments.editorExperiment)('support_table_in_comment_jira', true, {

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

@@ -1605,6 +1605,7 @@ var rendererTableSortableColumnStyles = (0, _react.css)((0, _defineProperty2.def
   width: '100%',
   height: '100%',
   padding: "".concat(_styles.tableCellPadding, "px"),
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-shape
   borderWidth: '1.5px',
   borderStyle: 'solid',
   borderColor: "transparent",
@@ -1987,6 +1988,11 @@ var denseStyles = (0, _react.css)((0, _defineProperty2.default)((0, _definePrope
     marginTop: RENDERER_LIST_DENSE_GAP
   }
 }));
+var syncBlockRendererStyles = (0, _react.css)({
+  margin: 0,
+  maxWidth: 'none',
+  padding: 0
+});
 var syncBlockStyles = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(_syncBlock.SyncBlockSharedCssClassName.renderer, ", .").concat(_syncBlock.BodiedSyncBlockSharedCssClassName.renderer, ", .").concat(_syncBlock.SyncBlockSharedCssClassName.error, ", .").concat(_syncBlock.SyncBlockSharedCssClassName.loading), {
   borderRadius: "var(--ds-radius-small, 3px)",
   marginTop: "var(--ds-space-075, 6px)",
@@ -2019,7 +2025,8 @@ var RendererStyleContainer = exports.RendererStyleContainer = function RendererS
     useBlockRenderForCodeBlock = props.useBlockRenderForCodeBlock,
     children = props.children,
     innerRef = props.innerRef,
-    testId = props.testId;
+    testId = props.testId,
+    isInsideSyncBlock = props.isInsideSyncBlock;
   var isAdvancedLayoutsOn = (0, _experiments.editorExperiment)('advanced_layouts', true);
   var isPreviewPanelResponsivenessOn = (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true, {
     exposure: true
@@ -2053,7 +2060,7 @@ var RendererStyleContainer = exports.RendererStyleContainer = function RendererS
     // this should be placed after baseOtherStyles
     (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,
     // merge firstWrappedMediaStyles with mediaSingleSharedStyle when clean up platform_editor_fix_media_in_renderer
-    (0, _platformFeatureFlags.fg)('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, 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 && 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) ? isCompactModeEnabled ? scaledDenseEmojiStyles : scaledEmojiStyles : isCompactModeEnabled ? denseStyles : undefined, (0, _experiments.editorExperiment)('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles],
+    (0, _platformFeatureFlags.fg)('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, 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 && 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) ? isCompactModeEnabled ? scaledDenseEmojiStyles : scaledEmojiStyles : isCompactModeEnabled ? denseStyles : undefined, (0, _experiments.editorExperiment)('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && isInsideSyncBlock && (0, _platformFeatureFlags.fg)('platform_synced_block_patch_9') ? syncBlockRendererStyles : null],
     "data-testid": testId
   }, children);
 };

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

@@ -71,7 +71,7 @@ var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var TABLE_INFO_TIMEOUT = 10000;
 var RENDER_EVENT_SAMPLE_RATE = 0.2;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "128.8.0";
+var packageVersion = "128.9.0";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'
@@ -199,10 +199,15 @@ var RendererFunctionalComponent = exports.RendererFunctionalComponent = function
       var normalizedFeatureFlags = (0, _normalizeFeatureFlags.normalizeFeatureFlags)(featureFlags);
       return {
         featureFlags: normalizedFeatureFlags,
-        isTopLevelRenderer: isTopLevelRenderer === undefined
+        isTopLevelRenderer: isTopLevelRenderer === undefined,
+        // Propagate nestedRendererType into the inner RendererContextProvider so that
+        // React components inside the renderer (e.g. Colgroup) can read it via
+        // useRendererContext(). Without this, the inner provider overwrites the outer
+        // AKRendererWrapper context and nestedRendererType becomes undefined.
+        nestedRendererType: nestedRendererType
       };
     };
-  }, []);
+  }, [nestedRendererType]);
   var fireAnalyticsEventOld = (0, _react.useCallback)(function (event) {
     var createAnalyticsEvent = props.createAnalyticsEvent;
     if (createAnalyticsEvent) {
@@ -627,6 +632,8 @@ var RendererWrapper = /*#__PURE__*/_react.default.memo(function (props) {
     return telepointer;
   };
   var initialUpdate = _react.default.useRef(true);
+  var _useRendererContext3 = (0, _rendererContext.useRendererContext)(),
+    nestedRendererType = _useRendererContext3.nestedRendererType;
   (0, _react.useEffect)(function () {
     // We must check if window is defined, if it isn't we are in a SSR environment
     // and we don't want to add the telepointer
@@ -724,7 +731,8 @@ var RendererWrapper = /*#__PURE__*/_react.default.memo(function (props) {
     useBlockRenderForCodeBlock: useBlockRenderForCodeBlock,
     allowAnnotations: props.allowAnnotations,
     allowTableResizing: allowTableResizing,
-    allowRendererContainerStyles: allowRendererContainerStyles
+    allowRendererContainerStyles: allowRendererContainerStyles,
+    isInsideSyncBlock: nestedRendererType === 'syncedBlock'
   }, children))));
 
   // We can only make the wrapper div query container when we have a known width.

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

@@ -4,7 +4,7 @@ import _extends from "@babel/runtime/helpers/extends";
  * @jsx jsx
  */
 /* eslint-disable jsdoc/check-tag-names */
-import { Fragment, useState, useMemo } from 'react';
+import { Fragment, useState, useMemo, useEffect } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { useSmartCardContext } from '@atlaskit/link-provider';
@@ -20,6 +20,7 @@ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from '@atlaskit/editor-smart-link-draggable';
+import { useProvider } from '@atlaskit/editor-common/provider-factory';
 import { CardErrorBoundary } from './fallback';
 import { withSmartCardStorage } from '../../ui/SmartCardStorage';
 import { getCardClickHandler } from '../utils/getCardClickHandler';
@@ -139,6 +140,7 @@ const InlineCard = props => {
   } = props;
   const portal = usePortal(props);
   const cardContext = useSmartCardContext();
+  const provider = useProvider('cardProvider');
   const SuspenseWrapperForUrl = smartLinks === null || smartLinks === void 0 ? void 0 : smartLinks.SuspenseWrapperForUrl;
 
   // Helper fn to conditionally wrap cards when suspense boundary is passed in via product
@@ -189,6 +191,21 @@ const InlineCard = props => {
       throw err;
     }
   };
+  useEffect(() => {
+    if (expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true) && url) {
+      // Refresh cache in the background
+      provider === null || provider === void 0 ? void 0 : provider.then(providerInstance => {
+        var _refreshCache, _ref;
+        (_refreshCache = (_ref = providerInstance).refreshCache) === null || _refreshCache === void 0 ? void 0 : _refreshCache.call(_ref, {
+          // It's ok to cast any resourceUrl to inlineCard here, because only URL is important for the request.
+          type: 'inlineCard',
+          attrs: {
+            url
+          }
+        });
+      });
+    }
+  }, [provider, url]);
   const MaybeOverlay = cardContext !== null && cardContext !== void 0 && cardContext.value ? OverlayWithCardContext : HoverLinkOverlayNoop;
   if ((ssr || cardState && expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true)) && url && !editorExperiment('platform_editor_preview_panel_linking_exp', true, {
     exposure: true

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

@@ -1,5 +1,6 @@
-import React from 'react';
+import React, { useContext } from 'react';
 import { tableCellBorderWidth, tableCellMinWidth } from '@atlaskit/editor-common/styles';
+import { WidthContext } from '@atlaskit/editor-common/ui';
 import { akEditorTableNumberColumnWidth, akEditorTableLegacyCellMinWidth, akEditorTableCellMinWidth } from '@atlaskit/editor-shared-styles';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
@@ -21,7 +22,8 @@ const isTableColumnResized = columnWidths => {
 const fixColumnWidth = ({
   columnWidth,
   zeroWidthColumnsCount,
-  scaleDownPercent
+  scaleDownPercent,
+  skipMinWidth
 }) => {
   if (columnWidth === 0) {
     return columnWidth;
@@ -30,11 +32,14 @@ const fixColumnWidth = ({
   // If the tables total width (including no zero widths col or cols without width) is less than the current layout
   // We scale up the columns to meet the minimum of the table layout.
   if (zeroWidthColumnsCount === 0 && scaleDownPercent) {
-    return Math.max(Math.floor((1 - scaleDownPercent) * columnWidth), tableCellMinWidth);
+    const scaled = Math.floor((1 - scaleDownPercent) * columnWidth);
+    return skipMinWidth ? scaled : Math.max(scaled, tableCellMinWidth);
   }
-  return Math.max(
-  // We need to take tableCellBorderWidth, to avoid unnecessary overflow.
-  columnWidth - tableCellBorderWidth, zeroWidthColumnsCount ? akEditorTableLegacyCellMinWidth : tableCellMinWidth);
+  const adjusted = columnWidth - tableCellBorderWidth;
+  if (skipMinWidth) {
+    return adjusted;
+  }
+  return Math.max(adjusted, zeroWidthColumnsCount ? akEditorTableLegacyCellMinWidth : tableCellMinWidth);
 };
 const calcScalePercent = ({
   renderWidth,
@@ -50,6 +55,80 @@ const calcScalePercent = ({
   return diffPercent < maxScale ? isNumberColumnEnabled ? 1 - numColumnScalePercent : diffPercent : maxScale;
 };
 export const colWidthSum = columnWidths => columnWidths.reduce((prev, curr) => curr + prev, 0);
+
+/**
+ * Returns the data-column available width: total width minus the fixed number column if enabled.
+ */
+const getDataColumnWidth = (totalWidth, isNumberColumnEnabled) => isNumberColumnEnabled ? totalWidth - akEditorTableNumberColumnWidth : totalWidth;
+
+/**
+ * Scales column widths proportionally to fit within availableWidth, matching the editor's
+ * scaleTableTo(): floors each column to the nearest pixel, then redistributes any rounding
+ * remainder to the first column that can absorb it without going below tableCellMinWidth.
+ */
+const scaleColumnsToWidth = (columnWidths, availableWidth) => {
+  const rawTotalWidth = columnWidths.reduce((sum, w) => sum + w, 0);
+  const scaleFactor = availableWidth / rawTotalWidth;
+  const scaledWidths = columnWidths.map(colWidth => Math.max(Math.floor(colWidth * scaleFactor), tableCellMinWidth));
+  const totalScaled = scaledWidths.reduce((sum, w) => sum + w, 0);
+  const diff = availableWidth - totalScaled;
+  if (diff !== 0 && Math.abs(diff) < tableCellMinWidth) {
+    for (let i = 0; i < scaledWidths.length; i++) {
+      if (scaledWidths[i] + diff > tableCellMinWidth) {
+        scaledWidths[i] += diff;
+        break;
+      }
+    }
+  }
+  return scaledWidths.map(width => ({
+    width: `${width}px`
+  }));
+};
+
+/**
+ * Computes column widths for tables inside sync blocks, matching the editor's scaleTableTo() exactly.
+ * Returns null if the flag is off or not inside a sync block.
+ *
+ * For nested tables (isInsideOfTable=true, gated by platform_synced_block_patch_9), we use
+ * getTableContainerWidth(tableNode) as the reference — the width the editor saved, which already
+ * accounts for the parent cell's available space (colwidth minus tableCellPadding * 2).
+ * This matches bodiedSyncBlock where isRendererNested=false, so renderScaleDownColgroup uses
+ * getTableContainerWidth(tableNode). For syncBlock the nested renderer has isRendererNested=true,
+ * which incorrectly overrides tableContainerWidth with renderWidth (the full container), causing
+ * overflow by 2 * tableCellPadding (16px).
+ */
+const renderSyncBlockColgroup = ({
+  isInsideOfSyncBlock,
+  isInsideOfTable,
+  tableNode,
+  columnWidths,
+  isNumberColumnEnabled,
+  renderWidth: renderWidthProp,
+  contextWidth
+}) => {
+  if (!isInsideOfSyncBlock || !fg('platform_synced_block_patch_9')) {
+    return null;
+  }
+  const rawTotalWidth = columnWidths.reduce((sum, w) => sum + w, 0);
+  if (isInsideOfTable) {
+    return null;
+  }
+
+  // SSR / first render before WidthContext measures. Output % of original ADF proportions so
+  // columns are stable — the CSS container query (100cqw) handles actual scaling width.
+  if (contextWidth <= 0 && renderWidthProp <= 0) {
+    const fullTableWidth = isNumberColumnEnabled ? rawTotalWidth + akEditorTableNumberColumnWidth : rawTotalWidth;
+    return columnWidths.map(colWidth => ({
+      width: `${colWidth / fullTableWidth * 100}%`
+    }));
+  }
+
+  // contextWidth measures the sync block content area. Subtract 2 to match the editor's
+  // getParentNodeWidth() border offset. Fall back to renderWidthProp for the non-CSS path.
+  const effectiveRenderWidth = contextWidth > 0 ? contextWidth - 2 : renderWidthProp;
+  const availableWidth = getDataColumnWidth(effectiveRenderWidth, isNumberColumnEnabled);
+  return scaleColumnsToWidth(columnWidths, availableWidth);
+};
 const renderScaleDownColgroup = props => {
   var _props$tableNode;
   const {
@@ -64,8 +143,10 @@ const renderScaleDownColgroup = props => {
     isTableScalingEnabled,
     isTableFixedColumnWidthsOptionEnabled,
     allowTableResizing,
-    isTopLevelRenderer
+    isTopLevelRenderer,
+    isInsideOfSyncBlock
   } = props;
+  const skipMinWidth = fg('platform_synced_block_patch_9') && !!(isInsideOfTable && isInsideOfSyncBlock);
   if (!columnWidths || columnWidths.every(width => width === 0) && fg('platform_editor_numbered_column_in_include')) {
     return [];
   }
@@ -169,7 +250,8 @@ const renderScaleDownColgroup = props => {
     const fixedColWidths = targetWidths.map(width => fixColumnWidth({
       columnWidth: width,
       zeroWidthColumnsCount,
-      scaleDownPercent
+      scaleDownPercent,
+      skipMinWidth
     }) || cellMinWidth);
     const sumFixedColumnWidths = colWidthSum(fixedColWidths);
     return fixedColWidths.map(colWidth => {
@@ -195,7 +277,8 @@ const renderScaleDownColgroup = props => {
     const width = fixColumnWidth({
       columnWidth: colWidth,
       zeroWidthColumnsCount,
-      scaleDownPercent
+      scaleDownPercent,
+      skipMinWidth
     }) || cellMinWidth;
     const style = width ? {
       width: `${width}px`
@@ -204,22 +287,43 @@ const renderScaleDownColgroup = props => {
   });
 };
 export const Colgroup = props => {
-  var _ref;
+  var _ref, _renderSyncBlockColgr;
   const {
-    isTopLevelRenderer
+    isTopLevelRenderer,
+    nestedRendererType
   } = useRendererContext();
   const {
     columnWidths,
     isNumberColumnEnabled
   } = props;
+  const {
+    width: contextWidth
+  } = useContext(WidthContext);
   const flags = useFeatureFlags();
   if (!columnWidths) {
     return null;
   }
   const isTableFixedColumnWidthsOptionEnabled = (_ref = fg('platform_editor_table_fixed_column_width_prop') ? props.allowFixedColumnWidthOption : flags && 'tableWithFixedColumnWidthsOption' in flags && flags.tableWithFixedColumnWidthsOption) !== null && _ref !== void 0 ? _ref : false;
-  const colStyles = renderScaleDownColgroup({
+
+  // For referenced sync blocks, nestedRendererType='syncedBlock' is set via RendererContextProvider
+  // in AKRendererWrapper. ReactSerializer is a class and cannot read React context, so we detect
+  // it here in the Colgroup component via useRendererContext() instead of prop-drilling.
+  const isInsideOfSyncBlock = nestedRendererType === 'syncedBlock';
+
+  // renderSyncBlockColgroup returns null when not applicable (flag off, SSR, not a sync block),
+  // in which case ?? falls back to the standard renderScaleDownColgroup path.
+  const colStyles = (_renderSyncBlockColgr = renderSyncBlockColgroup({
+    isInsideOfSyncBlock,
+    isInsideOfTable: !!props.isInsideOfTable,
+    tableNode: props.tableNode,
+    columnWidths,
+    isNumberColumnEnabled: !!isNumberColumnEnabled,
+    renderWidth: props.renderWidth,
+    contextWidth
+  })) !== null && _renderSyncBlockColgr !== void 0 ? _renderSyncBlockColgr : renderScaleDownColgroup({
     ...props,
     isTopLevelRenderer,
+    isInsideOfSyncBlock,
     isTableScalingEnabled: props.rendererAppearance === 'full-page' || props.rendererAppearance === 'full-width' || props.rendererAppearance === 'max' && (expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true)) || props.rendererAppearance === 'comment' && editorExperiment('support_table_in_comment', true, {
       exposure: true
     }) || props.rendererAppearance === 'comment' && editorExperiment('support_table_in_comment_jira', true, {

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

@@ -2043,6 +2043,7 @@ const rendererTableSortableColumnStyles = css({
           width: '100%',
           height: '100%',
           padding: `${tableCellPadding}px`,
+          // eslint-disable-next-line @atlaskit/design-system/use-tokens-shape
           borderWidth: '1.5px',
           borderStyle: 'solid',
           borderColor: `transparent`,
@@ -2524,6 +2525,11 @@ const denseStyles = css({
     }
   }
 });
+const syncBlockRendererStyles = css({
+  margin: 0,
+  maxWidth: 'none',
+  padding: 0
+});
 const syncBlockStyles = css({
   [`.${SyncBlockSharedCssClassName.renderer}, .${BodiedSyncBlockSharedCssClassName.renderer}, .${SyncBlockSharedCssClassName.error}, .${SyncBlockSharedCssClassName.loading}`]: {
     borderRadius: "var(--ds-radius-small, 3px)",
@@ -2563,7 +2569,8 @@ export const RendererStyleContainer = props => {
     useBlockRenderForCodeBlock,
     children,
     innerRef,
-    testId
+    testId,
+    isInsideSyncBlock
   } = props;
   const isAdvancedLayoutsOn = editorExperiment('advanced_layouts', true);
   const isPreviewPanelResponsivenessOn = editorExperiment('platform_editor_preview_panel_responsiveness', true, {
@@ -2600,7 +2607,7 @@ export const RendererStyleContainer = props => {
     // this should be placed after baseOtherStyles
     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,
     // merge firstWrappedMediaStyles with mediaSingleSharedStyle when clean up platform_editor_fix_media_in_renderer
-    fg('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, 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 && 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) ? isCompactModeEnabled ? scaledDenseEmojiStyles : scaledEmojiStyles : isCompactModeEnabled ? denseStyles : undefined, editorExperiment('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles],
+    fg('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, 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 && 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) ? isCompactModeEnabled ? scaledDenseEmojiStyles : scaledEmojiStyles : isCompactModeEnabled ? denseStyles : undefined, editorExperiment('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles, editorExperiment('platform_synced_block', true) && isInsideSyncBlock && fg('platform_synced_block_patch_9') ? syncBlockRendererStyles : null],
     "data-testid": testId
   }, children);
 };

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

@@ -57,7 +57,7 @@ export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const TABLE_INFO_TIMEOUT = 10000;
 const RENDER_EVENT_SAMPLE_RATE = 0.2;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "128.8.0";
+const packageVersion = "128.9.0";
 const setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'
@@ -187,9 +187,14 @@ export const RendererFunctionalComponent = props => {
     const normalizedFeatureFlags = normalizeFeatureFlags(featureFlags);
     return {
       featureFlags: normalizedFeatureFlags,
-      isTopLevelRenderer: isTopLevelRenderer === undefined
+      isTopLevelRenderer: isTopLevelRenderer === undefined,
+      // Propagate nestedRendererType into the inner RendererContextProvider so that
+      // React components inside the renderer (e.g. Colgroup) can read it via
+      // useRendererContext(). Without this, the inner provider overwrites the outer
+      // AKRendererWrapper context and nestedRendererType becomes undefined.
+      nestedRendererType
     };
-  }, []);
+  }, [nestedRendererType]);
   const fireAnalyticsEventOld = useCallback(event => {
     const {
       createAnalyticsEvent
@@ -615,6 +620,9 @@ const RendererWrapper = /*#__PURE__*/React.memo(props => {
     return telepointer;
   };
   const initialUpdate = React.useRef(true);
+  const {
+    nestedRendererType
+  } = useRendererContext();
   useEffect(() => {
     // We must check if window is defined, if it isn't we are in a SSR environment
     // and we don't want to add the telepointer
@@ -710,7 +718,8 @@ const RendererWrapper = /*#__PURE__*/React.memo(props => {
     useBlockRenderForCodeBlock: useBlockRenderForCodeBlock,
     allowAnnotations: props.allowAnnotations,
     allowTableResizing: allowTableResizing,
-    allowRendererContainerStyles: allowRendererContainerStyles
+    allowRendererContainerStyles: allowRendererContainerStyles,
+    isInsideSyncBlock: nestedRendererType === 'syncedBlock'
   }, children))));
 
   // We can only make the wrapper div query container when we have a known width.

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

@@ -5,7 +5,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
  * @jsx jsx
  */
 /* eslint-disable jsdoc/check-tag-names */
-import { Fragment, useState, useMemo } from 'react';
+import { Fragment, useState, useMemo, useEffect } from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { useSmartCardContext } from '@atlaskit/link-provider';
@@ -21,6 +21,7 @@ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from '@atlaskit/editor-smart-link-draggable';
+import { useProvider } from '@atlaskit/editor-common/provider-factory';
 import { CardErrorBoundary } from './fallback';
 import { withSmartCardStorage } from '../../ui/SmartCardStorage';
 import { getCardClickHandler } from '../utils/getCardClickHandler';
@@ -145,6 +146,7 @@ var InlineCard = function InlineCard(props) {
     onSetLinkTarget = props.onSetLinkTarget;
   var portal = usePortal(props);
   var cardContext = useSmartCardContext();
+  var provider = useProvider('cardProvider');
   var SuspenseWrapperForUrl = smartLinks === null || smartLinks === void 0 ? void 0 : smartLinks.SuspenseWrapperForUrl;
 
   // Helper fn to conditionally wrap cards when suspense boundary is passed in via product
@@ -195,6 +197,21 @@ var InlineCard = function InlineCard(props) {
       throw err;
     }
   };
+  useEffect(function () {
+    if (expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true) && url) {
+      // Refresh cache in the background
+      provider === null || provider === void 0 || provider.then(function (providerInstance) {
+        var _refreshCache, _ref5;
+        (_refreshCache = (_ref5 = providerInstance).refreshCache) === null || _refreshCache === void 0 || _refreshCache.call(_ref5, {
+          // It's ok to cast any resourceUrl to inlineCard here, because only URL is important for the request.
+          type: 'inlineCard',
+          attrs: {
+            url: url
+          }
+        });
+      });
+    }
+  }, [provider, url]);
   var MaybeOverlay = cardContext !== null && cardContext !== void 0 && cardContext.value ? OverlayWithCardContext : HoverLinkOverlayNoop;
   if ((ssr || cardState && expValEquals('platform_editor_smartlink_local_cache', 'isEnabled', true)) && url && !editorExperiment('platform_editor_preview_panel_linking_exp', true, {
     exposure: true

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

@@ -1,8 +1,9 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-import React from 'react';
+import React, { useContext } from 'react';
 import { tableCellBorderWidth, tableCellMinWidth } from '@atlaskit/editor-common/styles';
+import { WidthContext } from '@atlaskit/editor-common/ui';
 import { akEditorTableNumberColumnWidth, akEditorTableLegacyCellMinWidth, akEditorTableCellMinWidth } from '@atlaskit/editor-shared-styles';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
@@ -26,7 +27,8 @@ var isTableColumnResized = function isTableColumnResized(columnWidths) {
 var fixColumnWidth = function fixColumnWidth(_ref) {
   var columnWidth = _ref.columnWidth,
     zeroWidthColumnsCount = _ref.zeroWidthColumnsCount,
-    scaleDownPercent = _ref.scaleDownPercent;
+    scaleDownPercent = _ref.scaleDownPercent,
+    skipMinWidth = _ref.skipMinWidth;
   if (columnWidth === 0) {
     return columnWidth;
   }
@@ -34,11 +36,14 @@ var fixColumnWidth = function fixColumnWidth(_ref) {
   // If the tables total width (including no zero widths col or cols without width) is less than the current layout
   // We scale up the columns to meet the minimum of the table layout.
   if (zeroWidthColumnsCount === 0 && scaleDownPercent) {
-    return Math.max(Math.floor((1 - scaleDownPercent) * columnWidth), tableCellMinWidth);
+    var scaled = Math.floor((1 - scaleDownPercent) * columnWidth);
+    return skipMinWidth ? scaled : Math.max(scaled, tableCellMinWidth);
   }
-  return Math.max(
-  // We need to take tableCellBorderWidth, to avoid unnecessary overflow.
-  columnWidth - tableCellBorderWidth, zeroWidthColumnsCount ? akEditorTableLegacyCellMinWidth : tableCellMinWidth);
+  var adjusted = columnWidth - tableCellBorderWidth;
+  if (skipMinWidth) {
+    return adjusted;
+  }
+  return Math.max(adjusted, zeroWidthColumnsCount ? akEditorTableLegacyCellMinWidth : tableCellMinWidth);
 };
 var calcScalePercent = function calcScalePercent(_ref2) {
   var renderWidth = _ref2.renderWidth,
@@ -57,6 +62,93 @@ export var colWidthSum = function colWidthSum(columnWidths) {
     return curr + prev;
   }, 0);
 };
+
+/**
+ * Returns the data-column available width: total width minus the fixed number column if enabled.
+ */
+var getDataColumnWidth = function getDataColumnWidth(totalWidth, isNumberColumnEnabled) {
+  return isNumberColumnEnabled ? totalWidth - akEditorTableNumberColumnWidth : totalWidth;
+};
+
+/**
+ * Scales column widths proportionally to fit within availableWidth, matching the editor's
+ * scaleTableTo(): floors each column to the nearest pixel, then redistributes any rounding
+ * remainder to the first column that can absorb it without going below tableCellMinWidth.
+ */
+var scaleColumnsToWidth = function scaleColumnsToWidth(columnWidths, availableWidth) {
+  var rawTotalWidth = columnWidths.reduce(function (sum, w) {
+    return sum + w;
+  }, 0);
+  var scaleFactor = availableWidth / rawTotalWidth;
+  var scaledWidths = columnWidths.map(function (colWidth) {
+    return Math.max(Math.floor(colWidth * scaleFactor), tableCellMinWidth);
+  });
+  var totalScaled = scaledWidths.reduce(function (sum, w) {
+    return sum + w;
+  }, 0);
+  var diff = availableWidth - totalScaled;
+  if (diff !== 0 && Math.abs(diff) < tableCellMinWidth) {
+    for (var i = 0; i < scaledWidths.length; i++) {
+      if (scaledWidths[i] + diff > tableCellMinWidth) {
+        scaledWidths[i] += diff;
+        break;
+      }
+    }
+  }
+  return scaledWidths.map(function (width) {
+    return {
+      width: "".concat(width, "px")
+    };
+  });
+};
+
+/**
+ * Computes column widths for tables inside sync blocks, matching the editor's scaleTableTo() exactly.
+ * Returns null if the flag is off or not inside a sync block.
+ *
+ * For nested tables (isInsideOfTable=true, gated by platform_synced_block_patch_9), we use
+ * getTableContainerWidth(tableNode) as the reference — the width the editor saved, which already
+ * accounts for the parent cell's available space (colwidth minus tableCellPadding * 2).
+ * This matches bodiedSyncBlock where isRendererNested=false, so renderScaleDownColgroup uses
+ * getTableContainerWidth(tableNode). For syncBlock the nested renderer has isRendererNested=true,
+ * which incorrectly overrides tableContainerWidth with renderWidth (the full container), causing
+ * overflow by 2 * tableCellPadding (16px).
+ */
+var renderSyncBlockColgroup = function renderSyncBlockColgroup(_ref3) {
+  var isInsideOfSyncBlock = _ref3.isInsideOfSyncBlock,
+    isInsideOfTable = _ref3.isInsideOfTable,
+    tableNode = _ref3.tableNode,
+    columnWidths = _ref3.columnWidths,
+    isNumberColumnEnabled = _ref3.isNumberColumnEnabled,
+    renderWidthProp = _ref3.renderWidth,
+    contextWidth = _ref3.contextWidth;
+  if (!isInsideOfSyncBlock || !fg('platform_synced_block_patch_9')) {
+    return null;
+  }
+  var rawTotalWidth = columnWidths.reduce(function (sum, w) {
+    return sum + w;
+  }, 0);
+  if (isInsideOfTable) {
+    return null;
+  }
+
+  // SSR / first render before WidthContext measures. Output % of original ADF proportions so
+  // columns are stable — the CSS container query (100cqw) handles actual scaling width.
+  if (contextWidth <= 0 && renderWidthProp <= 0) {
+    var fullTableWidth = isNumberColumnEnabled ? rawTotalWidth + akEditorTableNumberColumnWidth : rawTotalWidth;
+    return columnWidths.map(function (colWidth) {
+      return {
+        width: "".concat(colWidth / fullTableWidth * 100, "%")
+      };
+    });
+  }
+
+  // contextWidth measures the sync block content area. Subtract 2 to match the editor's
+  // getParentNodeWidth() border offset. Fall back to renderWidthProp for the non-CSS path.
+  var effectiveRenderWidth = contextWidth > 0 ? contextWidth - 2 : renderWidthProp;
+  var availableWidth = getDataColumnWidth(effectiveRenderWidth, isNumberColumnEnabled);
+  return scaleColumnsToWidth(columnWidths, availableWidth);
+};
 var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
   var _props$tableNode;
   var columnWidths = props.columnWidths,
@@ -70,7 +162,9 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     isTableScalingEnabled = props.isTableScalingEnabled,
     isTableFixedColumnWidthsOptionEnabled = props.isTableFixedColumnWidthsOptionEnabled,
     allowTableResizing = props.allowTableResizing,
-    isTopLevelRenderer = props.isTopLevelRenderer;
+    isTopLevelRenderer = props.isTopLevelRenderer,
+    isInsideOfSyncBlock = props.isInsideOfSyncBlock;
+  var skipMinWidth = fg('platform_synced_block_patch_9') && !!(isInsideOfTable && isInsideOfSyncBlock);
   if (!columnWidths || columnWidths.every(function (width) {
     return width === 0;
   }) && fg('platform_editor_numbered_column_in_include')) {
@@ -177,7 +271,8 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
       return fixColumnWidth({
         columnWidth: width,
         zeroWidthColumnsCount: zeroWidthColumnsCount,
-        scaleDownPercent: scaleDownPercent
+        scaleDownPercent: scaleDownPercent,
+        skipMinWidth: skipMinWidth
       }) || cellMinWidth;
     });
     var sumFixedColumnWidths = colWidthSum(fixedColWidths);
@@ -204,7 +299,8 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     var width = fixColumnWidth({
       columnWidth: colWidth,
       zeroWidthColumnsCount: zeroWidthColumnsCount,
-      scaleDownPercent: scaleDownPercent
+      scaleDownPercent: scaleDownPercent,
+      skipMinWidth: skipMinWidth
     }) || cellMinWidth;
     var style = width ? {
       width: "".concat(width, "px")
@@ -213,18 +309,38 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
   });
 };
 export var Colgroup = function Colgroup(props) {
-  var _ref3;
+  var _ref4, _renderSyncBlockColgr;
   var _useRendererContext = useRendererContext(),
-    isTopLevelRenderer = _useRendererContext.isTopLevelRenderer;
+    isTopLevelRenderer = _useRendererContext.isTopLevelRenderer,
+    nestedRendererType = _useRendererContext.nestedRendererType;
   var columnWidths = props.columnWidths,
     isNumberColumnEnabled = props.isNumberColumnEnabled;
+  var _useContext = useContext(WidthContext),
+    contextWidth = _useContext.width;
   var flags = useFeatureFlags();
   if (!columnWidths) {
     return null;
   }
-  var isTableFixedColumnWidthsOptionEnabled = (_ref3 = fg('platform_editor_table_fixed_column_width_prop') ? props.allowFixedColumnWidthOption : flags && 'tableWithFixedColumnWidthsOption' in flags && flags.tableWithFixedColumnWidthsOption) !== null && _ref3 !== void 0 ? _ref3 : false;
-  var colStyles = renderScaleDownColgroup(_objectSpread(_objectSpread({}, props), {}, {
+  var isTableFixedColumnWidthsOptionEnabled = (_ref4 = fg('platform_editor_table_fixed_column_width_prop') ? props.allowFixedColumnWidthOption : flags && 'tableWithFixedColumnWidthsOption' in flags && flags.tableWithFixedColumnWidthsOption) !== null && _ref4 !== void 0 ? _ref4 : false;
+
+  // For referenced sync blocks, nestedRendererType='syncedBlock' is set via RendererContextProvider
+  // in AKRendererWrapper. ReactSerializer is a class and cannot read React context, so we detect
+  // it here in the Colgroup component via useRendererContext() instead of prop-drilling.
+  var isInsideOfSyncBlock = nestedRendererType === 'syncedBlock';
+
+  // renderSyncBlockColgroup returns null when not applicable (flag off, SSR, not a sync block),
+  // in which case ?? falls back to the standard renderScaleDownColgroup path.
+  var colStyles = (_renderSyncBlockColgr = renderSyncBlockColgroup({
+    isInsideOfSyncBlock: isInsideOfSyncBlock,
+    isInsideOfTable: !!props.isInsideOfTable,
+    tableNode: props.tableNode,
+    columnWidths: columnWidths,
+    isNumberColumnEnabled: !!isNumberColumnEnabled,
+    renderWidth: props.renderWidth,
+    contextWidth: contextWidth
+  })) !== null && _renderSyncBlockColgr !== void 0 ? _renderSyncBlockColgr : renderScaleDownColgroup(_objectSpread(_objectSpread({}, props), {}, {
     isTopLevelRenderer: isTopLevelRenderer,
+    isInsideOfSyncBlock: isInsideOfSyncBlock,
     isTableScalingEnabled: props.rendererAppearance === 'full-page' || props.rendererAppearance === 'full-width' || props.rendererAppearance === 'max' && (expValEquals('editor_tinymce_full_width_mode', 'isEnabled', true) || expValEquals('confluence_max_width_content_appearance', 'isEnabled', true)) || props.rendererAppearance === 'comment' && editorExperiment('support_table_in_comment', true, {
       exposure: true
     }) || props.rendererAppearance === 'comment' && editorExperiment('support_table_in_comment_jira', true, {

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

@@ -1598,6 +1598,7 @@ var rendererTableSortableColumnStyles = css(_defineProperty({}, ".".concat(Rende
   width: '100%',
   height: '100%',
   padding: "".concat(tableCellPadding, "px"),
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-shape
   borderWidth: '1.5px',
   borderStyle: 'solid',
   borderColor: "transparent",
@@ -1980,6 +1981,11 @@ var denseStyles = css(_defineProperty(_defineProperty(_defineProperty({}, ".".co
     marginTop: RENDERER_LIST_DENSE_GAP
   }
 }));
+var syncBlockRendererStyles = css({
+  margin: 0,
+  maxWidth: 'none',
+  padding: 0
+});
 var syncBlockStyles = css(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ".".concat(SyncBlockSharedCssClassName.renderer, ", .").concat(BodiedSyncBlockSharedCssClassName.renderer, ", .").concat(SyncBlockSharedCssClassName.error, ", .").concat(SyncBlockSharedCssClassName.loading), {
   borderRadius: "var(--ds-radius-small, 3px)",
   marginTop: "var(--ds-space-075, 6px)",
@@ -2012,7 +2018,8 @@ export var RendererStyleContainer = function RendererStyleContainer(props) {
     useBlockRenderForCodeBlock = props.useBlockRenderForCodeBlock,
     children = props.children,
     innerRef = props.innerRef,
-    testId = props.testId;
+    testId = props.testId,
+    isInsideSyncBlock = props.isInsideSyncBlock;
   var isAdvancedLayoutsOn = editorExperiment('advanced_layouts', true);
   var isPreviewPanelResponsivenessOn = editorExperiment('platform_editor_preview_panel_responsiveness', true, {
     exposure: true
@@ -2046,7 +2053,7 @@ export var RendererStyleContainer = function RendererStyleContainer(props) {
     // this should be placed after baseOtherStyles
     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,
     // merge firstWrappedMediaStyles with mediaSingleSharedStyle when clean up platform_editor_fix_media_in_renderer
-    fg('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, 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 && 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) ? isCompactModeEnabled ? scaledDenseEmojiStyles : scaledEmojiStyles : isCompactModeEnabled ? denseStyles : undefined, editorExperiment('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles],
+    fg('platform_editor_fix_media_in_renderer') && firstWrappedMediaStyles, tableSharedStyle, 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 && 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) ? isCompactModeEnabled ? scaledDenseEmojiStyles : scaledEmojiStyles : isCompactModeEnabled ? denseStyles : undefined, editorExperiment('platform_synced_block', true) && syncBlockStyles, centerWrapperStyles, editorExperiment('platform_synced_block', true) && isInsideSyncBlock && fg('platform_synced_block_patch_9') ? syncBlockRendererStyles : null],
     "data-testid": testId
   }, children);
 };

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

@@ -62,7 +62,7 @@ export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var TABLE_INFO_TIMEOUT = 10000;
 var RENDER_EVENT_SAMPLE_RATE = 0.2;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "128.8.0";
+var packageVersion = "128.9.0";
 var setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'
@@ -190,10 +190,15 @@ export var RendererFunctionalComponent = function RendererFunctionalComponent(pr
       var normalizedFeatureFlags = normalizeFeatureFlags(featureFlags);
       return {
         featureFlags: normalizedFeatureFlags,
-        isTopLevelRenderer: isTopLevelRenderer === undefined
+        isTopLevelRenderer: isTopLevelRenderer === undefined,
+        // Propagate nestedRendererType into the inner RendererContextProvider so that
+        // React components inside the renderer (e.g. Colgroup) can read it via
+        // useRendererContext(). Without this, the inner provider overwrites the outer
+        // AKRendererWrapper context and nestedRendererType becomes undefined.
+        nestedRendererType: nestedRendererType
       };
     };
-  }, []);
+  }, [nestedRendererType]);
   var fireAnalyticsEventOld = useCallback(function (event) {
     var createAnalyticsEvent = props.createAnalyticsEvent;
     if (createAnalyticsEvent) {
@@ -618,6 +623,8 @@ var RendererWrapper = /*#__PURE__*/React.memo(function (props) {
     return telepointer;
   };
   var initialUpdate = React.useRef(true);
+  var _useRendererContext3 = useRendererContext(),
+    nestedRendererType = _useRendererContext3.nestedRendererType;
   useEffect(function () {
     // We must check if window is defined, if it isn't we are in a SSR environment
     // and we don't want to add the telepointer
@@ -715,7 +722,8 @@ var RendererWrapper = /*#__PURE__*/React.memo(function (props) {
     useBlockRenderForCodeBlock: useBlockRenderForCodeBlock,
     allowAnnotations: props.allowAnnotations,
     allowTableResizing: allowTableResizing,
-    allowRendererContainerStyles: allowRendererContainerStyles
+    allowRendererContainerStyles: allowRendererContainerStyles,
+    isInsideSyncBlock: nestedRendererType === 'syncedBlock'
   }, children))));
 
   // We can only make the wrapper div query container when we have a known width.

package/dist/types/ui/Renderer/RendererStyleContainer.d.ts

@@ -6,7 +6,9 @@ import { jsx } from '@emotion/react';
 import type { RendererWrapperProps } from './index';
 export declare const textHighlightPaddingStyles: import("@emotion/utils").SerializedStyles;
 type RendererStyleContainerProps = Pick<RendererWrapperProps, 'onClick' | 'onMouseDown' | 'appearance' | 'contentMode' | 'allowNestedHeaderLinks' | 'allowColumnSorting' | 'useBlockRenderForCodeBlock' | 'allowAnnotations' | 'allowTableResizing' | 'innerRef' | 'children' | 'allowRendererContainerStyles'> & {
+    isInsideSyncBlock?: boolean;
     testId?: string;
+    isInsideOfSyncBlock?: boolean;
 };
 export declare const RendererStyleContainer: (props: RendererStyleContainerProps) => jsx.JSX.Element;
 export {};

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

@@ -6,7 +6,9 @@ import { jsx } from '@emotion/react';
 import type { RendererWrapperProps } from './index';
 export declare const textHighlightPaddingStyles: import("@emotion/utils").SerializedStyles;
 type RendererStyleContainerProps = Pick<RendererWrapperProps, 'onClick' | 'onMouseDown' | 'appearance' | 'contentMode' | 'allowNestedHeaderLinks' | 'allowColumnSorting' | 'useBlockRenderForCodeBlock' | 'allowAnnotations' | 'allowTableResizing' | 'innerRef' | 'children' | 'allowRendererContainerStyles'> & {
+    isInsideSyncBlock?: boolean;
     testId?: string;
+    isInsideOfSyncBlock?: boolean;
 };
 export declare const RendererStyleContainer: (props: RendererStyleContainerProps) => jsx.JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "128.9.0",
+	"version": "128.9.1",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -54,12 +54,12 @@
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/platform-feature-flags-react": "^0.4.0",
 		"@atlaskit/pragmatic-drag-and-drop": "^1.7.0",
-		"@atlaskit/react-ufo": "^5.10.0",
-		"@atlaskit/smart-card": "^43.30.0",
+		"@atlaskit/react-ufo": "^5.11.0",
+		"@atlaskit/smart-card": "^43.31.0",
 		"@atlaskit/status": "^3.2.0",
 		"@atlaskit/task-decision": "^19.3.0",
 		"@atlaskit/theme": "^22.0.0",
-		"@atlaskit/tmp-editor-statsig": "^54.1.0",
+		"@atlaskit/tmp-editor-statsig": "^54.4.0",
 		"@atlaskit/tokens": "^11.4.0",
 		"@atlaskit/tooltip": "^21.1.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
@@ -73,7 +73,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^112.16.0",
+		"@atlaskit/editor-common": "^112.18.0",
 		"@atlaskit/link-provider": "^4.3.0",
 		"@atlaskit/media-core": "^37.0.0",
 		"react": "^18.2.0",
@@ -92,7 +92,7 @@
 		"@atlaskit/mention": "^24.6.0",
 		"@atlaskit/modal-dialog": "^14.14.0",
 		"@atlaskit/navigation-system": "^7.1.0",
-		"@atlaskit/profilecard": "^24.46.0",
+		"@atlaskit/profilecard": "^24.47.0",
 		"@atlaskit/side-nav-items": "^1.12.0",
 		"@atlaskit/util-data-test": "^18.5.0",
 		"@atlassian/a11y-jest-testing": "^0.11.0",
@@ -235,6 +235,9 @@
 		"platform_editor_table_fixed_column_width_prop": {
 			"type": "boolean"
 		},
+		"platform_synced_block_patch_9": {
+			"type": "boolean"
+		},
 		"confluence_ttvc_inline_extensions": {
 			"type": "boolean"
 		},