@atlaskit/renderer 133.17.3 → 133.17.5

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.
Files changed (11) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/react/nodes/tableCell.js +6 -3
  3. package/dist/cjs/ui/Renderer/RendererStyleContainer.js +7 -1
  4. package/dist/cjs/ui/Renderer/index.js +1 -1
  5. package/dist/es2019/react/nodes/tableCell.js +5 -2
  6. package/dist/es2019/ui/Renderer/RendererStyleContainer.js +11 -1
  7. package/dist/es2019/ui/Renderer/index.js +1 -1
  8. package/dist/esm/react/nodes/tableCell.js +5 -2
  9. package/dist/esm/ui/Renderer/RendererStyleContainer.js +7 -1
  10. package/dist/esm/ui/Renderer/index.js +1 -1
  11. package/package.json +16 -13
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/renderer
2
2
 
3
+ ## 133.17.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [`109c3998554f2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/109c3998554f2) -
8
+ Add SSR-safe, experiment-gated CSS overflow shadows for editor tables and keep renderer shadows
9
+ within table bounds when sticky scrollbars are present.
10
+ - Updated dependencies
11
+
12
+ ## 133.17.4
13
+
14
+ ### Patch Changes
15
+
16
+ - [`3b0816741523c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3b0816741523c) -
17
+ Add lime, orange, and magenta colors to table cell background color palette
18
+ - Updated dependencies
19
+
3
20
  ## 133.17.3
4
21
 
5
22
  ### Patch Changes
package/dist/cjs/react/nodes/tableCell.js CHANGED
@@ -7,7 +7,9 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.withSortableColumn = exports.TableHeader = exports.TableCell = void 0;
8
8
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
9
  var _react = _interopRequireDefault(require("react"));
10
- var _adfSchema = require("@atlaskit/adf-schema");
10
+ var _tableNodes = require("@atlaskit/adf-schema/tableNodes");
11
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
12
+ var _lchColorInversion = require("@atlaskit/adf-schema/lch-color-inversion");
11
13
  var _useThemeObserver2 = require("@atlaskit/tokens/use-theme-observer");
12
14
  var _types = require("@atlaskit/editor-common/types");
13
15
  var _editorPalette = require("@atlaskit/editor-palette");
@@ -134,7 +136,7 @@ var getStyle = function getStyle(_ref) {
134
136
  // if we have a custom color, we need to check if we are in dark mode
135
137
  if (colorMode === 'dark') {
136
138
  // if we are in dark mode, we need to invert the color
137
- style.backgroundColor = (0, _adfSchema.getDarkModeLCHColor)(background);
139
+ style.backgroundColor = (0, _lchColorInversion.getDarkModeLCHColor)(background);
138
140
  } else {
139
141
  // if we are in light mode, we can just set the color
140
142
  style.backgroundColor = background;
@@ -175,7 +177,8 @@ var getWithCellProps = function getWithCellProps(WrapperComponent) {
175
177
 
176
178
  // This is used to set the background color of the cell
177
179
  // to a dark mode color in mobile dark mode
178
- var colorName = background ? _adfSchema.tableBackgroundColorPalette.get(background) : '';
180
+ var palette = (0, _expValEquals.expValEquals)('platform_editor_lovability_text_bg_color', 'isEnabled', true) && (0, _platformFeatureFlags.fg)('platform_editor_lovability_text_bg_color_patch_2') ? _tableNodes.tableBackgroundColorPaletteNew : _tableNodes.tableBackgroundColorPalette;
181
+ var colorName = background ? palette.get(background) : '';
179
182
  return /*#__PURE__*/_react.default.createElement(WrapperComponent, (0, _extends2.default)({
180
183
  rowSpan: rowspan,
181
184
  colSpan: colspan
package/dist/cjs/ui/Renderer/RendererStyleContainer.js CHANGED
@@ -1699,6 +1699,11 @@ var stickyScrollbarStyles = (0, _react.css)((0, _defineProperty2.default)({}, ".
1699
1699
  }), "> .".concat(_styles.TableSharedCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_BOTTOM), {
1700
1700
  bottom: "var(--ds-space-250, 20px)" // MAX_BROWSER_SCROLLBAR_HEIGHT = 20;
1701
1701
  })));
1702
+ var stickyScrollbarOverflowShadowFixStyles = (0, _react.css)((0, _defineProperty2.default)({}, ".".concat(_consts.RendererCssClassName.DOCUMENT, " .").concat(_styles.TableSharedCssClassName.TABLE_CONTAINER), (0, _defineProperty2.default)({}, "&.".concat(_ui.shadowClassNames.RIGHT_SHADOW, "::after, &.").concat(_ui.shadowClassNames.LEFT_SHADOW, "::before"), {
1703
+ // The sticky scrollbar retains this space in the table container's layout even while hidden.
1704
+ bottom: "var(--ds-space-250, 20px)",
1705
+ height: 'auto'
1706
+ })));
1702
1707
  var rendererTableHeaderEqualHeightStylesForTableCellOnly = (0, _react.css)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, ".".concat(_consts.RendererCssClassName.DOCUMENT, " .").concat(_styles.TableSharedCssClassName.TABLE_CONTAINER), (0, _defineProperty2.default)({}, ".".concat(_styles.TableSharedCssClassName.TABLE_NODE_WRAPPER, " > table, .").concat(_styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table"), {
1703
1708
  height: '1px' /* will be ignored */,
1704
1709
  marginLeft: 0,
@@ -2222,6 +2227,7 @@ var RendererStyleContainer = exports.RendererStyleContainer = function RendererS
2222
2227
  var isPreviewPanelResponsivenessOn = (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true, {
2223
2228
  exposure: true
2224
2229
  });
2230
+ var isStickyScrollbarOn = (0, _table.isStickyScrollbarEnabled)(appearance);
2225
2231
  var baseFontSize = (0, _getBaseFontSize.getBaseFontSize)(appearance, contentMode);
2226
2232
  var browser = (0, _browser.getBrowserInfo)();
2227
2233
  return (0, _react.jsx)("div", {
@@ -2249,7 +2255,7 @@ var RendererStyleContainer = exports.RendererStyleContainer = function RendererS
2249
2255
  // this should be placed after baseOtherStyles
2250
2256
  (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,
2251
2257
  // merge firstWrappedMediaStyles with mediaSingleSharedStyle when clean up platform_editor_fix_media_in_renderer
2252
- (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],
2258
+ (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, isStickyScrollbarOn && stickyScrollbarStyles, isStickyScrollbarOn && (0, _expValEquals.expValEquals)('platform_editor_table_css_overflow_shadow', 'isEnabled', true) && stickyScrollbarOverflowShadowFixStyles, 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],
2253
2259
  "data-testid": testId
2254
2260
  }, children);
2255
2261
  };
package/dist/cjs/ui/Renderer/index.js CHANGED
@@ -73,7 +73,7 @@ var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
73
73
  var TABLE_INFO_TIMEOUT = 10000;
74
74
  var RENDER_EVENT_SAMPLE_RATE = 0.1;
75
75
  var packageName = "@atlaskit/renderer";
76
- var packageVersion = "133.17.2";
76
+ var packageVersion = "133.17.4";
77
77
  var setAsQueryContainerStyles = (0, _react2.css)({
78
78
  containerName: 'ak-renderer-wrapper',
79
79
  containerType: 'inline-size'
package/dist/es2019/react/nodes/tableCell.js CHANGED
@@ -1,6 +1,8 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import React from 'react';
3
- import { tableBackgroundColorPalette, getDarkModeLCHColor } from '@atlaskit/adf-schema';
3
+ import { tableBackgroundColorPalette, tableBackgroundColorPaletteNew } from '@atlaskit/adf-schema/tableNodes';
4
+ import { fg } from '@atlaskit/platform-feature-flags';
5
+ import { getDarkModeLCHColor } from '@atlaskit/adf-schema/lch-color-inversion';
4
6
  import { useThemeObserver } from '@atlaskit/tokens/use-theme-observer';
5
7
  import { SortOrder } from '@atlaskit/editor-common/types';
6
8
  import { hexToEditorBackgroundPaletteRawValue } from '@atlaskit/editor-palette';
@@ -174,7 +176,8 @@ const getWithCellProps = WrapperComponent => {
174
176
 
175
177
  // This is used to set the background color of the cell
176
178
  // to a dark mode color in mobile dark mode
177
- const colorName = background ? tableBackgroundColorPalette.get(background) : '';
179
+ const palette = expValEquals('platform_editor_lovability_text_bg_color', 'isEnabled', true) && fg('platform_editor_lovability_text_bg_color_patch_2') ? tableBackgroundColorPaletteNew : tableBackgroundColorPalette;
180
+ const colorName = background ? palette.get(background) : '';
178
181
  return /*#__PURE__*/React.createElement(WrapperComponent, _extends({
179
182
  rowSpan: rowspan,
180
183
  colSpan: colspan
package/dist/es2019/ui/Renderer/RendererStyleContainer.js CHANGED
@@ -2159,6 +2159,15 @@ const stickyScrollbarStyles = css({
2159
2159
  }
2160
2160
  }
2161
2161
  });
2162
+ const stickyScrollbarOverflowShadowFixStyles = css({
2163
+ [`.${RendererCssClassName.DOCUMENT} .${TableSharedCssClassName.TABLE_CONTAINER}`]: {
2164
+ [`&.${shadowClassNames.RIGHT_SHADOW}::after, &.${shadowClassNames.LEFT_SHADOW}::before`]: {
2165
+ // The sticky scrollbar retains this space in the table container's layout even while hidden.
2166
+ bottom: "var(--ds-space-250, 20px)",
2167
+ height: 'auto'
2168
+ }
2169
+ }
2170
+ });
2162
2171
  const rendererTableHeaderEqualHeightStylesForTableCellOnly = css({
2163
2172
  [`.${RendererCssClassName.DOCUMENT} .${TableSharedCssClassName.TABLE_CONTAINER}`]: {
2164
2173
  [`.${TableSharedCssClassName.TABLE_NODE_WRAPPER} > table, .${TableSharedCssClassName.TABLE_STICKY_WRAPPER} > table`]: {
@@ -2846,6 +2855,7 @@ export const RendererStyleContainer = props => {
2846
2855
  const isPreviewPanelResponsivenessOn = editorExperiment('platform_editor_preview_panel_responsiveness', true, {
2847
2856
  exposure: true
2848
2857
  });
2858
+ const isStickyScrollbarOn = isStickyScrollbarEnabled(appearance);
2849
2859
  const baseFontSize = getBaseFontSize(appearance, contentMode);
2850
2860
  const browser = getBrowserInfo();
2851
2861
  return jsx("div", {
@@ -2875,7 +2885,7 @@ export const RendererStyleContainer = props => {
2875
2885
  // this should be placed after baseOtherStyles
2876
2886
  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,
2877
2887
  // merge firstWrappedMediaStyles with mediaSingleSharedStyle when clean up platform_editor_fix_media_in_renderer
2878
- 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],
2888
+ 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, isStickyScrollbarOn && stickyScrollbarStyles, isStickyScrollbarOn && expValEquals('platform_editor_table_css_overflow_shadow', 'isEnabled', true) && stickyScrollbarOverflowShadowFixStyles, 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],
2879
2889
  "data-testid": testId
2880
2890
  }, children);
2881
2891
  };
package/dist/es2019/ui/Renderer/index.js CHANGED
@@ -59,7 +59,7 @@ export const DEGRADED_SEVERITY_THRESHOLD = 3000;
59
59
  const TABLE_INFO_TIMEOUT = 10000;
60
60
  const RENDER_EVENT_SAMPLE_RATE = 0.1;
61
61
  const packageName = "@atlaskit/renderer";
62
- const packageVersion = "133.17.2";
62
+ const packageVersion = "133.17.4";
63
63
  const setAsQueryContainerStyles = css({
64
64
  containerName: 'ak-renderer-wrapper',
65
65
  containerType: 'inline-size'
package/dist/esm/react/nodes/tableCell.js CHANGED
@@ -1,6 +1,8 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import React from 'react';
3
- import { tableBackgroundColorPalette, getDarkModeLCHColor } from '@atlaskit/adf-schema';
3
+ import { tableBackgroundColorPalette, tableBackgroundColorPaletteNew } from '@atlaskit/adf-schema/tableNodes';
4
+ import { fg } from '@atlaskit/platform-feature-flags';
5
+ import { getDarkModeLCHColor } from '@atlaskit/adf-schema/lch-color-inversion';
4
6
  import { useThemeObserver } from '@atlaskit/tokens/use-theme-observer';
5
7
  import { SortOrder } from '@atlaskit/editor-common/types';
6
8
  import { hexToEditorBackgroundPaletteRawValue } from '@atlaskit/editor-palette';
@@ -168,7 +170,8 @@ var getWithCellProps = function getWithCellProps(WrapperComponent) {
168
170
 
169
171
  // This is used to set the background color of the cell
170
172
  // to a dark mode color in mobile dark mode
171
- var colorName = background ? tableBackgroundColorPalette.get(background) : '';
173
+ var palette = expValEquals('platform_editor_lovability_text_bg_color', 'isEnabled', true) && fg('platform_editor_lovability_text_bg_color_patch_2') ? tableBackgroundColorPaletteNew : tableBackgroundColorPalette;
174
+ var colorName = background ? palette.get(background) : '';
172
175
  return /*#__PURE__*/React.createElement(WrapperComponent, _extends({
173
176
  rowSpan: rowspan,
174
177
  colSpan: colspan
package/dist/esm/ui/Renderer/RendererStyleContainer.js CHANGED
@@ -1692,6 +1692,11 @@ var stickyScrollbarStyles = css(_defineProperty({}, ".".concat(RendererCssClassN
1692
1692
  }), "> .".concat(TableSharedCssClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_BOTTOM), {
1693
1693
  bottom: "var(--ds-space-250, 20px)" // MAX_BROWSER_SCROLLBAR_HEIGHT = 20;
1694
1694
  })));
1695
+ var stickyScrollbarOverflowShadowFixStyles = css(_defineProperty({}, ".".concat(RendererCssClassName.DOCUMENT, " .").concat(TableSharedCssClassName.TABLE_CONTAINER), _defineProperty({}, "&.".concat(shadowClassNames.RIGHT_SHADOW, "::after, &.").concat(shadowClassNames.LEFT_SHADOW, "::before"), {
1696
+ // The sticky scrollbar retains this space in the table container's layout even while hidden.
1697
+ bottom: "var(--ds-space-250, 20px)",
1698
+ height: 'auto'
1699
+ })));
1695
1700
  var rendererTableHeaderEqualHeightStylesForTableCellOnly = css(_defineProperty(_defineProperty({}, ".".concat(RendererCssClassName.DOCUMENT, " .").concat(TableSharedCssClassName.TABLE_CONTAINER), _defineProperty({}, ".".concat(TableSharedCssClassName.TABLE_NODE_WRAPPER, " > table, .").concat(TableSharedCssClassName.TABLE_STICKY_WRAPPER, " > table"), {
1696
1701
  height: '1px' /* will be ignored */,
1697
1702
  marginLeft: 0,
@@ -2215,6 +2220,7 @@ export var RendererStyleContainer = function RendererStyleContainer(props) {
2215
2220
  var isPreviewPanelResponsivenessOn = editorExperiment('platform_editor_preview_panel_responsiveness', true, {
2216
2221
  exposure: true
2217
2222
  });
2223
+ var isStickyScrollbarOn = isStickyScrollbarEnabled(appearance);
2218
2224
  var baseFontSize = getBaseFontSize(appearance, contentMode);
2219
2225
  var browser = getBrowserInfo();
2220
2226
  return jsx("div", {
@@ -2242,7 +2248,7 @@ export var RendererStyleContainer = function RendererStyleContainer(props) {
2242
2248
  // this should be placed after baseOtherStyles
2243
2249
  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,
2244
2250
  // merge firstWrappedMediaStyles with mediaSingleSharedStyle when clean up platform_editor_fix_media_in_renderer
2245
- 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],
2251
+ 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, isStickyScrollbarOn && stickyScrollbarStyles, isStickyScrollbarOn && expValEquals('platform_editor_table_css_overflow_shadow', 'isEnabled', true) && stickyScrollbarOverflowShadowFixStyles, 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],
2246
2252
  "data-testid": testId
2247
2253
  }, children);
2248
2254
  };
package/dist/esm/ui/Renderer/index.js CHANGED
@@ -64,7 +64,7 @@ export var DEGRADED_SEVERITY_THRESHOLD = 3000;
64
64
  var TABLE_INFO_TIMEOUT = 10000;
65
65
  var RENDER_EVENT_SAMPLE_RATE = 0.1;
66
66
  var packageName = "@atlaskit/renderer";
67
- var packageVersion = "133.17.2";
67
+ var packageVersion = "133.17.4";
68
68
  var setAsQueryContainerStyles = css({
69
69
  containerName: 'ak-renderer-wrapper',
70
70
  containerType: 'inline-size'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "133.17.3",
3
+ "version": "133.17.5",
4
4
  "description": "Renderer component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -30,8 +30,8 @@
30
30
  }
31
31
  },
32
32
  "dependencies": {
33
- "@atlaskit/adf-schema": "^56.1.0",
34
- "@atlaskit/adf-utils": "^20.3.0",
33
+ "@atlaskit/adf-schema": "^56.3.0",
34
+ "@atlaskit/adf-utils": "^20.4.0",
35
35
  "@atlaskit/afm-i18n-platform-editor-renderer": "2.200.0",
36
36
  "@atlaskit/analytics-listeners": "^11.1.0",
37
37
  "@atlaskit/analytics-namespaced-context": "^8.1.0",
@@ -40,11 +40,11 @@
40
40
  "@atlaskit/button": "^24.3.0",
41
41
  "@atlaskit/code": "^18.2.0",
42
42
  "@atlaskit/css": "^1.0.0",
43
- "@atlaskit/editor-json-transformer": "^9.1.0",
44
- "@atlaskit/editor-palette": "^3.1.0",
43
+ "@atlaskit/editor-json-transformer": "^9.2.0",
44
+ "@atlaskit/editor-palette": "^3.3.0",
45
45
  "@atlaskit/editor-prosemirror": "^8.0.0",
46
46
  "@atlaskit/editor-shared-styles": "^4.0.0",
47
- "@atlaskit/editor-smart-link-draggable": "^1.1.0",
47
+ "@atlaskit/editor-smart-link-draggable": "^1.2.0",
48
48
  "@atlaskit/emoji": "^71.15.0",
49
49
  "@atlaskit/feature-gate-js-client": "^6.0.0",
50
50
  "@atlaskit/icon": "^37.2.0",
@@ -64,11 +64,11 @@
64
64
  "@atlaskit/pragmatic-drag-and-drop": "^2.0.0",
65
65
  "@atlaskit/react-compiler-gating": "^0.2.0",
66
66
  "@atlaskit/react-ufo": "^7.3.0",
67
- "@atlaskit/smart-card": "^45.15.0",
67
+ "@atlaskit/smart-card": "^45.16.0",
68
68
  "@atlaskit/status": "^5.8.0",
69
69
  "@atlaskit/task-decision": "^21.8.0",
70
70
  "@atlaskit/theme": "^26.1.0",
71
- "@atlaskit/tmp-editor-statsig": "^135.6.0",
71
+ "@atlaskit/tmp-editor-statsig": "^135.9.0",
72
72
  "@atlaskit/tokens": "^16.3.0",
73
73
  "@atlaskit/tooltip": "^24.0.0",
74
74
  "@atlaskit/visually-hidden": "^4.2.0",
@@ -83,8 +83,8 @@
83
83
  "uuid": "^3.1.0"
84
84
  },
85
85
  "peerDependencies": {
86
- "@atlaskit/editor-common": "^116.44.0",
87
- "@atlaskit/link-provider": "^5.2.0",
86
+ "@atlaskit/editor-common": "^116.46.0",
87
+ "@atlaskit/link-provider": "^5.3.0",
88
88
  "@atlaskit/media-core": "^38.0.0",
89
89
  "react": "^18.2.0",
90
90
  "react-dom": "^18.2.0",
@@ -95,15 +95,15 @@
95
95
  "@af/visual-regression": "workspace:^",
96
96
  "@atlaskit/analytics-gas-types": "^6.0.0",
97
97
  "@atlaskit/checkbox": "^18.2.0",
98
- "@atlaskit/editor-card-provider": "^7.0.0",
99
- "@atlaskit/link-provider": "^5.2.0",
98
+ "@atlaskit/editor-card-provider": "^7.1.0",
99
+ "@atlaskit/link-provider": "^5.3.0",
100
100
  "@atlaskit/link-test-helpers": "^11.0.0",
101
101
  "@atlaskit/media-core": "^38.0.0",
102
102
  "@atlaskit/media-integration-test-helpers": "workspace:^",
103
103
  "@atlaskit/media-test-helpers": "^42.2.0",
104
104
  "@atlaskit/mention": "^27.12.0",
105
105
  "@atlaskit/modal-dialog": "^16.2.0",
106
- "@atlaskit/navigation-system": "^10.9.0",
106
+ "@atlaskit/navigation-system": "^10.10.0",
107
107
  "@atlaskit/profilecard": "^26.14.0",
108
108
  "@atlaskit/side-nav-items": "^2.3.0",
109
109
  "@atlaskit/util-data-test": "^19.1.0",
@@ -145,6 +145,9 @@
145
145
  }
146
146
  },
147
147
  "platform-feature-flags": {
148
+ "platform_editor_lovability_text_bg_color_patch_2": {
149
+ "type": "boolean"
150
+ },
148
151
  "platform_native_embeds_rollout_non_maui_experience": {
149
152
  "type": "boolean"
150
153
  },