@atlaskit/dynamic-table 14.4.3 → 14.5.1

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @atlaskit/dynamic-table
 
+## 14.5.1
+
+### Patch Changes
+
+- Updated dependencies
+
+## 14.5.0
+
+### Minor Changes
+
+- [`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - Rows can now also be highlighted using the isHighlighted property inside the rows data
+
+### Patch Changes
+
+- [`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - Updates usage of deprecated token names so they're aligned with the latest naming conventions. No UI or visual changes
+- Updated dependencies
+
+## 14.4.4
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 14.4.3
 
 ### Patch Changes

package/dist/cjs/components/Body.js

@@ -54,7 +54,7 @@ var Body = /*#__PURE__*/function (_React$Component) {
           isFixedSize: isFixedSize,
           key: row.key || rowIndex,
           row: row,
-          isHighlighted: !!highlightedRowIndex && (typeof highlightedRowIndex === 'number' ? highlightedRowIndex === rowIndex : highlightedRowIndex.indexOf(rowIndex) > -1),
+          isHighlighted: row.isHighlighted || !!highlightedRowIndex && (typeof highlightedRowIndex === 'number' ? highlightedRowIndex === rowIndex : highlightedRowIndex.indexOf(rowIndex) > -1),
           testId: testId
         });
       }));

package/dist/cjs/components/Stateless.js

@@ -52,7 +52,7 @@ 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; } }
 
 var packageName = "@atlaskit/dynamic-table";
-var packageVersion = "14.4.3";
+var packageVersion = "14.5.1";
 
 function toggleSortOrder(currentSortOrder) {
   switch (currentSortOrder) {

package/dist/cjs/components/TableHead.js

@@ -35,6 +35,9 @@ var _TableHeadCell = _interopRequireDefault(require("./rankable/TableHeadCell"))
 
 var _TableHeadCell2 = _interopRequireDefault(require("./TableHeadCell"));
 
+var _excluded = ["cells"],
+    _excluded2 = ["isSortable", "key"];
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 
 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; } }
