baseui 12.1.3 → 13.0.0

package/esm/stepper/stepper.js

@@ -0,0 +1,145 @@
+var _excluded = ["children"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _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; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+/*
+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 { getOverrides } from '../helpers/overrides';
+import { Button, KIND, SHAPE, SIZE } from '../button';
+import { Input as DefaultInput } from '../input';
+import { Plus, CheckIndeterminate } from '../icon';
+import { StyledRoot } from './styled-components';
+import { useStyletron } from '../styles';
+
+var DefaultButton = function DefaultButton(_ref) {
+  var children = _ref.children,
+      restProps = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React.createElement(Button, _extends({
+    shape: SHAPE.circle,
+    kind: KIND.secondary,
+    size: SIZE.compact
+  }, restProps), children);
+};
+
+export function Stepper(_ref2) {
+  var value = _ref2.value,
+      _ref2$disabled = _ref2.disabled,
+      disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
+      _ref2$overrides = _ref2.overrides,
+      overrides = _ref2$overrides === void 0 ? {} : _ref2$overrides,
+      setValue = _ref2.setValue,
+      _ref2$minValue = _ref2.minValue,
+      minValue = _ref2$minValue === void 0 ? 0 : _ref2$minValue,
+      maxValue = _ref2.maxValue;
+
+  var _getOverrides = getOverrides(overrides.Root, StyledRoot),
+      _getOverrides2 = _slicedToArray(_getOverrides, 2),
+      Root = _getOverrides2[0],
+      rootProps = _getOverrides2[1];
+
+  var _getOverrides3 = getOverrides(overrides.Input, DefaultInput),
+      _getOverrides4 = _slicedToArray(_getOverrides3, 2),
+      Input = _getOverrides4[0],
+      inputProps = _getOverrides4[1];
+
+  var _getOverrides5 = getOverrides(overrides.DecrementButton, DefaultButton),
+      _getOverrides6 = _slicedToArray(_getOverrides5, 2),
+      DecrementButton = _getOverrides6[0],
+      decrementButtonProps = _getOverrides6[1];
+
+  var _getOverrides7 = getOverrides(overrides.DecrementButtonIcon, CheckIndeterminate),
+      _getOverrides8 = _slicedToArray(_getOverrides7, 2),
+      DecrementButtonIcon = _getOverrides8[0],
+      decrementButtonIconProps = _getOverrides8[1];
+
+  var _getOverrides9 = getOverrides(overrides.DecrementButton, DefaultButton),
+      _getOverrides10 = _slicedToArray(_getOverrides9, 2),
+      IncrementButton = _getOverrides10[0],
+      incrementButtonProps = _getOverrides10[1];
+
+  var _getOverrides11 = getOverrides(overrides.DecrementButtonIcon, Plus),
+      _getOverrides12 = _slicedToArray(_getOverrides11, 2),
+      IncrementButtonIcon = _getOverrides12[0],
+      incrementButtonIconProps = _getOverrides12[1];
+
+  var handleInputChange = function handleInputChange(e) {
+    var newValue = Number(e.target.value);
+
+    if (!isNaN(newValue) && (!maxValue || newValue <= maxValue) && newValue >= minValue) {
+      setValue(newValue);
+    }
+  };
+
+  var _useStyletron = useStyletron(),
+      _useStyletron2 = _slicedToArray(_useStyletron, 2),
+      theme = _useStyletron2[1];
+
+  return /*#__PURE__*/React.createElement(Root, rootProps, /*#__PURE__*/React.createElement(DecrementButton, _extends({
+    onClick: function onClick() {
+      return setValue(value - 1);
+    },
+    disabled: disabled || value <= minValue,
+    "aria-label": "decrement value"
+  }, decrementButtonProps), /*#__PURE__*/React.createElement(DecrementButtonIcon, decrementButtonIconProps)), /*#__PURE__*/React.createElement(Input, _extends({
+    value: value,
+    onChange: handleInputChange,
+    disabled: disabled,
+    "aria-label": "value",
+    overrides: {
+      Root: {
+        style: {
+          maxWidth: '36px',
+          height: '36px',
+          borderLeftStyle: 'none',
+          borderRightStyle: 'none',
+          borderTopStyle: 'none',
+          borderBottomStyle: 'none'
+        }
+      },
+      Input: {
+        style: _objectSpread({
+          paddingTop: 0,
+          paddingBottom: 0,
+          paddingLeft: 0,
+          paddingRight: 0,
+          textAlign: 'center',
+          backgroundColor: theme.colors.backgroundPrimary
+        }, theme.typography.LabelLarge)
+      }
+    }
+  }, inputProps)), /*#__PURE__*/React.createElement(IncrementButton, _extends({
+    onClick: function onClick() {
+      return setValue(value + 1);
+    },
+    disabled: disabled || value >= maxValue,
+    "aria-label": "increment value"
+  }, incrementButtonProps), /*#__PURE__*/React.createElement(IncrementButtonIcon, incrementButtonIconProps)));
+}
+export default Stepper;

