@atlaskit/editor-plugin-table 14.0.0 → 14.0.1

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlaskit/editor-plugin-table
 
+## 14.0.1
+
+### Patch Changes
+
+- [`c0656bad0f992`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c0656bad0f992) -
+  EDITOR-1389 fix table container width behind platform_editor_table_container_width_fix
+- [`f0662cd7a143e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f0662cd7a143e) -
+  Internal changes to how borders are applied.
+- Updated dependencies
+
 ## 14.0.0
 
 ### Patch Changes

package/dist/cjs/nodeviews/TableContainer.js

@@ -247,7 +247,12 @@ var ResizableTableContainerLegacy = /*#__PURE__*/_react.default.memo(function (_
     // padding left = padding right = akEditorGutterPadding = 32
     responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - resizeHandleSpacing;
   }
-  var width = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+  // Fix for HOT-119925: Ensure table width is properly constrained and responsive
+  // For wide tables, ensure they don't exceed container width and can be scrolled
+  var calculatedWidth = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+
+  // Ensure minimum width for usability while respecting container constraints
+  var width = (0, _expValEquals.expValEquals)('platform_editor_table_container_width_fix', 'isEnabled', true) ? Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300)) : calculatedWidth;
   if (!isResizing) {
     tableWidthRef.current = width;
   }
@@ -448,7 +453,13 @@ var ResizableTableContainerNext = /*#__PURE__*/_react.default.memo(function (_re
     // padding left = padding right = akEditorGutterPadding = 32
     responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - resizeHandleSpacing;
   }
-  var width = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+
+  // Fix for HOT-119925: Ensure table width is properly constrained and responsive
+  // For wide tables, ensure they don't exceed container width and can be scrolled
+  var calculatedWidth = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+
+  // Ensure minimum width for usability while respecting container constraints
+  var width = (0, _expValEquals.expValEquals)('platform_editor_table_container_width_fix', 'isEnabled', true) ? Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300)) : calculatedWidth;
   if (!isResizing) {
     tableWidthRef.current = width;
   }

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

@@ -14,7 +14,7 @@ var boxStyles = (0, _primitives.xcss)({
   borderColor: 'color.border.focused',
   borderStyle: 'solid',
   borderRadius: 'radius.small',
-  borderWidth: 'border.width.outline',
+  borderWidth: 'border.width.focused',
   backgroundColor: 'color.blanket.selected'
 });
 var DragPreview = exports.DragPreview = function DragPreview(_ref) {

package/dist/cjs/ui/ui-styles.js

@@ -27,7 +27,7 @@ var Marker = function Marker() {
     height: "".concat(_consts.lineMarkerSize, "px"),
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     width: "".concat(_consts.lineMarkerSize, "px"),
-    borderRadius: '50%',
+    borderRadius: "var(--ds-radius-full, 9999px)",
     pointerEvents: 'none'
   });
 };

package/dist/es2019/nodeviews/TableContainer.js

@@ -240,7 +240,12 @@ const ResizableTableContainerLegacy = /*#__PURE__*/React.memo(({
     // padding left = padding right = akEditorGutterPadding = 32
     responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - resizeHandleSpacing;
   }
-  const width = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+  // Fix for HOT-119925: Ensure table width is properly constrained and responsive
+  // For wide tables, ensure they don't exceed container width and can be scrolled
+  const calculatedWidth = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+
+  // Ensure minimum width for usability while respecting container constraints
+  const width = expValEquals('platform_editor_table_container_width_fix', 'isEnabled', true) ? Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300)) : calculatedWidth;
   if (!isResizing) {
     tableWidthRef.current = width;
   }
@@ -437,7 +442,13 @@ const ResizableTableContainerNext = /*#__PURE__*/React.memo(({
     // padding left = padding right = akEditorGutterPadding = 32
     responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - resizeHandleSpacing;
   }
-  const width = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+
+  // Fix for HOT-119925: Ensure table width is properly constrained and responsive
+  // For wide tables, ensure they don't exceed container width and can be scrolled
+  const calculatedWidth = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+
+  // Ensure minimum width for usability while respecting container constraints
+  const width = expValEquals('platform_editor_table_container_width_fix', 'isEnabled', true) ? Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300)) : calculatedWidth;
   if (!isResizing) {
     tableWidthRef.current = width;
   }

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

@@ -7,7 +7,7 @@ const boxStyles = xcss({
   borderColor: 'color.border.focused',
   borderStyle: 'solid',
   borderRadius: 'radius.small',
-  borderWidth: 'border.width.outline',
+  borderWidth: 'border.width.focused',
   backgroundColor: 'color.blanket.selected'
 });
 export const DragPreview = ({

package/dist/es2019/ui/ui-styles.js

@@ -23,7 +23,7 @@ const Marker = () => css({
   height: `${lineMarkerSize}px`,
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   width: `${lineMarkerSize}px`,
-  borderRadius: '50%',
+  borderRadius: "var(--ds-radius-full, 9999px)",
   pointerEvents: 'none'
 });
 export const InsertMarker = cssString => css`

package/dist/esm/nodeviews/TableContainer.js

@@ -238,7 +238,12 @@ var ResizableTableContainerLegacy = /*#__PURE__*/React.memo(function (_ref4) {
     // padding left = padding right = akEditorGutterPadding = 32
     responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - resizeHandleSpacing;
   }
-  var width = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+  // Fix for HOT-119925: Ensure table width is properly constrained and responsive
+  // For wide tables, ensure they don't exceed container width and can be scrolled
+  var calculatedWidth = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+
+  // Ensure minimum width for usability while respecting container constraints
+  var width = expValEquals('platform_editor_table_container_width_fix', 'isEnabled', true) ? Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300)) : calculatedWidth;
   if (!isResizing) {
     tableWidthRef.current = width;
   }
