@atlaskit/dynamic-table 14.6.0 → 14.7.1

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/dynamic-table",
-	"version": "14.6.0",
+	"version": "14.7.1",
 	"sideEffects": false
 }

package/dist/esm/components/{Body.js → body.js}

@@ -9,8 +9,8 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 import React from 'react';
-import withSortedPageRows from '../hoc/withSortedPageRows';
-import TableRow from './TableRow';
+import withSortedPageRows from '../hoc/with-sorted-page-rows';
+import TableRow from './table-row';
 
 var Body = /*#__PURE__*/function (_React$Component) {
   _inherits(Body, _React$Component);

package/dist/esm/components/{LoadingContainerAdvanced.js → loading-container-advanced.js}

@@ -11,11 +11,12 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
+/* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
 import React from 'react';
 import { findDOMNode } from 'react-dom';
 import Spinner from '@atlaskit/spinner';
 import { LARGE, LOADING_CONTENTS_OPACITY } from '../internal/constants';
-import { Container, SpinnerBackdrop, SpinnerContainer } from '../styled/LoadingContainerAdvanced';
+import { Container, SpinnerBackdrop, SpinnerContainer } from '../styled/loading-container-advanced';
 
 // there is a bug with findDOMNode and Suspense in React < 16.9: https://github.com/facebook/react/issues/14188
 var safeFindDOMNode = function safeFindDOMNode(component) {

package/dist/esm/components/{LoadingContainer.js → loading-container.js}

@@ -12,7 +12,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 import React from 'react';
 import Spinner from '@atlaskit/spinner';
 import { LARGE, LOADING_CONTENTS_OPACITY } from '../internal/constants';
-import { Container, ContentsContainer, SpinnerContainer } from '../styled/LoadingContainer';
+import { Container, ContentsContainer, SpinnerContainer } from '../styled/loading-container';
 
 var LoadingContainer = /*#__PURE__*/function (_React$Component) {
   _inherits(LoadingContainer, _React$Component);

package/dist/esm/components/rankable/{Body.js → body.js}

@@ -13,8 +13,8 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 import React from 'react';
 import { DragDropContext, Droppable } from 'react-beautiful-dnd';
-import withSortedPageRows from '../../hoc/withSortedPageRows';
-import TableRow from './TableRow';
+import withSortedPageRows from '../../hoc/with-sorted-page-rows';
+import TableRow from './table-row';
 
 // computes destination of ranking
 // - if drag was cancelled returns undefined

package/dist/esm/components/rankable/{TableCell.js → table-cell.js}

@@ -12,9 +12,9 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 import React from 'react';
-import withDimensions from '../../hoc/withDimensions';
+import withDimensions from '../../hoc/with-dimensions';
 import { inlineStylesIfRanking } from '../../internal/helpers';
-import { RankableTableBodyCell } from '../../styled/rankable/TableCell';
+import { RankableTableBodyCell } from '../../styled/rankable/table-cell';
 export var RankableTableCell = /*#__PURE__*/function (_React$Component) {
   _inherits(RankableTableCell, _React$Component);
 

package/dist/esm/components/rankable/{TableHeadCell.js → table-head-cell.js}

@@ -12,9 +12,9 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 import React from 'react';
-import withDimensions from '../../hoc/withDimensions';
+import withDimensions from '../../hoc/with-dimensions';
 import { inlineStylesIfRanking } from '../../internal/helpers';
-import HeadCell from '../TableHeadCell';
+import HeadCell from '../table-head-cell';
 
 var RankableTableHeadCell = /*#__PURE__*/function (_React$Component) {
   _inherits(RankableTableHeadCell, _React$Component);

package/dist/esm/components/rankable/{TableRow.js → table-row.js}

@@ -19,10 +19,10 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 import React from 'react';
 import { Draggable } from 'react-beautiful-dnd';
-import withDimensions from '../../hoc/withDimensions';
+import withDimensions from '../../hoc/with-dimensions';
 import { inlineStylesIfRanking } from '../../internal/helpers';
-import { RankableTableBodyRow } from '../../styled/rankable/TableRow';
-import TableCell from './TableCell';
+import { RankableTableBodyRow } from '../../styled/rankable/table-row';
+import TableCell from './table-cell';
 export var RankableTableRow = /*#__PURE__*/function (_React$Component) {
   _inherits(RankableTableRow, _React$Component);
 

package/dist/esm/components/{Stateful.js → stateful.js}

@@ -11,8 +11,9 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 import React from 'react';
+import noop from '@atlaskit/ds-lib/noop';
 import { reorderRows } from '../internal/helpers';
-import DynamicTableStateless from './Stateless';
+import DynamicTableStateless from './stateless';
 
 /**
  * __Dynamic Table__
@@ -198,8 +199,8 @@ _defineProperty(DynamicTable, "defaultProps", {
   isLoading: false,
   isFixedSize: false,
   isRankable: false,
-  onSetPage: function onSetPage() {},
-  onSort: function onSort() {},
+  onSetPage: noop,
+  onSort: noop,
   rowsPerPage: Infinity
 });
 

package/dist/esm/components/{Stateless.js → stateless.js}

@@ -13,18 +13,19 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 import React from 'react';
 import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-next';
+import noop from '@atlaskit/ds-lib/noop';
 import { ASC, DESC, LARGE, SMALL } from '../internal/constants';
 import { assertIsSortable, getPageRows, validateSortKey } from '../internal/helpers';
-import { Caption, PaginationWrapper, Table } from '../styled/DynamicTable';
-import { EmptyViewContainer, EmptyViewWithFixedHeight } from '../styled/EmptyBody';
-import Body from './Body';
-import LoadingContainer from './LoadingContainer';
-import LoadingContainerAdvanced from './LoadingContainerAdvanced';
+import { Caption, PaginationWrapper, Table } from '../styled/dynamic-table';
+import { EmptyViewContainer, EmptyViewWithFixedHeight } from '../styled/empty-body';
+import Body from './body';
+import LoadingContainer from './loading-container';
+import LoadingContainerAdvanced from './loading-container-advanced';
 import ManagedPagination from './managed-pagination';
-import RankableTableBody from './rankable/Body';
-import TableHead from './TableHead';
+import RankableTableBody from './rankable/body';
+import TableHead from './table-head';
 var packageName = "@atlaskit/dynamic-table";
-var packageVersion = "14.6.0";
+var packageVersion = "14.7.1";
 
 function toggleSortOrder(currentSortOrder) {
   switch (currentSortOrder) {
@@ -209,6 +210,9 @@ var DynamicTable = /*#__PURE__*/function (_React$Component) {
         totalPages = rowsLength && rowsPerPage ? Math.ceil(rowsLength / rowsPerPage) : 0;
       }
 
+      totalPages = totalPages < 1 ? 1 : totalPages;
+      var getPageNumber = page > totalPages ? totalPages : page; // page! required, because typescript can't yet see defaultProps to know that this won't be undefined
+
       var bodyProps = {
         highlightedRowIndex: highlightedRowIndex,
         rows: rows,
@@ -216,7 +220,7 @@ var DynamicTable = /*#__PURE__*/function (_React$Component) {
         sortKey: sortKey,
         sortOrder: sortOrder,
         rowsPerPage: rowsPerPage,
-        page: page,
+        page: getPageNumber,
         isFixedSize: isFixedSize || false,
         onPageRowsUpdate: onPageRowsUpdate,
         isTotalPagesControlledExternally: isTotalPagesControlledExternally,
@@ -239,7 +243,8 @@ var DynamicTable = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/React.createElement(Table, {
         isFixedSize: isFixedSize,
         "data-testid": testId && "".concat(testId, "--table"),
-        "aria-label": label
+        "aria-label": label,
+        hasDataRow: rowsExist
       }, !!caption && /*#__PURE__*/React.createElement(Caption, null, caption), head && /*#__PURE__*/React.createElement(TableHead, {
         head: head,
         onSort: this.onSort,
@@ -253,8 +258,11 @@ var DynamicTable = /*#__PURE__*/function (_React$Component) {
         onRankStart: this.onRankStart,
         onRankEnd: this.onRankEnd,
         isRankingDisabled: isRankingDisabled || isLoading || false
-      })) : /*#__PURE__*/React.createElement(Body, bodyProps)))), !totalPages ? null : /*#__PURE__*/React.createElement(PaginationWrapper, null, /*#__PURE__*/React.createElement(ManagedPagination, {
-        value: page,
+      })) : /*#__PURE__*/React.createElement(Body, bodyProps)))), totalPages <= 1 ? null :
+      /*#__PURE__*/
+      // only show pagination if there's MORE than 1 page
+      React.createElement(PaginationWrapper, null, /*#__PURE__*/React.createElement(ManagedPagination, {
+        value: getPageNumber,
         onChange: this.onSetPage,
         total: totalPages,
         i18n: paginationi18n,
@@ -274,13 +282,13 @@ _defineProperty(DynamicTable, "defaultProps", {
   isLoading: false,
   isFixedSize: false,
   rowsPerPage: Infinity,
-  onSetPage: function onSetPage() {},
-  onSort: function onSort() {},
+  onSetPage: noop,
+  onSort: noop,
   page: 1,
   isRankable: false,
   isRankingDisabled: false,
-  onRankStart: function onRankStart() {},
-  onRankEnd: function onRankEnd() {},
+  onRankStart: noop,
+  onRankEnd: noop,
   paginationi18n: {
     prev: 'Prev',
     next: 'Next',

package/dist/esm/components/{TableHeadCell.js → table-head-cell.js}

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["content", "inlineStyles", "testId", "isRanking", "innerRef", "isSortable"];
 import React from 'react';
-import { HeadCell } from '../styled/TableHead';
+import { HeadCell } from '../styled/table-head';
 
 var TableHeadCell = function TableHeadCell(_ref) {
   var content = _ref.content,
@@ -17,11 +17,13 @@ var TableHeadCell = function TableHeadCell(_ref) {
     style: inlineStyles,
     "data-testid": testId && "".concat(testId, "--head--cell"),
     ref: typeof innerRef !== 'string' ? innerRef : null // string refs must be discarded as LegacyRefs are not compatible with FC forwardRefs
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
 
   }, rest, {
     tabIndex: isSortable ? 0 : undefined,
     isSortable: isSortable
   }), /*#__PURE__*/React.createElement("span", null, content));
-};
+}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 
 export default TableHeadCell;

package/dist/esm/components/{TableHead.js → table-head.js}

@@ -16,9 +16,9 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 import React from 'react';
 import { validateSortKey } from '../internal/helpers';
-import { Head } from '../styled/TableHead';
-import RankableHeadCell from './rankable/TableHeadCell';
-import HeadCell from './TableHeadCell';
+import { Head } from '../styled/table-head';
+import RankableHeadCell from './rankable/table-head-cell';
+import HeadCell from './table-head-cell';
 
 var TableHead = /*#__PURE__*/function (_React$Component) {
   _inherits(TableHead, _React$Component);
@@ -104,6 +104,7 @@ var TableHead = /*#__PURE__*/function (_React$Component) {
   }]);
 
   return TableHead;
-}(React.Component);
+}(React.Component); // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 
 export default TableHead;

package/dist/esm/components/{TableRow.js → table-row.js}

@@ -3,8 +3,8 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["cells"],
     _excluded2 = ["content"];
 import React from 'react';
-import { TableBodyCell } from '../styled/TableCell';
-import { TableBodyRow } from '../styled/TableRow';
+import { TableBodyCell } from '../styled/table-cell';
+import { TableBodyRow } from '../styled/table-row';
 
 var Row = function Row(_ref) {
   var row = _ref.row,
@@ -42,6 +42,7 @@ var Row = function Row(_ref) {
       width: width
     }), content);
   }));
