@atlaskit/table 0.4.0 → 0.4.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/table
 
+## 0.4.2
+
+### Patch Changes
+
+- [`9d00501a414`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9d00501a414) - Ensure legacy types are published for TS 4.5-4.8
+
+## 0.4.1
+
+### Patch Changes
+
+- [`41fae2c6f68`](https://bitbucket.org/atlassian/atlassian-frontend/commits/41fae2c6f68) - Upgrade Typescript from `4.5.5` to `4.9.5`
+
 ## 0.4.0
 
 ### Minor Changes

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/table",
-	"version": "0.4.0",
+	"version": "0.4.2",
 	"sideEffects": false
 }

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/table",
-	"version": "0.4.0",
+	"version": "0.4.2",
 	"sideEffects": false
 }

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/table",
-	"version": "0.4.0",
+	"version": "0.4.2",
 	"sideEffects": false
 }

package/dist/types/body.d.ts

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { ReactElement } from 'react';
 import { jsx } from '@emotion/react';
-export declare type BodyProps<Item extends object> = {
+export type BodyProps<Item extends object> = {
     rows: Item[];
     children: (row: Item) => ReactElement;
 } | {

package/dist/types/expandable-row-content.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-declare type ExpandableRowContentProps = {
+type ExpandableRowContentProps = {
     children?: React.ReactNode;
 };
 /**

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

@@ -1,5 +1,5 @@
 import React from 'react';
-declare type ExpandableRowProps = {
+type ExpandableRowProps = {
     children: React.ReactNode;
     /**
      * Controlled: If the row is expanded.

package/dist/types/hooks/selection-provider.d.ts

@@ -1,6 +1,6 @@
 import React, { FC, ReactNode } from 'react';
 import { SelectableActions, SelectableState } from './use-selectable';
-declare type SelectionContext = [
+type SelectionContext = [
     SelectableState,
     /**
      * Context actions will be undefined without a `SelectionProvider` mounted.

package/dist/types/hooks/use-expand-content.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-declare type ExpandContentContext = {
+type ExpandContentContext = {
     isExpandableContent: boolean;
 };
 declare const ExpandContentContext: React.Context<ExpandContentContext>;

package/dist/types/hooks/use-expand.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-declare type ExpandContextState = {
+type ExpandContextState = {
     isExpanded: boolean;
     toggleExpanded(): void;
 };

package/dist/types/hooks/use-selectable.d.ts

@@ -1,4 +1,4 @@
-export declare type SelectableState = {
+export type SelectableState = {
     /**
      * The localised ids that have been checked.
      */
@@ -27,7 +27,7 @@ export declare type SelectableState = {
      */
     previousSelection: number[];
 };
-export declare type SelectableActions = {
+export type SelectableActions = {
     setAll: () => void;
     removeAll: () => void;
     toggleSelection: (id: number, shiftHeld: boolean) => void;

package/dist/types/hooks/use-table.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-export declare type SortDirection = 'ascending' | 'descending';
-export declare type SortKey<Key extends string | symbol | number> = Key | 'unset';
-export declare type TableContext<T, K extends keyof T = keyof T> = {
+export type SortDirection = 'ascending' | 'descending';
+export type SortKey<Key extends string | symbol | number> = Key | 'unset';
+export type TableContext<T, K extends keyof T = keyof T> = {
     isSelectable?: boolean;
     sortKey: SortKey<K>;
     sortDirection?: SortDirection;

package/dist/types/row.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { FC, ReactNode } from 'react';
-export declare type RowProps = {
+export type RowProps = {
     /**
      * A `testId` prop is a unique string that appears as a data attribute `data-testid`
      * in the rendered code, serving as a hook for automated tests.

package/dist/types/table.d.ts

@@ -2,7 +2,7 @@
 import { ReactElement } from 'react';
 import { jsx } from '@emotion/react';
 import { SortKey } from './hooks/use-table';
-export declare type TableProps<ItemType extends object = {}> = {
+export type TableProps<ItemType extends object = {}> = {
     /**
      * A `testId` prop is a unique string that appears as a data attribute `data-testid`
      * in the rendered code, serving as a hook for automated tests.

package/dist/types/thead.d.ts

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

package/dist/types/ui/base-cell.d.ts

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { ReactNode } from 'react';
 import { BoxProps } from '@atlaskit/ds-explorations/box';
-export declare type BaseCellProps = {
+export type BaseCellProps = {
     /**
      * A percentage of pixel width of the table to apply to a column.
      */
@@ -37,7 +37,7 @@ export declare type BaseCellProps = {
 /**
  * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-sort
  */
-export declare type SortDirection = 'ascending' | 'descending' | 'none' | 'other';
+export type SortDirection = 'ascending' | 'descending' | 'none' | 'other';
 declare const alignMap: {
     readonly text: import("@emotion/react").SerializedStyles;
     readonly number: import("@emotion/react").SerializedStyles;

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

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { ReactNode } from 'react';
 import { jsx } from '@emotion/react';
-declare type ExpandableCellProps = {
+type ExpandableCellProps = {
     as: 'td' | 'th';
     children?: ReactNode;
 };

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

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { ReactNode } from 'react';
 import { jsx } from '@emotion/react';
-declare type SelectableCellProps = {
+type SelectableCellProps = {
     as: 'td' | 'th';
     children?: ReactNode;
 };

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

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { FC, ReactNode } from 'react';
-declare type TableProps = {
+type TableProps = {
     /**
      * A `testId` prop is a unique string that appears as a data attribute `data-testid`
      * in the rendered code, serving as a hook for automated tests.

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

@@ -1,7 +1,7 @@
 import { FC } from 'react';
 import { BaseCellProps, SortDirection } from './base-cell';
-export declare type THProps = Omit<BaseCellProps, 'as'>;
-declare type InternalTHProps = THProps & {
+export type THProps = Omit<BaseCellProps, 'as'>;
+type InternalTHProps = THProps & {
     sortDirection?: SortDirection;
 };
 /**

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

@@ -0,0 +1,15 @@
+/** @jsx jsx */
+import { ReactElement } from 'react';
+import { jsx } from '@emotion/react';
+export type BodyProps<Item extends object> = {
+    rows: Item[];
+    children: (row: Item) => ReactElement;
+} | {
+    rows?: never;
+    children: ReactElement[] | ReactElement;
+};
+/**
+ * __Table body__
+ */
+declare function TBody<ObjectType extends object>({ rows, children, }: BodyProps<ObjectType>): jsx.JSX.Element;
+export default TBody;

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

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { jsx } from '@emotion/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>;
+export default ExpandableCell;

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

@@ -0,0 +1,12 @@
+import React from 'react';
+type ExpandableRowContentProps = {
+    children?: React.ReactNode;
+};
+/**
+ * __Expandable row content__
+ *
+ * Contains expandable content. Uses a context provider to allow children
+ * to identify if they are expandable content.
+ */
+declare const ExpandableRowContent: ({ children }: ExpandableRowContentProps) => JSX.Element;
+export default ExpandableRowContent;

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

@@ -0,0 +1,19 @@
+import React from 'react';
+type ExpandableRowProps = {
+    children: React.ReactNode;
+    /**
+     * Controlled: If the row is expanded.
+     */
+    isExpanded?: boolean;
+    /**
+     * Uncontrolled: If the row is expanded by default.
+     */
+    isDefaultExpanded?: boolean;
+};
+/**
+ * __Expandable row__
+ *
+ * A context provider for `<Row>` to support expandable content.
+ */
+declare const ExpandableRow: ({ children, isExpanded, isDefaultExpanded, }: ExpandableRowProps) => JSX.Element;
+export default ExpandableRow;

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

@@ -0,0 +1,10 @@
+/** @jsx jsx */
+import type { FC } from 'react';
+import { THProps } from './ui/th';
+/**
+ * __HeadCell__
+ *
+ * HeadCell element
+ */
+declare const HeadCell: FC<THProps>;
+export default HeadCell;

package/dist/types-ts4.5/hooks/selection-provider.d.ts

@@ -0,0 +1,20 @@
+import React, { FC, ReactNode } from 'react';
+import { SelectableActions, SelectableState } from './use-selectable';
+type SelectionContext = [
+    SelectableState,
+    /**
+     * Context actions will be undefined without a `SelectionProvider` mounted.
+     */
+    SelectableActions | Partial<SelectableActions>
+];
+declare const SelectionContext: React.Context<SelectionContext>;
+/**
+ * __Selection provider__
+ *
+ * A selection provider injects selection specific state into the table.
+ */
+declare const SelectionProvider: FC<{
+    children: ReactNode;
+}>;
+export declare const useSelection: () => SelectionContext;
+export default SelectionProvider;

package/dist/types-ts4.5/hooks/use-expand-content.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+type ExpandContentContext = {
+    isExpandableContent: boolean;
+};
+declare const ExpandContentContext: React.Context<ExpandContentContext>;
+/**
+ * __Expand content provider__
+ *
+ * An expand content provider allows `<Row>` to determine if it is a subitem.
+ */
+export declare const ExpandContentContextProvider: ({ children, }: {
+    children: React.ReactNode;
+}) => JSX.Element;
+declare const useExpandContent: () => ExpandContentContext;
+export default useExpandContent;

package/dist/types-ts4.5/hooks/use-expand.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+type ExpandContextState = {
+    isExpanded: boolean;
+    toggleExpanded(): void;
+};
+/**
+ * __Expand context provider__
+ *
+ * An expand context provider.
+ */
+export declare const ExpandContextProvider: ({ children, isExpanded: isExpandedProp, isDefaultExpanded, }: {
+    children: React.ReactNode;
+    isExpanded?: boolean | undefined;
+    isDefaultExpanded?: boolean | undefined;
+}) => JSX.Element;
+declare const useExpand: () => ExpandContextState;
+export default useExpand;

package/dist/types-ts4.5/hooks/use-row-id.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+/**
+ * @internal
+ */
+export declare const useRowId: () => number | undefined;
+/**
+ * __Row provider__
+ * @internal
+ */
+export declare const RowProvider: import("react").Provider<number | undefined>;

package/dist/types-ts4.5/hooks/use-selectable.d.ts

@@ -0,0 +1,41 @@
+export type SelectableState = {
+    /**
+     * The localised ids that have been checked.
+     */
+    checked: number[];
+    /**
+     * Whether all list items are checked.
+     */
+    allChecked: boolean;
+    /**
+     * Whether any single row item is checked.
+     */
+    anyChecked: boolean;
+    /**
+     * Equal to the data length of the table, i.e. the maximum number of checked items.
+     */
+    maxChecked: number;
+    /**
+     * Indicates where a selection begins, i.e. the last selection where the Shift key was **not pressed**
+     */
+    selectionStart: number;
+    /**
+     * Indicates the most recent selection range where the Shift key was pressed.
+     * This provides the ability to uncheck ids that are not part of a new selection range, but were in the previous selection range,
+     * mimicking behaviour such as that in macOS
+     * e.g. [2, 3, 4] indicates ids from 2 to 4 were selected the last time the Shift key was pressed.
+     */
+    previousSelection: number[];
+};
+export type SelectableActions = {
+    setAll: () => void;
+    removeAll: () => void;
+    toggleSelection: (id: number, shiftHeld: boolean) => void;
+    setMax: (max: number) => void;
+};
+export declare const defaultSelectableState: SelectableState;
+declare function useSelectable(): [
+    SelectableState,
+    SelectableActions
+];
+export default useSelectable;

package/dist/types-ts4.5/hooks/use-sorting.d.ts

@@ -0,0 +1,7 @@
+import { SortDirection, SortKey } from './use-table';
+export declare const useSorting: <ItemType extends object>(sortKey: SortKey<keyof ItemType>) => {
+    sortKey: "unset" | keyof ItemType;
+    sortDirection: SortDirection | undefined;
+    setSortState: (key: SortKey<keyof ItemType>) => void;
+    sortFn: (rowA: ItemType, rowB: ItemType) => number;
+};

package/dist/types-ts4.5/hooks/use-table-body.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+/**
+ * __Table body provider__
+ * Ensures correct nesting of table elements.
+ */
+export declare const TableBodyProvider: import("react").Provider<boolean>;
+export declare const useTableBody: () => void;

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

@@ -0,0 +1,22 @@
+import React from 'react';
+export type SortDirection = 'ascending' | 'descending';
+export type SortKey<Key extends string | symbol | number> = Key | 'unset';
+export type TableContext<T, K extends keyof T = keyof T> = {
+    isSelectable?: boolean;
+    sortKey: SortKey<K>;
+    sortDirection?: SortDirection;
+    sortFn?: (a: T, b: T) => number;
+    setSortState: (key: SortKey<K>) => void;
+};
+/**
+ * __Table state provider__
+ *
+ * The table context provides the data required for more complex functionality.
+ *
+ * - [Examples](https://atlassian.design/components/table/examples)
+ */
+export declare function TableProvider<T extends object>({ children, state, }: {
+    children: React.ReactNode;
+    state: TableContext<T>;
+}): JSX.Element;
+export declare const useTable: <TableItem extends object>() => TableContext<TableItem, keyof TableItem>;

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

@@ -0,0 +1,10 @@
+export { default } from './table';
+export { default as TBody } from './body';
+export { default as Row } from './row';
+export { TD as Cell } from './ui';
+export { default as ExpandableCell } from './expandable-cell';
+export { default as ExpandableRow } from './expandable-row';
+export { default as ExpandableRowContent } from './expandable-row-content';
+export { default as HeadCell } from './head-cell';
+export { default as SortableColumn } from './sortable-column';
+export { default as THead } from './thead';

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

@@ -0,0 +1,22 @@
+/** @jsx jsx */
+import { FC, ReactNode } from 'react';
+export type RowProps = {
+    /**
+     * A `testId` prop is a unique string that appears as a data attribute `data-testid`
+     * in the rendered code, serving as a hook for automated tests.
+     */
+    testId?: string;
+    /**
+     * Content of the row.
+     */
+    children?: ReactNode;
+};
+/**
+ * __Row__
+ *
+ * A table row.
+ *
+ * - [Examples](https://atlassian.design/components/table/examples)
+ */
+declare const Row: FC<RowProps>;
+export default Row;

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

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

package/dist/types-ts4.5/sortable-column.d.ts

@@ -0,0 +1,22 @@
+/** @jsx jsx */
+import { FC, ReactNode } from 'react';
+export interface CellProps {
+    /**
+     * Unique key used for sorting table data by this column
+     */
+    name: string;
+    /**
+     * A `testId` prop is a unique string that appears as a data attribute `data-testid`
+     * in the rendered code, serving as a hook for automated tests.
+     */
+    testId?: string;
+    onClick?: React.MouseEventHandler;
+    children?: ReactNode;
+}
+/**
+ * __SortableColumn__
+ *
+ * SortableColumn is used in place of the default Column when sorting is desired.
+ */
+declare const SortableColumn: FC<CellProps>;
+export default SortableColumn;

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

@@ -0,0 +1,30 @@
+/** @jsx jsx */
+import { ReactElement } from 'react';
+import { jsx } from '@emotion/react';
+import { SortKey } from './hooks/use-table';
+export type TableProps<ItemType extends object = {}> = {
+    /**
+     * A `testId` prop is a unique string that appears as a data attribute `data-testid`
+     * in the rendered code, serving as a hook for automated tests.
+     */
+    testId?: string;
+    /**
+     * default sort key to be applied. If unspecified will use default ordering
+     */
+    sortKey?: SortKey<keyof ItemType>;
+    children: ReactElement[] | ReactElement;
+} & ({
+    isSelectable: true;
+    defaultSelected?: number;
+} | {
+    isSelectable?: false;
+});
+/**
+ * __Table__
+ *
+ * A data table is used to display dynamic data.
+ *
+ * - [Examples](https://atlassian.design/components/table/examples)
+ */
+declare function Table<ItemType extends object = object>({ children, isSelectable, sortKey, testId, }: TableProps<ItemType>): jsx.JSX.Element;
+export default Table;

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

@@ -0,0 +1,8 @@
+/** @jsx jsx */
+import { FC, ReactNode } from 'react';
+type THeadProps = {
+    actions?: (selected: number[]) => ReactNode;
+    children?: ReactNode;
+};
+declare const THead: FC<THeadProps>;
+export default THead;

package/dist/types-ts4.5/ui/base-cell.d.ts

@@ -0,0 +1,88 @@
+/** @jsx jsx */
+import { ReactNode } from 'react';
+import { BoxProps } from '@atlaskit/ds-explorations/box';
+export type BaseCellProps = {
+    /**
+     * A percentage of pixel width of the table to apply to a column.
+     */
+    width?: string;
+    /**
+     * Horizontal alignment of content.
+     */
+    align?: keyof typeof alignMap;
+    /**
+     * Whether the cell should render as a `td` or `th` element.
+     */
+    as?: 'td' | 'th';
+    /**
+     * Same behavior as the HTML attribute.
+     *
+     * @see 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th#attr-scope'
+     */
+    scope?: 'col' | 'row';
+    /**
+     * A `testId` prop is a unique string that appears as a data attribute `data-testid`
+     * in the rendered code, serving as a hook for automated tests.
+     */
+    testId?: string;
+    /**
+     * Content of the cell.
+     */
+    children?: ReactNode;
+    /**
+     * Number of columns to span.
+     */
+    colSpan?: number;
+} & Pick<BoxProps, 'paddingBlock' | 'paddingInline' | 'backgroundColor' | 'className'>;
+/**
+ * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-sort
+ */
+export type SortDirection = 'ascending' | 'descending' | 'none' | 'other';
+declare const alignMap: {
+    readonly text: import("@emotion/react").SerializedStyles;
+    readonly number: import("@emotion/react").SerializedStyles;
+    readonly icon: import("@emotion/react").SerializedStyles;
+};
+/**
+ * __BaseCell__
+ *
+ * @internal
+ *
+ * Basic cell element.
+ */
+export declare const BaseCell: import("react").ForwardRefExoticComponent<{
+    /**
+     * A percentage of pixel width of the table to apply to a column.
+     */
+    width?: string | undefined;
+    /**
+     * Horizontal alignment of content.
+     */
+    align?: "number" | "text" | "icon" | undefined;
+    /**
+     * Whether the cell should render as a `td` or `th` element.
+     */
+    as?: "td" | "th" | undefined;
+    /**
+     * Same behavior as the HTML attribute.
+     *
+     * @see 'https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th#attr-scope'
+     */
+    scope?: "col" | "row" | undefined;
+    /**
+     * A `testId` prop is a unique string that appears as a data attribute `data-testid`
+     * in the rendered code, serving as a hook for automated tests.
+     */
+    testId?: string | undefined;
+    /**
+     * Content of the cell.
+     */
+    children?: ReactNode;
+    /**
+     * Number of columns to span.
+     */
+    colSpan?: number | undefined;
+} & Pick<BoxProps<"div">, "className" | "backgroundColor" | "paddingBlock" | "paddingInline"> & {
+    sortDirection?: SortDirection | undefined;
+} & import("react").RefAttributes<HTMLTableCellElement>>;
+export {};

package/dist/types-ts4.5/ui/bulk-action-overlay.d.ts

@@ -0,0 +1,10 @@
+/** @jsx jsx */
+import { FC, ReactNode } from 'react';
+/**
+ * __Bulk action overlay__
+ *
+ * A bulk action overlay is used to conditionally render when a user makes a row selection
+ */
+export declare const BulkActionOverlay: FC<{
+    children: ReactNode;
+}>;

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

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

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

@@ -0,0 +1,14 @@
+/** @jsx jsx */
+import { ReactNode } from 'react';
+import { jsx } from '@emotion/react';
+type ExpandableCellProps = {
+    as: 'td' | 'th';
+    children?: ReactNode;
+};
+/**
+ * __Expandable cell__
+ *
+ * An expandable cell primitive designed to be used for light weight composition.
+ */
+export declare const ExpandableCell: ({ children, as }: ExpandableCellProps) => jsx.JSX.Element;
+export {};

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

@@ -0,0 +1,14 @@
+/**
+ * File exposes the HTML table primitives for use
+ */
+export { Table } from './table';
+export { TBody } from './tbody';
+export { TR } from './tr';
+export { TD } from './td';
+export { TH } from './th';
+export { SelectableCell } from './selectable-cell';
+export { ExpandableCell } from './expandable-cell';
+export { ExpandIcon } from './expand-icon';
+export { THead } from './thead';
+export { BulkActionOverlay } from './bulk-action-overlay';
+export { SortIcon } from './sort-icon';

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

@@ -0,0 +1,14 @@
+/** @jsx jsx */
+import { ReactNode } from 'react';
+import { jsx } from '@emotion/react';
+type SelectableCellProps = {
+    as: 'td' | 'th';
+    children?: ReactNode;
+};
+/**
+ * __Selectable cell__
+ *
+ * A selectable cell primitive designed to be used for light weight composition.
+ */
+export declare const SelectableCell: ({ children, as }: SelectableCellProps) => jsx.JSX.Element;
+export {};

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

@@ -0,0 +1,10 @@
+/** @jsx jsx */
+import { FC } from 'react';
+/**
+ * __SortIcon__
+ *
+ * SortIcon is used to display the sort state in our SortableColumn.
+ */
+export declare const SortIcon: FC<{
+    name: string;
+}>;

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

@@ -0,0 +1,31 @@
+/** @jsx jsx */
+import { FC, ReactNode } from 'react';
+type TableProps = {
+    /**
+     * A `testId` prop is a unique string that appears as a data attribute `data-testid`
+     * in the rendered code, serving as a hook for automated tests.
+     */
+    testId?: string;
+    /**
+     * Accessible description of the table data.
+     *
+     * @see 'https://www.w3.org/WAI/EO/Drafts/tutorials/tables/summary/'
+     */
+    summary?: string;
+    /**
+     * Table content.
+     */
+    children: ReactNode;
+};
+/**
+ * __Table__
+ *
+ * A primitive table container. Applies the HTML native element with no other styling.
+ *
+ * - [Examples](https://atlassian.design/components/table/examples)
+ *
+ * @primitive
+ * @see https://hello.atlassian.net/wiki/spaces/DST/pages/1947062524/Dynamic+table+2.0+implementation+spec
+ */
+export declare const Table: FC<TableProps>;
+export {};

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

@@ -0,0 +1,10 @@
+/** @jsx jsx */
+import { FC, ReactNode } from 'react';
+/**
+ * __TBody__
+ * @primitive
+ */
+export declare const TBody: FC<{
+    children: ReactNode;
+}>;
+export default TBody;

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

@@ -0,0 +1,11 @@
+/** @jsx jsx */
+import type { FC } from 'react';
+import { BaseCellProps } from './base-cell';
+/**
+ * __Cell__
+ *
+ * A data cell.
+ *
+ * @primitive
+ */
+export declare const TD: FC<Omit<BaseCellProps, 'as'>>;

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

@@ -0,0 +1,15 @@
+import { FC } from 'react';
+import { BaseCellProps, SortDirection } from './base-cell';
+export type THProps = Omit<BaseCellProps, 'as'>;
+type InternalTHProps = THProps & {
+    sortDirection?: SortDirection;
+};
+/**
+ * __Head cell__
+ *
+ * A head cell.
+ *
+ * @primitive
+ */
+export declare const TH: FC<InternalTHProps>;
+export {};

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

@@ -0,0 +1,12 @@
+/** @jsx jsx */
+import type { FC, ReactNode } from 'react';
+/**
+ * __THead__
+ *
+ * A primitive table head container. Applies the HTML native element with minimal styling.
+ *
+ * @primitive
+ */
+export declare const THead: FC<{
+    children?: ReactNode;
+}>;

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

@@ -0,0 +1,34 @@
+/** @jsx jsx */
+import type { FC, ReactNode } from 'react';
+interface TRProps {
+    /**
+     * A `testId` prop is a unique string that appears as a data attribute `data-testid`
+     * in the rendered code, serving as a hook for automated tests.
+     */
+    testId?: string;
+    /**
+     * If the row has programatic selection applied.
+     */
+    isSelected?: boolean;
+    /**
+     * Adjust the behavior of the element depending on whether the row is in the `THead` or in the `TBody`.
+     */
+    isBodyRow?: boolean;
+    /**
+     * Content of the row.
+     */
+    children?: ReactNode;
+    /**
+     * If the row is a subitem (an expandable row nested under a parent).
+     */
+    isSubitem?: boolean;
+}
+/**
+ * __Row__
+ *
+ * A row primitive.
+ *
+ * - [Examples](https://atlassian.design/components/table/examples)
+ */
+export declare const TR: FC<TRProps>;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/table",
-  "version": "0.4.0",
+  "version": "0.4.2",
   "description": "A table is used to display data.",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -25,6 +25,14 @@
   "module": "dist/esm/index.js",
   "module:es2019": "dist/es2019/index.js",
   "types": "dist/types/index.d.ts",
+  "typesVersions": {
+    ">=4.5 <4.9": {
+      "*": [
+        "dist/types-ts4.5/*",
+        "dist/types-ts4.5/index.d.ts"
+      ]
+    }
+  },
   "sideEffects": false,
   "atlaskit:src": "src/index.tsx",
   "af:exports": {
@@ -33,13 +41,13 @@
   },
   "dependencies": {
     "@atlaskit/button": "^16.7.0",
-    "@atlaskit/checkbox": "^12.5.0",
+    "@atlaskit/checkbox": "^12.6.0",
     "@atlaskit/ds-explorations": "^2.1.0",
     "@atlaskit/ds-lib": "^2.2.0",
     "@atlaskit/focus-ring": "^1.3.0",
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/primitives": "^0.9.0",
-    "@atlaskit/tokens": "^1.3.0",
+    "@atlaskit/tokens": "^1.4.0",
     "@atlaskit/tooltip": "^17.8.0",
     "@atlaskit/visually-hidden": "^1.2.0",
     "@babel/runtime": "^7.0.0",
@@ -67,7 +75,7 @@
     "jest-axe": "^4.0.0",
     "react-dom": "^16.8.0",
     "storybook-addon-designs": "^6.3.1",
-    "typescript": "4.5.5",
+    "typescript": "~4.9.5",
     "wait-for-expect": "^1.2.0"
   },
   "techstack": {

package/primitives/package.json

@@ -6,9 +6,9 @@
   "sideEffects": false,
   "types": "../dist/types/ui/index.d.ts",
   "typesVersions": {
-    ">=4.0 <4.5": {
+    ">=4.5 <4.9": {
       "*": [
-        "../dist/types-ts4.0/ui/index.d.ts"
+        "../dist/types-ts4.5/ui/index.d.ts"
       ]
     }
   }

package/tmp/api-report-tmp.d.ts

@@ -0,0 +1,130 @@
+## API Report File for "@atlaskit/table"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+
+/// <reference types="react" />
+
+import { BoxProps } from '@atlaskit/ds-explorations/box';
+import { FC } from 'react';
+import { jsx } from '@emotion/react';
+import { MemoExoticComponent } from 'react';
+import { default as React_2 } from 'react';
+import { ReactElement } from 'react';
+import { ReactNode } from 'react';
+import { SerializedStyles } from '@emotion/react';
+
+// @public (undocumented)
+const alignMap: {
+    readonly text: SerializedStyles;
+    readonly number: SerializedStyles;
+    readonly icon: SerializedStyles;
+};
+
+// @public (undocumented)
+type BaseCellProps = {
+    width?: string;
+    align?: keyof typeof alignMap;
+    as?: 'td' | 'th';
+    scope?: 'col' | 'row';
+    testId?: string;
+    children?: ReactNode;
+    colSpan?: number;
+} & Pick<BoxProps, 'backgroundColor' | 'className' | 'paddingBlock' | 'paddingInline'>;
+
+// @public (undocumented)
+type BodyProps<Item extends object> = {
+    rows: Item[];
+    children: (row: Item) => ReactElement;
+} | {
+    rows?: never;
+    children: ReactElement | ReactElement[];
+};
+
+// @public
+export const Cell: FC<Omit<BaseCellProps, 'as'>>;
+
+// @public (undocumented)
+interface CellProps {
+    // (undocumented)
+    children?: ReactNode;
+    name: string;
+    // (undocumented)
+    onClick?: React.MouseEventHandler;
+    testId?: string;
+}
+
+// @public
+export const ExpandableCell: MemoExoticComponent<() => jsx.JSX.Element>;
+
+// @public
+export const ExpandableRow: ({ children, isExpanded, isDefaultExpanded, }: ExpandableRowProps) => JSX.Element;
+
+// @public
+export const ExpandableRowContent: ({ children }: ExpandableRowContentProps) => JSX.Element;
+
+// @public (undocumented)
+type ExpandableRowContentProps = {
+    children?: React_2.ReactNode;
+};
+
+// @public (undocumented)
+type ExpandableRowProps = {
+    children: React_2.ReactNode;
+    isExpanded?: boolean;
+    isDefaultExpanded?: boolean;
+};
+
+// @public
+export const HeadCell: FC<THProps>;
+
+// @public
+export const Row: FC<RowProps>;
+
+// @public (undocumented)
+type RowProps = {
+    testId?: string;
+    children?: ReactNode;
+};
+
+// @public
+export const SortableColumn: FC<CellProps>;
+
+// @public (undocumented)
+type SortKey<Key extends number | string | symbol> = 'unset' | Key;
+
+// @public
+function Table<ItemType extends object = object>({ children, isSelectable, sortKey, testId, }: TableProps<ItemType>): jsx.JSX.Element;
+export default Table;
+
+// @public (undocumented)
+type TableProps<ItemType extends object = {}> = {
+    testId?: string;
+    sortKey?: SortKey<keyof ItemType>;
+    children: ReactElement | ReactElement[];
+} & ({
+    isSelectable: true;
+    defaultSelected?: number;
+} | {
+    isSelectable?: false;
+});
+
+// @public
+export function TBody<ObjectType extends object>({ rows, children, }: BodyProps<ObjectType>): jsx.JSX.Element;
+
+// @public (undocumented)
+export const THead: FC<THeadProps>;
+
+// @public (undocumented)
+type THeadProps = {
+    actions?: (selected: number[]) => ReactNode;
+    children?: ReactNode;
+};
+
+// @public (undocumented)
+type THProps = Omit<BaseCellProps, 'as'>;
+
+// (No @packageDocumentation comment for this package)
+
+```