package/esm/stepper/styled-components.js

@@ -0,0 +1,20 @@
+/*
+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 { styled } from '../styles';
+export var StyledRoot = styled('div', function (_ref) {
+  var $theme = _ref.$theme;
+  return {
+    display: 'flex',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    boxSizing: 'border-box',
+    maxWidth: '139px',
+    height: '48px',
+    padding: $theme.sizing.scale550
+  };
+});
+StyledRoot.displayName = "StyledRoot";
+StyledRoot.displayName = 'StyledRoot';

package/esm/stepper/types.js

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

package/esm/styles/__mocks__/styled.js

@@ -44,7 +44,7 @@ import * as React from 'react';
 import { getInitialStyle } from 'styletron-standard';
 import { LightTheme } from '../../themes';
 import createMockTheme from '../../test/create-mock-theme';
-var MOCK_THEME = createMockTheme(LightTheme);
+var MOCK_THEME = createMockTheme(LightTheme); // @ts-ignore
 
 var IDENTITY = function IDENTITY(x) {
   return x;
@@ -95,6 +95,7 @@ export function styled(ElementName) {
 
         return Object.keys(restProps).reduce(function (acc, key) {
           if (key[0] !== '$') {
+            // @ts-ignore
             acc[key] = restProps[key];
           }
 
@@ -148,9 +149,13 @@ export function styled(ElementName) {
     base: ElementName
   };
   return /*#__PURE__*/React.forwardRef(function (props, ref) {
-    return /*#__PURE__*/React.createElement(MockStyledComponent, _extends({
-      forwardedRef: ref
-    }, props));
+    return (
+      /*#__PURE__*/
+      // @ts-ignore
+      React.createElement(MockStyledComponent, _extends({
+        forwardedRef: ref
+      }, props))
+    );
   });
 }
 export var withStyle = styled;

package/esm/styles/as-primary-export-hoc.js