-};
+}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 
 export default Row;

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-export { default } from './components/Stateful';
-export { default as DynamicTableStateless } from './components/Stateless';
+export { default } from './components/stateful';
+export { default as DynamicTableStateless } from './components/stateless';

package/dist/esm/styled/constants.js

@@ -15,11 +15,11 @@ export var overflowTruncateStyles = css({
 });
 export var getTruncationStyleVars = function getTruncationStyleVars(_ref) {
   var width = _ref.width;
-  return _defineProperty({}, CSS_VAR_WIDTH, typeof width !== 'undefined' ? "".concat(width, "%") : undefined);
+  return typeof width !== 'undefined' ? _defineProperty({}, CSS_VAR_WIDTH, "".concat(width, "%")) : undefined;
 };
 export var cellStyles = css({
-  border: 'none',
   padding: "".concat(gridSize / 2, "px ").concat(gridSize, "px"),
+  border: 'none',
   textAlign: 'left',
   '&:first-of-type': {
     paddingLeft: 0

package/dist/esm/styled/{DynamicTable.js → dynamic-table.js}

@@ -1,14 +1,15 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["isFixedSize", "children"];
+var _excluded = ["isFixedSize", "hasDataRow", "children"];
+
+/* eslint-disable @repo/internal/react/require-jsdoc */
 
 /** @jsx jsx */
 import { forwardRef } from 'react';
 import { css, jsx } from '@emotion/core';
-import { useGlobalTheme } from '@atlaskit/theme/components';
 import { gridSize as getGridSize } from '@atlaskit/theme/constants';
-import { row } from '../theme';
+import { row, tableBorder } from '../theme';
 var gridSize = getGridSize();
 // CSS vars for table row
 // these are declared here to avoid being re-declared in each table row
@@ -22,46 +23,42 @@ var fixedSizeTableStyles = css({
   tableLayout: 'fixed'
 });
 var tableStyles = css({
-  borderCollapse: 'collapse',
-  width: '100%'
+  width: '100%',
+  borderCollapse: 'separate',
+  borderSpacing: '0px'
+});
+var bodyBorder = css({
+  borderBottom: "2px solid ".concat(tableBorder.borderColor)
 });
 export var Table = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _ref2;
 
   var isFixedSize = _ref.isFixedSize,
+      hasDataRow = _ref.hasDataRow,
       children = _ref.children,
       rest = _objectWithoutProperties(_ref, _excluded);
 
-  var theme = useGlobalTheme();
   return jsx("table", _extends({
-    style: (_ref2 = {}, _defineProperty(_ref2, tableRowCSSVars.CSS_VAR_HOVER_BACKGROUND, row.hoverBackground({
-      theme: theme
-    })), _defineProperty(_ref2, tableRowCSSVars.CSS_VAR_HIGHLIGHTED_BACKGROUND, row.highlightedBackground({
-      theme: theme
-    })), _defineProperty(_ref2, tableRowCSSVars.CSS_VAR_HOVER_HIGHLIGHTED_BACKGROUND, row.hoverHighlightedBackground({
-      theme: theme
-    })), _defineProperty(_ref2, tableRowCSSVars.CSS_VAR_ROW_FOCUS_OUTLINE, row.focusOutline({
-      theme: theme
-    })), _ref2),
-    css: [tableStyles, isFixedSize && fixedSizeTableStyles],
+    style: (_ref2 = {}, _defineProperty(_ref2, tableRowCSSVars.CSS_VAR_HOVER_BACKGROUND, row.hoverBackground), _defineProperty(_ref2, tableRowCSSVars.CSS_VAR_HIGHLIGHTED_BACKGROUND, row.highlightedBackground), _defineProperty(_ref2, tableRowCSSVars.CSS_VAR_HOVER_HIGHLIGHTED_BACKGROUND, row.hoverHighlightedBackground), _defineProperty(_ref2, tableRowCSSVars.CSS_VAR_ROW_FOCUS_OUTLINE, row.focusOutline), _ref2),
+    css: [tableStyles, isFixedSize && fixedSizeTableStyles, hasDataRow && bodyBorder],
     ref: ref
   }, rest), children);
 });
 var captionStyles = css({
+  marginTop: "".concat(gridSize * 3.5, "px"),
+  marginBottom: "".concat(gridSize, "px"),
   fontSize: '1.42857143em',
-
-  /* there is a bug in Safari: if element which creates a new stacking context
-     is a child of a table, table caption re-renders in bad wrong position
-     https://stackoverflow.com/questions/44009186/safari-bug-translating-table-row-group-using-gsap-make-caption-jump-to-bottom
-  */
-  willChange: 'transform',
   fontStyle: 'inherit',
   fontWeight: 500,
   letterSpacing: '-0.008em',
   lineHeight: 1.2,
-  marginBottom: "".concat(gridSize, "px"),
-  marginTop: "".concat(gridSize * 3.5, "px"),
-  textAlign: 'left'
+  textAlign: 'left',
+
+  /* there is a bug in Safari: if element which creates a new stacking context
+    is a child of a table, table caption re-renders in bad wrong position
+    https://stackoverflow.com/questions/44009186/safari-bug-translating-table-row-group-using-gsap-make-caption-jump-to-bottom
+  */
+  willChange: 'transform'
 });
 export var Caption = function Caption(_ref3) {
   var children = _ref3.children;

package/dist/esm/styled/{EmptyBody.js → empty-body.js}

@@ -1,3 +1,5 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
 /** @jsx jsx */
 import { css, jsx } from '@emotion/core';
 import { gridSize } from '@atlaskit/theme/constants';
@@ -11,10 +13,10 @@ export var EmptyViewWithFixedHeight = function EmptyViewWithFixedHeight(_ref) {
   }, children);
 };
 var emptyViewContainerStyles = css({
+  width: '50%',
   margin: 'auto',
   padding: '10px',
-  textAlign: 'center',
-  width: '50%'
+  textAlign: 'center'
 });
 export var EmptyViewContainer = function EmptyViewContainer(_ref2) {
   var children = _ref2.children;

package/dist/esm/styled/{LoadingContainerAdvanced.js → loading-container-advanced.js}

@@ -1,5 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
 /** @jsx jsx */
 import { forwardRef } from 'react';
 import { css, jsx } from '@emotion/core';
@@ -9,20 +11,22 @@ var containerStyles = css({
   position: 'relative'
 });
 export var Container = function Container(props) {
-  return jsx("div", _extends({
-    css: containerStyles
-  }, props));
+  return (// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+    jsx("div", _extends({
+      css: containerStyles
+    }, props))
+  );
 };
 var spinnerBackdropStyles = css({
-  pointerEvents: 'none',
+  display: 'flex',
   position: 'absolute',
   top: 0,
   right: 0,
   bottom: 0,
   left: 0,
-  display: 'flex',
   alignItems: 'center',
-  justifyContent: 'center'
+  justifyContent: 'center',
+  pointerEvents: 'none'
 });
 export var SpinnerBackdrop = function SpinnerBackdrop(_ref) {
   var children = _ref.children;

package/dist/esm/styled/{LoadingContainer.js → loading-container.js}

@@ -1,5 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
 /** @jsx jsx */
 import { css, jsx } from '@emotion/core';
 var CSS_VAR_CONTENTS_OPACITY = '--contents-opacity';
@@ -13,8 +15,8 @@ export var Container = function Container(_ref) {
   }, children);
 };
 var contentsContainerStyles = css({
-  pointerEvents: 'none',
-  opacity: "var(".concat(CSS_VAR_CONTENTS_OPACITY, ")")
+  opacity: "var(".concat(CSS_VAR_CONTENTS_OPACITY, ")"),
+  pointerEvents: 'none'
 });
 export var ContentsContainer = function ContentsContainer(_ref2) {
   var contentsOpacity = _ref2.contentsOpacity,
@@ -25,12 +27,12 @@ export var ContentsContainer = function ContentsContainer(_ref2) {
   }, children);
 };
 var spinnerContainerStyles = css({
+  display: 'flex',
   position: 'absolute',
   top: 0,
   right: 0,
   bottom: 0,
   left: 0,
-  display: 'flex',
   alignItems: 'center',
   justifyContent: 'center'
 });

