@atlaskit/editor-plugin-table 7.16.8 → 7.16.10

package/dist/es2019/ui/TableFloatingControls/RowControls/ClassicControls.js

@@ -39,47 +39,54 @@ class RowControlsComponent extends Component {
     const rowsParams = getRowsParams(rowHeights);
     const firstRow = tableRef.querySelector('tr');
     const hasHeaderRow = firstRow ? firstRow.getAttribute('data-header-row') : false;
-    return /*#__PURE__*/React.createElement("div", {
-      className: ClassName.ROW_CONTROLS
-    }, /*#__PURE__*/React.createElement("div", {
-      className: ClassName.ROW_CONTROLS_INNER
-    }, rowsParams.map(({
-      startIndex,
-      endIndex,
-      height
-    }, index) => {
-      // if previous row was header row, add its height to our margin
-      let marginTop = -1;
-      if (index === 1 && hasHeaderRow && this.props.stickyTop !== undefined) {
-        marginTop += rowHeights[index - 1] + tableToolbarSize;
-      }
-      const thisRowSticky = this.props.stickyTop !== undefined && index === 0 && hasHeaderRow;
-      return /*#__PURE__*/React.createElement("div", {
-        className: `${ClassName.ROW_CONTROLS_BUTTON_WRAP} ${getRowClassNames(startIndex, selectionState || selection, hoveredRows, isInDanger, isResizing)} ${thisRowSticky ? 'sticky' : ''}`,
-        key: startIndex,
-        style: {
-          // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-          height: height,
-          // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-          marginTop: `${marginTop}px`,
-          // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-          top: thisRowSticky ? `${this.props.stickyTop + 3}px` : undefined,
-          // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-          paddingTop: thisRowSticky ? `${tableControlsSpacing}px` : undefined
+    return (
+      /*#__PURE__*/
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      React.createElement("div", {
+        className: ClassName.ROW_CONTROLS
+      }, /*#__PURE__*/React.createElement("div", {
+        className: ClassName.ROW_CONTROLS_INNER
+      }, rowsParams.map(({
+        startIndex,
+        endIndex,
+        height
+      }, index) => {
+        // if previous row was header row, add its height to our margin
+        let marginTop = -1;
+        if (index === 1 && hasHeaderRow && this.props.stickyTop !== undefined) {
+          marginTop += rowHeights[index - 1] + tableToolbarSize;
         }
-      }, /*#__PURE__*/React.createElement("button", {
-        "aria-label": formatMessage(messages.rowControl),
-        type: "button",
-        className: `${ClassName.ROW_CONTROLS_BUTTON} ${ClassName.CONTROLS_BUTTON}`,
-        onClick: event => this.props.selectRow(startIndex, event.shiftKey),
-        onMouseOver: () => this.props.hoverRows([startIndex]),
-        onMouseOut: this.clearHoverSelection,
-        "data-start-index": startIndex,
-        "data-end-index": endIndex
-      }), /*#__PURE__*/React.createElement("div", {
-        className: ClassName.CONTROLS_INSERT_MARKER
-      }));
-    })));
+        const thisRowSticky = this.props.stickyTop !== undefined && index === 0 && hasHeaderRow;
+        return /*#__PURE__*/React.createElement("div", {
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+          className: `${ClassName.ROW_CONTROLS_BUTTON_WRAP} ${getRowClassNames(startIndex, selectionState || selection, hoveredRows, isInDanger, isResizing)} ${thisRowSticky ? 'sticky' : ''}`,
+          key: startIndex,
+          style: {
+            // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+            height: height,
+            // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+            marginTop: `${marginTop}px`,
+            // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+            top: thisRowSticky ? `${this.props.stickyTop + 3}px` : undefined,
+            // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+            paddingTop: thisRowSticky ? `${tableControlsSpacing}px` : undefined
+          }
+        }, /*#__PURE__*/React.createElement("button", {
+          "aria-label": formatMessage(messages.rowControl),
+          type: "button"
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+          ,
+          className: `${ClassName.ROW_CONTROLS_BUTTON} ${ClassName.CONTROLS_BUTTON}`,
+          onClick: event => this.props.selectRow(startIndex, event.shiftKey),
+          onMouseOver: () => this.props.hoverRows([startIndex]),
+          onMouseOut: this.clearHoverSelection,
+          "data-start-index": startIndex,
+          "data-end-index": endIndex
+        }), /*#__PURE__*/React.createElement("div", {
+          className: ClassName.CONTROLS_INSERT_MARKER
+        }));
+      })))
+    );
   }
 }
 export const RowControls = injectIntl(RowControlsComponent);

