@atlaskit/table 0.11.7 → 0.12.1

package/dist/esm/ui/thead.compiled.css

@@ -0,0 +1,7 @@
+
+._19itglyw{border:none}
+._1r04idpf{inset:0}._179r1n0b{border-block-end:var(--_ukuvb0)}
+._mqm21vrj{border-block-start:2px solid transparent}
+._1pbykb7n{z-index:1}
+._bfhkvuon{background-color:var(--ds-surface,#fff)}
+._kqsw1if8{position:sticky}

package/dist/esm/ui/thead.js

@@ -1,19 +1,8 @@
-/**
- * @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 baseStyles = css({
-  position: 'sticky',
-  zIndex: 1,
-  inset: 0,
-  backgroundColor: "var(--ds-surface, white)",
-  border: 'none',
-  borderBlockEnd: "2px solid ".concat("var(--ds-border, #eee)"),
-  borderBlockStart: '2px solid transparent'
-});
+/* thead.tsx generated by @compiled/babel-plugin v0.36.1 */
+import "./thead.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+var baseStyles = null;
 
 /**
  * __THead__
@@ -24,7 +13,10 @@ var baseStyles = css({
  */
 export var THead = function THead(_ref) {
   var children = _ref.children;
-  return jsx("thead", {
-    css: baseStyles
+  return /*#__PURE__*/React.createElement("thead", {
+    className: ax(["_1r04idpf _19itglyw _179r1n0b _mqm21vrj _kqsw1if8 _1pbykb7n _bfhkvuon"]),
+    style: {
+      "--_ukuvb0": ix("2px solid ".concat("var(--ds-border, #eee)"))
+    }
   }, children);
 };

package/dist/esm/ui/tr.compiled.css

@@ -0,0 +1,11 @@
+
+._19itglyw{border:none}._179rmc7d{border-block-end:var(--_1748cv6)}
+._4t3i1wto{height:3rem}
+._bfhkcslv{background-color:var(--ds-background-selected,#deebff88)}
+._bfhkm7j4{background-color:var(--ds-background-neutral,#091e420f)}
+._btyzidpf{border-spacing:0}
+._hpylidpf{border-image-width:0}
+._kqswh2mm{position:relative}
+._x6vyglyw:focus-visible:after{box-shadow:none}
+._irr3134o:hover{background-color:var(--ds-background-neutral-subtle-hovered,#f8f8f8)}
+._irr3quvt:hover{background-color:var(--ds-background-selected-hovered,#deebff)}

package/dist/esm/ui/tr.js

@@ -1,36 +1,12 @@
-/**
- * @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';
+/* tr.tsx generated by @compiled/babel-plugin v0.36.1 */
+import "./tr.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import FocusRing from '@atlaskit/focus-ring';
-var baseStyles = css({
-  height: '3rem',
-  position: 'relative',
-  border: 'none',
-  borderImageWidth: 0,
-  borderSpacing: 0
-});
-var selectedStyles = css({
-  backgroundColor: "var(--ds-background-selected, #DEEBFF88)",
-  '&:hover': {
-    backgroundColor: "var(--ds-background-selected-hovered, #DEEBFF)" // B50
-  }
-});
-var subitemStyles = css({
-  backgroundColor: "var(--ds-background-neutral, #091E420F)"
-});
-var bodyRowStyles = css({
-  borderBlockEnd: "1px solid ".concat("var(--ds-border, #eee)"),
-  '&:hover': {
-    backgroundColor: "var(--ds-background-neutral-subtle-hovered, #f8f8f8)"
-  },
-  '&:focus-visible::after': {
-    boxShadow: 'none'
-  }
-});
+var baseStyles = null;
+var selectedStyles = null;
+var subitemStyles = null;
+var bodyRowStyles = null;
 /**
  * __Row__
  *
@@ -45,12 +21,15 @@ export var TR = function TR(_ref) {
     _ref$isBodyRow = _ref.isBodyRow,
     isBodyRow = _ref$isBodyRow === void 0 ? true : _ref$isBodyRow,
     isSubitem = _ref.isSubitem;
-  return jsx(FocusRing, {
+  return /*#__PURE__*/React.createElement(FocusRing, {
     isInset: true
-  }, jsx("tr", {
+  }, /*#__PURE__*/React.createElement("tr", {
     tabIndex: -1,
     "aria-selected": isSelected,
     "data-testid": testId,
-    css: [baseStyles, isBodyRow && bodyRowStyles, isSelected && selectedStyles, isSubitem && subitemStyles]
+    className: ax(["_19itglyw _4t3i1wto _kqswh2mm _hpylidpf _btyzidpf", isBodyRow && "_179rmc7d _x6vyglyw _irr3134o", isSelected && "_bfhkcslv _irr3quvt", isSubitem && "_bfhkm7j4"]),
+    style: {
+      "--_1748cv6": ix("1px solid ".concat("var(--ds-border, #eee)"))
+    }
   }, children));
 };

package/dist/types/body.d.ts

@@ -1,9 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { type ReactElement } from 'react';
-import { jsx } from '@emotion/react';
+import React, { type ReactElement } from 'react';
 type BodyProps<Item extends object> = {
     rows: Item[];
     children: (row: Item) => ReactElement;
@@ -14,5 +9,5 @@ type BodyProps<Item extends object> = {
 /**
  * __Table body__
  */
-declare function TBody<ObjectType extends object>({ rows, children }: BodyProps<ObjectType>): jsx.JSX.Element;
+declare function TBody<ObjectType extends object>({ rows, children }: BodyProps<ObjectType>): React.JSX.Element;
 export default TBody;

package/dist/types/expandable-cell.d.ts

@@ -1,10 +1,9 @@
-/// <reference types="react" />
-import { jsx } from '@emotion/react';
+import React from 'react';
 /**
  * __Expandable cell__
  *
  * A cell with an expand button that controls the expanded state
  * of the `<ExpandableRow>`.
  */
-declare const ExpandableCell: import("react").MemoExoticComponent<() => jsx.JSX.Element>;
+declare const ExpandableCell: React.MemoExoticComponent<() => React.JSX.Element>;
 export default ExpandableCell;

package/dist/types/head-cell.d.ts

@@ -1,8 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import type { FC } from 'react';
+import { type FC } from 'react';
 import { type THProps } from './ui/th';
 /**
  * __HeadCell__

package/dist/types/row.d.ts

@@ -1,7 +1,3 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import { type FC, type ReactNode } from 'react';
 type RowProps = {
     /**

package/dist/types/selectable-cell.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-declare const SelectableCell: import("react").NamedExoticComponent<{}>;
+import React from 'react';
+declare const SelectableCell: React.NamedExoticComponent<{}>;
 export default SelectableCell;

package/dist/types/table.d.ts

@@ -1,9 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { type ReactElement } from 'react';
-import { jsx } from '@emotion/react';
+import React, { type ReactElement } from 'react';
 import { type SortKey } from './hooks/use-table';
 type TableProps<ItemType extends object = {}> = {
     /**
@@ -29,5 +24,5 @@ type TableProps<ItemType extends object = {}> = {
  *
  * - [Examples](https://atlassian.design/components/table/examples)
  */
-declare function Table<ItemType extends object = object>({ children, isSelectable, sortKey, testId, }: TableProps<ItemType>): jsx.JSX.Element;
+declare function Table<ItemType extends object = object>({ children, isSelectable, sortKey, testId, }: TableProps<ItemType>): React.JSX.Element;
 export default Table;

package/dist/types/thead.d.ts

@@ -1,7 +1,3 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import { type FC, type ReactNode } from 'react';
 type THeadProps = {
     actions?: (selected: number[]) => ReactNode;

package/dist/types/ui/expand-icon.d.ts

@@ -1,10 +1,9 @@
-/// <reference types="react" />
-import { jsx } from '@emotion/react';
+import React from 'react';
 /**
  * __Expand icon__
  *
  * An icon used to display the expanded state in an `<ExpandableCell>`.
  */
-export declare const ExpandIcon: import("react").MemoExoticComponent<({ isExpanded }: {
+export declare const ExpandIcon: React.MemoExoticComponent<({ isExpanded }: {
     isExpanded: boolean;
-}) => jsx.JSX.Element>;
+}) => React.JSX.Element>;

package/dist/types/ui/sort-icon.d.ts

@@ -1,7 +1,3 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import { type FC } from 'react';
 /**
  * __SortIcon__

package/dist/types/ui/table.d.ts

@@ -1,7 +1,3 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import { type FC, type ReactNode } from 'react';
 type TableProps = {
     /**

package/dist/types/ui/td.d.ts

@@ -1,8 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import type { FC } from 'react';
+import { type FC } from 'react';
 import { type BaseCellProps } from './base-cell';
 /**
  * __Cell__

package/dist/types-ts4.5/body.d.ts

@@ -1,9 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { type ReactElement } from 'react';
-import { jsx } from '@emotion/react';
+import React, { type ReactElement } from 'react';
 type BodyProps<Item extends object> = {
     rows: Item[];
     children: (row: Item) => ReactElement;
@@ -14,5 +9,5 @@ type BodyProps<Item extends object> = {
 /**
  * __Table body__
  */
-declare function TBody<ObjectType extends object>({ rows, children }: BodyProps<ObjectType>): jsx.JSX.Element;
+declare function TBody<ObjectType extends object>({ rows, children }: BodyProps<ObjectType>): React.JSX.Element;
 export default TBody;

package/dist/types-ts4.5/expandable-cell.d.ts

@@ -1,10 +1,9 @@
-/// <reference types="react" />
-import { jsx } from '@emotion/react';
+import React from 'react';
 /**
  * __Expandable cell__
  *
  * A cell with an expand button that controls the expanded state
  * of the `<ExpandableRow>`.
  */
-declare const ExpandableCell: import("react").MemoExoticComponent<() => jsx.JSX.Element>;
+declare const ExpandableCell: React.MemoExoticComponent<() => React.JSX.Element>;
 export default ExpandableCell;

package/dist/types-ts4.5/head-cell.d.ts

@@ -1,8 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import type { FC } from 'react';
+import { type FC } from 'react';
 import { type THProps } from './ui/th';
 /**
  * __HeadCell__

package/dist/types-ts4.5/row.d.ts

@@ -1,7 +1,3 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import { type FC, type ReactNode } from 'react';
 type RowProps = {
     /**

package/dist/types-ts4.5/selectable-cell.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-declare const SelectableCell: import("react").NamedExoticComponent<{}>;
+import React from 'react';
+declare const SelectableCell: React.NamedExoticComponent<{}>;
 export default SelectableCell;

package/dist/types-ts4.5/table.d.ts

@@ -1,9 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { type ReactElement } from 'react';
-import { jsx } from '@emotion/react';
+import React, { type ReactElement } from 'react';
 import { type SortKey } from './hooks/use-table';
 type TableProps<ItemType extends object = {}> = {
     /**
@@ -29,5 +24,5 @@ type TableProps<ItemType extends object = {}> = {
  *
  * - [Examples](https://atlassian.design/components/table/examples)
  */
-declare function Table<ItemType extends object = object>({ children, isSelectable, sortKey, testId, }: TableProps<ItemType>): jsx.JSX.Element;
+declare function Table<ItemType extends object = object>({ children, isSelectable, sortKey, testId, }: TableProps<ItemType>): React.JSX.Element;
 export default Table;

package/dist/types-ts4.5/thead.d.ts

@@ -1,7 +1,3 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import { type FC, type ReactNode } from 'react';
 type THeadProps = {
     actions?: (selected: number[]) => ReactNode;

package/dist/types-ts4.5/ui/expand-icon.d.ts

@@ -1,10 +1,9 @@
-/// <reference types="react" />
-import { jsx } from '@emotion/react';
+import React from 'react';
 /**
  * __Expand icon__
  *
  * An icon used to display the expanded state in an `<ExpandableCell>`.
  */
-export declare const ExpandIcon: import("react").MemoExoticComponent<({ isExpanded }: {
+export declare const ExpandIcon: React.MemoExoticComponent<({ isExpanded }: {
     isExpanded: boolean;
-}) => jsx.JSX.Element>;
+}) => React.JSX.Element>;

package/dist/types-ts4.5/ui/sort-icon.d.ts

@@ -1,7 +1,3 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import { type FC } from 'react';
 /**
  * __SortIcon__

package/dist/types-ts4.5/ui/table.d.ts

@@ -1,7 +1,3 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import { type FC, type ReactNode } from 'react';
 type TableProps = {
     /**

package/dist/types-ts4.5/ui/td.d.ts

@@ -1,8 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import type { FC } from 'react';
+import { type FC } from 'react';
 import { type BaseCellProps } from './base-cell';
 /**
  * __Cell__

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/table",
-	"version": "0.11.7",
+	"version": "0.12.1",
 	"description": "A table is used to display data.",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -14,8 +14,8 @@
 			"name": "Table",
 			"category": "Text and data display",
 			"status": {
-				"type": "alpha",
-				"description": "This package is an experiment, and is currently deprioritised. It is not recommended for use in production, and we are not providing support for it at this time. Consider using [@atlaskit/dynamic-table](/components/dynamic-table) instead."
+				"type": "intent-to-deprecate",
+				"description": "This package was an experiment, and is currently deprioritized. It is not recommended for use in production, and we are not providing support for it at this time. Consider using [@atlaskit/dynamic-table](/components/dynamic-table) instead."
 			}
 		},
 		"runReact18": true
@@ -42,17 +42,17 @@
 		"./primitives": "./src/ui/index.tsx"
 	},
 	"dependencies": {
-		"@atlaskit/button": "^23.0.0",
+		"@atlaskit/button": "^23.2.0",
 		"@atlaskit/checkbox": "^17.1.0",
 		"@atlaskit/ds-lib": "^4.0.0",
 		"@atlaskit/focus-ring": "^3.0.0",
-		"@atlaskit/icon": "^26.0.0",
-		"@atlaskit/primitives": "^14.7.0",
-		"@atlaskit/tokens": "^4.8.0",
-		"@atlaskit/tooltip": "^20.0.0",
+		"@atlaskit/icon": "^26.4.0",
+		"@atlaskit/primitives": "^14.8.0",
+		"@atlaskit/tokens": "^5.0.0",
+		"@atlaskit/tooltip": "^20.2.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
 		"@babel/runtime": "^7.0.0",
-		"@emotion/react": "^11.7.1",
+		"@compiled/react": "^0.18.3",
 		"tiny-invariant": "^1.2.0"
 	},
 	"peerDependencies": {
@@ -61,7 +61,7 @@
 	"devDependencies": {
 		"@af/accessibility-testing": "workspace:^",
 		"@af/integration-testing": "workspace:^",
-		"@atlaskit/avatar": "^25.0.0",
+		"@atlaskit/avatar": "^25.1.0",
 		"@atlaskit/date": "^2.0.0",
 		"@atlaskit/docs": "^10.0.0",
 		"@atlaskit/dynamic-table": "^18.1.0",