@atlaskit/dynamic-table 18.0.0 → 18.0.2

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

@@ -1,160 +1,43 @@
+/* table-head.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _extends from "@babel/runtime/helpers/extends";
+import "./table-head.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 /* eslint-disable @repo/internal/react/require-jsdoc */
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+
 import { forwardRef } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
+
 import { fg } from '@atlaskit/platform-feature-flags';
-import { B100, N30A } from '@atlaskit/theme/colors';
+import { B100, N300, N30A, N40 } from '@atlaskit/theme/colors';
 import { ASC, DESC } from '../internal/constants';
-import { arrow, head, MSThemeColors, tableBorder } from '../theme';
-import { cellStyles, fixedSizeTruncateStyles, getTruncationStyleVars, overflowTruncateStyles, truncationWidthStyles } from './constants';
+import { getTruncationStyleVars } from './constants';
 const CSS_VAR_TEXT_COLOR = '--local-dynamic-table-text-color';
-const rankingStyles = css({
-  display: 'block'
-});
-const headStyles = css({
-  borderBlockEnd: `none`
-});
+const rankingStyles = null;
+const headStyles = null;
+const overflowTruncateStyles = null;
+const truncationWidthStyles = null;
+const fixedSizeTruncateStyles = null;
+const cellStyles = null;
 export const Head = ({
   isRanking,
   testId,
   ...props
 }) => {
-  return jsx("thead", _extends({
-    css: [headStyles, isRanking && rankingStyles],
+  return /*#__PURE__*/React.createElement("thead", _extends({
     "data-testid": testId
     // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
-  }, props));
+  }, props, {
+    className: ax(["_179rglyw", isRanking && "_1e0c1ule"])
+  }));
 };