@@ -10,8 +10,10 @@ export default function asPrimaryExport(StyledComponent, propsTransformNames) {
   return function withStyledPropsHOC(props) {
     var styledProps = Object.keys(props).reduce(function (acc, key) {
       if (key[0] === '$' || propsTransformNames.indexOf(key) < 0) {
+        // @ts-ignore
         acc[key] = props[key];
       } else if (propsTransformNames.indexOf(key) >= 0) {
+        // @ts-ignore
         acc['$' + key] = props[key];
       }
 

package/esm/styles/styled.js

@@ -27,7 +27,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';
+import { ThemeContext } from './theme-provider'; // @ts-ignore
 
 var wrapper = function wrapper(StyledComponent) {
   // eslint-disable-next-line react/display-name
@@ -71,6 +71,7 @@ export function createThemedUseStyletron() {
 export var useStyletron = createThemedUseStyletron(); // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
 export function withWrapper(StyledElement, wrapperFn) {
+  // @ts-ignore
   return styletronWithWrapper(StyledElement, function (Styled) {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any,react/display-name
     return /*#__PURE__*/React.forwardRef(function (props, ref) {

package/esm/system-banner/index.js

@@ -0,0 +1,8 @@
+/*
+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 { SystemBanner } from './system-banner';
+export * from './styled-components';

package/esm/system-banner/styled-components.js

@@ -0,0 +1,82 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _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; }
+
+/*
+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 { withStyle } from '../styles';
+import { StyledRoot as StyledBannerRoot, StyledLeadingContent as StyledBannerLeadingContent, StyledMessageContent as StyledBannerMessageContent, StyledTrailingIconButton as StyledBannerTrailingIconButton } from '../banner';
+import { getMediaQueryPageMargins, getMinimumPageMargins } from '../helpers/responsive-helpers';
+export var StyledRoot = withStyle(StyledBannerRoot, function (_ref) {
+  var $isButton = _ref.$isButton,
+      $theme = _ref.$theme;
+  return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, $isButton ? {
+    ':hover': {
+      boxShadow: 'inset 999px 999px 0px rgba(0, 0, 0, 0.04)'
+    },
+    ':active': {
+      boxShadow: 'inset 999px 999px 0px rgba(0, 0, 0, 0.08)'
+    },
+    // button style reset
+    '-webkit-appearance': 'none',
+    textAlign: 'inherit',
+    boxShadow: 'none',
+    cursor: 'pointer',
+    border: 'none',
+    alignItems: 'center'
+  } : {}), getMediaQueryPageMargins($theme)), getMinimumPageMargins($theme.grid.margins)), {}, {
+    borderRadius: 0,
+    margin: 0
+  });
+});
+StyledRoot.displayName = "StyledRoot";
+StyledRoot.displayName = 'StyledRoot';
+export var StyledLeadingContent = withStyle(StyledBannerLeadingContent, function () {
+  return {
+    padding: 0
+  };
+});
+StyledLeadingContent.displayName = "StyledLeadingContent";
+StyledLeadingContent.displayName = 'StyledLeadingContent';
+export var StyledTrailingIconButton = withStyle(StyledBannerTrailingIconButton, function () {
+  return {
+    ':hover': {
+      boxShadow: 'none'
+    },
+    ':active': {
+      boxShadow: 'none'
+    }
+  };
+});
+StyledTrailingIconButton.displayName = "StyledTrailingIconButton";
+StyledTrailingIconButton.displayName = 'StyledTrailingIconButton';
+export var StyledMessageContent = withStyle(StyledBannerMessageContent, function () {
+  return {
+    // button styles reset
+    backgroundColor: 'transparent',
+    borderBottomWidth: 0,
+    borderLeftWidth: 0,
+    borderRightWidth: 0,
+    borderTopWidth: 0,
+    fontFamily: 'inherit',
+    fontSize: 'inherit',
+    fontStyle: 'inherit',
+    fontWeight: 'inherit',
+    lineHeight: 'inherit',
+    cursor: 'pointer',
+    ':hover': {
+      boxShadow: 'inset 999px 999px 0px rgba(0, 0, 0, 0.04)'
+    },
+    ':active': {
+      boxShadow: 'inset 999px 999px 0px rgba(0, 0, 0, 0.08)'
+    }
+  };
+});
+StyledMessageContent.displayName = "StyledMessageContent";
+StyledMessageContent.displayName = 'StyledMessageContent';

package/esm/system-banner/system-banner.js

@@ -0,0 +1,93 @@
+var _excluded = ["artworkIcon", "primaryAction", "secondaryAction", "overrides"],
+    _excluded2 = ["Root", "LeadingContent", "TrailingIconButton", "MessageContent"];
+
+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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _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; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+/*
+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 { Banner, ARTWORK_TYPE, HIERARCHY } from '../banner';
+import { StyledRoot, StyledLeadingContent, StyledTrailingIconButton, StyledMessageContent } from './styled-components';
+import { mergeOverride } from '../helpers/overrides';
+export function SystemBanner(props) {
+  var artworkIcon = props.artworkIcon,
+      primaryAction = props.primaryAction,
+      secondaryAction = props.secondaryAction,
+      _props$overrides = props.overrides,
+      overrides = _props$overrides === void 0 ? {} : _props$overrides,
+      restProps = _objectWithoutProperties(props, _excluded);
+
+  var Root = overrides.Root,
+      LeadingContent = overrides.LeadingContent,
+      TrailingIconButton = overrides.TrailingIconButton,
+      MessageContent = overrides.MessageContent,
+      restOverrides = _objectWithoutProperties(overrides, _excluded2);
+
+  var hasSinglePrimaryAction = (primaryAction === null || primaryAction === void 0 ? void 0 : primaryAction.onClick) && !secondaryAction;
+  var hasTwoActions = (primaryAction === null || primaryAction === void 0 ? void 0 : primaryAction.onClick) && (secondaryAction === null || secondaryAction === void 0 ? void 0 : secondaryAction.onClick);
+  var hasTrailingIcon = hasSinglePrimaryAction && primaryAction.icon;
+  var systemBannerRootOverrides = {
+    component: StyledRoot,
+    props: hasSinglePrimaryAction ? {
+      $isButton: true,
+      $as: 'button',
+      onClick: primaryAction.onClick,
+      'aria-label': primaryAction.label
+    } : {}
+  };
+  var systemBannerLeadingContentOverrides = {
+    component: StyledLeadingContent
+  };
+  var styledTrailingIconButtonOverrides = {
+    component: StyledTrailingIconButton,
+    props: {
+      $as: 'div'
+    }
+  };
+  var systemBannerMessageContentOverrides = {
+    component: StyledMessageContent,
+    props: {
+      $as: 'button',
+      onClick: primaryAction === null || primaryAction === void 0 ? void 0 : primaryAction.onClick,
+      'aria-label': primaryAction === null || primaryAction === void 0 ? void 0 : primaryAction.label
+    }
+  };
+
+  var systemBannerOverrides = _objectSpread({
+    Root: mergeOverride(systemBannerRootOverrides, Root || {}),
+    LeadingContent: mergeOverride(systemBannerLeadingContentOverrides, LeadingContent || {}),
+    TrailingIconButton: hasTrailingIcon ? mergeOverride(styledTrailingIconButtonOverrides, TrailingIconButton || {}) : {},
+    MessageContent: hasTwoActions ? mergeOverride(systemBannerMessageContentOverrides, MessageContent || {}) : {}
+  }, restOverrides);
+
+  return /*#__PURE__*/React.createElement(Banner, _extends({
+    action: secondaryAction ? _objectSpread({
+      onClick: null
+    }, secondaryAction) : hasTrailingIcon ? {
+      icon: primaryAction.icon,
+      onClick: null,
+      label: null
+    } : null,
+    hierarchy: HIERARCHY.high,
+    overrides: systemBannerOverrides
+  }, artworkIcon ? {
+    artwork: {
+      icon: artworkIcon,
+      type: ARTWORK_TYPE.icon
+    }
+  } : {}, restProps));
+}

package/esm/system-banner/types.js

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

package/esm/table/styled-components.js

@@ -141,6 +141,7 @@ export var StyledRow = withWrapper(StyledRowElement, function (StyledComponent)
     }, props));
   };
 });
+// @ts-ignore
 var StyledCellElement = styled('div', function (_ref6) {
   var $theme = _ref6.$theme,
       $striped = _ref6.$striped;

package/esm/table/table.js

@@ -86,7 +86,9 @@ var Table = /*#__PURE__*/function (_React$Component) {
 }(React.Component);
 
 _defineProperty(Table, "defaultProps", {
+  // @ts-ignore
   columns: [],
+  // @ts-ignore
   data: [[]],
   isLoading: false
 });

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

@@ -16,6 +16,7 @@ import ChevronUp from '../icon/chevron-up';
 import { styled, withStyle, expandBorderStyles } from '../styles';
 import { SIZE, DIVIDER } from './constants';
 
+// @ts-ignore
 function sizeToCellPadding($theme, $size) {
   if ($size === SIZE.compact) {
     return $theme.sizing.scale500;
@@ -47,6 +48,7 @@ export var StyledRoot = styled('div', function (_ref) {
 StyledRoot.displayName = "StyledRoot";
 StyledRoot.displayName = 'StyledRoot';
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
+// @ts-ignore
 export var StyledTable = styled('table', function (_ref2) {
   var $theme = _ref2.$theme,
       $width = _ref2.$width;
@@ -78,8 +80,7 @@ export var StyledTableHeadCell = styled('th', function (_ref5) {
 
   var $theme = _ref5.$theme,
       $size = _ref5.$size,
-      $divider = _ref5.$divider,
-      $isNumeric = _ref5.$isNumeric;
+      $divider = _ref5.$divider;
   var borderDir = $theme.direction === 'rtl' ? 'Left' : 'Right';
   var borderVertical = $divider === DIVIDER.grid || $divider === DIVIDER.vertical;
   var padding = sizeToCellPadding($theme, $size);
@@ -92,7 +93,7 @@ export var StyledTableHeadCell = styled('th', function (_ref5) {
     paddingLeft: padding,
     backgroundColor: $theme.colors.tableHeadBackgroundColor,
     color: $theme.colors.contentPrimary,
-    textAlign: $theme.direction === 'rtl' || $isNumeric ? 'right' : 'left',
+    textAlign: $theme.direction === 'rtl' ? 'right' : 'left',
     whiteSpace: 'nowrap',
     zIndex: 1
   }, $divider === DIVIDER.clean ? {} : {
@@ -110,7 +111,6 @@ export var StyledTableHeadCellSortable = withStyle(StyledTableHeadCell, function
       $isFocusVisible = _ref6.$isFocusVisible;
   return {
     cursor: 'pointer',
-    paddingRight: $theme.sizing.scale1000,
     outline: 'none',
     ':focus': {
       outline: $isFocusVisible ? "3px solid ".concat($theme.colors.accent) : 'none',
@@ -187,22 +187,22 @@ export var StyledTableBodyRow = styled('tr', function (_ref12) {
 });
 StyledTableBodyRow.displayName = "StyledTableBodyRow";
 StyledTableBodyRow.displayName = 'StyledTableBodyRow';
-export var StyledTableBodyCell = styled('td', function (_ref13) {
+export var StyledTableBodyCell = styled('td', // @ts-ignore
+function (_ref13) {
   var _notLastChild2;
 
   var $theme = _ref13.$theme,
       $size = _ref13.$size,
       $divider = _ref13.$divider,
       $isNumeric = _ref13.$isNumeric,
-      $isLastRow = _ref13.$isLastRow,
-      $isSortable = _ref13.$isSortable;
+      $isLastRow = _ref13.$isLastRow;
   var borderDir = $theme.direction === 'rtl' ? 'Left' : 'Right';
   var borderVertical = $divider === DIVIDER.vertical || $divider === DIVIDER.grid;
   var borderHorizontal = $divider === undefined || $divider === DIVIDER.horizontal || $divider === DIVIDER.grid;
   var padding = sizeToCellPadding($theme, $size);
   return _objectSpread(_objectSpread({}, $theme.typography.font200), {}, {
     paddingTop: padding,
-    paddingRight: !$isSortable ? padding : $theme.sizing.scale1000,
+    paddingRight: padding,
     paddingBottom: padding,
     paddingLeft: padding,
     color: $theme.colors.contentPrimary,

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

@@ -50,7 +50,7 @@ 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';
-import { getOverrides } from '../helpers/overrides';
+import { getOverrides, mergeConfigurationOverrides } from '../helpers/overrides';
 import Blank from '../icon/blank';
 import ChevronDown from '../icon/chevron-down';
 import ChevronUp from '../icon/chevron-up';
@@ -195,7 +195,7 @@ var TableBuilder = /*#__PURE__*/function (_React$Component) {
       var columns = React.Children.toArray(children).filter(Boolean) // @ts-expect-error todo(flow->ts): limit children to be only react elements
       .map(function (child) {
         return child.props;
-      });
+      }); // @ts-ignore
 
       function renderHeader(col, colIndex, isFocusVisible) {
         var colOverrides = col.overrides || {};
@@ -221,37 +221,32 @@ var TableBuilder = /*#__PURE__*/function (_React$Component) {
             ColTableHeadCellSortable = _getOverrides34[0],
             colTableHeadCellSortableProps = _getOverrides34[1];
 
-        var sortIcon = null;
-        var sortLabel = 'not sorted';
+        var SortIcon, sortIconProps, sortLabel;
 
         switch (col.id === sortColumn && sortOrder) {
           case 'ASC':
-            sortIcon = /*#__PURE__*/React.createElement(SortAscIcon, _extends({
-              size: "16px",
-              "aria-hidden": true,
-              role: "presentation"
-            }, sortAscIconProps));
+            SortIcon = SortAscIcon;
+            sortIconProps = sortAscIconProps;
             sortLabel = 'ascending sorting';
             break;
 
           case 'DESC':
-            sortIcon = /*#__PURE__*/React.createElement(SortDescIcon, _extends({
-              size: "16px",
-              "aria-hidden": true,
-              role: "presentation"
-            }, sortDescIconProps));
+            SortIcon = SortDescIcon;
+            sortIconProps = sortDescIconProps;
             sortLabel = 'descending sorting';
             break;
 
           default:
-            sortIcon = /*#__PURE__*/React.createElement(SortNoneIcon, _extends({
-              size: "16px",
-              "aria-hidden": true,
-              role: "presentation"
-            }, sortNoneIconProps));
+            SortIcon = SortNoneIcon;
+            sortIconProps = sortNoneIconProps;
+            sortLabel = 'not sorted';
             break;
-        }
+        } // add background-color: inherit on container for non-Blank icons
+
 
+        var sortIconContainerStyle = SortIcon === Blank ? sortIconContainerProps.$style : mergeConfigurationOverrides({
+          backgroundColor: 'inherit'
+        }, sortIconContainerProps.$style);
         return /*#__PURE__*/React.createElement(ColTableHeadCellSortable, _extends({
           key: colIndex,
           $col: col,
@@ -271,8 +266,15 @@ var TableBuilder = /*#__PURE__*/function (_React$Component) {
               onSort && onSort(col.id);
             }
           }
-        }, tableHeadCellSortableProps, colTableHeadCellSortableProps), col.header, /*#__PURE__*/React.createElement(SortIconContainer, sortIconContainerProps, sortIcon));
-      }
+        }, tableHeadCellSortableProps, colTableHeadCellSortableProps), col.header, /*#__PURE__*/React.createElement(SortIconContainer, _extends({}, sortIconContainerProps, {
+          $style: sortIconContainerStyle
+        }), /*#__PURE__*/React.createElement(SortIcon, _extends({
+          size: "16px",
+          "aria-hidden": "true",
+          role: "presentation"
+        }, sortIconProps))));
+      } // @ts-ignore
+
 
       function renderCell(col, colIndex, row, rowIndex, lastRowindex) {
         var colOverrides = col.overrides || {};
@@ -329,6 +331,7 @@ var TableBuilder = /*#__PURE__*/function (_React$Component) {
 }(React.Component);
 
 _defineProperty(TableBuilder, "defaultProps", {
+  // @ts-ignore
   data: [],
   loadingMessage: 'Loading...'
 });

package/esm/table-semantic/table.js

@@ -174,7 +174,9 @@ var Table = /*#__PURE__*/function (_React$Component) {
 }(React.Component);
 
 _defineProperty(Table, "defaultProps", {
+  // @ts-ignore
   columns: [],
+  // @ts-ignore
   data: [[]],
   loadingMessage: 'Loading...'
 });

package/esm/tabs/stateful-tabs.js

@@ -87,8 +87,8 @@ var StatefulTabs = /*#__PURE__*/function (_React$Component) {
       if (initialState && initialState.activeKey) {
         return initialState.activeKey;
       } else {
-        return React.Children.map(children, // @ts-expect-error todo(flow->ts) child might be not a ReactElement, theoretically including null
-        function (child, index) {
+        // @ts-ignore
+        return React.Children.map(children, function (child, index) {
           return child.key || String(index);
         })[0];
       }

package/esm/tabs-motion/stateful-tabs.js

@@ -32,6 +32,7 @@ var getInitialState = function getInitialState(children, initialState) {
   if (initialState && initialState.activeKey) {
     return initialState;
   } else {
+    // @ts-ignore
     var firstKey = React.Children.map(children, // @ts-expect-error todo(flow->ts) child might be not a ReactElement, theoretically including null
     function (child, index) {
       return child.key || String(index);

package/esm/tabs-motion/tab.js

@@ -5,6 +5,7 @@ This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
+// @ts-ignore
 export function Tab(props) {
   return null;
 }