baseui 0.0.0-next-2992a67 → 0.0.0-next-ecc760f

package/esm/aspect-ratio-box/aspect-ratio-box-body.js

@@ -21,12 +21,16 @@ export var AspectRatioBoxBody = function AspectRatioBoxBody(_ref) {
       width = _ref.width,
       restProps = _objectWithoutProperties(_ref, _excluded);
 
-  return /*#__PURE__*/React.createElement(Block, _extends({
-    "data-baseweb": "aspect-ratio-box-body",
-    position: position || 'absolute',
-    top: top || 0,
-    bottom: bottom || 0,
-    width: width || '100%'
-  }, restProps));
+  return (
+    /*#__PURE__*/
+    // @ts-expect-error todo(ts-migration) TS2322 Type '{ "data-baseweb": string; position: Responsive<Position>; top: string | 0 | Scale[]; bottom: string | 0 | Scale[]; width: string | Scale[]; } & Omit<...>' is not assignable to type 'IntrinsicAtt...
+    React.createElement(Block, _extends({
+      "data-baseweb": "aspect-ratio-box-body",
+      position: position || 'absolute',
+      top: top || 0,
+      bottom: bottom || 0,
+      width: width || '100%'
+    }, restProps))
+  );
 };
 export default AspectRatioBoxBody;

package/esm/aspect-ratio-box/aspect-ratio-box.js

@@ -16,6 +16,7 @@ import * as React from 'react';
 import { Block } from '../block';
 import { mergeOverrides } from '../helpers/overrides';
 
+// @ts-ignore
 var aspectRatioBoxStyle = function aspectRatioBoxStyle(_ref) {
   var $aspectRatio = _ref.$aspectRatio;
   return {

package/esm/avatar/avatar.js

@@ -22,8 +22,10 @@ import * as React from 'react';
 import { getOverrides } from '../helpers/overrides';
 import { Avatar as StyledAvatar, Initials as StyledInitials, Root as StyledRoot } from './styled-components';
 
+// @ts-ignore
 function getInitials(name) {
-  var words = name.split(' ');
+  var words = name.split(' '); // @ts-ignore
+
   var initials = words.map(function (word) {
     return word[0];
   });

package/esm/avatar/styled-components.js

@@ -12,6 +12,7 @@ LICENSE file in the root directory of this source tree.
 */
 import { styled } from '../styles';
 
+// @ts-ignore
 function getSize(props) {
   var $size = props.$size,
       $theme = props.$theme;
@@ -46,7 +47,8 @@ export var Initials = styled('div', function (props) {
   });
 });
 Initials.displayName = "Initials";
-Initials.displayName = 'Initials';
+Initials.displayName = 'Initials'; // @ts-ignore
+
 export var Root = styled('div', function (props) {
   var $didImageFailToLoad = props.$didImageFailToLoad;
   var themedSize = getSize(props);

package/esm/badge/styled-components.js

@@ -13,7 +13,7 @@ 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';
-import { COLOR, SHAPE, ROLE, PLACEMENT, HIERARCHY } from './constants';
+import { COLOR, SHAPE, ROLE, PLACEMENT, HIERARCHY } from './constants'; // @ts-ignore
 
 function getColorStyles(_ref) {
   var _HIERARCHY$primary, _HIERARCHY$secondary, _COLOR_STYLES;
@@ -51,7 +51,8 @@ function getColorStyles(_ref) {
   }), _defineProperty(_HIERARCHY$secondary, COLOR.warning, {
     color: $theme.colors.contentWarning,
     backgroundColor: $theme.colors.backgroundLightWarning
-  }), _HIERARCHY$secondary)), _COLOR_STYLES);
+  }), _HIERARCHY$secondary)), _COLOR_STYLES); // @ts-ignore
+
   return COLOR_STYLES[$hierarchy][$color];
 }
 