@@ -439,7 +444,13 @@ var ResizableTableContainerNext = /*#__PURE__*/React.memo(function (_ref5) {
     // padding left = padding right = akEditorGutterPadding = 32
     responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - resizeHandleSpacing;
   }
-  var width = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+
+  // Fix for HOT-119925: Ensure table width is properly constrained and responsive
+  // For wide tables, ensure they don't exceed container width and can be scrolled
+  var calculatedWidth = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
+
+  // Ensure minimum width for usability while respecting container constraints
+  var width = expValEquals('platform_editor_table_container_width_fix', 'isEnabled', true) ? Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300)) : calculatedWidth;
   if (!isResizing) {
     tableWidthRef.current = width;
   }

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

@@ -7,7 +7,7 @@ var boxStyles = xcss({
   borderColor: 'color.border.focused',
   borderStyle: 'solid',
   borderRadius: 'radius.small',
-  borderWidth: 'border.width.outline',
+  borderWidth: 'border.width.focused',
   backgroundColor: 'color.blanket.selected'
 });
 export var DragPreview = function DragPreview(_ref) {

package/dist/esm/ui/ui-styles.js

@@ -20,7 +20,7 @@ var Marker = function Marker() {
     height: "".concat(lineMarkerSize, "px"),
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     width: "".concat(lineMarkerSize, "px"),
-    borderRadius: '50%',
+    borderRadius: "var(--ds-radius-full, 9999px)",
     pointerEvents: 'none'
   });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "14.0.0",
+	"version": "14.0.1",
 	"description": "Table plugin for the @atlaskit/editor",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -37,12 +37,12 @@
 		"@atlaskit/editor-plugin-batch-attribute-updates": "^5.0.0",
 		"@atlaskit/editor-plugin-content-insertion": "^5.0.0",
 		"@atlaskit/editor-plugin-editor-viewmode": "^7.0.0",
-		"@atlaskit/editor-plugin-extension": "8.0.0",
+		"@atlaskit/editor-plugin-extension": "8.0.1",
 		"@atlaskit/editor-plugin-guideline": "^5.0.0",
 		"@atlaskit/editor-plugin-interaction": "^7.0.0",
 		"@atlaskit/editor-plugin-limited-mode": "^2.0.0",
 		"@atlaskit/editor-plugin-selection": "^5.0.0",
-		"@atlaskit/editor-plugin-toolbar": "^2.0.0",
+		"@atlaskit/editor-plugin-toolbar": "^2.1.0",
 		"@atlaskit/editor-plugin-user-intent": "^3.0.0",
 		"@atlaskit/editor-plugin-width": "^6.0.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
@@ -58,8 +58,8 @@
 		"@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.1.0",
 		"@atlaskit/primitives": "^14.14.0",
 		"@atlaskit/react-ufo": "^4.6.0",
-		"@atlaskit/theme": "^20.0.0",
-		"@atlaskit/tmp-editor-statsig": "^12.9.0",
+		"@atlaskit/theme": "^21.0.0",
+		"@atlaskit/tmp-editor-statsig": "^12.10.0",
 		"@atlaskit/toggle": "^15.1.0",
 		"@atlaskit/tokens": "^6.3.0",
 		"@atlaskit/tooltip": "^20.4.0",
@@ -72,7 +72,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^109.0.0",
+		"@atlaskit/editor-common": "^109.1.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"