-const headCellBaseStyles = css({
-  boxSizing: 'border-box',
-  position: 'relative',
-  border: 'none',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  borderBlockEnd: `2px solid ${tableBorder.borderColor}`,
-  color: `var(--ds-text-subtle, ${`var(${CSS_VAR_TEXT_COLOR})`})`,
-  font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
-  fontWeight: "var(--ds-font-weight-bold, 700)",
-  textAlign: 'left',
-  verticalAlign: 'middle',
-  '&:focus-visible': {
-    outline: `solid 2px ${`var(--ds-border-focused, ${B100})`}`
-  }
-});
-const headCellBaseStylesOld = css({
-  boxSizing: 'border-box',
-  position: 'relative',
-  border: 'none',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  borderBlockEnd: `2px solid ${tableBorder.borderColor}`,
-  color: `var(--ds-text-subtle, ${`var(${CSS_VAR_TEXT_COLOR})`})`,
-  font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
-  fontWeight: "var(--ds-font-weight-bold, 700)",
-  textAlign: 'left',
-  verticalAlign: 'top',
-  '&:focus-visible': {
-    outline: `solid 2px ${`var(--ds-border-focused, ${B100})`}`
-  }
-});
-const onClickStyles = css({
-  '&:hover': {
-    backgroundColor: `var(--ds-background-neutral-hovered, ${N30A})`,
-    cursor: 'pointer'
-  }
-});
-const baseStyles = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '& > button': {
-    padding: "var(--ds-space-0, 0)",
-    position: 'relative',
-    appearance: 'none',
-    background: 'none',
-    border: 'none',
-    color: 'inherit',
-    cursor: 'inherit',
-    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-    fontSize: 'inherit',
-    // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-    fontWeight: 'inherit',
-    '&::before, &::after': {
-      display: 'block',
-      width: 0,
-      height: 0,
-      position: 'absolute',
-      border: '3px solid transparent',
-      content: '""',
-      insetInlineEnd: "var(--ds-space-negative-100, -8px)"
-    },
-    '&::before': {
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-      borderBlockEnd: `3px solid ${arrow.defaultColor}`,
-      insetBlockEnd: "var(--ds-space-100, 8px)"
-    },
-    '&::after': {
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-      borderBlockStart: `3px solid ${arrow.defaultColor}`,
-      insetBlockEnd: 0
-    }
-  },
-  '@media (forced-colors: active)': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    '& > button': {
-      '&::before, &::after': {
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-        border: `3px solid ${MSThemeColors.Background}`
-      },
-      '&::before': {
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-        borderBlockEnd: `3px solid ${MSThemeColors.Text}`
-      },
-      '&::after': {
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-        borderBlockStart: `3px solid ${MSThemeColors.Text}`
-      }
-    }
-  }
-});
-const ascendingStyles = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '& > button': {
-    '&::before': {
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-      borderBlockEnd: `3px solid ${arrow.selectedColor}`
-    }
-  },
-  '@media (forced-colors: active)': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    '& > button': {
-      '&::before': {
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-        borderBlockEnd: `3px solid ${MSThemeColors.SelectedBackground}`
-      }
-    }
-  }
-});
-const descendingStyles = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '& > button': {
-    '&::after': {
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-      borderBlockStart: `3px solid ${arrow.selectedColor}`
-    }
-  },
-  '@media (forced-colors: active)': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    '& > button': {
-      '&::after': {
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-        borderBlockStart: `3px solid ${MSThemeColors.SelectedBackground}`
-      }
-    }
-  }
-});
+const headCellBaseStyles = null;
+const headCellBaseStylesOld = null;
+const onClickStyles = null;
+const baseStyles = null;
+const ascendingStyles = null;
+const descendingStyles = null;
 export const HeadCell = /*#__PURE__*/forwardRef(({
   width,
   children,
@@ -172,7 +55,7 @@ export const HeadCell = /*#__PURE__*/forwardRef(({
     ...(width && getTruncationStyleVars({
       width
     })),
-    [CSS_VAR_TEXT_COLOR]: head.textColor
+    [CSS_VAR_TEXT_COLOR]: `var(--ds-text-subtlest, ${N300})`
   };
   const isASC = sortOrder === ASC;
   const isDESC = sortOrder === DESC;
@@ -188,22 +71,15 @@ export const HeadCell = /*#__PURE__*/forwardRef(({
   // https://dequeuniversity.com/rules/axe/4.7/empty-table-header
   const Component = children ? 'th' : 'td';
   const isVisuallyRefreshed = fg('platform-component-visual-refresh');
-  return jsx(Component, _extends({
+  return /*#__PURE__*/React.createElement(Component, _extends({
     "aria-sort": getFormattedSortOrder()
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     ,
     style: mergedStyles,
-    css: [
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    cellStyles, isVisuallyRefreshed ? headCellBaseStyles : headCellBaseStylesOld, !isVisuallyRefreshed && onClick && onClickStyles,
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    truncationWidthStyles,
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    isFixedSize && shouldTruncate && fixedSizeTruncateStyles,
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    isFixedSize && overflowTruncateStyles, !isVisuallyRefreshed && isSortable && baseStyles, !isVisuallyRefreshed && isASC && ascendingStyles, !isVisuallyRefreshed && isDESC && descendingStyles],
     onClick: !isVisuallyRefreshed ? onClick : undefined,
     ref: ref,
     "data-testid": testId
-  }, rest), children);
+  }, rest, {
+    className: ax(["_izbqglyw _h7alglyw _85i51b66 _1q511b66 _y4tiu2gc _bozgu2gc _y3gn1e5h _1s37ze3t _uupyze3t", isVisuallyRefreshed ? "_11c8dcr7 _179r1on0 _mqm2glyw _vchhusvi _kqswh2mm _syaz34id _k48pmoej _y3gn1e5h _s7n4nkob _1ygbvd8c" : "_11c8dcr7 _179r1on0 _mqm2glyw _t51zglyw _191wglyw _vchhusvi _kqswh2mm _syaz34id _k48pmoej _y3gn1e5h _s7n4jp4b _1ygbvd8c", !isVisuallyRefreshed && onClick && "_irr317ks _d0altlke", "_1bsb8a2a", isFixedSize && shouldTruncate && "_1bto1l2s _o5721q9c", isFixedSize && "_1reo15vq _18m915vq", !isVisuallyRefreshed && isSortable && "_173zglyw _pw6dglyw _1xgk1j28 _1wfn1j28 _y9yonqa1 _997wnqa1 _sklb1l7b _1j091l7b _19w61ule _1w611ule _1hvvidpf _n56nidpf _wyc4idpf _1d4oidpf _no7mstnw _qh32stnw _4b5mb3bt _hn3bb3bt _14gsx0bf _cigmx0bf _c77kvia6 _qzvtu2gc _f473via6 _1fpyidpf _a04fh2mm _xv14glyw _58ej1kw7 _1ay31kw7 _mdbq1kw7 _10pp1kw7 _1yw3ze3t _n2fdze3t _8607ze3t _szhwze3t _1g2wwc43 _ze9fwc43 _1lcgnqa1 _at5qnqa1 _o4d71l7b _npl51l7b _1rp11onz _1iornqa1 _oi051l7b _1ehx1onz _19t8nqa1 _1bog1l7b", !isVisuallyRefreshed && isASC && "_c77k1thn _142s94yt", !isVisuallyRefreshed && isDESC && "_f4731thn _17x894yt"])
+  }), children);
 });

package/dist/es2019/styled/table-row.compiled.css

@@ -0,0 +1,6 @@
+
+._bfhkqtfy{background-color:var(--ds-background-neutral-subtle,transparent)}
+._bfhktkjs{background-color:var(--ds-background-selected,var(--local-dynamic-table-highlighted-bg))}
+._1ygbi9un:focus-visible{outline:2px solid var(--ds-border-focused,var(--local-dynamic-table-hover-bg))}._1ah312gs:focus-visible{outline-offset:-2px}
+._irr31ae3:hover{background-color:var(--ds-background-selected-hovered,var(--local-dynamic-table-hover-highlighted-bg))}
+._irr3s8ts:hover{background-color:var(--ds-background-neutral-subtle-hovered,var(--local-dynamic-table-hover-bg))}

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

@@ -1,39 +1,12 @@
+/* table-row.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _extends from "@babel/runtime/helpers/extends";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+import "./table-row.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { forwardRef } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import { tableRowCSSVars as cssVars } from './dynamic-table';
-const rowStyles = css({
-  backgroundColor: "var(--ds-background-neutral-subtle, transparent)",
-  '&:focus-visible': {
-    outline: `2px solid ${`var(--ds-border-focused, ${
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    `var(${cssVars.CSS_VAR_HOVER_BACKGROUND})`})`}`,
-    outlineOffset: `-2px`
-  }
-});
-const rowBackgroundStyles = css({
-  '&:hover': {
-    backgroundColor: `var(--ds-background-neutral-subtle-hovered, ${
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    `var(${cssVars.CSS_VAR_HOVER_BACKGROUND})`})`
-  }
-});
-const rowHighlightedBackgroundStyles = css({
-  backgroundColor: `var(--ds-background-selected, ${
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  `var(${cssVars.CSS_VAR_HIGHLIGHTED_BACKGROUND})`})`,
-  '&:hover': {
-    backgroundColor: `var(--ds-background-selected-hovered, ${
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    `var(${cssVars.CSS_VAR_HOVER_HIGHLIGHTED_BACKGROUND})`})`
-  }
-});
+const rowStyles = null;
+const rowBackgroundStyles = null;
+const rowHighlightedBackgroundStyles = null;
 
 // eslint-disable-next-line @repo/internal/react/require-jsdoc
 export const TableBodyRow = /*#__PURE__*/forwardRef(({
@@ -43,12 +16,12 @@ export const TableBodyRow = /*#__PURE__*/forwardRef(({
   testId,
   ...rest
 }, ref) => {
-  return jsx("tr", _extends({
+  return /*#__PURE__*/React.createElement("tr", _extends({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
-    style: style,
-    css: [rowStyles, isHighlighted ? rowHighlightedBackgroundStyles : rowBackgroundStyles]
+    style: style
   }, rest, {
     ref: ref,
-    "data-testid": testId
+    "data-testid": testId,
+    className: ax(["_bfhkqtfy _1ygbi9un _1ah312gs", isHighlighted ? "_bfhktkjs _irr31ae3" : "_irr3s8ts"])
   }), children);
 });

package/dist/es2019/theme.js

@@ -1,23 +1,6 @@
-import * as colors from '@atlaskit/theme/colors';
 export const MSThemeColors = {
   Background: 'Canvas',
   Text: 'CanvasText',
   SelectedBackground: 'Highlight',
   SelectedText: 'HighlightText'
-};
-export const arrow = {
-  defaultColor: `var(--ds-icon-disabled, ${colors.N40})`,
-  selectedColor: `var(--ds-icon-subtle, ${colors.N300})`
-};
-export const row = {
-  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 = {
-  textColor: `var(--ds-text-subtlest, ${colors.N300})`
-};
-export const tableBorder = {
-  borderColor: `var(--ds-border, ${colors.N40})`
 };

package/dist/esm/components/stateless.js

@@ -77,14 +77,14 @@ var DynamicTable = function DynamicTable(_ref) {
     action: 'sorted',
     componentName: 'dynamicTable',
     packageName: "@atlaskit/dynamic-table",
-    packageVersion: "18.0.0"
+    packageVersion: "18.0.2"
   });
   var onRankEnd = usePlatformLeafEventHandler({
     fn: providedOnRankEnd,
     action: 'ranked',
     componentName: 'dynamicTable',
     packageName: "@atlaskit/dynamic-table",
-    packageVersion: "18.0.0"
+    packageVersion: "18.0.2"
   });
   useEffect(function () {
     validateSortKey(sortKey, head);

package/dist/esm/styled/constants.js

@@ -1,38 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
 var CSS_VAR_WIDTH = '--local-dynamic-table-width';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var truncationWidthStyles = css({
-  width: "var(".concat(CSS_VAR_WIDTH, ")")
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var fixedSizeTruncateStyles = css({
-  textOverflow: 'ellipsis',
-  whiteSpace: 'nowrap'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var overflowTruncateStyles = css({
-  overflow: 'hidden'
-});
 export var getTruncationStyleVars = function getTruncationStyleVars(_ref) {
   var width = _ref.width;
   return typeof width !== 'undefined' ? _defineProperty({}, CSS_VAR_WIDTH, "".concat(width, "%")) : undefined;
-};
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var cellStyles = css({
-  padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-100, 8px)"),
-  border: 'none',
-  textAlign: 'left',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  '&:first-of-type': {
-    paddingInlineStart: "var(--ds-space-0, 0px)"
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  '&:last-child': {
-    paddingInlineEnd: "var(--ds-space-0, 0px)"
-  }
-});
+};

package/dist/esm/styled/dynamic-table.compiled.css

@@ -0,0 +1,11 @@
+._11c8lodh{font:var(--ds-font-heading-medium,normal 500 20px/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._179rralu{border-block-end:var(--_k02y3n)}
+._1bah1h6o{justify-content:center}
+._1bsb1osq{width:100%}
+._1e0c1txw{display:flex}
+._1kqm1n9t{table-layout:fixed}
+._1pfh1ejb{margin-block-start:var(--ds-space-300,24px)}
+._6rthu2gc{margin-block-end:var(--ds-space-100,8px)}
+._btyzidpf{border-spacing:0}
+._m6k41e03{will-change:transform}
+._yq5hus1c{border-collapse:separate}

package/dist/esm/styled/dynamic-table.js

@@ -1,37 +1,23 @@
+/* dynamic-table.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["isFixedSize", "hasDataRow", "children", "testId", "isLoading"];
+import "./dynamic-table.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /* eslint-disable @repo/internal/react/require-jsdoc */
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+
 import { forwardRef } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-import { row, tableBorder } from '../theme';
-// CSS vars for table row
-// these are declared here to avoid being re-declared in each table row
-export var tableRowCSSVars = {
-  CSS_VAR_HOVER_BACKGROUND: '--local-dynamic-table-hover-bg',
-  CSS_VAR_HIGHLIGHTED_BACKGROUND: '--local-dynamic-table-highlighted-bg',
-  CSS_VAR_HOVER_HIGHLIGHTED_BACKGROUND: '--local-dynamic-table-hover-highlighted-bg',
-  CSS_VAR_ROW_FOCUS_OUTLINE: '--local-dynamic-table-row-focus-outline'
-};
-var fixedSizeTableStyles = css({
-  tableLayout: 'fixed'
-});
-var tableStyles = css({
-  width: '100%',
-  borderCollapse: 'separate',
-  borderSpacing: '0px'
-});
-var bodyBorder = css({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  borderBlockEnd: "2px solid ".concat(tableBorder.borderColor)
-});
+
+import { B100, B50, B75, N10, N40 } from '@atlaskit/theme/colors';
+var fixedSizeTableStyles = null;
+var tableStyles = null;
+var bodyBorder = null;
 export var Table = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var isFixedSize = _ref.isFixedSize,
     hasDataRow = _ref.hasDataRow,
@@ -39,36 +25,39 @@ export var Table = /*#__PURE__*/forwardRef(function (_ref, ref) {
     testId = _ref.testId,
     isLoading = _ref.isLoading,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return jsx("table", _extends({
+  return /*#__PURE__*/React.createElement("table", _extends({
     inert: isLoading ? '' : undefined,
-    style: _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, 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, hasDataRow && bodyBorder],
     ref: ref
   }, rest, {
-    "data-testid": testId && "".concat(testId, "--table")
+    "data-testid": testId && "".concat(testId, "--table"),
+    className: ax(["_1bsb1osq _yq5hus1c _btyzidpf", isFixedSize && "_1kqm1n9t", hasDataRow && "_179rralu"]),
+    style: _objectSpread(_objectSpread({}, {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+      '--local-dynamic-table-hover-bg': "var(--ds-background-neutral-subtle-hovered, ".concat(N10, ")"),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+      '--local-dynamic-table-highlighted-bg': "var(--ds-background-selected, ".concat(B50, ")"),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+      '--local-dynamic-table-hover-highlighted-bg': "var(--ds-background-selected-hovered, ".concat(B75, ")"),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+      '--local-dynamic-table-row-focus-outline': "var(--ds-border-focused, ".concat(B100, ")")
+    }), {}, {
+      "--_k02y3n": ix("2px solid ".concat("var(--ds-border, ".concat(N40, ")")))
+    })
   }), children);
 });
-var captionStyles = css({
-  font: "var(--ds-font-heading-medium, normal 500 20px/24px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
-  marginBlockEnd: "var(--ds-space-100, 8px)",
-  marginBlockStart: "var(--ds-space-300, 24px)",
-  willChange: 'transform'
-});
-export var Caption = function Caption(_ref3) {
-  var children = _ref3.children;
-  return jsx("caption", {
-    css: captionStyles
+var captionStyles = null;
+export var Caption = function Caption(_ref2) {
+  var children = _ref2.children;
+  return /*#__PURE__*/React.createElement("caption", {
+    className: ax(["_11c8lodh _6rthu2gc _1pfh1ejb _m6k41e03"])
   }, children);
 };
-var paginationWrapperStyles = css({
-  display: 'flex',
-  justifyContent: 'center'
-});
-export var PaginationWrapper = function PaginationWrapper(_ref4) {
-  var children = _ref4.children,
-    testId = _ref4.testId;
-  return jsx("div", {
-    css: paginationWrapperStyles,
-    "data-testid": testId && "".concat(testId, "--pagination--container")
+var paginationWrapperStyles = null;
+export var PaginationWrapper = function PaginationWrapper(_ref3) {
+  var children = _ref3.children,
+    testId = _ref3.testId;
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": testId && "".concat(testId, "--pagination--container"),
+    className: ax(["_1e0c1txw _1bah1h6o"])
   }, children);
 };

package/dist/esm/styled/empty-body.compiled.css

@@ -0,0 +1,11 @@
+._18u01wug{margin-left:auto}
+._19bv19bv{padding-left:10px}
+._19pk1wug{margin-top:auto}
+._1bsb1ssb{width:50%}
+._2hwx1wug{margin-right:auto}
+._4t3i1jdh{height:9rem}
+._ca0q19bv{padding-top:10px}
+._n3td19bv{padding-bottom:10px}
+._otyr1wug{margin-bottom:auto}
+._u5f319bv{padding-right:10px}
+._y3gn1h6o{text-align:center}

package/dist/esm/styled/empty-body.js

@@ -1,34 +1,24 @@
+/* empty-body.tsx generated by @compiled/babel-plugin v0.36.1 */
 /* eslint-disable @repo/internal/react/require-jsdoc */
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-var fixedHeightStyles = css({
-  height: '9rem'
-});
+import "./empty-body.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+var fixedHeightStyles = null;
 export var EmptyViewWithFixedHeight = function EmptyViewWithFixedHeight(_ref) {
   var children = _ref.children,
     testId = _ref.testId;
-  return jsx("div", {
-    css: fixedHeightStyles,
-    "data-testid": testId && "".concat(testId, "--empty-view-with-fixed-height")
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": testId && "".concat(testId, "--empty-view-with-fixed-height"),
+    className: ax(["_4t3i1jdh"])
   }, children);
 };
-var emptyViewContainerStyles = css({
-  width: '50%',
-  margin: 'auto',
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-space
-  padding: '10px',
-  textAlign: 'center'
-});
+var emptyViewContainerStyles = null;
 export var EmptyViewContainer = function EmptyViewContainer(props) {
   var children = props.children,
     testId = props.testId;
-  return jsx("div", {
-    css: emptyViewContainerStyles,
-    "data-testid": testId && "".concat(testId, "--empty-view-container")
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": testId && "".concat(testId, "--empty-view-container"),
+    className: ax(["_19pk1wug _2hwx1wug _otyr1wug _18u01wug _ca0q19bv _u5f319bv _n3td19bv _19bv19bv _1bsb1ssb _y3gn1h6o"])
   }, children);
 };

package/dist/esm/styled/loading-container-advanced.compiled.css

@@ -0,0 +1,9 @@
+
+._1r04idpf{inset:0}._152tidpf{inset-block-start:0}
+._1bah1h6o{justify-content:center}
+._1e0c1txw{display:flex}
+._4cvr1h6o{align-items:center}
+._6rth1ejb{margin-block-end:var(--ds-space-300,24px)}
+._kqswh2mm{position:relative}
+._kqswstnw{position:absolute}
+._lcxvglyw{pointer-events:none}