@@ -93,14 +96,14 @@ var TableHead = /*#__PURE__*/function (_React$Component) {
 
       var HeadCellComponent = isRankable ? _TableHeadCell.default : _TableHeadCell2.default;
       var cells = head.cells,
-          rest = (0, _objectWithoutProperties2.default)(head, ["cells"]);
+          rest = (0, _objectWithoutProperties2.default)(head, _excluded);
       return /*#__PURE__*/_react.default.createElement(_TableHead.Head, (0, _extends2.default)({}, rest, {
         isRanking: isRanking,
         "data-testid": testId && "".concat(testId, "--head")
       }), /*#__PURE__*/_react.default.createElement("tr", null, cells.map(function (cell, index) {
         var isSortable = cell.isSortable,
             key = cell.key,
-            restCellProps = (0, _objectWithoutProperties2.default)(cell, ["isSortable", "key"]);
+            restCellProps = (0, _objectWithoutProperties2.default)(cell, _excluded2);
         return /*#__PURE__*/_react.default.createElement(HeadCellComponent, (0, _extends2.default)({
           isFixedSize: isFixedSize,
           isSortable: !!isSortable,

package/dist/cjs/components/TableHeadCell.js

@@ -15,6 +15,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _TableHead = require("../styled/TableHead");
 
+var _excluded = ["content", "inlineStyles", "testId", "isRanking", "innerRef", "isSortable"];
+
 var TableHeadCell = function TableHeadCell(_ref) {
   var content = _ref.content,
       inlineStyles = _ref.inlineStyles,
@@ -22,7 +24,7 @@ var TableHeadCell = function TableHeadCell(_ref) {
       isRanking = _ref.isRanking,
       innerRef = _ref.innerRef,
       isSortable = _ref.isSortable,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["content", "inlineStyles", "testId", "isRanking", "innerRef", "isSortable"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_TableHead.HeadCell, (0, _extends2.default)({
     style: inlineStyles,
     "data-testid": testId && "".concat(testId, "--head--cell"),

package/dist/cjs/components/TableRow.js

@@ -17,6 +17,9 @@ var _TableCell = require("../styled/TableCell");
 
 var _TableRow = require("../styled/TableRow");
 
+var _excluded = ["cells"],
+    _excluded2 = ["content"];
+
 var Row = function Row(_ref) {
   var row = _ref.row,
       head = _ref.head,
@@ -24,7 +27,7 @@ var Row = function Row(_ref) {
       isFixedSize = _ref.isFixedSize,
       isHighlighted = _ref.isHighlighted;
   var cells = row.cells,
-      restRowProps = (0, _objectWithoutProperties2.default)(row, ["cells"]);
+      restRowProps = (0, _objectWithoutProperties2.default)(row, _excluded);
   return /*#__PURE__*/_react.default.createElement(_TableRow.TableBodyRow, (0, _extends2.default)({}, restRowProps, {
     isHighlighted: isHighlighted
   }, isHighlighted ? {
@@ -33,7 +36,7 @@ var Row = function Row(_ref) {
     "data-testid": testId && "".concat(testId, "--row-").concat(restRowProps.key)
   }), cells.map(function (cell, cellIndex) {
     var content = cell.content,
-        restCellProps = (0, _objectWithoutProperties2.default)(cell, ["content"]);
+        restCellProps = (0, _objectWithoutProperties2.default)(cell, _excluded2);
 
     var _ref2 = (head || {
       cells: []

package/dist/cjs/components/rankable/TableCell.js

@@ -29,6 +29,8 @@ var _helpers = require("../../internal/helpers");
 
 var _TableCell = require("../../styled/rankable/TableCell");
 
+var _excluded = ["content"];
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 
 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; } }
@@ -54,7 +56,7 @@ var RankableTableCell = /*#__PURE__*/function (_React$Component) {
           refWidth = _this$props.refWidth,
           innerRef = _this$props.innerRef;
       var content = cell.content,
-          restCellProps = (0, _objectWithoutProperties2.default)(cell, ["content"]);
+          restCellProps = (0, _objectWithoutProperties2.default)(cell, _excluded);
 
       var _ref = head || {},
           shouldTruncate = _ref.shouldTruncate,

package/dist/cjs/components/rankable/TableHeadCell.js

@@ -29,6 +29,8 @@ var _helpers = require("../../internal/helpers");
 
 var _TableHeadCell = _interopRequireDefault(require("../TableHeadCell"));
 
+var _excluded = ["isRanking", "refHeight", "refWidth"];
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 
 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; } }
@@ -50,7 +52,7 @@ var RankableTableHeadCell = /*#__PURE__*/function (_React$Component) {
           isRanking = _this$props.isRanking,
           refHeight = _this$props.refHeight,
           refWidth = _this$props.refWidth,
-          restProps = (0, _objectWithoutProperties2.default)(_this$props, ["isRanking", "refHeight", "refWidth"]);
+          restProps = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
       var inlineStyles = (0, _helpers.inlineStylesIfRanking)(isRanking, refWidth);
       return /*#__PURE__*/_react.default.createElement(_TableHeadCell.default, (0, _extends2.default)({
         inlineStyles: inlineStyles

package/dist/cjs/components/rankable/TableRow.js

@@ -37,9 +37,11 @@ var _TableRow = require("../../styled/rankable/TableRow");
 
 var _TableCell = _interopRequireDefault(require("./TableCell"));
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+var _excluded = ["cells", "key"];
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 
@@ -89,7 +91,7 @@ var RankableTableRow = /*#__PURE__*/function (_React$Component) {
           testId = _this$props.testId;
       var cells = row.cells,
           key = row.key,
-          restRowProps = (0, _objectWithoutProperties2.default)(row, ["cells", "key"]);
+          restRowProps = (0, _objectWithoutProperties2.default)(row, _excluded);
       var inlineStyles = (0, _helpers.inlineStylesIfRanking)(isRanking, refWidth);
 
       if (typeof key !== 'string' && !isRankingDisabled) {

package/dist/cjs/hoc/withSortedPageRows.js

@@ -33,9 +33,11 @@ var _constants = require("../internal/constants");
 
 var _helpers = require("../internal/helpers");
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+var _excluded = ["rows", "head", "sortKey", "sortOrder", "rowsPerPage", "page"];
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 
@@ -165,7 +167,7 @@ function withSortedPageRows(WrappedComponent) {
             sortOrder = _this$props.sortOrder,
             rowsPerPage = _this$props.rowsPerPage,
             page = _this$props.page,
-            restProps = (0, _objectWithoutProperties2.default)(_this$props, ["rows", "head", "sortKey", "sortOrder", "rowsPerPage", "page"]);
+            restProps = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
         return /*#__PURE__*/_react.default.createElement(WrappedComponent //@ts-expect-error TODO Fix legit TypeScript 3.9.6 improved inference error
         , (0, _extends2.default)({
           pageRows: this.state.pageRows,

package/dist/cjs/index.js

@@ -5,16 +5,16 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "default", {
+Object.defineProperty(exports, "DynamicTableStateless", {
   enumerable: true,
   get: function get() {
-    return _Stateful.default;
+    return _Stateless.default;
   }
 });
-Object.defineProperty(exports, "DynamicTableStateless", {
+Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
-    return _Stateless.default;
+    return _Stateful.default;
   }
 });
 

package/dist/cjs/internal/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.LOADING_CONTENTS_OPACITY = exports.LARGE = exports.SMALL = exports.DESC = exports.ASC = void 0;
+exports.SMALL = exports.LOADING_CONTENTS_OPACITY = exports.LARGE = exports.DESC = exports.ASC = void 0;
 var ASC = 'ASC';
 exports.ASC = ASC;
 var DESC = 'DESC';

package/dist/cjs/internal/helpers.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.reorderRows = exports.computeIndex = exports.inlineStylesIfRanking = exports.validateSortKey = exports.assertIsSortable = exports.getPageRows = void 0;
+exports.validateSortKey = exports.reorderRows = exports.inlineStylesIfRanking = exports.getPageRows = exports.computeIndex = exports.assertIsSortable = void 0;
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 

package/dist/cjs/styled/DynamicTable.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.PaginationWrapper = exports.Caption = exports.Table = exports.tableRowCSSVars = void 0;
+exports.tableRowCSSVars = exports.Table = exports.PaginationWrapper = exports.Caption = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
@@ -23,7 +23,7 @@ var _constants = require("@atlaskit/theme/constants");
 
 var _theme = require("../theme");
 
-/** @jsx jsx */
+var _excluded = ["isFixedSize", "children"];
 var gridSize = (0, _constants.gridSize)();
 // CSS vars for table row
 // these are declared here to avoid being re-declared in each table row
@@ -46,7 +46,7 @@ var Table = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
 
   var isFixedSize = _ref.isFixedSize,
       children = _ref.children,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["isFixedSize", "children"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var theme = (0, _components.useGlobalTheme)();
   return (0, _core.jsx)("table", (0, _extends2.default)({
     style: (_ref2 = {}, (0, _defineProperty2.default)(_ref2, tableRowCSSVars.CSS_VAR_HOVER_BACKGROUND, _theme.row.hoverBackground({

package/dist/cjs/styled/EmptyBody.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.EmptyViewContainer = exports.EmptyViewWithFixedHeight = void 0;
+exports.EmptyViewWithFixedHeight = exports.EmptyViewContainer = void 0;
 
 var _core = require("@emotion/core");
 

package/dist/cjs/styled/TableCell.js

@@ -15,13 +15,14 @@ var _core = require("@emotion/core");
 
 var _constants = require("./constants");
 
-/** @jsx jsx */
+var _excluded = ["width", "isFixedSize", "shouldTruncate", "innerRef"];
+
 var TableBodyCell = function TableBodyCell(_ref) {
   var width = _ref.width,
       isFixedSize = _ref.isFixedSize,
       shouldTruncate = _ref.shouldTruncate,
       innerRef = _ref.innerRef,
-      props = (0, _objectWithoutProperties2.default)(_ref, ["width", "isFixedSize", "shouldTruncate", "innerRef"]);
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return (0, _core.jsx)("td", (0, _extends2.default)({
     style: (0, _constants.getTruncationStyleVars)({
       width: width

package/dist/cjs/styled/TableHead.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.HeadCell = exports.getArrowStyles = exports.Head = void 0;
+exports.getArrowStyles = exports.HeadCell = exports.Head = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
@@ -29,9 +29,12 @@ var _theme = require("../theme");
 
 var _constants3 = require("./constants");
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+var _excluded = ["isRanking"],
+    _excluded2 = ["width", "children", "isSortable", "sortOrder", "isFixedSize", "shouldTruncate", "onClick", "style"];
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 var gridSize = (0, _constants.gridSize)();
 var CSS_VAR_TEXT_COLOR = '--local-dynamic-table-text-color';
@@ -41,7 +44,7 @@ var rankingStyles = (0, _core.css)({
 
 var getHeadStyles = function getHeadStyles(theme) {
   return (0, _core.css)({
-    borderBottom: "2px solid ".concat("var(--ds-border-neutral, ".concat(_theme.head.borderColor({
+    borderBottom: "2px solid ".concat("var(--ds-border, ".concat(_theme.head.borderColor({
       theme: theme
     }), ")"))
   });
@@ -49,7 +52,7 @@ var getHeadStyles = function getHeadStyles(theme) {
 
 var Head = function Head(_ref) {
   var isRanking = _ref.isRanking,
-      props = (0, _objectWithoutProperties2.default)(_ref, ["isRanking"]);
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var theme = (0, _components.useGlobalTheme)();
   return (0, _core.jsx)("thead", (0, _extends2.default)({
     css: [getHeadStyles(theme), isRanking && rankingStyles]
@@ -65,9 +68,9 @@ var headCellStyles = (0, _core.css)([_constants3.cellStyles, {
   position: 'relative',
   textAlign: 'left',
   verticalAlign: 'top',
-  color: "var(--ds-text-lowEmphasis, ".concat("var(".concat(CSS_VAR_TEXT_COLOR, ")"), ")"),
+  color: "var(--ds-text-subtlest, ".concat("var(".concat(CSS_VAR_TEXT_COLOR, ")"), ")"),
   '&:focus': {
-    outline: "solid 2px ".concat("var(--ds-border-focus, ".concat(_colors.B100, ")"))
+    outline: "solid 2px ".concat("var(--ds-border-focused, ".concat(_colors.B100, ")"))
   }
 }]); // this needs to be made static: https://product-fabric.atlassian.net/browse/DSP-2011
 
@@ -151,7 +154,7 @@ exports.getArrowStyles = getArrowStyles;
 var onClickStyles = (0, _core.css)({
   '&:hover': {
     cursor: 'pointer',
-    backgroundColor: "var(--ds-background-subtleNeutral-hover, ".concat(_colors.N30A, ")")
+    backgroundColor: "var(--ds-background-neutral-hovered, ".concat(_colors.N30A, ")")
   }
 });
 var HeadCell = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
@@ -163,7 +166,7 @@ var HeadCell = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
       shouldTruncate = _ref2.shouldTruncate,
       onClick = _ref2.onClick,
       style = _ref2.style,
-      rest = (0, _objectWithoutProperties2.default)(_ref2, ["width", "children", "isSortable", "sortOrder", "isFixedSize", "shouldTruncate", "onClick", "style"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
   var theme = (0, _components.useGlobalTheme)();
 
   var mergedStyles = _objectSpread(_objectSpread(_objectSpread({}, style), width && (0, _constants3.getTruncationStyleVars)({

package/dist/cjs/styled/TableRow.js

@@ -17,29 +17,29 @@ var _core = require("@emotion/core");
 
 var _DynamicTable = require("./DynamicTable");
 
-/** @jsx jsx */
+var _excluded = ["isHighlighted", "children", "style"];
 var rowStyles = (0, _core.css)({
   '&:focus': {
-    outline: "2px solid ".concat("var(--ds-border-focus, ".concat("var(".concat(_DynamicTable.tableRowCSSVars.CSS_VAR_HOVER_BACKGROUND, ")"), ")")),
+    outline: "2px solid ".concat("var(--ds-border-focused, ".concat("var(".concat(_DynamicTable.tableRowCSSVars.CSS_VAR_HOVER_BACKGROUND, ")"), ")")),
     outlineOffset: "-2px"
   }
 });
 var rowBackgroundStyles = (0, _core.css)({
   '&:hover': {
-    backgroundColor: "var(--ds-background-transparentNeutral-hover, ".concat("var(".concat(_DynamicTable.tableRowCSSVars.CSS_VAR_HOVER_BACKGROUND, ")"), ")")
+    backgroundColor: "var(--ds-background-neutral-subtle-hovered, ".concat("var(".concat(_DynamicTable.tableRowCSSVars.CSS_VAR_HOVER_BACKGROUND, ")"), ")")
   }
 });
 var rowHighlightedBackgroundStyles = (0, _core.css)({
-  backgroundColor: "var(--ds-background-selected-resting, ".concat("var(".concat(_DynamicTable.tableRowCSSVars.CSS_VAR_HIGHLIGHTED_BACKGROUND, ")"), ")"),
+  backgroundColor: "var(--ds-background-brand, ".concat("var(".concat(_DynamicTable.tableRowCSSVars.CSS_VAR_HIGHLIGHTED_BACKGROUND, ")"), ")"),
   '&:hover': {
-    backgroundColor: "var(--ds-background-selected-hover, ".concat("var(".concat(_DynamicTable.tableRowCSSVars.CSS_VAR_HOVER_HIGHLIGHTED_BACKGROUND, ")"), ")")
+    backgroundColor: "var(--ds-background-brand-hovered, ".concat("var(".concat(_DynamicTable.tableRowCSSVars.CSS_VAR_HOVER_HIGHLIGHTED_BACKGROUND, ")"), ")")
   }
 });
 var TableBodyRow = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var isHighlighted = _ref.isHighlighted,
       children = _ref.children,
       style = _ref.style,
-      rest = (0, _objectWithoutProperties2.default)(_ref, ["isHighlighted", "children", "style"]);
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return (0, _core.jsx)("tr", (0, _extends2.default)({
     style: style,
     css: [rowStyles, isHighlighted ? rowHighlightedBackgroundStyles : rowBackgroundStyles]

package/dist/cjs/styled/constants.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.cellStyles = exports.getTruncationStyleVars = exports.overflowTruncateStyles = exports.fixedSizeTruncateStyles = exports.truncationWidthStyles = void 0;
+exports.truncationWidthStyles = exports.overflowTruncateStyles = exports.getTruncationStyleVars = exports.fixedSizeTruncateStyles = exports.cellStyles = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 

package/dist/cjs/styled/rankable/TableCell.js

@@ -15,7 +15,7 @@ var _core = require("@emotion/core");
 
 var _TableCell = require("../TableCell");
 
-/** @jsx jsx */
+var _excluded = ["isRanking", "innerRef"];
 var rankingStyles = (0, _core.css)({
   boxSizing: 'border-box'
 });
@@ -23,7 +23,7 @@ var rankingStyles = (0, _core.css)({
 var RankableTableBodyCell = function RankableTableBodyCell(_ref) {
   var isRanking = _ref.isRanking,
       innerRef = _ref.innerRef,
-      props = (0, _objectWithoutProperties2.default)(_ref, ["isRanking", "innerRef"]);
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return (0, _core.jsx)(_TableCell.TableBodyCell, (0, _extends2.default)({
     css: isRanking && rankingStyles
   }, props, {

package/dist/cjs/styled/rankable/TableRow.js

@@ -19,32 +19,32 @@ var _colors = require("@atlaskit/theme/colors");
 
 var _TableRow = require("../TableRow");
 
-/** @jsx jsx */
+var _excluded = ["isRanking", "isRankingItem"];
 var rankingStyles = (0, _core.css)({
   display: 'block'
 });
-var elevationStyle = "var(--ds-overlay, ".concat("0 20px 32px -8px ".concat(_colors.N50A, ", 0 0 1px ").concat(_colors.N60A), ")");
+var elevationStyle = "var(--ds-shadow-overlay, ".concat("0 20px 32px -8px ".concat(_colors.N50A, ", 0 0 1px ").concat(_colors.N60A), ")");
 /**
  * TODO: Pass the props here to get particular theme for the table
  * Skipping it for now as it may impact migration as util-shared-styles does not support this feature
  */
 
 var rankingItemStyles = (0, _core.css)({
-  backgroundColor: "var(--ds-background-subtleNeutral-resting, ".concat(_colors.N20, ")"),
+  backgroundColor: "var(--ds-background-neutral, ".concat(_colors.N20, ")"),
   boxShadow: elevationStyle,
   borderRadius: '2px'
 });
 var draggableStyles = (0, _core.css)({
   '&:focus': {
     outlineStyle: 'solid',
-    outlineColor: "var(--ds-border-focus, ".concat(_colors.B100, ")")
+    outlineColor: "var(--ds-border-focused, ".concat(_colors.B100, ")")
   },
   outlineWidth: '2px'
 });
 var RankableTableBodyRow = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var isRanking = _ref.isRanking,
       isRankingItem = _ref.isRankingItem,
-      props = (0, _objectWithoutProperties2.default)(_ref, ["isRanking", "isRankingItem"]);
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return (0, _core.jsx)(_TableRow.TableBodyRow, (0, _extends2.default)({
     css: [isRanking && rankingStyles, isRankingItem && rankingItemStyles, draggableStyles],
     ref: ref

package/dist/cjs/theme.js

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.head = exports.row = exports.arrow = exports.MSThemeColors = void 0;
+exports.row = exports.head = exports.arrow = exports.MSThemeColors = void 0;
 
 var colors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
 
@@ -24,46 +24,46 @@ var MSThemeColors = {
 exports.MSThemeColors = MSThemeColors;
 var arrow = {
   defaultColor: (0, _components.themed)({
-    light: "var(--ds-background-subtleNeutral-resting, ".concat(colors.N40, ")"),
-    dark: "var(--ds-background-subtleNeutral-resting, ".concat(colors.DN40, ")")
+    light: "var(--ds-background-neutral, ".concat(colors.N40, ")"),
+    dark: "var(--ds-background-neutral, ".concat(colors.DN40, ")")
   }),
   selectedColor: (0, _components.themed)({
-    light: "var(--ds-text-lowEmphasis, ".concat(colors.N300, ")"),
-    dark: "var(--ds-text-lowEmphasis, ".concat(colors.DN300, ")")
+    light: "var(--ds-text-subtlest, ".concat(colors.N300, ")"),
+    dark: "var(--ds-text-subtlest, ".concat(colors.DN300, ")")
   }),
   hoverColor: (0, _components.themed)({
-    light: "var(--ds-background-subtleNeutral-pressed, ".concat(colors.N60, ")"),
-    dark: "var(--ds-background-subtleNeutral-pressed, ".concat(colors.DN60, ")")
+    light: "var(--ds-background-neutral-pressed, ".concat(colors.N60, ")"),
+    dark: "var(--ds-background-neutral-pressed, ".concat(colors.DN60, ")")
   })
 };
 exports.arrow = arrow;
 var row = {
   focusOutline: (0, _components.themed)({
-    light: "var(--ds-border-focus, ".concat(colors.B100, ")"),
-    dark: "var(--ds-border-focus, ".concat(colors.B100, ")")
+    light: "var(--ds-border-focused, ".concat(colors.B100, ")"),
+    dark: "var(--ds-border-focused, ".concat(colors.B100, ")")
   }),
   highlightedBackground: (0, _components.themed)({
-    light: "var(--ds-background-selected-resting, ".concat(colors.B50, ")"),
-    dark: "var(--ds-background-selected-resting, ".concat(colors.DN50, ")")
+    light: "var(--ds-background-brand, ".concat(colors.B50, ")"),
+    dark: "var(--ds-background-brand, ".concat(colors.DN50, ")")
   }),
   hoverBackground: (0, _components.themed)({
-    light: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(colors.N10, ")"),
-    dark: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(colors.DN40, ")")
+    light: "var(--ds-background-input, ".concat(colors.N10, ")"),
+    dark: "var(--ds-background-input, ".concat(colors.DN40, ")")
   }),
   hoverHighlightedBackground: (0, _components.themed)({
-    light: "var(--ds-background-selected-hover, ".concat(colors.B75, ")"),
-    dark: "var(--ds-background-selected-hover, ".concat(colors.DN60, ")")
+    light: "var(--ds-background-brand-hovered, ".concat(colors.B75, ")"),
+    dark: "var(--ds-background-brand-hovered, ".concat(colors.DN60, ")")
   })
 };
 exports.row = row;
 var head = {
   borderColor: (0, _components.themed)({
-    light: "var(--ds-border-neutral, ".concat(colors.N40, ")"),
-    dark: "var(--ds-border-neutral, ".concat(colors.DN50, ")")
+    light: "var(--ds-border, ".concat(colors.N40, ")"),
+    dark: "var(--ds-border, ".concat(colors.DN50, ")")
   }),
   textColor: (0, _components.themed)({
-    light: "var(--ds-text-lowEmphasis, ".concat(colors.N300, ")"),
-    dark: "var(--ds-text-lowEmphasis, ".concat(colors.DN300, ")")
+    light: "var(--ds-text-subtlest, ".concat(colors.N300, ")"),
+    dark: "var(--ds-text-subtlest, ".concat(colors.DN300, ")")
   })
 };
 exports.head = head;

package/dist/cjs/version.json

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

package/dist/es2019/components/Body.js

@@ -18,7 +18,7 @@ class Body extends React.Component {
       isFixedSize: isFixedSize,
       key: row.key || rowIndex,
       row: row,
-      isHighlighted: !!highlightedRowIndex && (typeof highlightedRowIndex === 'number' ? highlightedRowIndex === rowIndex : highlightedRowIndex.indexOf(rowIndex) > -1),
+      isHighlighted: row.isHighlighted || !!highlightedRowIndex && (typeof highlightedRowIndex === 'number' ? highlightedRowIndex === rowIndex : highlightedRowIndex.indexOf(rowIndex) > -1),
       testId: testId
     })));
   }

package/dist/es2019/components/Stateless.js

@@ -13,7 +13,7 @@ import ManagedPagination from './managed-pagination';
 import RankableTableBody from './rankable/Body';
 import TableHead from './TableHead';
 const packageName = "@atlaskit/dynamic-table";
-const packageVersion = "14.4.3";
+const packageVersion = "14.5.1";
 
 function toggleSortOrder(currentSortOrder) {
   switch (currentSortOrder) {