@elliemae/ds-mobile 1.55.0-next.7 → 2.0.0-alpha.10

package/esm/MobileFilterbar/FilterbarSort.js

@@ -1,33 +1,33 @@
-import React from 'react';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'react';
 import { PropTypes, describe } from 'react-desc';
 import styled from 'styled-components';
 import { Grid } from '@elliemae/ds-basic/Grid';
 import MobileSeparator from '../MobileSeparator/Separator.js';
-import '@babel/runtime/helpers/esm/defineProperty';
+import { jsxs, Fragment } from 'react/jsx-runtime';
 
-var Separator = /*#__PURE__*/styled.div.withConfig({
+const Separator = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-103uq0b-0"
 })(["& > *{margin-left:0;}"]);
 
-var DSMobileFilterbarSort = function DSMobileFilterbarSort(_ref) {
-  var children = _ref.children;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, children, /*#__PURE__*/React.createElement(Grid, {
+const DSMobileFilterbarSort = ({
+  children
+}) => /*#__PURE__*/jsxs(Fragment, {
+  children: [children, /*#__PURE__*/_jsx(Grid, {
     pb: "xxs",
     pt: "xxs",
     cols: ['min-content']
-  }, /*#__PURE__*/React.createElement(Separator, null, /*#__PURE__*/React.createElement(MobileSeparator, {
+  }, void 0, /*#__PURE__*/_jsx(Separator, {}, void 0, /*#__PURE__*/_jsx(MobileSeparator, {
     margin: "xxs",
     direction: "vertical",
     color: ['neutral', '300']
-  }))));
-};
+  })))]
+});
 
-var filterbarSortProps = {
+const filterbarSortProps = {
   children: PropTypes.element.description('FilterBar Sort Item').isRequired
 };
-DSMobileFilterbarSort.propTypes = filterbarSortProps;
-var FilterbarSortWithSchema = describe(DSMobileFilterbarSort);
+const FilterbarSortWithSchema = describe(DSMobileFilterbarSort);
 FilterbarSortWithSchema.propTypes = filterbarSortProps;
 
 export { DSMobileFilterbarSort, FilterbarSortWithSchema };
-//# sourceMappingURL=FilterbarSort.js.map

package/esm/MobileFilterbar/index.js

@@ -1,11 +1,3 @@
 export { DSMobileFilterbar, FilterbarWithSchema } from './Filterbar.js';
 export { DSMobileFilterbarSort, FilterbarSortWithSchema } from './FilterbarSort.js';
 export { DSMobileFilterbarItem, FilterbarItemWithSchema } from './FilterbarItem.js';
-import 'react';
-import 'styled-components';
-import 'react-desc';
-import '@elliemae/ds-system';
-import '@elliemae/ds-basic/Grid';
-import '../MobileSeparator/Separator.js';
-import '@babel/runtime/helpers/esm/defineProperty';
-//# sourceMappingURL=index.js.map

package/esm/MobileFooter/Action.js

@@ -1,3 +1,4 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
 import React from 'react';
 import styled from 'styled-components';
 import { typography } from 'styled-system';
@@ -5,39 +6,33 @@ import { color, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';
 import { Grid } from '@elliemae/ds-basic/Grid';
 import { PropTypes, describe } from 'react-desc';
 
-/* eslint-disable jest/valid-describe */
-var Label = /*#__PURE__*/styled.span.withConfig({
+const Label = /*#__PURE__*/styled.span.withConfig({
   componentId: "sc-1op229o-0"
-})(["", " ", " padding-bottom:", ";padding-top:calc( ", " / 2 );"], typography, color('neutral', '800'), function (props) {
-  return __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs);
-}, function (props) {
-  return __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs);
-});
+})(["", " ", " padding-bottom:", ";padding-top:calc( ", " / 2 );"], typography, color('neutral', '800'), props => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs), props => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs));
 