@@ -224,6 +225,7 @@ export var StyledHintDot = styled('div', function (_ref5) {
       $hidden = _ref5.$hidden;
   return _objectSpread({
     visibility: $hidden ? 'hidden' : 'inherit',
+    // @ts-ignore
     backgroundColor: $theme.colors[$color],
     boxSizing: 'content-box',
     height: '8px',

package/esm/banner/banner.js

@@ -25,6 +25,7 @@ import { useStyletron } from '../styles/index';
 import { ACTION_POSITION, ARTWORK_TYPE, HIERARCHY, KIND } from './constants';
 import { StyledRoot, StyledLeadingContent, StyledMessageContent, StyledTitle, StyledMessage, StyledBelowContent, StyledTrailingContent, StyledTrailingButtonContainer, StyledTrailingIconButton } from './styled-components';
 
+// @ts-ignore
 function low(theme, kind) {
   switch (kind) {
     case KIND.negative:
@@ -56,7 +57,8 @@ function low(theme, kind) {
         color: theme.colors.contentPrimary
       };
   }
-}
+} // @ts-ignore
+
 
 function high(theme, kind) {
   switch (kind) {
@@ -89,7 +91,8 @@ function high(theme, kind) {
         color: theme.colors.contentOnColor
       };
   }
-}
+} // @ts-ignore
+
 
 function Leading(_ref) {
   var artwork = _ref.artwork;
@@ -106,7 +109,8 @@ function Leading(_ref) {
   return artwork.icon({
     size: size
   });
-}
+} // @ts-ignore
+
 
 function Below(_ref2) {
   var action = _ref2.action,
@@ -137,7 +141,8 @@ function Below(_ref2) {
   }
 
   return null;
-}
+} // @ts-ignore
+
 
 function Trailing(_ref3) {
   var action = _ref3.action,
@@ -252,11 +257,15 @@ export function Banner(_ref4) {
       Message = _getOverrides18[0],
       messageProps = _getOverrides18[1];
 
+  var ariaLabel = rootProps.hasOwnProperty('aria-label') ? rootProps['aria-label'] : 'this is an announcement banner';
   return /*#__PURE__*/React.createElement(Root, _extends({
     $backgroundColor: styles.backgroundColor,
     $color: styles.color,
     $nested: nested
-  }, rootProps), /*#__PURE__*/React.createElement(LeadingContent, _extends({
+  }, rootProps, {
+    role: "complementary",
+    "aria-label": ariaLabel
+  }), /*#__PURE__*/React.createElement(LeadingContent, _extends({
     $includesArtwork: Boolean(artwork)
   }, leadingContentProps), /*#__PURE__*/React.createElement(Leading, {
     artwork: artwork

package/esm/block/styled-components.js

@@ -8,6 +8,7 @@ import { getMediaQueries } from '../helpers/responsive-helpers';
 import { styled } from '../styles';
 
 // styletron will throw when value is undefined. if so, replace with null
+// @ts-ignore
 function constrainToNull(value) {
   if (value === undefined) {
     return null;
@@ -20,6 +21,7 @@ function build(breakpoints) {
   var styles = {};
   var mediaQueries = getMediaQueries(breakpoints);
   return {
+    // @ts-ignore
     apply: function apply(_ref) {
       var property = _ref.property,
           _ref$transform = _ref.transform,
@@ -36,19 +38,23 @@ function build(breakpoints) {
         value.forEach(function (v, index) {
           // Do not create a media query for the smallest breakpoint.
           if (index === 0) {
+            // @ts-ignore
             styles[property] = constrainToNull(transform(v));
             return;
           }
 
-          var mediaQuery = mediaQueries[index - 1];
+          var mediaQuery = mediaQueries[index - 1]; // @ts-ignore
 
           if (!styles[mediaQuery]) {
+            // @ts-ignore
             styles[mediaQuery] = {};
-          }
+          } // @ts-ignore
+
 
           styles[mediaQuery][property] = constrainToNull(transform(v));
         });
       } else {
+        // @ts-ignore
         styles[property] = constrainToNull(transform(value));
       }
     },
@@ -56,7 +62,8 @@ function build(breakpoints) {
       return styles;
     }
   };
-}
+} // @ts-ignore
+
 
 function getFontValue(obj, key) {
   if (!obj) return;
@@ -72,7 +79,8 @@ export var StyledBlock = styled('div', function (props) {
 
   var get = function get(obj, key) {
     return obj[key];
-  };
+  }; // @ts-ignore
+
 
   var getScale = function getScale(size) {
     return sizing[size] || size;
@@ -82,6 +90,7 @@ export var StyledBlock = styled('div', function (props) {
   styles.apply({
     property: 'color',
     value: get(props, '$color'),
+    // @ts-ignore
     transform: function transform(color) {
       return colors[color] || color;
     }
@@ -97,6 +106,7 @@ export var StyledBlock = styled('div', function (props) {
   styles.apply({
     property: 'backgroundColor',
     value: get(props, '$backgroundColor'),
+    // @ts-ignore
     transform: function transform(backgroundColor) {
       return colors[backgroundColor] || backgroundColor;
     }
@@ -124,6 +134,7 @@ export var StyledBlock = styled('div', function (props) {
   styles.apply({
     property: 'fontFamily',
     value: get(props, '$font'),
+    // @ts-ignore
     transform: function transform(font) {
       return getFontValue(typography[font], 'fontFamily');
     }
@@ -131,6 +142,7 @@ export var StyledBlock = styled('div', function (props) {
   styles.apply({
     property: 'fontWeight',
     value: get(props, '$font'),
+    // @ts-ignore
     transform: function transform(font) {
       return getFontValue(typography[font], 'fontWeight');
     }
@@ -138,6 +150,7 @@ export var StyledBlock = styled('div', function (props) {
   styles.apply({
     property: 'fontSize',
     value: get(props, '$font'),
+    // @ts-ignore
     transform: function transform(font) {
       return getFontValue(typography[font], 'fontSize');
     }
@@ -145,6 +158,7 @@ export var StyledBlock = styled('div', function (props) {
   styles.apply({
     property: 'lineHeight',
     value: get(props, '$font'),
+    // @ts-ignore
     transform: function transform(font) {
       return getFontValue(typography[font], 'lineHeight');
     }
@@ -297,6 +311,7 @@ export var StyledBlock = styled('div', function (props) {
   styles.apply({
     property: 'overflowX',
     value: get(props, '$overflow'),
+    // @ts-ignore
     transform: function transform(overflow) {
       if (overflow === 'scrollX') {
         return 'scroll';
@@ -308,6 +323,7 @@ export var StyledBlock = styled('div', function (props) {
   styles.apply({
     property: 'overflowY',
     value: get(props, '$overflow'),
+    // @ts-ignore
     transform: function transform(overflow) {
       if (overflow === 'scrollY') {
         return 'scroll';
@@ -319,6 +335,7 @@ export var StyledBlock = styled('div', function (props) {
   styles.apply({
     property: 'overflow',
     value: get(props, '$overflow'),
+    // @ts-ignore
     transform: function transform(overflow) {
       if (overflow !== 'scrollX' && overflow !== 'scrollY') {
         return overflow;

package/esm/bottom-navigation/bottom-navigation.js

@@ -0,0 +1,155 @@
+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 _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; }
+
+/*
+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 { Selector } from './selector';
+import { Panel } from './panel';
+import { StyledRoot, StyledSelectorList, StyledOverflowPanel, StyledOverflowPanelList } from './styled-components';
+import { getOverrides } from '../helpers/overrides';
+import { ListItem, ListItemLabel } from '../list';
+import { MobileHeader } from '../mobile-header';
+import { Overflow, ChevronRight } from '../icon';
+var MAX_SELECTORS = 5;
+
+var BottomNavigation = function BottomNavigation(_ref) {
+  var _ref$activeKey = _ref.activeKey,
+      activeKey = _ref$activeKey === void 0 ? '0' : _ref$activeKey,
+      onChange = _ref.onChange,
+      children = _ref.children,
+      _ref$overrides = _ref.overrides,
+      overrides = _ref$overrides === void 0 ? {} : _ref$overrides;
+
+  var _getOverrides = getOverrides(overrides.Root, StyledRoot),
+      _getOverrides2 = _slicedToArray(_getOverrides, 2),
+      Root = _getOverrides2[0],
+      RootProps = _getOverrides2[1];
+
+  var _getOverrides3 = getOverrides(overrides.SelectorList, StyledSelectorList),
+      _getOverrides4 = _slicedToArray(_getOverrides3, 2),
+      SelectorList = _getOverrides4[0],
+      SelectorListProps = _getOverrides4[1];
+
+  var _getOverrides5 = getOverrides(overrides.OverflowPanel, StyledOverflowPanel),
+      _getOverrides6 = _slicedToArray(_getOverrides5, 2),
+      OverflowPanel = _getOverrides6[0],
+      OverflowPanelProps = _getOverrides6[1];
+
+  var _getOverrides7 = getOverrides(overrides.OverflowPanelList, StyledOverflowPanelList),
+      _getOverrides8 = _slicedToArray(_getOverrides7, 2),
+      OverflowPanelList = _getOverrides8[0],
+      OverflowPanelListProps = _getOverrides8[1];
+
+  var _React$useState = React.useState(false),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      displayOverflow = _React$useState2[0],
+      setDisplayOverflow = _React$useState2[1];
+
+  var NavItemPanelRefs = React.useRef([]);
+
+  function scrollToTop(idx) {
+    NavItemPanelRefs.current[idx].scrollTo({
+      top: 0,
+      left: 0,
+      behavior: 'smooth'
+    });
+  }
+
+  function handleNavItemChange(activeKey) {
+    if (displayOverflow) {
+      setDisplayOverflow(false);
+    }
+
+    onChange({
+      activeKey: activeKey
+    });
+  }
+
+  var renderSelectors = function renderSelectors(navItems) {
+    return navItems.map(function (navItem, idx) {
+      var isActive = activeKey === idx && !displayOverflow;
+      return /*#__PURE__*/React.createElement(Selector, {
+        title: navItem.props.title,
+        icon: navItem.props.icon,
+        isActive: isActive,
+        onChange: function onChange() {
+          isActive ? scrollToTop(idx) : handleNavItemChange(idx);
+        },
+        overrides: navItem.props.overrides,
+        key: idx
+      });
+    });
+  };
+
+  var OverflowSelector = function OverflowSelector() {
+    return /*#__PURE__*/React.createElement(Selector, {
+      title: "More",
+      icon: Overflow,
+      onChange: function onChange() {
+        return setDisplayOverflow(true);
+      } // @ts-expect-error todo(ts-migration) TS2365 Operator '>' cannot be applied to types 'Key' and 'number'.
+      ,
+      isActive: displayOverflow || activeKey > 4,
+      overrides: {
+        Title: overrides.OverflowTitle,
+        Selector: overrides.OverflowSelector
+      },
+      key: 'more'
+    });
+  };
+
+  var navItems = React.Children.toArray(children);
+  return /*#__PURE__*/React.createElement(Root, RootProps, navItems.map(function (navItem, idx) {
+    if (!navItem) return;
+    var isActive = activeKey === idx && !displayOverflow;
+    return /*#__PURE__*/React.createElement(Panel, {
+      isActive: isActive,
+      ref: function ref(element) {
+        return NavItemPanelRefs.current.push(element);
+      },
+      overrides: navItem.props.overrides,
+      key: idx,
+      "aria-labelledby": "tabs-".concat(navItem.props.title, "-tabpanel-").concat(idx)
+    }, navItem.props.children);
+  }), displayOverflow && /*#__PURE__*/React.createElement(OverflowPanel, OverflowPanelProps, /*#__PURE__*/React.createElement(MobileHeader, {
+    title: "More",
+    expanded: true
+  }), /*#__PURE__*/React.createElement(OverflowPanelList, OverflowPanelListProps, navItems.slice(MAX_SELECTORS).map(function (navItem, overflowIdx) {
+    var _navItem$props = navItem.props,
+        Icon = _navItem$props.icon,
+        title = _navItem$props.title;
+    var idx = overflowIdx + MAX_SELECTORS;
+    return /*#__PURE__*/React.createElement(ListItem, {
+      artwork: function artwork(props) {
+        return /*#__PURE__*/React.createElement(Icon, props);
+      },
+      endEnhancer: function endEnhancer() {
+        return /*#__PURE__*/React.createElement(ChevronRight, null);
+      },
+      onClick: function onClick() {
+        activeKey === idx && !displayOverflow ? scrollToTop(idx) : handleNavItemChange(idx);
+      },
+      key: overflowIdx
+    }, /*#__PURE__*/React.createElement(ListItemLabel, null, title));
+  }))), /*#__PURE__*/React.createElement(SelectorList, _extends({
+    role: "tablist"
+  }, SelectorListProps), navItems.length > 5 ? /*#__PURE__*/React.createElement(React.Fragment, null, renderSelectors(navItems.slice(0, 4)), /*#__PURE__*/React.createElement(OverflowSelector, null)) : /*#__PURE__*/React.createElement(React.Fragment, null, renderSelectors(navItems))));
+};
+
+export default BottomNavigation;

package/esm/bottom-navigation/index.js

@@ -0,0 +1,10 @@
+/*
+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 BottomNavigation } from './bottom-navigation';
+export { default as NavItem } from './nav-item';
+export * from './styled-components';
+export * from './types';

package/esm/bottom-navigation/nav-item.js

@@ -0,0 +1,12 @@
+/*
+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.
+*/
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function NavItem(props) {
+  return null;
+}
+
+export default NavItem;

package/esm/bottom-navigation/panel.js

@@ -0,0 +1,42 @@
+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 _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; }
+
+/*
+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 { StyledPanel } from './styled-components';
+import { getOverrides } from '../helpers/overrides';
+export var Panel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var isActive = _ref.isActive,
+      _ref$overrides = _ref.overrides,
+      overrides = _ref$overrides === void 0 ? {} : _ref$overrides,
+      children = _ref.children;
+
+  var _getOverrides = getOverrides(overrides.Panel, StyledPanel),
+      _getOverrides2 = _slicedToArray(_getOverrides, 2),
+      Panel = _getOverrides2[0],
+      PanelProps = _getOverrides2[1];
+
+  return /*#__PURE__*/React.createElement(Panel, _extends({
+    ref: ref,
+    tabIndex: isActive ? '0' : '-1',
+    role: "tabpanel",
+    hidden: !isActive
+  }, PanelProps), children);
+});
+Panel.displayName = 'Panel';

package/esm/bottom-navigation/selector.js

@@ -0,0 +1,58 @@
+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 _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; }
+
+/*
+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 { StyledTitle, StyledSelector } from './styled-components';
+import { useStyletron } from '../styles/index';
+import { getOverrides } from '../helpers/overrides';
+export var Selector = function Selector(_ref) {
+  var title = _ref.title,
+      icon = _ref.icon,
+      isActive = _ref.isActive,
+      onChange = _ref.onChange,
+      _ref$overrides = _ref.overrides,
+      overrides = _ref$overrides === void 0 ? {} : _ref$overrides;
+
+  var _getOverrides = getOverrides(overrides.Title, StyledTitle),
+      _getOverrides2 = _slicedToArray(_getOverrides, 2),
+      Title = _getOverrides2[0],
+      TitleProps = _getOverrides2[1];
+
+  var _getOverrides3 = getOverrides(overrides.Selector, StyledSelector),
+      _getOverrides4 = _slicedToArray(_getOverrides3, 2),
+      Selector = _getOverrides4[0],
+      SelectorProps = _getOverrides4[1];
+
+  var _useStyletron = useStyletron(),
+      _useStyletron2 = _slicedToArray(_useStyletron, 2),
+      theme = _useStyletron2[1];
+
+  var Icon = icon;
+  return /*#__PURE__*/React.createElement(Selector, _extends({
+    onClick: onChange,
+    role: "tab",
+    "aria-selected": isActive
+  }, SelectorProps), /*#__PURE__*/React.createElement(Icon, {
+    size: 20,
+    color: isActive ? theme.colors.contentPrimary : theme.colors.contentTertiary
+  }), /*#__PURE__*/React.createElement(Title, _extends({
+    $isActive: isActive
+  }, TitleProps), title));
+};

package/esm/bottom-navigation/styled-components.js

@@ -0,0 +1,95 @@
+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 { styled } from '../styles';
+var SELECTOR_LIST_HEIGHT = '64px';
+export var StyledRoot = styled('div', {
+  height: '100%',
+  display: 'flex',
+  flexDirection: 'column'
+});
+StyledRoot.displayName = "StyledRoot";
+StyledRoot.displayName = 'StyledRoot';
+export var StyledSelectorList = styled('div', function (_ref) {
+  var $theme = _ref.$theme;
+  return {
+    container: 'nav-item-list / inline-size',
+    boxSizing: 'border-box',
+    display: 'grid',
+    gridAutoFlow: 'column',
+    gridAutoColumns: '1fr',
+    gap: $theme.sizing.scale300,
+    width: '100%',
+    height: SELECTOR_LIST_HEIGHT,
+    paddingTop: $theme.sizing.scale500,
+    paddingBottom: $theme.sizing.scale500,
+    paddingLeft: $theme.sizing.scale300,
+    paddingRight: $theme.sizing.scale300,
+    borderTop: "".concat($theme.sizing.scale0, " solid ").concat($theme.colors.borderOpaque),
+    backgroundColor: $theme.colors.backgroundPrimary
+  };
+});
+StyledSelectorList.displayName = "StyledSelectorList";
+StyledSelectorList.displayName = 'StyledSelectorList';
+export var StyledOverflowPanel = styled('div', {
+  height: "calc(100% - ".concat(SELECTOR_LIST_HEIGHT, ")"),
+  overflow: 'auto'
+});
+StyledOverflowPanel.displayName = "StyledOverflowPanel";
+StyledOverflowPanel.displayName = 'StyledOverflowPanel';
+export var StyledOverflowPanelList = styled('ul', {
+  paddingLeft: 0,
+  paddingRight: 0
+});
+StyledOverflowPanelList.displayName = "StyledOverflowPanelList";
+StyledOverflowPanelList.displayName = 'StyledOverflowPanelList';
+export var StyledTitle = styled('div', function (_ref2) {
+  var $theme = _ref2.$theme,
+      $isActive = _ref2.$isActive;
+  return _objectSpread(_objectSpread({}, $theme.typography.LabelXSmall), {}, {
+    color: $isActive ? $theme.colors.contentPrimary : $theme.colors.contentTertiary
+  });
+});
+StyledTitle.displayName = "StyledTitle";
+StyledTitle.displayName = 'StyledTitle';
+export var StyledSelector = styled('button', function (_ref3) {
+  var $theme = _ref3.$theme;
+  return {
+    '@container nav-item-list (min-width: 600px)': {
+      flexDirection: 'row',
+      gap: $theme.sizing.scale500
+    },
+    display: 'flex',
+    justifyContent: 'center',
+    alignItems: 'center',
+    flexDirection: 'column',
+    gap: $theme.sizing.scale0,
+    // button style reset
+    borderRadius: 0,
+    textAlign: 'inherit',
+    background: 'none',
+    boxShadow: 'none',
+    padding: 0,
+    cursor: 'pointer',
+    border: 'none',
+    color: 'inherit',
+    font: 'inherit'
+  };
+});
+StyledSelector.displayName = "StyledSelector";
+StyledSelector.displayName = 'StyledSelector';
+export var StyledPanel = styled('div', {
+  height: "calc(100% - ".concat(SELECTOR_LIST_HEIGHT, ")"),
+  overflow: 'auto'
+});
+StyledPanel.displayName = "StyledPanel";
+StyledPanel.displayName = 'StyledPanel';

package/esm/bottom-navigation/types.js

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