package/dist/esm/styled/rankable/{RowPlaceholder.js → row-placeholder.js}

@@ -4,9 +4,12 @@ import _extends from "@babel/runtime/helpers/extends";
 import { css, jsx } from '@emotion/core';
 var rowPlaceholderStyles = css({
   padding: 0
-});
+}); // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 export var RowPlaceholderCell = function RowPlaceholderCell(props) {
-  return jsx("td", _extends({
-    css: rowPlaceholderStyles
-  }, props));
+  return (// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+    jsx("td", _extends({
+      css: rowPlaceholderStyles
+    }, props))
+  );
 };

package/dist/esm/styled/rankable/{TableCell.js → table-cell.js}

@@ -4,17 +4,19 @@ var _excluded = ["isRanking", "innerRef"];
 
 /** @jsx jsx */
 import { css, jsx } from '@emotion/core';
-import { TableBodyCell } from '../TableCell';
+import { TableBodyCell } from '../table-cell';
 var rankingStyles = css({
   boxSizing: 'border-box'
-});
+}); // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 export var RankableTableBodyCell = function RankableTableBodyCell(_ref) {
   var isRanking = _ref.isRanking,
       innerRef = _ref.innerRef,
       props = _objectWithoutProperties(_ref, _excluded);
 
   return jsx(TableBodyCell, _extends({
-    css: isRanking && rankingStyles
+    css: isRanking && rankingStyles // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+
   }, props, {
     innerRef: innerRef
   }));