-var DSMobileFooterAction = function DSMobileFooterAction(_ref) {
-  var label = _ref.label,
-      icon = _ref.icon,
-      onClick = _ref.onClick;
-  return /*#__PURE__*/React.createElement(Grid, {
-    "data-testid": "ds-mobile-footer-action",
-    rows: ['auto'].concat(label ? 'min-content' : 'none'),
-    justifyContent: "center",
-    role: "button",
-    onClick: onClick
-  }, /*#__PURE__*/React.createElement(Grid, {
-    justifyContent: "center",
-    alignItems: "center"
-  }, /*#__PURE__*/React.cloneElement(icon, {
-    'data-testid': 'ds-mobile-footer-action-icon',
-    size: !label ? 'l' : 'm'
-  })), label && /*#__PURE__*/React.createElement(Grid, {
-    justifyContent: "center"
-  }, /*#__PURE__*/React.createElement(Label, {
-    fontSize: "11px"
-  }, label)));
-};
+const DSMobileFooterAction = ({
+  label,
+  icon,
+  onClick
+}) => /*#__PURE__*/_jsx(Grid, {
+  "data-testid": "ds-mobile-footer-action",
+  rows: ['auto'].concat(label ? 'min-content' : 'none'),
+  justifyContent: "center",
+  role: "button",
+  onClick: onClick
+}, void 0, /*#__PURE__*/_jsx(Grid, {
+  justifyContent: "center",
+  alignItems: "center"
+}, void 0, /*#__PURE__*/React.cloneElement(icon, {
+  'data-testid': 'ds-mobile-footer-action-icon',
+  size: !label ? 'l' : 'm'
+})), label && /*#__PURE__*/_jsx(Grid, {
+  justifyContent: "center"
+}, void 0, /*#__PURE__*/_jsx(Label, {
+  fontSize: "11px"
+}, void 0, label)));
 
-var actionProps = {
+const actionProps = {
   /** Action label */
   label: PropTypes.string.description('Action label'),
 
@@ -47,9 +42,7 @@ var actionProps = {
   /** onClick callback */
   onClick: PropTypes.func.description('onClick callback')
 };
-DSMobileFooterAction.propTypes = actionProps;
-var DSMobileFooterActionWithSchema = describe(DSMobileFooterAction).description('Mobile footer action');
+const DSMobileFooterActionWithSchema = describe(DSMobileFooterAction).description('Mobile footer action');
 DSMobileFooterActionWithSchema.propTypes = actionProps;
 
 export { DSMobileFooterAction, DSMobileFooterActionWithSchema };
-//# sourceMappingURL=Action.js.map

package/esm/MobileFooter/Footer.js

@@ -1,3 +1,4 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
 import React from 'react';
 import styled from 'styled-components';
 import { border, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';
@@ -6,57 +7,42 @@ import DSButton from '@elliemae/ds-basic/Button';
 import { PropTypes, describe } from 'react-desc';
 import { DSMobileFooterText } from './Text.js';
 
-/* eslint-disable jest/valid-describe */
-var FooterWrap = /*#__PURE__*/styled(Grid).withConfig({
+const FooterWrap = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-ls5vfg-0"
-})(["background-color:", ";border-top:", ";height:", ";"], function (props) {
-  return props.theme.colors.neutral['000'];
-}, function (props) {
-  return border(props.theme.colors.neutral[100]);
-}, function (props) {
-  return "calc(".concat(__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs), " * 7)");
-});
+})(["background-color:", ";border-top:", ";height:", ";"], props => props.theme.colors.neutral['000'], props => border(props.theme.colors.neutral[100]), props => `calc(${__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)} * 7)`);
 
