baseui 12.1.3 → 13.0.0

package/menu/nested-menus.js

@@ -100,6 +100,7 @@ var NestedMenus = /*#__PURE__*/function (_React$Component) {
     _defineProperty(_assertThisInitialized(_this), "mouseLeaveTimeoueId", null);
 
     _defineProperty(_assertThisInitialized(_this), "handleMenuMouseLeave", function (event) {
+      // @ts-ignore
       _this.mouseLeaveTimeoueId = setTimeout(function () {
         _this.setState({
           nestedMenuHoverIndex: -1
@@ -109,10 +110,14 @@ var NestedMenus = /*#__PURE__*/function (_React$Component) {
 
     _defineProperty(_assertThisInitialized(_this), "handleMenuMouseEnter", function (event) {
       if (typeof document !== 'undefined') {
+        // @ts-ignore
         clearTimeout(_this.mouseLeaveTimeoueId);
 
         var index = _this.state.menus.findIndex(function (m) {
-          return m.current && event.currentTarget instanceof Node && m.current.contains(event.currentTarget);
+          return (// @ts-ignore
+            m.current && event.currentTarget instanceof Node && // @ts-ignore
+            m.current.contains(event.currentTarget)
+          );
         });
 
         _this.setState({
@@ -148,7 +153,9 @@ var NestedMenus = /*#__PURE__*/function (_React$Component) {
           for (_iterator.s(); !(_step = _iterator.n()).done;) {
             var r = _step.value;
 
+            // @ts-ignore
             if (r.current && isSame(r.current, ref.current)) {
+              // @ts-ignore
               var element = r.current;
               element.removeEventListener('mouseenter', _this.handleMenuMouseEnter);
               element.removeEventListener('mouseleave', _this.handleMenuMouseLeave);
@@ -170,6 +177,7 @@ var NestedMenus = /*#__PURE__*/function (_React$Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "findMenuIndexByRef", function (ref) {
+      // @ts-ignore
       return _this.state.menus.findIndex(function (r) {
         return isSame(r.current, ref.current);
       });

package/menu/option-list.js

@@ -82,7 +82,8 @@ function OptionList(props, ref) {
   var _getOverrides3 = (0, _overrides.getOverrides)(overrides.ListItemAnchor, _styledComponents.StyledListItemAnchor),
       _getOverrides4 = _slicedToArray(_getOverrides3, 2),
       ListItemAnchor = _getOverrides4[0],
-      listItemAnchorProps = _getOverrides4[1];
+      listItemAnchorProps = _getOverrides4[1]; // @ts-ignore
+
 
   var getItem = function getItem(item) {
     if (item.href && renderHrefAsAnchor) {
@@ -116,7 +117,8 @@ function OptionList(props, ref) {
       isHighlighted: $isHighlighted
     }, item))));
   });
-}
+} // @ts-ignore
+
 
 function areEqualShallow(a, b) {
   if (!a || !b) return false;
@@ -128,11 +130,13 @@ function areEqualShallow(a, b) {
   }
 
   return true;
-}
+} // @ts-ignore
+
 
 function compare(prevProps, nextProps) {
   return prevProps.$isHighlighted === nextProps.$isHighlighted && prevProps.$isFocused === nextProps.$isFocused && areEqualShallow(prevProps.item, nextProps.item) && areEqualShallow(prevProps.overrides, nextProps.overrides) && prevProps.size === nextProps.size && prevProps.getItemLabel === nextProps.getItemLabel && prevProps.getChildMenu === nextProps.getChildMenu && prevProps.resetMenu === nextProps.resetMenu;
-}
+} // @ts-ignore
+
 
 var forwarded = /*#__PURE__*/React.forwardRef(OptionList);
 forwarded.displayName = 'OptionList';

package/menu/option-profile.js

@@ -98,8 +98,7 @@ function OptionProfile(props, ref) {
       subtitle = _getProfileItemLabels.subtitle,
       body = _getProfileItemLabels.body;
 
-  return /*#__PURE__*/React.createElement(_maybeChildMenu.default // @ts-expect-error todo(flow->ts)
-  , {
+  return /*#__PURE__*/React.createElement(_maybeChildMenu.default, {
     ref: ref,
     getChildMenu: getChildMenu,
     isOpen: !!$isHighlighted,
@@ -117,7 +116,8 @@ function OptionProfile(props, ref) {
   /*#__PURE__*/
   // Or just render the entire component user specified
   React.createElement(ItemImg, profileImgProps))), /*#__PURE__*/React.createElement(ProfileLabelsContainer, profileLabelsContainerProps, title && /*#__PURE__*/React.createElement(ProfileTitle, profileTitleProps, title), subtitle && /*#__PURE__*/React.createElement(ProfileSubtitle, profileSubtitleProps, subtitle), body && /*#__PURE__*/React.createElement(ProfileBody, profileBodyProps, body))));
-}
+} // @ts-ignore
+
 
 var forwarded = /*#__PURE__*/React.forwardRef(OptionProfile);
 forwarded.displayName = 'OptionProfile';

package/menu/stateful-container.js

@@ -72,6 +72,7 @@ var DEFAULT_PROPS = {
   getRequiredItemProps: function getRequiredItemProps() {
     return {};
   },
+  // @ts-ignore
   children: function children() {
     return null;
   },
@@ -142,6 +143,7 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
 
         default:
           if (_this.props.typeAhead) {
+            // @ts-ignore
             clearTimeout(_this.typeAheadTimeOut);
 
             _this.handleAlphaDown(event);
@@ -191,7 +193,8 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
       });
 
       if (_this.refList[nextIndex]) {
-        (0, _utils.scrollItemIntoView)(_this.refList[nextIndex].current, rootRef.current, nextIndex === 0, nextIndex === list.length - 1);
+        (0, _utils.scrollItemIntoView)(_this.refList[nextIndex].current, // @ts-ignore
+        rootRef.current, nextIndex === 0, nextIndex === list.length - 1);
       }
     });
 
@@ -247,7 +250,8 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
       }
 
       if (_this.refList[nextIndex]) {
-        (0, _utils.scrollItemIntoView)(_this.refList[nextIndex].current, rootRef.current, nextIndex === 0, nextIndex === _this.getItems().length - 1);
+        (0, _utils.scrollItemIntoView)(_this.refList[nextIndex].current, // @ts-ignore
+        rootRef.current, nextIndex === 0, nextIndex === _this.getItems().length - 1);
       }
     });
 
@@ -364,6 +368,7 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
 
       var optgroups = Object.keys(this.props.items);
       return optgroups.reduce(function (output, optgroup) {
+        // @ts-ignore
         return output.concat(_this2.props.items[optgroup]);
       }, []);
     }
@@ -476,6 +481,7 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
         highlightedIndex: this.state.highlightedIndex,
         isFocused: this.state.isFocused,
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        // @ts-ignore
         handleKeyDown: this.props.keyboardControlNode.current ? function (event) {} : this.onKeyDown,
         focusMenu: this.focusMenu,
         unfocusMenu: this.unfocusMenu
@@ -490,7 +496,6 @@ var MenuStatefulContainerInner = /*#__PURE__*/function (_React$Component) {
 _defineProperty(MenuStatefulContainerInner, "defaultProps", DEFAULT_PROPS);
 
 var MenuStatefulContainer = function MenuStatefulContainer(props) {
-  //$FlowExpectedError[cannot-spread-inexact]
   return /*#__PURE__*/React.createElement(MenuStatefulContainerInner, _extends({
     uidSeed: (0, _reactUid.useUIDSeed)()
   }, props));

package/menu/styled-components.d.ts

@@ -1,5 +1,5 @@
 import { OPTION_LIST_SIZE } from './constants';
-declare type StyledProps = {
+type StyledProps = {
     $disabled?: boolean;
     $isFocused?: boolean;
     $isFocusVisible?: boolean;

package/menu/styled-components.js

@@ -56,7 +56,7 @@ var StyledList = (0, _styles.styled)('ul', function (_ref) {
 });
 exports.StyledList = StyledList;
 StyledList.displayName = "StyledList";
-StyledList.displayName = 'StyledList';
+StyledList.displayName = 'StyledList'; // @ts-ignore
 
 function getFontColor(props) {
   if (props.$disabled) {
@@ -72,7 +72,8 @@ function getFontColor(props) {
   }
 
   return props.$theme.colors.menuFontDefault;
-}
+} // @ts-ignore
+
 
 function getBackgroundColor(props) {
   if (props.$disabled) {
@@ -155,7 +156,8 @@ var StyledListItemElement = (0, _styles.styled)('li', function (props) {
 });
 exports.StyledListItemElement = StyledListItemElement;
 StyledListItemElement.displayName = "StyledListItemElement";
-StyledListItemElement.displayName = 'StyledListItemElement';
+StyledListItemElement.displayName = 'StyledListItemElement'; // @ts-ignore
+
 var StyledListItem = (0, _styles.withWrapper)(StyledListItemElement, function (Styled) {
   return (// eslint-disable-next-line @typescript-eslint/no-unused-vars
     function StyledListItem(_ref2) {

package/menu/types.d.ts

@@ -1,30 +1,30 @@
 import type * as React from 'react';
 import type { Override } from '../helpers/overrides';
 import type { STATE_CHANGE_TYPES, OPTION_LIST_SIZE } from './constants';
-export declare type Item = any;
-export declare type ArrayItems = ReadonlyArray<Item>;
-export declare type GroupedItems = {
+export type Item = any;
+export type ArrayItems = ReadonlyArray<Item>;
+export type GroupedItems = {
     __ungrouped: ArrayItems;
     [x: string]: ArrayItems;
 };
-export declare type Items = ArrayItems | GroupedItems;
-export declare type GetItemLabelFn = (item: Item) => React.ReactNode;
-export declare type GetProfileItemLabelsFn = (item: Item) => {
+export type Items = ArrayItems | GroupedItems;
+export type GetItemLabelFn = (item: Item) => React.ReactNode;
+export type GetProfileItemLabelsFn = (item: Item) => {
     title?: string;
     subtitle?: string;
     body?: string;
 };
-export declare type GetProfileItemImgFn = (item: Item) => string | React.ComponentType<any>;
-export declare type GetProfileItemImgTextFn = (item: Item) => string;
-export declare type SetRootRefFn = (ref: React.RefObject<typeof HTMLElement>) => void;
-export declare type RootRef = {
+export type GetProfileItemImgFn = (item: Item) => string | React.ComponentType<any>;
+export type GetProfileItemImgTextFn = (item: Item) => string;
+export type SetRootRefFn = (ref: React.RefObject<typeof HTMLElement>) => void;
+export type RootRef = {
     current: null | HTMLElement;
 };
-export declare type OnItemSelectFn = (a: {
+export type OnItemSelectFn = (a: {
     item: Item;
     event?: React.SyntheticEvent<HTMLElement> | KeyboardEvent;
 }) => unknown;
-export declare type ProfileOverrides = {
+export type ProfileOverrides = {
     List?: Override;
     ListItemProfile?: Override;
     ProfileImgContainer?: Override;
@@ -34,7 +34,7 @@ export declare type ProfileOverrides = {
     ProfileSubtitle?: Override;
     ProfileBody?: Override;
 };
-export declare type RenderItemProps = {
+export type RenderItemProps = {
     disabled?: boolean;
     ref?: React.RefObject<typeof HTMLElement>;
     id?: string | null;
@@ -44,19 +44,19 @@ export declare type RenderItemProps = {
     onMouseEnter?: (event: React.MouseEvent<HTMLElement>) => void;
     resetMenu?: () => void;
 };
-export declare type GetRequiredItemPropsFn = (item: Item, index: number) => RenderItemProps;
-export declare type StateReducerFn = (changeType: keyof typeof STATE_CHANGE_TYPES | undefined | null, changes: Partial<StatefulContainerState>, currentState: StatefulContainerState) => StatefulContainerState;
-export declare type StatefulContainerState = {
+export type GetRequiredItemPropsFn = (item: Item, index: number) => RenderItemProps;
+export type StateReducerFn = (changeType: keyof typeof STATE_CHANGE_TYPES | undefined | null, changes: Partial<StatefulContainerState>, currentState: StatefulContainerState) => StatefulContainerState;
+export type StatefulContainerState = {
     activedescendantId?: string | null;
     highlightedIndex: number;
     isFocused: boolean;
 };
-export declare type InitialState = {
+export type InitialState = {
     activedescendantId?: string | null;
     highlightedIndex?: number;
     isFocused?: boolean;
 };
-export declare type RenderProps = StatefulContainerState & {
+export type RenderProps = StatefulContainerState & {
     items: Items;
     getRequiredItemProps: GetRequiredItemPropsFn;
 };
@@ -66,7 +66,7 @@ export declare type RenderProps = StatefulContainerState & {
  * Required and Optional are split into separate object types, and internals are all
  * marked as required because otherwise defaultProps will not work properly
  */
-export declare type StatefulContainerProps = {
+export type StatefulContainerProps = {
     /** List of menu items. */
     items: Items;
     /** Initial state of the stateful menu. */
@@ -112,7 +112,7 @@ export declare type StatefulContainerProps = {
     }) => boolean;
     forceHighlight: boolean;
 };
-export declare type MenuOverrides = {
+export type MenuOverrides = {
     EmptyState?: Override;
     List?: Override;
     Option?: Override;
@@ -120,12 +120,12 @@ export declare type MenuOverrides = {
     ListItem?: Override;
     MenuDivider?: Override;
 };
-export declare type MenuProps = {
+export type MenuProps = {
     overrides?: MenuOverrides;
     /** Renders all menu content for SEO purposes regardless of menu  state */
     renderAll?: boolean;
 };
-export declare type MenuProfileProps = {
+export type MenuProfileProps = {
     /** Returns an object consisting of title, subtitle, and body to render menu item */
     getProfileItemLabels: GetProfileItemLabelsFn;
     /** Returns either an image source url, or a full React component to render as the image. */
@@ -134,7 +134,7 @@ export declare type MenuProfileProps = {
     getProfileItemImgText: GetProfileItemImgTextFn;
     overrides?: ProfileOverrides;
 };
-export declare type SharedStatelessProps = {
+export type SharedStatelessProps = {
     /** Id of the highlighted menu item. */
     activedescendantId?: string | null;
     /** Function to get props for each rendered item. This will have some defaults needed for keyboard
@@ -159,7 +159,7 @@ export declare type SharedStatelessProps = {
     unfocusMenu?: () => unknown;
     handleKeyDown?: (event: KeyboardEvent) => unknown;
 };
-export declare type StatefulMenuProps = {
+export type StatefulMenuProps = {
     /** List of menu items. */
     items: Items;
     /** Initial state of the stateful menu. */
@@ -200,10 +200,10 @@ export declare type StatefulMenuProps = {
         current: HTMLElement | null;
     }) => boolean;
 } & MenuProps;
-export declare type StatefulMenuProfileProps = StatefulContainerProps & MenuProfileProps;
-export declare type StatelessMenuProps = SharedStatelessProps & MenuProps;
-export declare type StatelessMenuProfileProps = SharedStatelessProps & MenuProfileProps;
-export declare type OptionListProps = {
+export type StatefulMenuProfileProps = StatefulContainerProps & MenuProfileProps;
+export type StatelessMenuProps = SharedStatelessProps & MenuProps;
+export type StatelessMenuProfileProps = SharedStatelessProps & MenuProfileProps;
+export type OptionListProps = {
     /** Item to parse and render. */
     item: Item;
     /** Function used to get the string label for each item. */
@@ -242,7 +242,7 @@ export declare type OptionListProps = {
     /** Accessibility role of the item */
     role?: string;
 };
-export declare type OptionProfileProps = {
+export type OptionProfileProps = {
     /** Item to parse and render. */
     item: Item;
     /** Used to render a sub menu at this menu item. You'll often render another menu from this function. */
@@ -270,10 +270,10 @@ export declare type OptionProfileProps = {
     /** Renders all menu content for SEO purposes regardless of menu  state */
     renderAll?: boolean;
 };
-export declare type NestedMenuRef = {
+export type NestedMenuRef = {
     current: HTMLElement | null;
 };
-export declare type NestedMenuContextProps = {
+export type NestedMenuContextProps = {
     addMenuToNesting: (ref: NestedMenuRef) => void;
     removeMenuFromNesting: (ref: NestedMenuRef) => void;
     getParentMenu: (ref: NestedMenuRef) => NestedMenuRef | undefined | null;

package/message-card/message-card.js

@@ -31,14 +31,14 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+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 _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."); }
@@ -85,10 +85,14 @@ var MessageCard = function MessageCard(_ref2) {
       backgroundPosition = _ref3.backgroundPosition,
       ariaLabel = _ref3.ariaLabel;
 
+  var _useStyletron = (0, _index.useStyletron)(),
+      _useStyletron2 = _slicedToArray(_useStyletron, 2),
+      theme = _useStyletron2[1];
+
   var _getOverrides = (0, _overrides.getOverrides)(overrides.Root, _styledComponents.StyledRoot),
       _getOverrides2 = _slicedToArray(_getOverrides, 2),
       Root = _getOverrides2[0],
-      RootProps = _getOverrides2[1];
+      rootProps = _getOverrides2[1];
 
   var _getOverrides3 = (0, _overrides.getOverrides)(overrides.ContentContainer, _styledComponents.StyledContentContainer),
       _getOverrides4 = _slicedToArray(_getOverrides3, 2),
@@ -98,27 +102,37 @@ var MessageCard = function MessageCard(_ref2) {
   var _getOverrides5 = (0, _overrides.getOverrides)(overrides.HeadingContainer, _styledComponents.StyledHeadingContainer),
       _getOverrides6 = _slicedToArray(_getOverrides5, 2),
       HeadingContainer = _getOverrides6[0],
-      HeadingContainerProps = _getOverrides6[1];
+      headingContainerProps = _getOverrides6[1];
 
   var _getOverrides7 = (0, _overrides.getOverrides)(overrides.ParagraphContainer, _styledComponents.StyledParagraphContainer),
       _getOverrides8 = _slicedToArray(_getOverrides7, 2),
       ParagraphContainer = _getOverrides8[0],
-      ParagraphContainerProps = _getOverrides8[1];
+      paragraphContainerProps = _getOverrides8[1];
 
   var _getOverrides9 = (0, _overrides.getOverrides)(overrides.Image, _styledComponents.StyledImage),
       _getOverrides10 = _slicedToArray(_getOverrides9, 2),
       Image = _getOverrides10[0],
-      ImageProps = _getOverrides10[1];
+      imageProps = _getOverrides10[1];
 
   var _getOverrides11 = (0, _overrides.getOverrides)(overrides.Button, ButtonAlwaysLightTheme),
       _getOverrides12 = _slicedToArray(_getOverrides11, 2),
       Button = _getOverrides12[0],
-      ButtonProps = _getOverrides12[1];
-
-  var _useStyletron = (0, _index.useStyletron)(),
-      _useStyletron2 = _slicedToArray(_useStyletron, 2),
-      theme = _useStyletron2[1];
-
+      buttonProps = _getOverrides12[1];
+
+  var defaultButtonOverrides = {
+    BaseButton: {
+      style: _objectSpread({
+        textAlign: 'center',
+        pointerEvents: 'none'
+      }, buttonKind === _constants.BUTTON_KIND.tertiary ? {
+        marginTop: theme.sizing.scale100,
+        transform: theme.direction === 'rtl' ? "translateX(".concat(theme.sizing.scale500, ")") : "translateX(-".concat(theme.sizing.scale500, ")")
+      } : {
+        marginTop: theme.sizing.scale500
+      })
+    }
+  };
+  buttonProps.overrides = (0, _overrides.mergeOverrides)(defaultButtonOverrides, buttonProps.overrides);
   var backgroundColorType = backgroundColorTypeProp || (0, _utils.getBackgroundColorType)(backgroundColor);
 
   if (!backgroundColorType) {
@@ -150,34 +164,21 @@ var MessageCard = function MessageCard(_ref2) {
     $backgroundColor: backgroundColor,
     $backgroundColorType: backgroundColorType,
     $imageLayout: layout
-  }, RootProps), image && /*#__PURE__*/React.createElement(Image, _extends({
+  }, rootProps), image && /*#__PURE__*/React.createElement(Image, _extends({
     role: "img",
     "aria-label": ariaLabel,
     $src: src,
     $imageLayout: layout,
     $backgroundPosition: backgroundPosition
-  }, ImageProps)), /*#__PURE__*/React.createElement(ContentContainer, ContentContainerProps, heading && /*#__PURE__*/React.createElement(HeadingContainer, HeadingContainerProps, heading), paragraph && /*#__PURE__*/React.createElement(ParagraphContainer, ParagraphContainerProps, paragraph), buttonLabel && /*#__PURE__*/React.createElement(Button, _extends({
+  }, imageProps)), /*#__PURE__*/React.createElement(ContentContainer, ContentContainerProps, heading && /*#__PURE__*/React.createElement(HeadingContainer, headingContainerProps, heading), paragraph && /*#__PURE__*/React.createElement(ParagraphContainer, paragraphContainerProps, paragraph), buttonLabel && /*#__PURE__*/React.createElement(Button, _extends({
     $as: "div",
     kind: buttonKind,
     shape: _button.SHAPE.pill,
     size: _button.SIZE.compact,
     role: "none",
     tabIndex: -1,
-    colors: buttonColors,
-    overrides: {
-      BaseButton: {
-        style: _objectSpread({
-          textAlign: 'center',
-          pointerEvents: 'none'
-        }, buttonKind === _constants.BUTTON_KIND.tertiary ? {
-          marginTop: theme.sizing.scale100,
-          transform: theme.direction === 'rtl' ? "translateX(".concat(theme.sizing.scale500, ")") : "translateX(-".concat(theme.sizing.scale500, ")")
-        } : {
-          marginTop: theme.sizing.scale500
-        })
-      }
-    }
-  }, ButtonProps), buttonLabel)));
+    colors: buttonColors
+  }, buttonProps), buttonLabel)));
 };
 
 var _default = MessageCard;

package/message-card/styled-components.js

@@ -75,6 +75,7 @@ var StyledRoot = (0, _styles.styled)('button', function (_ref) {
 });
 exports.StyledRoot = StyledRoot;
 StyledRoot.displayName = "StyledRoot";
+StyledRoot.displayName = 'StyledRoot';
 var StyledImage = (0, _styles.styled)('div', function (_ref2) {
   var _ref2$$imageLayout = _ref2.$imageLayout,
       $imageLayout = _ref2$$imageLayout === void 0 ? _constants.IMAGE_LAYOUT.top : _ref2$$imageLayout,
@@ -95,6 +96,7 @@ var StyledImage = (0, _styles.styled)('div', function (_ref2) {
 });
 exports.StyledImage = StyledImage;
 StyledImage.displayName = "StyledImage";
+StyledImage.displayName = 'StyledImage';
 var StyledContentContainer = (0, _styles.styled)('div', function (_ref3) {
   var $theme = _ref3.$theme;
   return {
@@ -108,12 +110,14 @@ var StyledContentContainer = (0, _styles.styled)('div', function (_ref3) {
 });
 exports.StyledContentContainer = StyledContentContainer;
 StyledContentContainer.displayName = "StyledContentContainer";
+StyledContentContainer.displayName = 'StyledContentContainer';
 var StyledHeadingContainer = (0, _styles.styled)('div', function (_ref4) {
   var $theme = _ref4.$theme;
   return _objectSpread({}, $theme.typography.HeadingXSmall);
 });
 exports.StyledHeadingContainer = StyledHeadingContainer;
 StyledHeadingContainer.displayName = "StyledHeadingContainer";
+StyledHeadingContainer.displayName = 'StyledHeadingContainer';
 var StyledParagraphContainer = (0, _styles.styled)('div', function (_ref5) {
   var $theme = _ref5.$theme;
   return _objectSpread(_objectSpread({}, $theme.typography.ParagraphSmall), {}, {
@@ -121,4 +125,5 @@ var StyledParagraphContainer = (0, _styles.styled)('div', function (_ref5) {
   });
 });
 exports.StyledParagraphContainer = StyledParagraphContainer;
-StyledParagraphContainer.displayName = "StyledParagraphContainer";
+StyledParagraphContainer.displayName = "StyledParagraphContainer";
+StyledParagraphContainer.displayName = 'StyledParagraphContainer';

package/message-card/types.d.ts

@@ -1,7 +1,7 @@
 import type { SyntheticEvent } from 'react';
 import type { Override } from '../helpers/overrides';
 import type { BACKGROUND_COLOR_TYPE, IMAGE_LAYOUT, BUTTON_KIND } from './constants';
-export declare type MessageCardOverrides = {
+export type MessageCardOverrides = {
     Root?: Override;
     ContentContainer?: Override;
     HeadingContainer?: Override;

package/mobile-header/constants.d.ts

@@ -0,0 +1,4 @@
+export declare const TYPE: Readonly<{
+    readonly fixed: "fixed";
+    readonly floating: "floating";
+}>;

package/mobile-header/constants.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TYPE = void 0;
+
+/*
+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.
+*/
+var TYPE = Object.freeze({
+  fixed: 'fixed',
+  floating: 'floating'
+});
+exports.TYPE = TYPE;

package/mobile-header/index.d.ts

@@ -0,0 +1,4 @@
+export { default as MobileHeader } from './mobile-header';
+export * from './constants';
+export * from './styled-components';
+export * from './types';

package/mobile-header/index.js

@@ -0,0 +1,60 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  MobileHeader: true
+};
+Object.defineProperty(exports, "MobileHeader", {
+  enumerable: true,
+  get: function get() {
+    return _mobileHeader.default;
+  }
+});
+
+var _mobileHeader = _interopRequireDefault(require("./mobile-header"));
+
+var _constants = require("./constants");
+
+Object.keys(_constants).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _constants[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _constants[key];
+    }
+  });
+});
+
+var _styledComponents = require("./styled-components");
+
+Object.keys(_styledComponents).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _styledComponents[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _styledComponents[key];
+    }
+  });
+});
+
+var _types = require("./types");
+
+Object.keys(_types).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _types[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _types[key];
+    }
+  });
+});
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }