baseui 11.2.1 → 12.1.1

package/es/styles/__mocks__/styled.js

@@ -1,4 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
@@ -8,17 +8,16 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
-
-/* flowlint unclear-type:off */
 import * as React from 'react';
 import { getInitialStyle } from 'styletron-standard';
-import { LightTheme } from '../../themes/index.js';
-import createMockTheme from '../../test/create-mock-theme.js';
+import { LightTheme } from '../../themes';
+import createMockTheme from '../../test/create-mock-theme';
 const MOCK_THEME = createMockTheme(LightTheme);
 
 const IDENTITY = x => x;
 
 export function useStyletron() {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   function css(styles) {
     return {
       label: 'useStyletron mock describes the applied css properties',
@@ -27,7 +26,8 @@ export function useStyletron() {
   }
 
   return [css, MOCK_THEME];
-}
+} // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
 export function styled(ElementName, objOrFn = {}) {
   class MockStyledComponent extends React.Component {
     constructor(...args) {
@@ -63,6 +63,7 @@ export function styled(ElementName, objOrFn = {}) {
     }
 
     getPassedProps() {
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       const {
         forwardedRef,
         ...restProps
@@ -84,7 +85,7 @@ export function styled(ElementName, objOrFn = {}) {
       }, this.getPassedProps()));
     }
 
-  } // $FlowFixMe
+  } // @ts-expect-error
 
 
   _defineProperty(MockStyledComponent, "displayName", 'MockStyledComponent');
@@ -99,8 +100,10 @@ export function styled(ElementName, objOrFn = {}) {
   }, props)));
 }
 export const withStyle = styled;
-export function withWrapper(StyledElement, wrapperFn) {
-  // eslint-disable-next-line react/display-name
+export function withWrapper( // eslint-disable-next-line @typescript-eslint/no-explicit-any
+StyledElement, // eslint-disable-next-line @typescript-eslint/no-explicit-any
+wrapperFn) {
+  // eslint-disable-next-line react/display-name,@typescript-eslint/no-explicit-any
   return /*#__PURE__*/React.forwardRef((props, ref) => wrapperFn(StyledElement)({
     ref: ref,
     ...props,

package/es/styles/index.js

@@ -4,8 +4,9 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
-import { ThemeContext } from './theme-provider.js';
-export { createThemedStyled, createThemedWithStyle, createThemedUseStyletron, styled, withStyle, useStyletron, withWrapper } from './styled.js';
-export { hexToRgb, expandBorderStyles } from './util.js';
-export { default as ThemeProvider } from './theme-provider.js';
-export const ThemeConsumer = ThemeContext.Consumer;
+import { ThemeContext } from './theme-provider';
+export { createThemedStyled, createThemedWithStyle, createThemedUseStyletron, styled, withStyle, useStyletron, withWrapper } from './styled';
+export { hexToRgb, expandBorderStyles } from './util';
+export { default as ThemeProvider } from './theme-provider';
+export const ThemeConsumer = ThemeContext.Consumer;
+export * from './types';

package/es/styles/styled.js

@@ -1,4 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 /*
 Copyright (c) Uber Technologies, Inc.
@@ -9,7 +9,7 @@ LICENSE file in the root directory of this source tree.
 import * as React from 'react';
 import { createStyled, withStyle as styletronWithStyle, useStyletron as styletronUseStyletron, withWrapper as styletronWithWrapper } from 'styletron-react';
 import { driver, getInitialStyle } from 'styletron-standard';
-import { ThemeContext } from './theme-provider.js';
+import { ThemeContext } from './theme-provider';
 
 const wrapper = StyledComponent => {
   // eslint-disable-next-line react/display-name
@@ -19,46 +19,40 @@ const wrapper = StyledComponent => {
     $theme: theme
   }))));
 };
-/* eslint-disable flowtype/generic-spacing */
 
-/* flowlint unclear-type:off */
-
-
-/* eslint-enable flowtype/generic-spacing */
-
-/* flowlint unclear-type:error */
 export function createThemedStyled() {
   return createStyled({
     wrapper,
     getInitialStyle,
-    driver // flowlint-next-line unclear-type:off
+    driver // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
   });
 }
 export const styled = createThemedStyled();
 export function createThemedWithStyle() {
-  // flowlint-next-line unclear-type:off
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   return styletronWithStyle;
 }
 export const withStyle = createThemedWithStyle();
 export function createThemedUseStyletron() {
   return function () {
-    // flowlint-next-line unclear-type:off
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const theme = React.useContext(ThemeContext);
     const [css] = styletronUseStyletron();
     return [css, theme];
   };
 }
-export const useStyletron = createThemedUseStyletron();
-export function withWrapper( // flowlint-next-line unclear-type:off
-StyledElement, wrapperFn) {
-  // flowlint-next-line unclear-type:off
+export const useStyletron = createThemedUseStyletron(); // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+export function withWrapper(StyledElement, wrapperFn) {
   return styletronWithWrapper(StyledElement, Styled => {
-    // eslint-disable-next-line react/display-name
-    return /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, theme => wrapperFn(Styled)({
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any,react/display-name
+    return /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, theme => // @ts-ignore
+    wrapperFn(Styled)({
       ref: ref,
       ...props,
       $theme: theme
     })));
   });
-}
+}
+/** @deprecated use StyleFn instead. To be removed in future versions.*/

package/es/styles/theme-provider.js

@@ -5,7 +5,7 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
-import { LightTheme } from '../themes/index.js';
+import { LightTheme } from '../themes';
 export const ThemeContext = /*#__PURE__*/React.createContext(LightTheme);
 
 const ThemeProvider = props => {

package/es/styles/types.js

@@ -0,0 +1 @@
+export {};

package/es/table/filter.js

@@ -1,4 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 /*
 Copyright (c) Uber Technologies, Inc.
@@ -8,11 +8,11 @@ LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
 import FocusLock from 'react-focus-lock';
-import { Button, KIND, SIZE } from '../button/index.js';
-import { getOverrides } from '../helpers/overrides.js';
-import FilterIcon from '../icon/filter.js';
-import { StatefulPopover, PLACEMENT } from '../popover/index.js';
-import { StyledFilterButton, StyledFilterContent, StyledFilterHeading, StyledFilterFooter } from './styled-components.js';
+import { Button, KIND, SIZE } from '../button';
+import { getOverrides } from '../helpers/overrides';
+import FilterIcon from '../icon/filter';
+import { StatefulPopover, PLACEMENT } from '../popover';
+import { StyledFilterButton, StyledFilterContent, StyledFilterHeading, StyledFilterFooter } from './styled-components';
 export default function Filter(props) {
   const {
     onSelectAll = () => {},

package/es/table/index.js

@@ -4,10 +4,14 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
-export { default as SortableHeadCell, SortableHeadCellFactory } from './sortable-head-cell.js';
-export { default as Table } from './table.js';
-export { default as Filter } from './filter.js'; // Constants
+export { default as SortableHeadCell, SortableHeadCellFactory } from './sortable-head-cell';
+export { default as Table } from './table';
+export { default as Filter } from './filter'; // Constants
 
-export { SORT_DIRECTION } from './constants.js'; // Styled elements
+export { SORT_DIRECTION } from './constants'; // Styled elements
 
-export { StyledTable, StyledFilterButton, StyledFilterContent, StyledFilterHeading, StyledFilterFooter, StyledHead, StyledHeadCell, StyledBody, StyledRow, StyledCell, StyledAction, StyledSortableLabel } from './styled-components.js'; // Flow
+export { StyledTable, StyledFilterButton, StyledFilterContent, StyledFilterHeading, StyledFilterFooter, StyledHead, StyledHeadCell, StyledBody, StyledRow, StyledCell, StyledAction, StyledSortableLabel } from './styled-components'; // Flow
+
+export * from './types';
+/** @deprecated use HeadCellOverrides instead. To be removed in future versions.*/
+// eslint-disable-next-line @typescript-eslint/no-unused-vars

package/es/table/sortable-head-cell.js

@@ -1,4 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 /*
 Copyright (c) Uber Technologies, Inc.
@@ -7,11 +7,11 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
-import { getOverrides } from '../helpers/overrides.js';
-import TriangleUp from '../icon/triangle-up.js';
-import TriangleDown from '../icon/triangle-down.js';
-import { SORT_DIRECTION } from './constants.js';
-import { StyledHeadCell, StyledSortableLabel } from './styled-components.js';
+import { getOverrides } from '../helpers/overrides';
+import TriangleUp from '../icon/triangle-up';
+import TriangleDown from '../icon/triangle-down';
+import { SORT_DIRECTION } from './constants';
+import { StyledHeadCell, StyledSortableLabel } from './styled-components';
 
 function SortDirectionIcon({
   direction
@@ -32,7 +32,8 @@ function SortDirectionIcon({
   }
 }
 
-export const SortableHeadCellFactory = (CustomHeadCell = StyledHeadCell) => {
+export const SortableHeadCellFactory = ( // @ts-expect-error todo(flow->ts) this assignment is not correct title property is declared as ReactNode but then it is used on div element… which is not correct
+CustomHeadCell = StyledHeadCell) => {
   return function SortableHeadCell(props) {
     const {
       overrides = {},

package/es/table/styled-components.js

@@ -1,4 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 /*
 Copyright (c) Uber Technologies, Inc.
@@ -7,7 +7,7 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
-import { styled, withWrapper, expandBorderStyles } from '../styles/index.js';
+import { styled, withWrapper, expandBorderStyles } from '../styles';
 const StyledTableElement = styled('div', ({
   $theme
 }) => {
@@ -24,6 +24,7 @@ const StyledTableElement = styled('div', ({
   };
 });
 StyledTableElement.displayName = "StyledTableElement";
+StyledTableElement.displayName = 'StyledTableElement';
 export const StyledTable = withWrapper(StyledTableElement, StyledComponent => function StyledTable(props) {
   return /*#__PURE__*/React.createElement(StyledComponent, _extends({
     "data-baseweb": "table-custom",
@@ -43,6 +44,7 @@ const StyledHeadElement = styled('div', ({
   };
 });
 StyledHeadElement.displayName = "StyledHeadElement";
+StyledHeadElement.displayName = 'StyledHeadElement';
 export const StyledHead = withWrapper(StyledHeadElement, StyledComponent => function StyledHead(props) {
   return /*#__PURE__*/React.createElement(StyledComponent, _extends({
     role: "row"
@@ -73,6 +75,7 @@ const StyledHeadCellElement = styled('div', ({
   };
 });
 StyledHeadCellElement.displayName = "StyledHeadCellElement";
+StyledHeadCellElement.displayName = 'StyledHeadCellElement';
 export const StyledHeadCell = withWrapper(StyledHeadCellElement, StyledComponent => function StyledHeadCell(props) {
   return /*#__PURE__*/React.createElement(StyledComponent, _extends({
     role: "columnheader"
@@ -100,17 +103,20 @@ export const StyledSortableLabel = styled('button', ({
   };
 });
 StyledSortableLabel.displayName = "StyledSortableLabel";
+StyledSortableLabel.displayName = 'StyledSortableLabel';
 const StyledBodyElement = styled('div', ({
   $width
 }) => {
   return {
     width: $width ? $width : '100%',
     overflowX: 'hidden',
+    // @ts-expect-error todo(flow->ts) looks to be incorrect value
     overflowY: 'overlay',
     flex: 1
   };
 });
 StyledBodyElement.displayName = "StyledBodyElement";
+StyledBodyElement.displayName = 'StyledBodyElement';
 export const StyledBody = withWrapper(StyledBodyElement, StyledComponent => function StyledBody(props) {
   return /*#__PURE__*/React.createElement(StyledComponent, _extends({
     role: "rowgroup"
@@ -121,6 +127,7 @@ const StyledRowElement = styled('div', {
   alignItems: 'center'
 });
 StyledRowElement.displayName = "StyledRowElement";
+StyledRowElement.displayName = 'StyledRowElement';
 export const StyledRow = withWrapper(StyledRowElement, StyledComponent => function StyledRow(props) {
   return /*#__PURE__*/React.createElement(StyledComponent, _extends({
     role: "row"
@@ -142,6 +149,7 @@ const StyledCellElement = styled('div', ({
   };
 });
 StyledCellElement.displayName = "StyledCellElement";
+StyledCellElement.displayName = 'StyledCellElement';
 export const StyledCell = withWrapper(StyledCellElement, StyledComponent => function StyledCell(props) {
   return /*#__PURE__*/React.createElement(StyledComponent, _extends({
     role: "gridcell"
@@ -186,6 +194,7 @@ export const StyledFilterButton = styled('button', props => {
   };
 });
 StyledFilterButton.displayName = "StyledFilterButton";
+StyledFilterButton.displayName = 'StyledFilterButton';
 export const StyledFilterContent = styled('div', ({
   $theme
 }) => ({ ...expandBorderStyles($theme.borders.border300),
@@ -198,6 +207,7 @@ export const StyledFilterContent = styled('div', ({
   overflow: 'auto'
 }));
 StyledFilterContent.displayName = "StyledFilterContent";
+StyledFilterContent.displayName = 'StyledFilterContent';
 export const StyledFilterHeading = styled('div', ({
   $theme
 }) => ({ ...$theme.typography.font250,
@@ -208,6 +218,7 @@ export const StyledFilterHeading = styled('div', ({
   paddingLeft: $theme.sizing.scale600
 }));
 StyledFilterHeading.displayName = "StyledFilterHeading";
+StyledFilterHeading.displayName = 'StyledFilterHeading';
 export const StyledFilterFooter = styled('div', ({
   $theme
 }) => ({
@@ -221,6 +232,7 @@ export const StyledFilterFooter = styled('div', ({
   minWidth: '216px'
 }));
 StyledFilterFooter.displayName = "StyledFilterFooter";
+StyledFilterFooter.displayName = 'StyledFilterFooter';
 export const StyledAction = styled('button', ({
   $theme
 }) => {
@@ -242,4 +254,5 @@ export const StyledAction = styled('button', ({
     }
   };
 });
-StyledAction.displayName = "StyledAction";
+StyledAction.displayName = "StyledAction";
+StyledAction.displayName = 'StyledAction';

package/es/table/table.js

@@ -7,8 +7,8 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
-import { StyledTable, StyledHead, StyledHeadCell, StyledBody, StyledRow, StyledCell } from './styled-components.js';
-import { ProgressBar } from '../progress-bar/index.js';
+import { StyledTable, StyledHead, StyledHeadCell, StyledBody, StyledRow, StyledCell } from './styled-components';
+import { ProgressBar } from '../progress-bar';
 export default class Table extends React.Component {
   render() {
     return /*#__PURE__*/React.createElement(StyledTable, {

package/es/table/types.js

@@ -1,8 +1 @@
-/*
-Copyright (c) Uber Technologies, Inc.
-
-This source code is licensed under the MIT license found in the
-LICENSE file in the root directory of this source tree.
-*/
-import * as React from 'react';
-import { SORT_DIRECTION } from './constants.js';
+export {};

package/es/table-grid/index.js

@@ -4,6 +4,6 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
-export { SORT_DIRECTION } from '../table/index.js';
-export { StyledTable, StyledHeadCell, StyledBodyCell } from './styled-components.js';
-export { SortableHeadCell } from './sortable-head-cell.js';
+export { SORT_DIRECTION } from '../table';
+export { StyledTable, StyledHeadCell, StyledBodyCell } from './styled-components';
+export { SortableHeadCell } from './sortable-head-cell';

package/es/table-grid/sortable-head-cell.js

@@ -4,6 +4,7 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
-import { SortableHeadCellFactory } from '../table/index.js';
-import { StyledHeadCell } from './styled-components.js';
+import { SortableHeadCellFactory } from '../table';
+import { StyledHeadCell } from './styled-components'; // @ts-expect-error todo(flow->ts) this assignment is not correct title property is declared as ReactNode but then it is used on div element… which is not correct
+
 export const SortableHeadCell = SortableHeadCellFactory(StyledHeadCell);

package/es/table-grid/styled-components.js

@@ -1,4 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 /*
 Copyright (c) Uber Technologies, Inc.
@@ -7,8 +7,8 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
-import { withStyle, withWrapper } from '../styles/index.js';
-import { StyledTable as FlexStyledTable, StyledHeadCell as FlexStyledHeadCell, StyledCell as FlexStyledBodyCell } from '../table/index.js';
+import { withStyle, withWrapper } from '../styles';
+import { StyledTable as FlexStyledTable, StyledHeadCell as FlexStyledHeadCell, StyledCell as FlexStyledBodyCell } from '../table';
 const StyledTableElement = withStyle(FlexStyledTable, props => {
   return {
     display: 'grid',
@@ -20,6 +20,7 @@ const StyledTableElement = withStyle(FlexStyledTable, props => {
   };
 });
 StyledTableElement.displayName = "StyledTableElement";
+StyledTableElement.displayName = 'StyledTableElement';
 export const StyledTable = withWrapper(StyledTableElement, StyledComponent => function StyledTable(props) {
   return /*#__PURE__*/React.createElement(StyledComponent, _extends({
     "data-baseweb": "table-grid"
@@ -44,6 +45,7 @@ export const StyledHeadCell = withStyle(FlexStyledHeadCell, ({
   };
 });
 StyledHeadCell.displayName = "StyledHeadCell";
+StyledHeadCell.displayName = 'StyledHeadCell';
 export const StyledBodyCell = withStyle(FlexStyledBodyCell, props => {
   return {
     display: 'block',
@@ -56,4 +58,5 @@ export const StyledBodyCell = withStyle(FlexStyledBodyCell, props => {
     }
   };
 });
-StyledBodyCell.displayName = "StyledBodyCell";
+StyledBodyCell.displayName = "StyledBodyCell";
+StyledBodyCell.displayName = 'StyledBodyCell';

package/es/table-semantic/index.js

@@ -4,9 +4,11 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
-export { default as Table } from './table.js';
-export { default as TableBuilder } from './table-builder.js';
-export { default as TableBuilderColumn } from './table-builder-column.js';
-export { DIVIDER, SIZE } from './constants.js'; // Styled elements
+export { default as Table } from './table';
+export { default as TableBuilder } from './table-builder';
+export { default as TableBuilderColumn } from './table-builder-column';
+export { DIVIDER, SIZE } from './constants'; // Styled elements
 
-export { StyledRoot, StyledTable, StyledTableHead, StyledTableHeadRow, StyledTableHeadCell, StyledTableHeadCellSortable, StyledTableBody, StyledTableBodyRow, StyledTableBodyCell, StyledTableLoadingMessage, StyledTableEmptyMessage, StyledSortAscIcon, StyledSortDescIcon, StyledSortNoneIcon } from './styled-components.js'; // Flow
+export { StyledRoot, StyledTable, StyledTableHead, StyledTableHeadRow, StyledTableHeadCell, StyledTableHeadCellSortable, StyledTableBody, StyledTableBodyRow, StyledTableBodyCell, StyledTableLoadingMessage, StyledTableEmptyMessage, StyledSortAscIcon, StyledSortDescIcon, StyledSortNoneIcon } from './styled-components'; // Flow
+
+export * from './types';

package/es/table-semantic/styled-components.js

@@ -4,11 +4,11 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
-import Blank from '../icon/blank.js';
-import ChevronDown from '../icon/chevron-down.js';
-import ChevronUp from '../icon/chevron-up.js';
-import { styled, withStyle, expandBorderStyles } from '../styles/index.js';
-import { SIZE, DIVIDER } from './constants.js';
+import Blank from '../icon/blank';
+import ChevronDown from '../icon/chevron-down';
+import ChevronUp from '../icon/chevron-up';
+import { styled, withStyle, expandBorderStyles } from '../styles';
+import { SIZE, DIVIDER } from './constants';
 
 function sizeToCellPadding($theme, $size) {
   if ($size === SIZE.compact) {
@@ -41,6 +41,8 @@ export const StyledRoot = styled('div', ({
   };
 });
 StyledRoot.displayName = "StyledRoot";
+StyledRoot.displayName = 'StyledRoot';
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 export const StyledTable = styled('table', ({
   $theme,
   $width
@@ -53,18 +55,23 @@ export const StyledTable = styled('table', ({
   };
 });
 StyledTable.displayName = "StyledTable";
+StyledTable.displayName = 'StyledTable'; // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
 export const StyledTableHead = styled('thead', ({
   $theme
 }) => {
   return {};
 });
 StyledTableHead.displayName = "StyledTableHead";
+StyledTableHead.displayName = 'StyledTableHead'; // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
 export const StyledTableHeadRow = styled('tr', ({
   $theme
 }) => {
   return {};
 });
 StyledTableHeadRow.displayName = "StyledTableHeadRow";
+StyledTableHeadRow.displayName = 'StyledTableHeadRow';
 export const StyledTableHeadCell = styled('th', ({
   $theme,
   $size,
@@ -84,7 +91,6 @@ export const StyledTableHeadCell = styled('th', ({
     backgroundColor: $theme.colors.tableHeadBackgroundColor,
     color: $theme.colors.contentPrimary,
     textAlign: $theme.direction === 'rtl' || $isNumeric ? 'right' : 'left',
-    verticalAlign: 'top',
     whiteSpace: 'nowrap',
     zIndex: 1,
     ...($divider === DIVIDER.clean ? {} : {
@@ -100,6 +106,7 @@ export const StyledTableHeadCell = styled('th', ({
   };
 });
 StyledTableHeadCell.displayName = "StyledTableHeadCell";
+StyledTableHeadCell.displayName = 'StyledTableHeadCell';
 export const StyledTableHeadCellSortable = withStyle(StyledTableHeadCell, ({
   $theme,
   $isFocusVisible
@@ -118,6 +125,7 @@ export const StyledTableHeadCellSortable = withStyle(StyledTableHeadCell, ({
   };
 });
 StyledTableHeadCellSortable.displayName = "StyledTableHeadCellSortable";
+StyledTableHeadCellSortable.displayName = 'StyledTableHeadCellSortable';
 export const StyledSortIconContainer = styled('span', ({
   $theme
 }) => {
@@ -129,9 +137,10 @@ export const StyledSortIconContainer = styled('span', ({
     right: $theme.sizing.scale500,
     transform: 'translateY(-50%)'
   };
-}); // No longer used, but will maintain for some time to support existing usage
-
+});
 StyledSortIconContainer.displayName = "StyledSortIconContainer";
+StyledSortIconContainer.displayName = 'StyledSortIconContainer'; // No longer used, but will maintain for some time to support existing usage
+
 export const StyledSortAscIcon = styled(ChevronUp, ({
   $theme
 }) => {
@@ -143,6 +152,7 @@ export const StyledSortAscIcon = styled(ChevronUp, ({
   };
 });
 StyledSortAscIcon.displayName = "StyledSortAscIcon";
+StyledSortAscIcon.displayName = 'StyledSortAscIcon';
 export const StyledSortDescIcon = styled(ChevronDown, ({
   $theme
 }) => {
@@ -154,6 +164,7 @@ export const StyledSortDescIcon = styled(ChevronDown, ({
   };
 });
 StyledSortDescIcon.displayName = "StyledSortDescIcon";
+StyledSortDescIcon.displayName = 'StyledSortDescIcon';
 export const StyledSortNoneIcon = styled(Blank, ({
   $theme
 }) => {
@@ -165,12 +176,15 @@ export const StyledSortNoneIcon = styled(Blank, ({
   };
 });
 StyledSortNoneIcon.displayName = "StyledSortNoneIcon";
+StyledSortNoneIcon.displayName = 'StyledSortNoneIcon'; // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
 export const StyledTableBody = styled('tbody', ({
   $theme
 }) => {
   return {};
 });
 StyledTableBody.displayName = "StyledTableBody";
+StyledTableBody.displayName = 'StyledTableBody';
 export const StyledTableBodyRow = styled('tr', ({
   $theme
 }) => {
@@ -181,6 +195,7 @@ export const StyledTableBodyRow = styled('tr', ({
   };
 });
 StyledTableBodyRow.displayName = "StyledTableBodyRow";
+StyledTableBodyRow.displayName = 'StyledTableBodyRow';
 export const StyledTableBodyCell = styled('td', ({
   $theme,
   $size,
@@ -212,6 +227,7 @@ export const StyledTableBodyCell = styled('td', ({
   };
 });
 StyledTableBodyCell.displayName = "StyledTableBodyCell";
+StyledTableBodyCell.displayName = 'StyledTableBodyCell';
 export const StyledTableLoadingMessage = styled('div', ({
   $theme
 }) => {
@@ -221,4 +237,5 @@ export const StyledTableLoadingMessage = styled('div', ({
   };
 });
 StyledTableLoadingMessage.displayName = "StyledTableLoadingMessage";
+StyledTableLoadingMessage.displayName = 'StyledTableLoadingMessage';
 export const StyledTableEmptyMessage = StyledTableLoadingMessage;

package/es/table-semantic/table-builder.js

@@ -1,4 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
@@ -9,12 +9,12 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
-import { StyledRoot, StyledTable, StyledTableHead, StyledTableHeadRow, StyledTableHeadCell, StyledTableHeadCellSortable, StyledTableBody, StyledTableBodyRow, StyledTableBodyCell, StyledTableLoadingMessage, StyledTableEmptyMessage, StyledSortIconContainer } from './styled-components.js';
-import { getOverrides } from '../helpers/overrides.js';
-import Blank from '../icon/blank.js';
-import ChevronDown from '../icon/chevron-down.js';
-import ChevronUp from '../icon/chevron-up.js';
-import { isFocusVisible, forkFocus, forkBlur } from '../utils/focusVisible.js';
+import { StyledRoot, StyledTable, StyledTableHead, StyledTableHeadRow, StyledTableHeadCell, StyledTableHeadCellSortable, StyledTableBody, StyledTableBodyRow, StyledTableBodyCell, StyledTableLoadingMessage, StyledTableEmptyMessage, StyledSortIconContainer } from './styled-components';
+import { getOverrides } from '../helpers/overrides';
+import Blank from '../icon/blank';
+import ChevronDown from '../icon/chevron-down';
+import ChevronUp from '../icon/chevron-up';
+import { isFocusVisible, forkFocus, forkBlur } from '../utils/focusVisible';
 export default class TableBuilder extends React.Component {
   constructor(...args) {
     super(...args);
@@ -71,7 +71,8 @@ export default class TableBuilder extends React.Component {
     const [SortAscIcon, sortAscIconProps] = getOverrides(overrides.SortAscIcon, ChevronUp);
     const [SortDescIcon, sortDescIconProps] = getOverrides(overrides.SortDescIcon, ChevronDown);
     const [SortNoneIcon, sortNoneIconProps] = getOverrides(overrides.SortNoneIcon, Blank);
-    const columns = React.Children.toArray(children).filter(Boolean).map(child => child.props);
+    const columns = React.Children.toArray(children).filter(Boolean) // @ts-expect-error todo(flow->ts): limit children to be only react elements
+    .map(child => child.props);
 
     function renderHeader(col, colIndex, isFocusVisible) {
       const colOverrides = col.overrides || {};