@atlaskit/editor-plugin-table 11.1.2 → 11.1.4

package/src/pm-plugins/table-resizing/utils/misc.ts

@@ -14,7 +14,10 @@ import {
 	akEditorFullWidthLayoutWidth,
 	akEditorGutterPaddingDynamic,
 	akEditorTableNumberColumnWidth,
+	akEditorGutterPaddingReduced,
+	akEditorFullPageNarrowBreakout,
 } from '@atlaskit/editor-shared-styles';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 
 import type { TableOptions } from '../../../nodeviews/types';
 
@@ -33,8 +36,16 @@ export function getLayoutSize(
 	const { isFullWidthModeEnabled } = options;
 
 	if (isFullWidthModeEnabled) {
+		let padding: number = akEditorGutterPaddingDynamic();
+		if (
+			containerWidth <= akEditorFullPageNarrowBreakout &&
+			expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true)
+		) {
+			padding = akEditorGutterPaddingReduced;
+		}
+
 		return containerWidth
-			? Math.min(containerWidth - akEditorGutterPaddingDynamic() * 2, akEditorFullWidthLayoutWidth)
+			? Math.min(containerWidth - padding * 2, akEditorFullWidthLayoutWidth)
 			: akEditorFullWidthLayoutWidth;
 	}
 

package/src/pm-plugins/utils/snapping.ts

@@ -5,7 +5,10 @@ import {
 	akEditorDefaultLayoutWidth,
 	akEditorFullWidthLayoutWidth,
 	akEditorGutterPaddingDynamic,
+	akEditorGutterPaddingReduced,
+	akEditorFullPageNarrowBreakout,
 } from '@atlaskit/editor-shared-styles';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 
 const numberOfLanesInDefaultLayoutWidth = 12;
 
@@ -29,6 +32,13 @@ export type GuidelineExcludeConfig = {
 	breakoutPoints: boolean;
 };
 
+const getPadding = (editorContainerWith: number) => {
+	return editorContainerWith <= akEditorFullPageNarrowBreakout &&
+		expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true)
+		? akEditorGutterPaddingReduced
+		: akEditorGutterPaddingDynamic();
+};
+
 // FF TablePreserve for calculateDefaultSnappings
 export const calculateDefaultTablePreserveSnappings = (
 	lengthOffset = 0,
@@ -38,10 +48,11 @@ export const calculateDefaultTablePreserveSnappings = (
 		breakoutPoints: false,
 	},
 ) => {
+	const padding = getPadding(editorContainerWith);
 	const dynamicFullWidthLine =
-		editorContainerWith - akEditorGutterPaddingDynamic() * 2 >= akEditorFullWidthLayoutWidth
+		editorContainerWith - padding * 2 >= akEditorFullWidthLayoutWidth
 			? akEditorFullWidthLayoutWidth
-			: editorContainerWith - akEditorGutterPaddingDynamic() * 2;
+			: editorContainerWith - padding * 2;
 
 	const guides = [dynamicFullWidthLine - lengthOffset];
 
@@ -77,7 +88,8 @@ export const defaultTablePreserveSnappingWidths = (
 		breakoutPoints: false,
 	},
 ) => {
-	return editorContainerWidth - akEditorGutterPaddingDynamic() * 2 > akEditorFullWidthLayoutWidth
+	const padding = getPadding(editorContainerWidth);
+	return editorContainerWidth - padding * 2 > akEditorFullWidthLayoutWidth
 		? calculateDefaultSnappings()
 		: calculateDefaultTablePreserveSnappings(lengthOffset, editorContainerWidth, exclude); // lengthOffset was hardcoded 0 here, created PRESERVE_TABLE_SNAPPING_LENGTH_OFFSET instead.
 };

package/src/ui/DragPreview/index.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 
+// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, xcss } from '@atlaskit/primitives';
 
 import type { TableDirection } from '../../types';

package/src/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.tsx

@@ -11,6 +11,7 @@ import {
 	FloatingToolbarButton as Button,
 	FloatingToolbarSeparator,
 } from '@atlaskit/editor-common/ui';
+// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, xcss } from '@atlaskit/primitives';
 
 const containerStyles = xcss({

package/src/ui/FloatingContextualMenu/ContextualMenu.tsx

@@ -53,6 +53,7 @@ import TableRowAddBelowIcon from '@atlaskit/icon/core/table-row-add-below';
 import TableRowDeleteIcon from '@atlaskit/icon/core/table-row-delete';
 import CrossCircleIcon from '@atlaskit/icon/glyph/cross-circle';
 import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
+// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, xcss } from '@atlaskit/primitives';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 

package/src/ui/FloatingDragMenu/DragMenu.tsx

@@ -42,6 +42,7 @@ import {
 	isSelectionType,
 } from '@atlaskit/editor-tables/utils';
 import PaintBucketIcon from '@atlaskit/icon/core/migration/paint-bucket--editor-background-color';
+// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, xcss } from '@atlaskit/primitives';
 import Toggle from '@atlaskit/toggle';
 

package/src/ui/TableFullWidthLabel/index.tsx

@@ -3,6 +3,7 @@ import React from 'react';
 import { useIntl } from 'react-intl-next';
 
 import { tableMessages as messages } from '@atlaskit/editor-common/messages';
+// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, Inline, xcss } from '@atlaskit/primitives';
 import { token } from '@atlaskit/tokens';
 

package/src/ui/toolbar.tsx

@@ -17,8 +17,8 @@ import type {
 	Command,
 	CommandDispatch,
 	ConfirmDialogOptions,
-	DropdownOptions,
 	DropdownOptionT,
+	DropdownOptions,
 	FloatingToolbarDropdown,
 	FloatingToolbarHandler,
 	FloatingToolbarItem,
@@ -26,7 +26,7 @@ import type {
 	Icon,
 	typeOption,
 } from '@atlaskit/editor-common/types';
-import { cellBackgroundColorPalette, DEFAULT_BORDER_COLOR } from '@atlaskit/editor-common/ui-color';
+import { DEFAULT_BORDER_COLOR, cellBackgroundColorPalette } from '@atlaskit/editor-common/ui-color';
 import {
 	closestElement,
 	getChildrenInfo,