-var MobileFooter = function MobileFooter(_ref) {
-  var children = _ref.children;
-  var childArr = React.Children.toArray(children);
-  var isButtonType = childArr[0].type === DSMobileFooterText || childArr[0].type === DSButton;
+const MobileFooter = ({
+  children
+}) => {
+  const childArr = React.Children.toArray(children);
+  const isButtonType = childArr[0].type === DSMobileFooterText || childArr[0].type === DSButton;
 
-  var setCols = function setCols() {
+  const setCols = () => {
     if (isButtonType) {
       return childArr.length === 1 ? ['90%'] : ['45%', '45%'];
     }
 
-    return childArr.map(function () {
-      return "".concat(100 / childArr.length, "%");
-    });
+    return childArr.map(() => `${100 / childArr.length}%`);
   };
 
-  return /*#__PURE__*/React.createElement(FooterWrap, null, /*#__PURE__*/React.createElement(Grid, {
+  return /*#__PURE__*/_jsx(FooterWrap, {}, void 0, /*#__PURE__*/_jsx(Grid, {
     cols: setCols(),
     gutter: isButtonType ? 'xs' : undefined,
     justifyContent: "center",
     alignItems: isButtonType ? 'center' : undefined
-  }, childArr.map(function (c, i) {
-    return (
-      /*#__PURE__*/
-      // eslint-disable-next-line react/no-array-index-key
-      React.createElement(Grid, {
-        key: i
-      }, c)
-    );
-  })));
+  }, void 0, childArr.map((c, i) =>
+  /*#__PURE__*/
+  // eslint-disable-next-line react/no-array-index-key
+  _jsx(Grid, {}, i, c))));
 };
 
-var footerProps = {
+const footerProps = {
   /**
    * Instance of DSButton, DSMobileFooterText or DSMobileFooterAction
    */
   children: PropTypes.oneOfType([PropTypes.element, PropTypes.arrayOf(PropTypes.element)]).isRequired.description('Instance of DSButton, DSMobileFooterText or DSMobileFooterAction')
 };
-MobileFooter.propTypes = footerProps;
-var MobileFooterWithSchema = describe(MobileFooter);
+const MobileFooterWithSchema = describe(MobileFooter);
 MobileFooterWithSchema.propTypes = footerProps;
 
 export { MobileFooterWithSchema, MobileFooter as default };
-//# sourceMappingURL=Footer.js.map

package/esm/MobileFooter/Text.js

@@ -1,24 +1,21 @@
-import React from 'react';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'react';
 import styled from 'styled-components';
 import { truncate, textStyle, color } from '@elliemae/ds-system';
 import { PropTypes, describe } from 'react-desc';
 
-/* eslint-disable jest/valid-describe */
-var Text = /*#__PURE__*/styled.p.withConfig({
+const Text = /*#__PURE__*/styled.p.withConfig({
   componentId: "sc-1v0cqsw-0"
 })(["margin:auto 0;", " ", " ", ""], truncate(), textStyle('body'), color('neutral', '800'));
 
-var DSMobileFooterText = function DSMobileFooterText(_ref) {
-  var children = _ref.children;
-  return /*#__PURE__*/React.createElement(Text, null, children);
-};
+const DSMobileFooterText = ({
+  children
+}) => /*#__PURE__*/_jsx(Text, {}, void 0, children);
 
-var props = {
+const props = {
   children: PropTypes.string.isRequired.description('Children')
 };
-DSMobileFooterText.propTypes = props;
-var DSMobileFooterTextWithSchema = describe(DSMobileFooterText);
+const DSMobileFooterTextWithSchema = describe(DSMobileFooterText);
 DSMobileFooterTextWithSchema.propTypes = props;
 
 export { DSMobileFooterText, DSMobileFooterTextWithSchema };
-//# sourceMappingURL=Text.js.map

package/esm/MobileFooter/index.js

@@ -1,11 +1,3 @@
 export { default as DSMobileFooter, MobileFooterWithSchema } from './Footer.js';
 export { DSMobileFooterText, DSMobileFooterTextWithSchema } from './Text.js';
 export { DSMobileFooterAction, DSMobileFooterActionWithSchema } from './Action.js';
-import 'react';
-import 'styled-components';
-import '@elliemae/ds-system';
-import '@elliemae/ds-basic/Grid';
-import '@elliemae/ds-basic/Button';
-import 'react-desc';
-import 'styled-system';
-//# sourceMappingURL=index.js.map

package/esm/MobileListItem/MobileListItem.js

@@ -1,60 +1,49 @@
-import React from 'react';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'react';
 import { PropTypes, describe } from 'react-desc';
 import styled from 'styled-components';
 import { Grid } from '@elliemae/ds-basic/Grid';
 import { truncate, withTheme, __UNSAFE_SPACE_TO_DIMSUM, border } from '@elliemae/ds-system';
 
-var StyledContainer = /*#__PURE__*/styled(Grid).withConfig({
+const StyledContainer = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-n7r3qn-0"
-})(["background:", ";border-bottom:", ";"], function (props) {
-  return props.theme.colors.neutral['000'];
-}, function (props) {
-  return border(props.theme.colors.neutral['300']);
-});
-var StyledTitle = /*#__PURE__*/styled.div.withConfig({
+})(["background:", ";border-bottom:", ";"], props => props.theme.colors.neutral['000'], props => border(props.theme.colors.neutral['300']));
+const StyledTitle = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-n7r3qn-1"
-})(["font-weight:", ";font-size:13px;color:", ";", ""], function (props) {
-  return props.theme.fontWeights.semibold;
-}, function (props) {
-  return props.theme.colors.neutral['800'];
-}, truncate());
+})(["font-weight:", ";font-size:13px;color:", ";", ""], props => props.theme.fontWeights.semibold, props => props.theme.colors.neutral['800'], truncate());
 
-var MobileListItem = function MobileListItem(_ref) {
-  var _ref$leftAddon = _ref.leftAddon,
-      leftAddon = _ref$leftAddon === void 0 ? null : _ref$leftAddon,
-      _ref$rightAddon = _ref.rightAddon,
-      rightAddon = _ref$rightAddon === void 0 ? null : _ref$rightAddon,
-      _ref$title = _ref.title,
-      title = _ref$title === void 0 ? '' : _ref$title,
-      _ref$value = _ref.value,
-      value = _ref$value === void 0 ? '' : _ref$value,
-      _ref$dataTestid = _ref.dataTestid,
-      dataTestid = _ref$dataTestid === void 0 ? 'mobile-list-item' : _ref$dataTestid,
-      theme = _ref.theme;
-  var cols = [1];
+const MobileListItem = ({
+  leftAddon = null,
+  rightAddon = null,
+  title = '',
+  value = '',
+  dataTestid = 'mobile-list-item',
+  theme
+}) => {
+  const cols = [1];
   if (leftAddon) cols.unshift(__UNSAFE_SPACE_TO_DIMSUM(theme.space.m));
   if (rightAddon) cols.push(__UNSAFE_SPACE_TO_DIMSUM(theme.space.m));
-  return /*#__PURE__*/React.createElement(StyledContainer, {
+  return /*#__PURE__*/_jsx(StyledContainer, {
     cols: cols,
     height: theme.space.m,
     width: "100%",
     pl: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
     pr: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
     gutter: "xs",
-    "data-testid": "".concat(dataTestid, "--").concat(value)
-  }, leftAddon && /*#__PURE__*/React.createElement(Grid, {
+    "data-testid": `${dataTestid}--${value}`
+  }, void 0, leftAddon && /*#__PURE__*/_jsx(Grid, {
     alignItems: "center",
     justifyContent: "center"
-  }, leftAddon), /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, leftAddon), /*#__PURE__*/_jsx(Grid, {
     alignItems: "center"
-  }, /*#__PURE__*/React.createElement(StyledTitle, null, title)), rightAddon && /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, /*#__PURE__*/_jsx(StyledTitle, {}, void 0, title)), rightAddon && /*#__PURE__*/_jsx(Grid, {
     alignItems: "center",
     justifyContent: "center"
-  }, rightAddon));
+  }, void 0, rightAddon));
 };
 
-var DSMobileListItem = withTheme(MobileListItem);
-var listItemProps = {
+const DSMobileListItem = withTheme(MobileListItem);
+const listItemProps = {
   leftAddon: PropTypes.element.description('Element placed at the left'),
   rightAddon: PropTypes.element.description('Element placed at the right'),
   title: PropTypes.string.description('Item s title').isRequired,
@@ -62,9 +51,7 @@ var listItemProps = {
   dataTestid: PropTypes.string.description('ID used for testing').defaultValue('mobile-list-item'),
   theme: PropTypes.object.description('')
 };
-MobileListItem.propTypes = listItemProps;
-var ListItemWithSchema = describe(MobileListItem);
+const ListItemWithSchema = describe(MobileListItem);
 ListItemWithSchema.propTypes = listItemProps;
 
 export { DSMobileListItem, ListItemWithSchema };
-//# sourceMappingURL=MobileListItem.js.map

package/esm/MobileListItem/index.js

@@ -1,7 +1 @@
 export { DSMobileListItem, ListItemWithSchema } from './MobileListItem.js';
-import 'react';
-import 'react-desc';
-import 'styled-components';
-import '@elliemae/ds-basic/Grid';
-import '@elliemae/ds-system';
-//# sourceMappingURL=index.js.map

package/esm/MobilePageHeader/MobilePageHeader.js

@@ -1,4 +1,4 @@
-import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
 import React, { useMemo, useState, useCallback } from 'react';
 import { PropTypes, describe } from 'react-desc';
 import styled from 'styled-components';
@@ -8,140 +8,107 @@ import { truncate, withTheme, __UNSAFE_SPACE_TO_DIMSUM, border } from '@elliemae
 import ChevronSmallDown from '@elliemae/ds-icons/ChevronSmallDown';
 import DSButton from '@elliemae/ds-basic/Button';
 import MobileSeparator from '../MobileSeparator/Separator.js';
-import '@babel/runtime/helpers/esm/defineProperty';
 
-var StyledTitle = /*#__PURE__*/styled(Grid).withConfig({
+var _ChevronSmallDown;
+const StyledTitle = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-1tfu1y9-0"
-})(["font-size:22px;font-weight:", ";color:", ";min-height:", ";padding-top:", ";"], function (props) {
-  return props.theme.fontWeights.regular;
-}, function (props) {
-  return props.theme.colors.neutral['700'];
-}, function (props) {
-  return props.withBreadcrumb ? 'auto' : '44px';
-}, function (props) {
-  return props.withBreadcrumb ? '0' : '6px';
-});
-var StyledBreadCrumb = /*#__PURE__*/styled.div.withConfig({
+})(["font-size:22px;font-weight:", ";color:", ";min-height:", ";padding-top:", ";"], props => props.theme.fontWeights.regular, props => props.theme.colors.neutral['700'], props => props.withBreadcrumb ? 'auto' : '44px', props => props.withBreadcrumb ? '0' : '6px');
+const StyledBreadCrumb = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-1tfu1y9-1"
-})(["font-size:16px;font-weight:", ";color:", ";", ""], function (props) {
-  return props.theme.fontWeights.regular;
-}, function (props) {
-  return props.theme.colors.neutral['600'];
-}, truncate());
-var Label = /*#__PURE__*/styled.div.withConfig({
+})(["font-size:16px;font-weight:", ";color:", ";", ""], props => props.theme.fontWeights.regular, props => props.theme.colors.neutral['600'], truncate());
+const Label = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-1tfu1y9-2"
-})(["color:", ";", ""], function (props) {
-  return props.theme.colors.neutral['500'];
-}, truncate());
-var Value = /*#__PURE__*/styled.div.withConfig({
+})(["color:", ";", ""], props => props.theme.colors.neutral['500'], truncate());
+const Value = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-1tfu1y9-3"
-})(["", " color:", ";", " margin-top:", ";"], truncate(), function (props) {
-  return props.theme.colors.neutral['600'];
-}, function (props) {
-  return props.withMarginRight ? "margin-right: 4px;" : '';
-}, function (props) {
-  return props.withBreadcrumb ? '12px' : '0';
-});
-var Wrapper = /*#__PURE__*/styled(Grid).withConfig({
+})(["", " color:", ";", " margin-top:", ";"], truncate(), props => props.theme.colors.neutral['600'], props => props.withMarginRight ? `margin-right: 4px;` : '', props => props.withBreadcrumb ? '12px' : '0');
+const Wrapper = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-1tfu1y9-4"
-})(["border-bottom:", ";"], function (props) {
-  return border(props.theme.colors.neutral['300']);
-});
+})(["border-bottom:", ";"], props => border(props.theme.colors.neutral['300']));
 