package/dist/esm/styled/rankable/{TableRow.js → table-row.js}

@@ -6,7 +6,7 @@ var _excluded = ["isRanking", "isRankingItem"];
 import { forwardRef } from 'react';
 import { css, jsx } from '@emotion/core';
 import { B100, N20, N50A, N60A } from '@atlaskit/theme/colors';
-import { TableBodyRow } from '../TableRow';
+import { TableBodyRow } from '../table-row';
 var rankingStyles = css({
   display: 'block'
 });
@@ -18,16 +18,17 @@ var elevationStyle = "var(--ds-shadow-overlay, ".concat("0 20px 32px -8px ".conc
 
 var rankingItemStyles = css({
   backgroundColor: "var(--ds-background-neutral, ".concat(N20, ")"),
-  boxShadow: elevationStyle,
-  borderRadius: '2px'
+  borderRadius: '2px',
+  boxShadow: elevationStyle
 });
 var draggableStyles = css({
+  outlineWidth: '2px',
   '&:focus': {
-    outlineStyle: 'solid',
-    outlineColor: "var(--ds-border-focused, ".concat(B100, ")")
-  },
-  outlineWidth: '2px'
-});
+    outlineColor: "var(--ds-border-focused, ".concat(B100, ")"),
+    outlineStyle: 'solid'
+  }
+}); // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 export var RankableTableBodyRow = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var isRanking = _ref.isRanking,
       isRankingItem = _ref.isRankingItem,

package/dist/esm/styled/{TableCell.js → table-cell.js}

@@ -4,7 +4,8 @@ var _excluded = ["width", "isFixedSize", "shouldTruncate", "innerRef"];
 
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
-import { cellStyles, fixedSizeTruncateStyles, getTruncationStyleVars, overflowTruncateStyles, truncationWidthStyles } from './constants';
+import { cellStyles, fixedSizeTruncateStyles, getTruncationStyleVars, overflowTruncateStyles, truncationWidthStyles } from './constants'; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 export var TableBodyCell = function TableBodyCell(_ref) {
   var width = _ref.width,
       isFixedSize = _ref.isFixedSize,
@@ -19,6 +20,7 @@ export var TableBodyCell = function TableBodyCell(_ref) {
     css: [truncationWidthStyles, isFixedSize && shouldTruncate && fixedSizeTruncateStyles, isFixedSize && overflowTruncateStyles, cellStyles] // HOC withDimensions complains about the types but it is working fine
     // @ts-ignore
     ,
-    ref: innerRef
+    ref: innerRef // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+
   }, props));
 };