@atlaskit/dynamic-table 14.6.1 → 14.8.0

package/dist/es2019/styled/constants.js

@@ -1,4 +1,4 @@
-import { css } from '@emotion/core';
+import { css } from '@emotion/react';
 import { gridSize as getGridSize } from '@atlaskit/theme/constants';
 const CSS_VAR_WIDTH = '--local-dynamic-table-width';
 const gridSize = getGridSize();
@@ -14,14 +14,12 @@ export const overflowTruncateStyles = css({
 });
 export const getTruncationStyleVars = ({
   width
-}) => {
-  return {
-    [CSS_VAR_WIDTH]: typeof width !== 'undefined' ? `${width}%` : undefined
-  };
-};
+}) => typeof width !== 'undefined' ? {
+  [CSS_VAR_WIDTH]: `${width}%`
+} : undefined;
 export const cellStyles = css({
-  border: 'none',
   padding: `${gridSize / 2}px ${gridSize}px`,
+  border: 'none',
   textAlign: 'left',
   '&:first-of-type': {
     paddingLeft: 0

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

@@ -1,11 +1,12 @@
 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';
-import { useGlobalTheme } from '@atlaskit/theme/components';
+import { css, jsx } from '@emotion/react';
 import { gridSize as getGridSize } from '@atlaskit/theme/constants';
-import { row } from '../theme';
+import { row, tableBorder } from '../theme';
 const gridSize = getGridSize();
 // CSS vars for table row
 // these are declared here to avoid being re-declared in each table row
@@ -19,49 +20,45 @@ const fixedSizeTableStyles = css({
   tableLayout: 'fixed'
 });
 const tableStyles = css({
-  borderCollapse: 'collapse',
-  width: '100%'
+  width: '100%',
+  borderCollapse: 'separate',
+  borderSpacing: '0px'
+});
+const bodyBorder = css({
+  borderBottom: `2px solid ${tableBorder.borderColor}`
 });
 export const Table = /*#__PURE__*/forwardRef(({
   isFixedSize,
+  hasDataRow,
   children,
   ...rest
 }, ref) => {
-  const theme = useGlobalTheme();
   return jsx("table", _extends({
     style: {
-      [tableRowCSSVars.CSS_VAR_HOVER_BACKGROUND]: row.hoverBackground({
-        theme
-      }),
-      [tableRowCSSVars.CSS_VAR_HIGHLIGHTED_BACKGROUND]: row.highlightedBackground({
-        theme
-      }),
-      [tableRowCSSVars.CSS_VAR_HOVER_HIGHLIGHTED_BACKGROUND]: row.hoverHighlightedBackground({
-        theme
-      }),
-      [tableRowCSSVars.CSS_VAR_ROW_FOCUS_OUTLINE]: row.focusOutline({
-        theme
-      })
+      [tableRowCSSVars.CSS_VAR_HOVER_BACKGROUND]: row.hoverBackground,
+      [tableRowCSSVars.CSS_VAR_HIGHLIGHTED_BACKGROUND]: row.highlightedBackground,
+      [tableRowCSSVars.CSS_VAR_HOVER_HIGHLIGHTED_BACKGROUND]: row.hoverHighlightedBackground,
+      [tableRowCSSVars.CSS_VAR_ROW_FOCUS_OUTLINE]: row.focusOutline
     },
-    css: [tableStyles, isFixedSize && fixedSizeTableStyles],
+    css: [tableStyles, isFixedSize && fixedSizeTableStyles, hasDataRow && bodyBorder],
     ref: ref
   }, rest), children);
 });
 const captionStyles = css({
+  marginTop: `${gridSize * 3.5}px`,
+  marginBottom: `${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: `${gridSize}px`,
-  marginTop: `${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 const Caption = ({
   children

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

@@ -1,5 +1,7 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
 /** @jsx jsx */
-import { css, jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import { gridSize } from '@atlaskit/theme/constants';
 const fixedHeightStyles = css({
   height: `${gridSize() * 18}px`
@@ -10,10 +12,10 @@ export const EmptyViewWithFixedHeight = ({
   css: fixedHeightStyles
 }, children);
 const emptyViewContainerStyles = css({
+  width: '50%',
   margin: 'auto',
   padding: '10px',
-  textAlign: 'center',
-  width: '50%'
+  textAlign: 'center'
 });
 export const EmptyViewContainer = ({
   children

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

@@ -1,26 +1,29 @@
 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';
+import { css, jsx } from '@emotion/react';
 import { gridSize } from '@atlaskit/theme/constants';
 const containerStyles = css({
   marginBottom: `${gridSize() * 3}px`,
   position: 'relative'
 });
-export const Container = props => jsx("div", _extends({
+export const Container = props => // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+jsx("div", _extends({
   css: containerStyles
 }, props));
 const 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 const SpinnerBackdrop = ({
   children

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

@@ -1,5 +1,7 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
 /** @jsx jsx */
-import { css, jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 const CSS_VAR_CONTENTS_OPACITY = '--contents-opacity';
 const containerStyles = css({
   position: 'relative'
@@ -10,8 +12,8 @@ export const Container = ({
   css: containerStyles
 }, children);
 const contentsContainerStyles = css({
-  pointerEvents: 'none',
-  opacity: `var(${CSS_VAR_CONTENTS_OPACITY})`
+  opacity: `var(${CSS_VAR_CONTENTS_OPACITY})`,
+  pointerEvents: 'none'
 });
 export const ContentsContainer = ({
   contentsOpacity,
@@ -23,12 +25,12 @@ export const ContentsContainer = ({
   css: [contentsContainerStyles]
 }, children);
 const spinnerContainerStyles = css({
+  display: 'flex',
   position: 'absolute',
   top: 0,
   right: 0,
   bottom: 0,
   left: 0,
-  display: 'flex',
   alignItems: 'center',
   justifyContent: 'center'
 });

package/dist/es2019/styled/rankable/row-placeholder.js

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

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

@@ -1,17 +1,19 @@
 import _extends from "@babel/runtime/helpers/extends";
 
 /** @jsx jsx */
-import { css, jsx } from '@emotion/core';
-import { TableBodyCell } from '../TableCell';
+import { css, jsx } from '@emotion/react';
+import { TableBodyCell } from '../table-cell';
 const rankingStyles = css({
   boxSizing: 'border-box'
-});
+}); // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 export const RankableTableBodyCell = ({
   isRanking,
   innerRef,
   ...props
 }) => 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/es2019/styled/rankable/{TableRow.js → table-row.js}

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

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

@@ -1,8 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 
 /** @jsx jsx */
-import { jsx } from '@emotion/core';
-import { cellStyles, fixedSizeTruncateStyles, getTruncationStyleVars, overflowTruncateStyles, truncationWidthStyles } from './constants';
+import { jsx } from '@emotion/react';
+import { cellStyles, fixedSizeTruncateStyles, getTruncationStyleVars, overflowTruncateStyles, truncationWidthStyles } from './constants'; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 export const TableBodyCell = ({
   width,
   isFixedSize,
@@ -16,5 +17,6 @@ export const TableBodyCell = ({
   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));

package/dist/es2019/styled/table-head.js

@@ -0,0 +1,138 @@
+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/react';
+import { B100, N30A } from '@atlaskit/theme/colors';
+import { gridSize as getGridSize } from '@atlaskit/theme/constants';
+import { ASC, DESC } from '../internal/constants';
+import { arrow, head, MSThemeColors, tableBorder } from '../theme';
+import { cellStyles, fixedSizeTruncateStyles, getTruncationStyleVars, overflowTruncateStyles, truncationWidthStyles } from './constants';
+const gridSize = getGridSize();
+const CSS_VAR_TEXT_COLOR = '--local-dynamic-table-text-color';
+const rankingStyles = css({
+  display: 'block'
+});
+const headStyles = css({
+  borderBottom: `none`
+});
+export const Head = ({
+  isRanking,
+  ...props
+}) => {
+  return jsx("thead", _extends({
+    css: [headStyles, isRanking && rankingStyles] // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+
+  }, props));
+};
+const headCellStyles = css([cellStyles, {
+  boxSizing: 'border-box',
+  position: 'relative',
+  border: 'none',
+  borderBottom: `2px solid ${tableBorder.borderColor}`,
+  color: `var(--ds-text-subtlest, ${`var(${CSS_VAR_TEXT_COLOR})`})`,
+  fontSize: '12px',
+  fontWeight: 600,
+  textAlign: 'left',
+  verticalAlign: 'top',
+  '&:focus': {
+    outline: `solid 2px ${`var(--ds-border-focused, ${B100})`}`
+  }
+}]);
+const onClickStyles = css({
+  '&:hover': {
+    backgroundColor: `var(--ds-background-neutral-hovered, ${N30A})`,
+    cursor: 'pointer'
+  }
+});
+const baseStyles = css({
+  '& > span': {
+    position: 'relative',
+    '&::before, &::after': {
+      display: 'block',
+      width: 0,
+      height: 0,
+      position: 'absolute',
+      right: `-${gridSize}px`,
+      border: '3px solid transparent',
+      content: '""'
+    },
+    '&::before': {
+      bottom: '8px',
+      borderBottom: `3px solid ${arrow.defaultColor}`
+    },
+    '&::after': {
+      bottom: 0,
+      borderTop: `3px solid ${arrow.defaultColor}`
+    }
+  },
+  '@media (forced-colors: active)': {
+    '& > span': {
+      '&::before, &::after': {
+        border: `3px solid ${MSThemeColors.Background}`
+      },
+      '&::before': {
+        borderBottom: `3px solid ${MSThemeColors.Text}`
+      },
+      '&::after': {
+        borderTop: `3px solid ${MSThemeColors.Text}`
+      }
+    }
+  }
+});
+const ascendingStyles = css({
+  '& > span': {
+    '&::before': {
+      borderBottom: `3px solid ${arrow.selectedColor}`
+    }
+  },
+  '@media (forced-colors: active)': {
+    '& > span': {
+      '&::before': {
+        borderBottom: `3px solid ${MSThemeColors.SelectedBackground}`
+      }
+    }
+  }
+});
+const descendingStyles = css({
+  '& > span': {
+    '&::after': {
+      borderTop: `3px solid ${arrow.selectedColor}`
+    }
+  },
+  '@media (forced-colors: active)': {
+    '& > span': {
+      '&::after': {
+        borderTop: `3px solid ${MSThemeColors.SelectedBackground}`
+      }
+    }
+  }
+});
+export const HeadCell = /*#__PURE__*/forwardRef(({
+  width,
+  children,
+  isSortable,
+  sortOrder,
+  isFixedSize,
+  shouldTruncate,
+  onClick,
+  style,
+  ...rest
+}, ref) => {
+  const mergedStyles = { ...style,
+    ...(width && getTruncationStyleVars({
+      width
+    })),
+    [CSS_VAR_TEXT_COLOR]: head.textColor
+  };
+  const isASC = sortOrder === ASC;
+  const isDESC = sortOrder === DESC;
+  return jsx("th", _extends({
+    style: mergedStyles,
+    css: [headCellStyles, onClick && onClickStyles, truncationWidthStyles, isFixedSize && shouldTruncate && fixedSizeTruncateStyles, isFixedSize && overflowTruncateStyles, isSortable && baseStyles, isASC && ascendingStyles, isDESC && descendingStyles],
+    onClick: onClick,
+    ref: ref
+  }, rest), children);
+});

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

@@ -2,8 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
 
 /** @jsx jsx */
 import { forwardRef } from 'react';
-import { css, jsx } from '@emotion/core';
-import { tableRowCSSVars as cssVars } from './DynamicTable';
+import { css, jsx } from '@emotion/react';
+import { tableRowCSSVars as cssVars } from './dynamic-table';
 const rowStyles = css({
   '&:focus': {
     outline: `2px solid ${`var(--ds-border-focused, ${`var(${cssVars.CSS_VAR_HOVER_BACKGROUND})`})`}`,
@@ -20,7 +20,8 @@ const rowHighlightedBackgroundStyles = css({
   '&:hover': {
     backgroundColor: `var(--ds-background-selected-hovered, ${`var(${cssVars.CSS_VAR_HOVER_HIGHLIGHTED_BACKGROUND})`})`
   }
-});
+}); // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 export const TableBodyRow = /*#__PURE__*/forwardRef(({
   isHighlighted,
   children,

package/dist/es2019/theme.js

@@ -1,5 +1,4 @@
 import * as colors from '@atlaskit/theme/colors';
-import { themed } from '@atlaskit/theme/components';
 export const MSThemeColors = {
   Background: 'Canvas',
   Text: 'CanvasText',
@@ -7,44 +6,18 @@ export const MSThemeColors = {
   SelectedText: 'HighlightText'
 };
 export const arrow = {
-  defaultColor: themed({
-    light: `var(--ds-icon-disabled, ${colors.N40})`,
-    dark: `var(--ds-icon-disabled, ${colors.DN40})`
-  }),
-  selectedColor: themed({
-    light: `var(--ds-icon-subtle, ${colors.N300})`,
-    dark: `var(--ds-icon-subtle, ${colors.DN300})`
-  }),
-  hoverColor: themed({
-    light: `var(--ds-icon-disabled, ${colors.N60})`,
-    dark: `var(--ds-icon-disabled, ${colors.DN60})`
-  })
+  defaultColor: `var(--ds-icon-disabled, ${colors.N40})`,
+  selectedColor: `var(--ds-icon-subtle, ${colors.N300})`
 };
 export const row = {
-  focusOutline: themed({
-    light: `var(--ds-border-focused, ${colors.B100})`,
-    dark: `var(--ds-border-focused, ${colors.B100})`
-  }),
-  highlightedBackground: themed({
-    light: `var(--ds-background-selected, ${colors.B50})`,
-    dark: `var(--ds-background-selected, ${colors.DN50})`
-  }),
-  hoverBackground: themed({
-    light: `var(--ds-background-neutral-subtle-hovered, ${colors.N10})`,
-    dark: `var(--ds-background-neutral-subtle-hovered, ${colors.DN40})`
-  }),
-  hoverHighlightedBackground: themed({
-    light: `var(--ds-background-selected-hovered, ${colors.B75})`,
-    dark: `var(--ds-background-selected-hovered, ${colors.DN60})`
-  })
+  focusOutline: `var(--ds-border-focused, ${colors.B100})`,
+  highlightedBackground: `var(--ds-background-selected, ${colors.B50})`,
+  hoverBackground: `var(--ds-background-neutral-subtle-hovered, ${colors.N10})`,
+  hoverHighlightedBackground: `var(--ds-background-selected-hovered, ${colors.B75})`
 };
 export const head = {
-  borderColor: themed({
-    light: `var(--ds-border, ${colors.N40})`,
-    dark: `var(--ds-border, ${colors.DN50})`
-  }),
-  textColor: themed({
-    light: `var(--ds-text-subtlest, ${colors.N300})`,
-    dark: `var(--ds-text-subtlest, ${colors.DN300})`
-  })
+  textColor: `var(--ds-text-subtlest, ${colors.N300})`
+};
+export const tableBorder = {
+  borderColor: `var(--ds-border, ${colors.N40})`
 };

package/dist/es2019/types.js

@@ -1 +1,2 @@
+/* eslint-disable @repo/internal/react/consistent-types-definitions */
 import { UIAnalyticsEvent } from '@atlaskit/analytics-next';

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/dynamic-table",
-	"version": "14.6.1",
+	"version": "14.8.0",
 	"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}

@@ -16,7 +16,7 @@ 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
 });