-var MobilePageHeader = function MobilePageHeader(_ref) {
-  var _ref$pageTitle = _ref.pageTitle,
-      pageTitle = _ref$pageTitle === void 0 ? null : _ref$pageTitle,
-      _ref$contextMenu = _ref.contextMenu,
-      contextMenu = _ref$contextMenu === void 0 ? null : _ref$contextMenu,
-      _ref$firstAction = _ref.firstAction,
-      firstAction = _ref$firstAction === void 0 ? null : _ref$firstAction,
-      _ref$secondAction = _ref.secondAction,
-      secondAction = _ref$secondAction === void 0 ? null : _ref$secondAction,
-      _ref$backArrow = _ref.backArrow,
-      backArrow = _ref$backArrow === void 0 ? null : _ref$backArrow,
-      _ref$breadCrumb = _ref.breadCrumb,
-      breadCrumb = _ref$breadCrumb === void 0 ? null : _ref$breadCrumb,
-      _ref$onOpenContextMen = _ref.onOpenContextMenu,
-      onOpenContextMenu = _ref$onOpenContextMen === void 0 ? function () {
-    return null;
-  } : _ref$onOpenContextMen,
-      value = _ref.value,
-      label = _ref.label,
-      theme = _ref.theme;
-  var hasValue = value === 0 || value;
-  var countActions = useMemo(function () {
-    var count = 0;
+const MobilePageHeader = ({
+  pageTitle = null,
+  contextMenu = null,
+  firstAction = null,
+  secondAction = null,
+  backArrow = null,
+  breadCrumb = null,
+  onOpenContextMenu = () => null,
+  value,
+  label,
+  theme
+}) => {
+  const hasValue = value === 0 || value;
+  const countActions = useMemo(() => {
+    let count = 0;
     if (firstAction) count++;
     if (secondAction) count++;
     return count;
   }, [firstAction, secondAction]);
-
-  var _useState = useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      open = _useState2[0],
-      setOpen = _useState2[1];
-
-  var handleContext = useCallback(function () {
+  const [open, setOpen] = useState();
+  const handleContext = useCallback(() => {
     setOpen(!open);
   }, [open]);
-  var separator = /*#__PURE__*/React.createElement(Grid, {
+
+  const separator = /*#__PURE__*/_jsx(Grid, {
     height: "32px",
     alignItems: "center"
-  }, /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, /*#__PURE__*/_jsx(Grid, {
     height: "24px"
-  }, /*#__PURE__*/React.createElement(MobileSeparator, {
+  }, void 0, /*#__PURE__*/_jsx(MobileSeparator, {
     direction: "vertical",
     margin: "xxs",
     color: ['neutral', '300']
   })));
-  var cols = [1, 'auto'];
-  var cols2 = ['auto'];
+
+  const cols = [1, 'auto'];
+  const cols2 = ['auto'];
   if (countActions) cols.push('auto');
   if (hasValue) cols2.push('auto');
   if (label) cols2.push('auto');
-  return /*#__PURE__*/React.createElement(Wrapper, {
+  return /*#__PURE__*/_jsx(Wrapper, {
     cols: cols,
     pl: theme.space.xs,
     pr: theme.space.xs,
     alignItems: "flex-start",
     width: "100%",
     "data-testid": "page-header-wrapper"
-  }, /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, /*#__PURE__*/_jsx(Grid, {
     alignItems: "flex-start",
     justifyContent: "flex-start",
     cols: cols2
-  }, /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, /*#__PURE__*/_jsx(Grid, {
     cols: backArrow ? ['auto', 1] : [1],
     alignItems: "flex-start",
     pr: countActions === 0 && !hasValue && !label ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : 0
-  }, backArrow && /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, backArrow && /*#__PURE__*/_jsx(Grid, {
     height: breadCrumb ? '56px' : '44px',
     alignItems: "center"
-  }, backArrow), /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, backArrow), /*#__PURE__*/_jsx(Grid, {
     flexGrow: 0,
     pt: !breadCrumb ? 0 : theme.space.xxs
-  }, /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, /*#__PURE__*/_jsx(Grid, {
     cols: ['auto', 'auto'],
     alignItems: "flex-start"
-  }, /*#__PURE__*/React.createElement(Grid, null, breadCrumb && /*#__PURE__*/React.createElement(StyledBreadCrumb, {
+  }, void 0, /*#__PURE__*/_jsx(Grid, {}, void 0, breadCrumb && /*#__PURE__*/_jsx(StyledBreadCrumb, {
     "data-testid": "page-header-breadcrum"
-  }, breadCrumb), /*#__PURE__*/React.createElement(StyledTitle, {
+  }, void 0, breadCrumb), /*#__PURE__*/_jsx(StyledTitle, {
     maxWidth: "100%",
     alignItems: "flex-start",
     withBreadcrumb: !!breadCrumb,
     "data-testid": "page-header-title"
-  }, /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, /*#__PURE__*/_jsx(Grid, {
     pt: breadCrumb ? 0 : theme.space.xxxs
-  }, /*#__PURE__*/React.createElement(TruncatedExpandableText, {
+  }, void 0, /*#__PURE__*/_jsx(TruncatedExpandableText, {
     value: pageTitle
-  })))), contextMenu && /*#__PURE__*/React.createElement(Grid, {
+  })))), contextMenu && /*#__PURE__*/_jsx(Grid, {
     alignItems: "center",
     mt: breadCrumb ? '20px' : '8px'
-  }, /*#__PURE__*/React.createElement(DSButton, {
+  }, void 0, /*#__PURE__*/_jsx(DSButton, {
     buttonType: "text",
-    icon: /*#__PURE__*/React.createElement(ChevronSmallDown, null),
+    icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx(ChevronSmallDown, {})),
     size: "s",
-    onClick: function onClick() {
+    onClick: () => {
       handleContext();
       onOpenContextMenu();
     },
@@ -150,31 +117,31 @@ var MobilePageHeader = function MobilePageHeader(_ref) {
     }
   }), /*#__PURE__*/React.cloneElement(contextMenu, {
     open: contextMenu.props.open !== undefined ? contextMenu.props.open : open,
-    onChange: function onChange(event, item) {
+    onChange: (event, item) => {
       if (contextMenu.props.onChange) contextMenu.props.onChange(event, item);
       handleContext();
     }
-  }))))), hasValue && /*#__PURE__*/React.createElement(Grid, {
+  }))))), hasValue && /*#__PURE__*/_jsx(Grid, {
     height: breadCrumb ? '56px' : '44px',
     alignItems: "center",
     cols: ['auto', 'auto']
-  }, separator, /*#__PURE__*/React.createElement(Value, {
+  }, void 0, separator, /*#__PURE__*/_jsx(Value, {
     withMarginRight: !!label,
     "data-testid": "page-header-value"
-  }, value)), label && /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, value)), label && /*#__PURE__*/_jsx(Grid, {
     height: breadCrumb ? '56px' : '44px',
     alignItems: "center"
-  }, /*#__PURE__*/React.createElement(Label, {
+  }, void 0, /*#__PURE__*/_jsx(Label, {
     withBreadcrumb: !!breadCrumb,
     "data-testid": "page-header-label"
-  }, label))), countActions > 0 && /*#__PURE__*/React.createElement(Grid, {
+  }, void 0, label))), countActions > 0 && /*#__PURE__*/_jsx(Grid, {
     height: breadCrumb ? '56px' : '44px',
     alignItems: "center",
     cols: countActions === 1 ? ['auto'] : ['auto', 'auto', 'auto']
-  }, firstAction && /*#__PURE__*/React.createElement(Grid, null, firstAction), countActions === 2 && separator, secondAction && /*#__PURE__*/React.createElement(Grid, null, secondAction)));
+  }, void 0, firstAction && /*#__PURE__*/_jsx(Grid, {}, void 0, firstAction), countActions === 2 && separator, secondAction && /*#__PURE__*/_jsx(Grid, {}, void 0, secondAction)));
 };
 
-var pageHeaderProps = {
+const pageHeaderProps = {
   pageTitle: PropTypes.string.description('Page title').isRequired,
   contextMenu: PropTypes.element.description('Context Menu to open'),
   onOpenContextMenu: PropTypes.func.description('function called when context menu opens'),
@@ -186,10 +153,8 @@ var pageHeaderProps = {
   label: PropTypes.string.description('Page summary label'),
   theme: PropTypes.object.description('dimsum theme')
 };
-MobilePageHeader.propTypes = pageHeaderProps;
-var PageHeaderWithSchema = describe(MobilePageHeader);
+const PageHeaderWithSchema = describe(MobilePageHeader);
 PageHeaderWithSchema.propTypes = pageHeaderProps;
-var DSMobilePageHeader = withTheme(MobilePageHeader);
+const DSMobilePageHeader = withTheme(MobilePageHeader);
 
 export { DSMobilePageHeader, PageHeaderWithSchema };
-//# sourceMappingURL=MobilePageHeader.js.map

package/esm/MobilePageHeader/index.js

@@ -1,13 +1 @@
 export { DSMobilePageHeader, PageHeaderWithSchema } from './MobilePageHeader.js';
-import '@babel/runtime/helpers/esm/slicedToArray';
-import 'react';
-import 'react-desc';
-import 'styled-components';
-import '@elliemae/ds-basic/TruncatedExpandableText';
-import '@elliemae/ds-basic/Grid';
-import '@elliemae/ds-system';
-import '@elliemae/ds-icons/ChevronSmallDown';
-import '@elliemae/ds-basic/Button';
-import '../MobileSeparator/Separator.js';
-import '@babel/runtime/helpers/esm/defineProperty';
-//# sourceMappingURL=index.js.map