package/dist/es2019/ui/TableFloatingControls/RowControls/DragControls.js

@@ -134,13 +134,18 @@ const DragControlsComponent = ({
       key: type,
       style: {
         gridRow,
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         gridColumn: '2',
         // DragHandle uses `transform: rotate(90)`, which doesn't affect its parent (this div) causing the width of this element to be the true height of the drag handle
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         display: 'flex',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         width: '9px',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         height: '100%',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         position: 'relative',
-        // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+        // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         right: '-0.5px'
       },
       "data-testid": `table-floating-row-${isHover ? rowIndex : selectedRowIndexes[0]}-drag-handle`
@@ -181,6 +186,7 @@ const DragControlsComponent = ({
     return null;
   }
   return /*#__PURE__*/React.createElement("div", {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: ClassName.DRAG_ROW_CONTROLS,
     style: {
       gridTemplateRows: heights,
@@ -198,10 +204,13 @@ const DragControlsComponent = ({
   }, /*#__PURE__*/React.createElement("div", {
     style: {
       gridRow: `${index + 1} / span 1`,
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       gridColumn: '2'
     },
     "data-start-index": startIndex,
-    "data-end-index": endIndex,
+    "data-end-index": endIndex
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+    ,
     className: ClassName.DRAG_ROW_FLOATING_INSERT_DOT_WRAPPER,
     contentEditable: false,
     key: `insert-dot-${index}`
@@ -212,11 +221,16 @@ const DragControlsComponent = ({
     index: index,
     localId: currentNodeLocalId,
     style: {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       gridColumn: '1 / span 3',
       gridRow: `${index + 1} / span 1`,
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       height: '100%',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       pointerEvents: 'auto',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       position: 'relative',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       left: "var(--ds-space-negative-100, -8px)"
     }
   }))), rowHandles());

package/dist/es2019/ui/TableFloatingControls/RowDropTarget/index.js

@@ -70,7 +70,9 @@ const RowDropTarget = ({
     });
   }, [index, localId]);
   return /*#__PURE__*/React.createElement("div", {
-    ref: dropTargetRef,
+    ref: dropTargetRef
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+    ,
     style: style,
     "data-drop-target-index": index,
     "data-drop-target-localid": localId,

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

@@ -75,79 +75,83 @@ export const TableFloatingControls = ({
   }
   const stickyTop = stickyHeader && stickyHeader.sticky && hasHeaderRow ? stickyHeader.top : undefined;
   const wrapperClassName = isDragAndDropEnabled ? ClassName.DRAG_ROW_CONTROLS_WRAPPER : ClassName.ROW_CONTROLS_WRAPPER;
-  return /*#__PURE__*/React.createElement("div", {
-    className: wrapperClassName
-  }, /*#__PURE__*/React.createElement("div", {
-    onMouseDown: e => !isDragAndDropEnabled && e.preventDefault()
-  }, isNumberColumnEnabled ? /*#__PURE__*/React.createElement(NumberColumn, {
-    editorView: editorView,
-    hoverRows: _hoverRows,
-    tableRef: tableRef,
-    tableActive: tableActive,
-    hoveredRows: hoveredRows,
-    hasHeaderRow: hasHeaderRow,
-    isInDanger: isInDanger,
-    isResizing: isResizing,
-    selectRow: _selectRow,
-    updateCellHoverLocation: updateCellHoverLocation,
-    stickyTop: stickyTop,
-    isDragAndDropEnabled: isDragAndDropEnabled
-  }) : null, tableActive && /*#__PURE__*/React.createElement(React.Fragment, null, isDragAndDropEnabled ? /*#__PURE__*/React.createElement(React.Fragment, null, getBooleanFF('platform.editor.table.use-shared-state-hook') ? /*#__PURE__*/React.createElement(DragCornerControlsWithSelection, {
-    editorView: editorView,
-    tableRef: tableRef,
-    isInDanger: isInDanger,
-    isResizing: isResizing,
-    api: api
-  }) : /*#__PURE__*/React.createElement(DragCornerControls, {
-    editorView: editorView,
-    tableRef: tableRef,
-    isInDanger: isInDanger,
-    isResizing: isResizing
-  }), /*#__PURE__*/React.createElement(DragControls, {
-    tableRef: tableRef,
-    tableNode: tableNode,
-    hoveredCell: hoveredCell,
-    isTableHovered: isTableHovered,
-    editorView: editorView,
-    tableActive: tableActive,
-    isInDanger: isInDanger,
-    isResizing: isResizing,
-    tableWidth: tableWrapperWidth,
-    hoverRows: _hoverRows,
-    selectRow: _selectRow,
-    selectRows: _selectRows,
-    updateCellHoverLocation: updateCellHoverLocation
-  })) : getBooleanFF('platform.editor.table.use-shared-state-hook') ? /*#__PURE__*/React.createElement(FloatingControlsWithSelection, {
-    editorView: editorView,
-    tableRef: tableRef,
-    isInDanger: isInDanger,
-    isResizing: isResizing,
-    isHeaderRowEnabled: isHeaderRowEnabled,
-    isHeaderColumnEnabled: isHeaderColumnEnabled,
-    hoveredRows: hoveredRows,
-    stickyTop: tableActive ? stickyTop : undefined,
-    tableActive: tableActive,
-    hoverRows: _hoverRows,
-    selectRow: _selectRow,
-    api: api
-  }) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CornerControls, {
-    editorView: editorView,
-    tableRef: tableRef,
-    isInDanger: isInDanger,
-    isResizing: isResizing,
-    isHeaderRowEnabled: isHeaderRowEnabled,
-    isHeaderColumnEnabled: isHeaderColumnEnabled,
-    hoveredRows: hoveredRows,
-    stickyTop: tableActive ? stickyTop : undefined
-  }), /*#__PURE__*/React.createElement(RowControls, {
-    editorView: editorView,
-    tableRef: tableRef,
-    hoverRows: _hoverRows,
-    hoveredRows: hoveredRows,
-    isInDanger: isInDanger,
-    isResizing: isResizing,
-    selectRow: _selectRow,
-    stickyTop: tableActive ? stickyTop : undefined
-  })))));
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+    React.createElement("div", {
+      className: wrapperClassName
+    }, /*#__PURE__*/React.createElement("div", {
+      onMouseDown: e => !isDragAndDropEnabled && e.preventDefault()
+    }, isNumberColumnEnabled ? /*#__PURE__*/React.createElement(NumberColumn, {
+      editorView: editorView,
+      hoverRows: _hoverRows,
+      tableRef: tableRef,
+      tableActive: tableActive,
+      hoveredRows: hoveredRows,
+      hasHeaderRow: hasHeaderRow,
+      isInDanger: isInDanger,
+      isResizing: isResizing,
+      selectRow: _selectRow,
+      updateCellHoverLocation: updateCellHoverLocation,
+      stickyTop: stickyTop,
+      isDragAndDropEnabled: isDragAndDropEnabled
+    }) : null, tableActive && /*#__PURE__*/React.createElement(React.Fragment, null, isDragAndDropEnabled ? /*#__PURE__*/React.createElement(React.Fragment, null, getBooleanFF('platform.editor.table.use-shared-state-hook') ? /*#__PURE__*/React.createElement(DragCornerControlsWithSelection, {
+      editorView: editorView,
+      tableRef: tableRef,
+      isInDanger: isInDanger,
+      isResizing: isResizing,
+      api: api
+    }) : /*#__PURE__*/React.createElement(DragCornerControls, {
+      editorView: editorView,
+      tableRef: tableRef,
+      isInDanger: isInDanger,
+      isResizing: isResizing
+    }), /*#__PURE__*/React.createElement(DragControls, {
+      tableRef: tableRef,
+      tableNode: tableNode,
+      hoveredCell: hoveredCell,
+      isTableHovered: isTableHovered,
+      editorView: editorView,
+      tableActive: tableActive,
+      isInDanger: isInDanger,
+      isResizing: isResizing,
+      tableWidth: tableWrapperWidth,
+      hoverRows: _hoverRows,
+      selectRow: _selectRow,
+      selectRows: _selectRows,
+      updateCellHoverLocation: updateCellHoverLocation
+    })) : getBooleanFF('platform.editor.table.use-shared-state-hook') ? /*#__PURE__*/React.createElement(FloatingControlsWithSelection, {
+      editorView: editorView,
+      tableRef: tableRef,
+      isInDanger: isInDanger,
+      isResizing: isResizing,
+      isHeaderRowEnabled: isHeaderRowEnabled,
+      isHeaderColumnEnabled: isHeaderColumnEnabled,
+      hoveredRows: hoveredRows,
+      stickyTop: tableActive ? stickyTop : undefined,
+      tableActive: tableActive,
+      hoverRows: _hoverRows,
+      selectRow: _selectRow,
+      api: api
+    }) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CornerControls, {
+      editorView: editorView,
+      tableRef: tableRef,
+      isInDanger: isInDanger,
+      isResizing: isResizing,
+      isHeaderRowEnabled: isHeaderRowEnabled,
+      isHeaderColumnEnabled: isHeaderColumnEnabled,
+      hoveredRows: hoveredRows,
+      stickyTop: tableActive ? stickyTop : undefined
+    }), /*#__PURE__*/React.createElement(RowControls, {
+      editorView: editorView,
+      tableRef: tableRef,
+      hoverRows: _hoverRows,
+      hoveredRows: hoveredRows,
+      isInDanger: isInDanger,
+      isResizing: isResizing,
+      selectRow: _selectRow,
+      stickyTop: tableActive ? stickyTop : undefined
+    })))))
+  );
 };
 export default TableFloatingControls;

package/dist/es2019/ui/icons/DragHandleDisabledIcon.js

@@ -6,7 +6,9 @@ export const DragHandleDisabledIcon = ({
   height: "16",
   viewBox: "0 0 24 16",
   fill: "none",
-  xmlns: "http://www.w3.org/2000/svg",
+  xmlns: "http://www.w3.org/2000/svg"
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+  ,
   style: style,
   "data-testid": "drag-icon-disabled"
 }, /*#__PURE__*/React.createElement("rect", {

package/dist/es2019/ui/icons/DragInMotionIcon.js

@@ -6,7 +6,9 @@ export const DragInMotionIcon = ({
   height: "20",
   viewBox: "0 0 28 20",
   fill: "none",
-  xmlns: "http://www.w3.org/2000/svg",
+  xmlns: "http://www.w3.org/2000/svg"
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+  ,
   style: style
 }, /*#__PURE__*/React.createElement("rect", {
   x: "1",

package/dist/es2019/ui/icons/MinimisedHandle.js

@@ -6,6 +6,7 @@ export const MinimisedHandleIcon = () => /*#__PURE__*/React.createElement("svg",
   height: "5",
   fill: "none"
 }, /*#__PURE__*/React.createElement("rect", {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
   className: ClassName.DRAG_HANDLE_MINIMISED,
   width: "24",
   height: "5",

package/dist/es2019/utils/guidelines.js

@@ -4,7 +4,10 @@ import { calculateDefaultSnappings, calculateDefaultTablePreserveSnappings } fro
 // NOTE: We have to take 1 pixel off every length due to the fact that the tbody is 1px smaller then the table container.
 // If we don't do this then the guidelines will not align correctly to the edge of the table
 export const defaultGuidelines = createFixedGuidelinesFromLengths([0, ...calculateDefaultSnappings(-1)]);
-export const defaultGuidelinesForPreserveTable = (editorContainerWidth, excludeInnerGuidelines = false) => {
-  const lengths = calculateDefaultTablePreserveSnappings(-1, editorContainerWidth, excludeInnerGuidelines);
+export const defaultGuidelinesForPreserveTable = (editorContainerWidth, exclude = {
+  innerGuidelines: false,
+  breakoutPoints: false
+}) => {
+  const lengths = calculateDefaultTablePreserveSnappings(-1, editorContainerWidth, exclude);
   return createFixedGuidelinesFromLengths(lengths, undefined, true);
 };

package/dist/es2019/utils/snapping.js

@@ -4,20 +4,29 @@ import { tableResizerWidth } from '../ui/consts';
 const numberOfLanesInDefaultLayoutWidth = 12;
 const calculateSubSnappingWidths = (totalLanes, totalWidth) => new Array(Math.round(totalLanes / 2) - 1).fill(totalWidth / totalLanes).map((v, i) => v * (i + 1) * 2);
 export const calculateDefaultSnappings = (lengthOffset = 0) => [...calculateSubSnappingWidths(numberOfLanesInDefaultLayoutWidth, akEditorDefaultLayoutWidth + lengthOffset), akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset, akEditorFullWidthLayoutWidth + lengthOffset];
-
 // FF TablePreserve for calculateDefaultSnappings
-export const calculateDefaultTablePreserveSnappings = (lengthOffset = 0, editorContainerWith = akEditorFullWidthLayoutWidth, excludeInnerGuidelines = false) => {
+export const calculateDefaultTablePreserveSnappings = (lengthOffset = 0, editorContainerWith = akEditorFullWidthLayoutWidth, exclude = {
+  innerGuidelines: false,
+  breakoutPoints: false
+}) => {
   const dynamicFullWidthLine = editorContainerWith - akEditorGutterPadding * 2 >= akEditorFullWidthLayoutWidth ? akEditorFullWidthLayoutWidth : editorContainerWith - akEditorGutterPadding * 2 - tableResizerWidth;
-  if (excludeInnerGuidelines) {
-    return [akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset, dynamicFullWidthLine - lengthOffset];
+  const guides = [dynamicFullWidthLine - lengthOffset];
+  if (!exclude.breakoutPoints) {
+    guides.unshift(akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset);
+  }
+  if (!exclude.innerGuidelines) {
+    guides.unshift(0, ...calculateSubSnappingWidths(numberOfLanesInDefaultLayoutWidth, akEditorDefaultLayoutWidth + lengthOffset));
   }
-  return [0, ...calculateSubSnappingWidths(numberOfLanesInDefaultLayoutWidth, akEditorDefaultLayoutWidth + lengthOffset), akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset, dynamicFullWidthLine - lengthOffset];
+  return guides;
 };
 export const defaultSnappingWidths = calculateDefaultSnappings();
 
 // FF TablePreserve for defaultSnappingWidths
-export const defaultTablePreserveSnappingWidths = (editorContainerWidth, excludeInnerGuidelines = false) => {
-  return editorContainerWidth - akEditorGutterPadding * 2 > akEditorFullWidthLayoutWidth ? calculateDefaultSnappings() : calculateDefaultTablePreserveSnappings(0, editorContainerWidth, excludeInnerGuidelines);
+export const defaultTablePreserveSnappingWidths = (editorContainerWidth, exclude = {
+  innerGuidelines: false,
+  breakoutPoints: false
+}) => {
+  return editorContainerWidth - akEditorGutterPadding * 2 > akEditorFullWidthLayoutWidth ? calculateDefaultSnappings() : calculateDefaultTablePreserveSnappings(0, editorContainerWidth, exclude);
 };
 
 /**

package/dist/esm/nodeviews/ExternalDropTargets.js

@@ -40,16 +40,20 @@ export var ExternalDropTargets = function ExternalDropTargets(_ref) {
   return /*#__PURE__*/React.createElement("div", {
     style: {
       width: getTableWrapperWidth(),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       overflow: 'hidden',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       position: 'absolute',
       // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
       top: "-".concat(dropTargetExtendedWidth - tableMarginTop, "px"),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       pointerEvents: 'auto',
       zIndex: "".concat(dropTargetsZIndex)
     },
     "data-testid": "table-floating-column-extended-drop-targets"
   }, /*#__PURE__*/React.createElement("div", {
     style: {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       display: 'flex',
       // move drop targets based on table wrapper scroll
       // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview

package/dist/esm/nodeviews/TableComponent.js

@@ -742,7 +742,9 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       var topStickyShadowPosition = isDragAndDropEnabled ? this.state.stickyHeader && this.state.stickyHeader.top + this.state.stickyHeader.padding + 2 : this.state.stickyHeader && this.state.stickyHeader.top + this.state.stickyHeader.padding + shadowPadding + 2;
       var _getEditorFeatureFlag3 = getEditorFeatureFlags(),
         stickyScrollbar = _getEditorFeatureFlag3.stickyScrollbar;
-      return /*#__PURE__*/React.createElement(TableContainer, {
+      return /*#__PURE__*/React.createElement(TableContainer
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      , {
         className: classnames(ClassName.TABLE_CONTAINER, (_classnames = {}, _defineProperty(_classnames, ClassName.WITH_CONTROLS, allowControls && tableActive), _defineProperty(_classnames, ClassName.TABLE_STICKY, this.state.stickyHeader && hasHeaderRow), _defineProperty(_classnames, ClassName.HOVERED_DELETE_BUTTON, isInDanger), _defineProperty(_classnames, ClassName.TABLE_SELECTED, isTableSelected(view.state.selection)), _classnames)),
         editorView: view,
         getPos: getPos,
@@ -758,9 +760,11 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
         isWholeTableInDanger: isWholeTableInDanger,
         isTableAlignmentEnabled: isTableAlignmentEnabled
       }, /*#__PURE__*/React.createElement("div", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         className: ClassName.TABLE_STICKY_SENTINEL_TOP,
         "data-testid": "sticky-sentinel-top"
       }), stickyScrollbar && /*#__PURE__*/React.createElement("div", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         className: ClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_TOP,
         "data-testid": "sticky-scrollbar-sentinel-top"
       }), allowControls && rowControls, isDragAndDropEnabled && /*#__PURE__*/React.createElement(ExternalDropTargets, {
@@ -775,10 +779,15 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           return ((_this4$wrapper3 = _this4.wrapper) === null || _this4$wrapper3 === void 0 ? void 0 : _this4$wrapper3.clientWidth) || 760;
         }
       }), /*#__PURE__*/React.createElement("div", {
-        contentEditable: false,
-        style: shadowStyle(showBeforeShadow),
+        contentEditable: false
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+        ,
+        style: shadowStyle(showBeforeShadow)
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+        ,
         className: ClassName.TABLE_LEFT_SHADOW
       }), this.state.stickyHeader && /*#__PURE__*/React.createElement("div", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         className: "".concat(ClassName.TABLE_LEFT_SHADOW, " ").concat(ClassName.TABLE_STICKY_SHADOW),
         style: {
           visibility: showBeforeShadow && hasHeaderRow ? 'visible' : 'hidden',
@@ -786,6 +795,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           paddingBottom: "".concat(isDragAndDropEnabled && "var(--ds-space-025, 2px)")
         }
       }), /*#__PURE__*/React.createElement("div", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         className: classnames(ClassName.TABLE_NODE_WRAPPER),
         ref: function ref(elem) {
           _this4.wrapper = elem;
@@ -800,10 +810,13 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           }
         }
       }, allowControls && colControls), stickyScrollbar && /*#__PURE__*/React.createElement("div", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         className: ClassName.TABLE_STICKY_SCROLLBAR_CONTAINER,
         style: {
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
           height: "var(--ds-space-250, 20px)",
           // MAX_BROWSER_SCROLLBAR_HEIGHT
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
           display: 'none',
           // prevent unwanted scroll during table resize without removing scrollbar container from the dom
           width: isResizing ? "var(--ds-space-0, 0px)" : '100%'
@@ -811,18 +824,26 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/React.createElement("div", {
         style: {
           width: tableRef === null || tableRef === void 0 ? void 0 : tableRef.clientWidth,
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
           height: '100%'
         }
       })), /*#__PURE__*/React.createElement("div", {
-        contentEditable: false,
-        style: shadowStyle(showAfterShadow),
+        contentEditable: false
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+        ,
+        style: shadowStyle(showAfterShadow)
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+        ,
         className: ClassName.TABLE_RIGHT_SHADOW
       }), this.state.stickyHeader && /*#__PURE__*/React.createElement("div", {
         style: {
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
           position: 'absolute',
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
           right: "var(--ds-space-400, 32px)" // tableOverflowShadowWidthWide
         }
       }, /*#__PURE__*/React.createElement("div", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         className: "".concat(ClassName.TABLE_RIGHT_SHADOW, " ").concat(ClassName.TABLE_STICKY_SHADOW),
         style: {
           visibility: showAfterShadow && hasHeaderRow ? 'visible' : 'hidden',
@@ -830,9 +851,11 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
           paddingBottom: "".concat(isDragAndDropEnabled && "var(--ds-space-025, 2px)")
         }
       })), /*#__PURE__*/React.createElement("div", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         className: ClassName.TABLE_STICKY_SENTINEL_BOTTOM,
         "data-testid": "sticky-sentinel-bottom"
       }), stickyScrollbar && /*#__PURE__*/React.createElement("div", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
         className: ClassName.TABLE_STICKY_SCROLLBAR_SENTINEL_BOTTOM,
         "data-testid": "sticky-scrollbar-sentinel-bottom"
       }));

package/dist/esm/nodeviews/TableContainer.js

@@ -13,8 +13,12 @@ export var InnerContainer = /*#__PURE__*/forwardRef(function (_ref, ref) {
     node = _ref.node,
     children = _ref.children;
   return /*#__PURE__*/React.createElement("div", {
-    ref: ref,
-    style: style,
+    ref: ref
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+    ,
+    style: style
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+    ,
     className: className,
     "data-number-column": node.attrs.isNumberColumnEnabled,
     "data-layout": node.attrs.layout,
@@ -36,10 +40,14 @@ var AlignmentTableContainer = function AlignmentTableContainer(_ref2) {
   var style = useMemo(function () {
     return alignment === 'align-start' ? leftAlignStyle : centerAlignStyle;
   }, [alignment]);
-  return /*#__PURE__*/React.createElement("div", {
-    "data-testid": "table-alignment-container",
-    style: style
-  }, children);
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+    React.createElement("div", {
+      "data-testid": "table-alignment-container",
+      style: style
+    }, children)
+  );
 };
 var AlignmentTableContainerWrapper = function AlignmentTableContainerWrapper(_ref3) {
   var isTableAlignmentEnabled = _ref3.isTableAlignmentEnabled,
@@ -49,7 +57,9 @@ var AlignmentTableContainerWrapper = function AlignmentTableContainerWrapper(_re
     return /*#__PURE__*/React.createElement("div", {
       "data-testid": "table-alignment-container",
       style: {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         display: 'flex',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         justifyContent: 'center'
       }
     }, children);
@@ -171,12 +181,18 @@ export var ResizableTableContainer = /*#__PURE__*/React.memo(function (_ref4) {
       width: tableWidthRef.current,
       height: resizing ? updateContainerHeight(tableWrapperHeight !== null && tableWrapperHeight !== void 0 ? tableWrapperHeight : 'auto') : 'auto',
       position: isLivePageViewMode ? 'relative' : 'unset'
-    },
+    }
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+    ,
     className: ClassName.TABLE_RESIZER_CONTAINER,
     ref: containerRef
-  }, isLivePageViewMode ? /*#__PURE__*/React.createElement(InnerContainer, {
+  }, isLivePageViewMode ? /*#__PURE__*/React.createElement(InnerContainer
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+  , {
     className: className,
-    node: node,
+    node: node
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+    ,
     style: {
       width: 'inherit'
     }
@@ -204,7 +220,9 @@ export var TableContainer = function TableContainer(_ref5) {
     isTableScalingEnabled = _ref5.isTableScalingEnabled,
     isTableAlignmentEnabled = _ref5.isTableAlignmentEnabled;
   if (isTableResizingEnabled && !isNested) {
-    return /*#__PURE__*/React.createElement(ResizableTableContainer, {
+    return /*#__PURE__*/React.createElement(ResizableTableContainer
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+    , {
       className: className,
       node: node,
       containerWidth: editorWidth,
@@ -221,11 +239,14 @@ export var TableContainer = function TableContainer(_ref5) {
     }, children);
   }
   return /*#__PURE__*/React.createElement(InnerContainer, {
-    node: node,
+    node: node
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+    ,
     className: classNames(className, {
       'less-padding': editorWidth < akEditorMobileBreakoutPoint && !isNested
     }),
     style: {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       width: 'inherit'
     }
   }, children);