@elliemae/ds-mobile 2.0.0-alpha.1 → 2.0.0-alpha.13

package/cjs/SwipeToRefresh/SwipeToRefresh.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _jsx = require('@babel/runtime/helpers/jsx');
 require('react');
 var reactDesc = require('react-desc');
-var CircularProgressIndicator = require('@elliemae/ds-basic/CircularProgressIndicator');
+var dsCircularProgressIndicator = require('@elliemae/ds-circular-progress-indicator');
 var dsSystem = require('@elliemae/ds-system');
 var useSwipe = require('./useSwipe.js');
 var styled = require('./styled.js');
@@ -18,11 +18,12 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
 var _DSCircularProgressIn;
 
-const SwipeToRefresh = ({
-  children,
-  loading,
-  onRefresh
-}) => {
+const SwipeToRefresh = _ref => {
+  let {
+    children,
+    loading,
+    onRefresh
+  } = _ref;
   const breakpoint = 60;
   const theme = dsSystem.useTheme();
   const swipe = useSwipe.useSwipe({
@@ -30,22 +31,22 @@ const SwipeToRefresh = ({
     breakpoint
   });
   const progress = swipe.height > breakpoint ? 100 : swipe.height * 100 / breakpoint;
-  return /*#__PURE__*/_jsx__default['default'](styled.SwipeContainer, {}, void 0, /*#__PURE__*/jsxRuntime.jsxs(styled.SwipeDrag, {
+  return /*#__PURE__*/_jsx__default["default"](styled.SwipeContainer, {}, void 0, /*#__PURE__*/jsxRuntime.jsxs(styled.SwipeDrag, {
     onTouchStart: swipe.touchStart,
     onTouchEnd: swipe.touchEnd,
     onTouchCancel: swipe.touchCancel,
     onTouchMove: swipe.touchMove,
     ref: swipe.ref,
-    children: [/*#__PURE__*/_jsx__default['default'](styled.LoaderBox, {
-      height: loading ? theme.space.m : `${swipe.height}px`,
+    children: [/*#__PURE__*/_jsx__default["default"](styled.LoaderBox, {
+      height: loading ? theme.space.m : "".concat(swipe.height, "px"),
       alignItems: "flex-start",
       "data-testid": "loader-box"
-    }, void 0, /*#__PURE__*/_jsx__default['default'](styled.PositionLoader, {
+    }, void 0, /*#__PURE__*/_jsx__default["default"](styled.PositionLoader, {
       height: theme.space.m,
       justifyContent: "center",
       alignItems: "center",
-      mt: swipe.height > 40 || loading ? 0 : `${swipe.height - 40}px`
-    }, void 0, loading ? _DSCircularProgressIn || (_DSCircularProgressIn = /*#__PURE__*/_jsx__default['default'](CircularProgressIndicator.DSCircularProgressIndicator, {})) : /*#__PURE__*/_jsx__default['default'](ProgressIndicator.ProgressIndicator, {
+      mt: swipe.height > 40 || loading ? 0 : "".concat(swipe.height - 40, "px")
+    }, void 0, loading ? _DSCircularProgressIn || (_DSCircularProgressIn = /*#__PURE__*/_jsx__default["default"](dsCircularProgressIndicator.DSCircularProgressIndicator, {})) : /*#__PURE__*/_jsx__default["default"](ProgressIndicator.ProgressIndicator, {
       progress: progress
     }))), /*#__PURE__*/jsxRuntime.jsx("div", {
       ref: swipe.target,

package/cjs/SwipeToRefresh/styled.js

@@ -2,23 +2,23 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Grid = require('@elliemae/ds-basic/Grid');
+var dsGrid = require('@elliemae/ds-grid');
 var styled = require('styled-components');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const SwipeContainer = /*#__PURE__*/styled__default['default'](Grid.Grid).withConfig({
+const SwipeContainer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
   componentId: "sc-pbpd8a-0"
 })(["transition:height 0.2s;overscroll-behavior:none;height:100%;"]);
-const SwipeDrag = /*#__PURE__*/styled__default['default'].div.withConfig({
+const SwipeDrag = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-pbpd8a-1"
 })(["border:none;overscroll-behavior:none;overflow:auto;max-height:100%;"]);
-const LoaderBox = /*#__PURE__*/styled__default['default'](Grid.Grid).withConfig({
+const LoaderBox = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
   componentId: "sc-pbpd8a-2"
 })(["transition:height 0.2s;overflow:hidden;"]);
-const PositionLoader = /*#__PURE__*/styled__default['default'](Grid.Grid).withConfig({
+const PositionLoader = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
   componentId: "sc-pbpd8a-3"
 })(["transition:margin 0.2s;"]);
 

package/cjs/SwipeToRefresh/useSwipe.js

@@ -2,12 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/web.dom-collections.iterator.js');
 var React = require('react');
 
-const useSwipe = ({
-  onRefresh,
-  breakpoint
-}) => {
+const useSwipe = _ref => {
+  let {
+    onRefresh,
+    breakpoint
+  } = _ref;
   const [startingPoint, setStartingPoint] = React.useState(0);
   const [movingPoint, setMovingPoint] = React.useState(0);
   const ref = React.useRef();

package/cjs/Tabs/index.js

@@ -2,10 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-require('react');
-var dsBasic = require('@elliemae/ds-basic');
+var reactDesc = require('react-desc');
+var dsTabs = require('@elliemae/ds-tabs');
+var propTypes = require('./propTypes.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -18,14 +24,14 @@ const _excluded = ["children"],
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 const DSMobileTabs = _ref => {
   let {
     children
   } = _ref,
-      props = _objectWithoutProperties__default['default'](_ref, _excluded);
+      props = _objectWithoutProperties__default["default"](_ref, _excluded);
 
-  return /*#__PURE__*/jsxRuntime.jsx(dsBasic.DSTabs, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/jsxRuntime.jsx(dsTabs.DSTabs, _objectSpread(_objectSpread({}, props), {}, {
     isDSMobile: true,
     children: children
   }));
@@ -34,13 +40,18 @@ const DSMobileTab = _ref2 => {
   let {
     children
   } = _ref2,
-      props = _objectWithoutProperties__default['default'](_ref2, _excluded2);
+      props = _objectWithoutProperties__default["default"](_ref2, _excluded2);
 
-  return /*#__PURE__*/jsxRuntime.jsx(dsBasic.DSTab, _objectSpread(_objectSpread({}, props), {}, {
-    isDSMobile: true,
+  return /*#__PURE__*/jsxRuntime.jsx(dsTabs.DSTab, _objectSpread(_objectSpread({}, props), {}, {
     children: children
   }));
 };
+const DSMobileTabsWithSchema = reactDesc.describe(DSMobileTabs);
+DSMobileTabsWithSchema.propTypes = propTypes.MobileTabsPropTypes;
+const DSMobileTabWithSchema = reactDesc.describe(DSMobileTab);
+DSMobileTabWithSchema.propTypes = propTypes.MobileTabPropTypes;
 
 exports.DSMobileTab = DSMobileTab;
+exports.DSMobileTabWithSchema = DSMobileTabWithSchema;
 exports.DSMobileTabs = DSMobileTabs;
+exports.DSMobileTabsWithSchema = DSMobileTabsWithSchema;

package/cjs/Tabs/propTypes.js

@@ -0,0 +1,28 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var reactDesc = require('react-desc');
+
+const MobileTabPropTypes = {
+  tabId: reactDesc.PropTypes.string.description('Unique Tab id.').defaultValue(''),
+  title: reactDesc.PropTypes.string.description('Tab title.').defaultValue(''),
+  required: reactDesc.PropTypes.bool.description('Show a required mark next to the title.').defaultValue(false),
+  disabled: reactDesc.PropTypes.bool.description('Disables Tab.').defaultValue(false)
+};
+const MobileTabsPropTypes = {
+  onTabChange: reactDesc.PropTypes.func.description('Handler when a user clicks on a different Tab.').defaultValue('() => {}'),
+  tabBarExtraContent: reactDesc.PropTypes.element.description('Extra content next to the Tabs Bar.').defaultValue(undefined),
+  onlyRenderActiveTab: reactDesc.PropTypes.bool.description('Only renders the active Tab in the DOM.').defaultValue(false),
+  fixedTabsHeaders: reactDesc.PropTypes.bool.description('Enables fixed Tabs mode. Makes Tab Bar non scrollable and adds equal fixed widths.').defaultValue(false),
+  activeTab: reactDesc.PropTypes.string.description('Passing a value makes DSTabs a controlled component.').defaultValue('First DSTab children.'),
+  children: reactDesc.PropTypes.node.description('Use DSTab component as children.').isRequired,
+  tabsListAriaLabel: reactDesc.PropTypes.string.description('Aria label for the Tab list.').defaultValue('Tab list.'),
+  containerProps: reactDesc.PropTypes.object.description('Additional properties for the container.').defaultValue({}),
+  innerRef: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.func, reactDesc.PropTypes.shape({
+    current: reactDesc.PropTypes.any
+  })]).description('Ref to the container.').defaultValue(undefined)
+};
+
+exports.MobileTabPropTypes = MobileTabPropTypes;
+exports.MobileTabsPropTypes = MobileTabsPropTypes;

package/cjs/index.js

@@ -8,7 +8,7 @@ var PageForm = require('./PageForm/PageForm.js');
 var PageSummary = require('./PageSummary/PageSummary.js');
 var Page = require('./LoadingPage/Page.js');
 var PageSearch = require('./PageSearch/PageSearch.js');
-var Accordion = require('@elliemae/ds-basic/Accordion');
+var dsAccordion = require('@elliemae/ds-accordion');
 var Separator = require('./MobileSeparator/Separator.js');
 var MobileListItem = require('./MobileListItem/MobileListItem.js');
 var MobileTouchable = require('./MobileTouchable/MobileTouchable.js');
@@ -45,6 +45,7 @@ var MobileBanner = require('./MobileBanner/MobileBanner.js');
 var bannerTypes = require('./MobileBanner/utils/bannerTypes.js');
 var Card = require('./MobileCard/Card.js');
 var Group = require('./MobileCard/Group.js');
+var CardIcons = require('./MobileCard/CardIcons.js');
 
 
 
@@ -59,28 +60,21 @@ exports.DSMobilePageSearch = PageSearch.DSMobilePageSearch;
 exports.DSPageSearch = PageSearch.DSPageSearch;
 Object.defineProperty(exports, 'DSMobileAccordion', {
   enumerable: true,
-  get: function () {
-    return Accordion.DSAccordion;
-  }
+  get: function () { return dsAccordion.DSAccordion; }
 });
 Object.defineProperty(exports, 'DSMobileAccordionItem', {
   enumerable: true,
-  get: function () {
-    return Accordion.DSAccordionItem;
-  }
+  get: function () { return dsAccordion.DSAccordionItem; }
 });
 Object.defineProperty(exports, 'DSMobileAccordionItemWithSchema', {
   enumerable: true,
-  get: function () {
-    return Accordion.DSAccordionItemWithSchema;
-  }
+  get: function () { return dsAccordion.DSAccordionItemWithSchema; }
 });
 Object.defineProperty(exports, 'DSMobileAccordionWithSchema', {
   enumerable: true,
-  get: function () {
-    return Accordion.DSAccordionWithSchema;
-  }
+  get: function () { return dsAccordion.DSAccordionWithSchema; }
 });
+exports.DSMobileSeparator = Separator["default"];
 exports.MobileSeparatorWithSchema = Separator.MobileSeparatorWithSchema;
 exports.DSMobileListItem = MobileListItem.DSMobileListItem;
 exports.ListItemWithSchema = MobileListItem.ListItemWithSchema;
@@ -97,10 +91,11 @@ exports.DSMobileFilterbarSort = FilterbarSort.DSMobileFilterbarSort;
 exports.FilterbarSortWithSchema = FilterbarSort.FilterbarSortWithSchema;
 exports.DSMobileFilterbarItem = FilterbarItem.DSMobileFilterbarItem;
 exports.FilterbarItemWithSchema = FilterbarItem.FilterbarItemWithSchema;
+exports.DSMobileActionToolbar = MobileActionToolbar["default"];
 exports.DSMobileActionToolbarWithSchema = MobileActionToolbar.DSMobileActionToolbarWithSchema;
 exports.DSToolbarItemWithSchema = MobileActionToolbarItem.DSToolbarItemWithSchema;
-exports.ToolbarItem = MobileActionToolbarItem['default'];
-exports.DSMobileFooter = Footer['default'];
+exports.ToolbarItem = MobileActionToolbarItem["default"];
+exports.DSMobileFooter = Footer["default"];
 exports.MobileFooterWithSchema = Footer.MobileFooterWithSchema;
 exports.DSMobileFooterText = Text.DSMobileFooterText;
 exports.DSMobileFooterTextWithSchema = Text.DSMobileFooterTextWithSchema;
@@ -119,7 +114,9 @@ exports.DSMobileDropdownMenu = MobileDropdownMenu.DSMobileDropdownMenu;
 exports.DSMobileDropdownMenuWithSchema = MobileDropdownMenu.DSMobileDropdownMenuWithSchema;
 exports.DSMobileDropdownTriggerInput = MobileDropdownInput.DSMobileDropdownTriggerInput;
 exports.DSMobileTab = index$1.DSMobileTab;
+exports.DSMobileTabWithSchema = index$1.DSMobileTabWithSchema;
 exports.DSMobileTabs = index$1.DSMobileTabs;
+exports.DSMobileTabsWithSchema = index$1.DSMobileTabsWithSchema;
 exports.DSMobileCard = index.DSMobileCard;
 exports.DSCollectionBox = CollectionBox.DSCollectionBox;
 exports.DSCollectionBoxWithSchema = CollectionBox.DSCollectionBoxWithSchema;
@@ -144,3 +141,4 @@ exports.DSMobileBannerWithSchema = MobileBanner.DSMobileBannerWithSchema;
 exports.MOBILE_BANNER_TYPES = bannerTypes.MOBILE_BANNER_TYPES;
 exports.DSMobileCardWithSchema = Card.DSMobileCardWithSchema;
 exports.DSMobileCardGroupWithSchema = Group.DSMobileCardGroupWithSchema;
+exports.SubIcons = CardIcons.SubIcons;

package/esm/Accordion/Accordion.js

@@ -1 +1 @@
-export { DSAccordion as DSMobileAccordion, DSAccordionItem as DSMobileAccordionItem, DSAccordionItemWithSchema as DSMobileAccordionItemWithSchema, DSAccordionWithSchema as DSMobileAccordionWithSchema } from '@elliemae/ds-basic/Accordion';
+export { DSAccordion as DSMobileAccordion, DSAccordionItem as DSMobileAccordionItem, DSAccordionItemWithSchema as DSMobileAccordionItemWithSchema, DSAccordionWithSchema as DSMobileAccordionWithSchema } from '@elliemae/ds-accordion';

package/esm/Accordion/index.js

@@ -1 +1 @@
-export { DSAccordion as DSMobileAccordion, DSAccordionItem as DSMobileAccordionItem, DSAccordionItemWithSchema as DSMobileAccordionItemWithSchema, DSAccordionWithSchema as DSMobileAccordionWithSchema } from '@elliemae/ds-basic/Accordion';
+export { DSAccordion as DSMobileAccordion, DSAccordionItem as DSMobileAccordionItem, DSAccordionItemWithSchema as DSMobileAccordionItemWithSchema, DSAccordionWithSchema as DSMobileAccordionWithSchema } from '@elliemae/ds-accordion';

package/esm/CategoryBox/CategoryBox.js

@@ -3,7 +3,7 @@ import 'react';
 import { times } from 'lodash';
 import { PropTypes, describe } from 'react-desc';
 import styled from 'styled-components';
-import { Grid } from '@elliemae/ds-basic';
+import { Grid } from '@elliemae/ds-grid';
 import { truncate } from '@elliemae/ds-system';
 
 const Title = /*#__PURE__*/styled.h3.withConfig({
@@ -11,15 +11,16 @@ const Title = /*#__PURE__*/styled.h3.withConfig({
 })(["font-size:18px;margin:0;color:", ";line-height:inherit;", " font-weight:", ";"], props => props.theme.colors.neutral['700'], truncate(), props => props.theme.fontWeights.semibold);
 const CategoryBox = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-iv6vo1-1"
-})(["background:", ";border-top:", ";"], props => props.theme.colors.neutral['0'], props => props.borderTop ? `1px solid ${props.theme.colors.neutral['100']}` : 'none');
+})(["background:", ";border-top:", ";"], props => props.theme.colors.neutral['0'], props => props.borderTop ? "1px solid ".concat(props.theme.colors.neutral['100']) : 'none');
 
-const DSCategoryBox = ({
-  borderTop = true,
-  actionsRight = [],
-  title,
-  headerLevel = 3,
-  children
-}) => {
+const DSCategoryBox = _ref => {
+  let {
+    borderTop = true,
+    actionsRight = [],
+    title,
+    headerLevel = 3,
+    children
+  } = _ref;
   const rows = ['auto'];
   const hasActions = actionsRight.length > 0;
   if (hasActions) rows.push('auto');
@@ -32,7 +33,7 @@ const DSCategoryBox = ({
     pl: "xs",
     pr: actionsRight.length > 0 ? 'xxs' : 'xs'
   }, void 0, /*#__PURE__*/_jsx(Title, {
-    as: `h${headerLevel}`
+    as: "h".concat(headerLevel)
   }, void 0, title), hasActions && /*#__PURE__*/_jsx(Grid, {
     cols: times(actionsRight.length, () => 'auto'),
     justifySelf: "end"

package/esm/CollectionBox/CollectionBox.js

@@ -2,7 +2,7 @@ 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 { Grid } from '@elliemae/ds-grid';
 import { truncate } from '@elliemae/ds-system';
 
 const CollectionBox = /*#__PURE__*/styled(Grid).withConfig({
@@ -21,13 +21,14 @@ const ActionWrap = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-z729w4-4"
 })(["& .em-ds-button{padding:0;min-width:unset;}"]);
 
-const DSCollectionBox = ({
-  body,
-  title,
-  headerAction,
-  footerAction,
-  headerLevel = 3
-}) => {
+const DSCollectionBox = _ref => {
+  let {
+    body,
+    title,
+    headerAction,
+    footerAction,
+    headerLevel = 3
+  } = _ref;
   const headerCols = [];
   const footerCols = [];
   const rows = [];
@@ -43,7 +44,7 @@ const DSCollectionBox = ({
     alignItems: "center",
     cols: headerCols
   }, void 0, title && /*#__PURE__*/_jsx(Header, {
-    as: `h${headerLevel}`
+    as: "h".concat(headerLevel)
   }, void 0, title), headerAction && /*#__PURE__*/_jsx(ActionWrap, {
     justifySelf: "end"
   }, void 0, headerAction)), /*#__PURE__*/_jsx(Body, {}, void 0, body), footerAction && /*#__PURE__*/_jsx(Footer, {

package/esm/FullPageContainer/FullPageContainer.js

@@ -1,7 +1,12 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import 'react';
-import { Grid } from '@elliemae/ds-basic';
+import { Grid } from '@elliemae/ds-grid';
 import { useMobileHeight } from './useMobileHeight.js';
 import { jsx } from 'react/jsx-runtime';
 

package/esm/FullPageContainer/FullPageContainerScroll.js

@@ -1,7 +1,12 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import 'react';
-import { Grid } from '@elliemae/ds-basic';
+import { Grid } from '@elliemae/ds-grid';
 import { jsx } from 'react/jsx-runtime';
 
 const _excluded = ["style", "children"];

package/esm/FullPageContainer/useMobileHeight.js

@@ -1,3 +1,4 @@
+import 'core-js/modules/web.dom-collections.iterator.js';
 import { useState, useEffect } from 'react';
 
 function useMobileHeight() {

package/esm/GlobalHeader/MobileGlobalHeader.js

@@ -1,13 +1,19 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/web.dom-collections.iterator.js';
 import { useState, useCallback } from 'react';
-import Search from '@elliemae/ds-icons/Search';
-import DSInput from '@elliemae/ds-basic/form/Input';
+import { Search } from '@elliemae/ds-icons';
+import { DSInput } from '@elliemae/ds-form';
 import { PropTypes, describe } from 'react-desc';
-import DSButton from '@elliemae/ds-basic/Button';
-import { DSIconSizes, DSIconColors } from '@elliemae/ds-basic/Icon';
-import { noop, debounce } from 'lodash';
-import { Grid } from '@elliemae/ds-basic/Grid';
+import DSButton from '@elliemae/ds-button';
+import { DSIconSizes, DSIconColors } from '@elliemae/ds-icon';
+import { debounce, noop } from 'lodash';
+import { Grid } from '@elliemae/ds-grid';
 import SvgIcon from '../Icons/EM_logo.js';
 import { Container, MainSection, Icon, Label, RightSection, SearchWrapper } from './styles.js';
 import { DSSideNav } from '../SideNav/SideNav.js';
@@ -19,14 +25,15 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-const DSGlobalHeader = ({
-  containerProps = {},
-  title,
-  lastIcon,
-  onSearchChange = noop,
-  topMenuItems,
-  bottomMenuItems
-}) => {
+const DSGlobalHeader = _ref => {
+  let {
+    containerProps = {},
+    title,
+    lastIcon,
+    onSearchChange = noop,
+    topMenuItems,
+    bottomMenuItems
+  } = _ref;
   const [searchBarVisible, setSearchBarVisible] = useState(false);
   const [searchValue, setSearchValue] = useState();
   const [showMenu, setShowMenu] = useState(false);

package/esm/GlobalHeader/styles.js

@@ -1,22 +1,15 @@
+import _taggedTemplateLiteral from '@babel/runtime/helpers/esm/taggedTemplateLiteral';
 import styled from 'styled-components';
 import { kfrm, css } from '@elliemae/ds-system';
 
+var _templateObject, _templateObject2;
 const Container = /*#__PURE__*/styled.header.withConfig({
   componentId: "sc-1nzpklc-0"
 })(["width:auto;height:64px;position:fixed;width:100%;background-color:", ";padding:", ";color:", ";"], props => props.theme.colors.brand[700], props => props.theme.space.xs, props => props.theme.colors.neutral['000']);
-const growLeft = kfrm`
-  0% {
-    width: 0;
-  }
-  100% {
-    width: 100%;
-  }
-`;
+const growLeft = kfrm(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  0% {\n    width: 0;\n  }\n  100% {\n    width: 100%;\n  }\n"])));
 const SearchWrapper = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-1nzpklc-1"
-})(["background-color:", ";", " float:right;width:100%;border-radius:4px;.dsInput{input{border-radius:2px 0 0 2px;color:", ";border:calc(0.30769rem * 0.25) solid ", " !important;&:focus{border-right:none !important;}&::placeholder{color:", ";}}.em-ds-input__clearable{border:calc(0.30769rem * 0.25) solid ", " !important;}}.dsButton{border-color:", " !important;border-radius:0 2px 2px 0;border-left:none;}svg,svg:not([fill]){fill:", ";}"], props => props.theme.colors.brand[600], css`
-    animation: ${growLeft} 1s;
-  `, props => props.theme.colors.neutral['000'], props => props.theme.colors.brand[800], props => props.theme.colors.neutral['000'], props => props.theme.colors.brand[800], props => props.theme.colors.brand[800], props => props.theme.colors.neutral['000']);
+})(["background-color:", ";", " float:right;width:100%;border-radius:4px;.dsInput{input{border-radius:2px 0 0 2px;color:", ";border:calc(0.30769rem * 0.25) solid ", " !important;&:focus{border-right:none !important;}&::placeholder{color:", ";}}.em-ds-input__clearable{border:calc(0.30769rem * 0.25) solid ", " !important;}}.dsButton{border-color:", " !important;border-radius:0 2px 2px 0;border-left:none;}svg,svg:not([fill]){fill:", ";}"], props => props.theme.colors.brand[600], css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    animation: ", " 1s;\n  "])), growLeft), props => props.theme.colors.neutral['000'], props => props.theme.colors.brand[800], props => props.theme.colors.neutral['000'], props => props.theme.colors.brand[800], props => props.theme.colors.brand[800], props => props.theme.colors.neutral['000']);
 const Icon = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-1nzpklc-2"
 })(["margin-right:", ";"], props => props.theme.space.xs);

package/esm/GroupBox/GroupBox.js

@@ -4,23 +4,24 @@ import { PropTypes, describe } from 'react-desc';
 import { times } from 'lodash';
 import { truncate } from '@elliemae/ds-system';
 import styled from 'styled-components';
-import { Grid } from '@elliemae/ds-basic';
+import { Grid } from '@elliemae/ds-grid';
 
 const Title = /*#__PURE__*/styled.h3.withConfig({
   componentId: "sc-1g87w66-0"
 })(["font-size:14px;margin:0;", " color:", ";line-height:inherit;text-transform:capitalize;font-weight:", ";"], truncate(), props => props.theme.colors.neutral['700'], props => props.theme.fontWeights.semibold);
 const GroupBox = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-1g87w66-1"
-})(["background:", ";border-top:", ";"], props => props.background === 'grey' ? props.theme.colors.neutral['050'] : props.theme.colors.neutral['000'], props => props.borderTop ? `1px solid ${props.theme.colors.neutral['100']}` : 'none');
+})(["background:", ";border-top:", ";"], props => props.background === 'grey' ? props.theme.colors.neutral['050'] : props.theme.colors.neutral['000'], props => props.borderTop ? "1px solid ".concat(props.theme.colors.neutral['100']) : 'none');
 
-const DSGroupBox = ({
-  children,
-  title,
-  background = 'grey',
-  headerLevel = 3,
-  actionsRight = [],
-  borderTop
-}) => {
+const DSGroupBox = _ref => {
+  let {
+    children,
+    title,
+    background = 'grey',
+    headerLevel = 3,
+    actionsRight = [],
+    borderTop
+  } = _ref;
   const rows = ['auto'];
   const hasActions = actionsRight.length > 0;
   if (hasActions) rows.push('auto');
@@ -34,7 +35,7 @@ const DSGroupBox = ({
     pl: "xs",
     pr: hasActions ? 'xxs' : 'xs'
   }, void 0, /*#__PURE__*/_jsx(Title, {
-    as: `h${headerLevel}`
+    as: "h".concat(headerLevel)
   }, void 0, title), hasActions && /*#__PURE__*/_jsx(Grid, {
     cols: times(actionsRight.length, () => 'auto'),
     justifySelf: "end"

package/esm/InfiniteLoader/Infiniteloader.js

@@ -1,16 +1,18 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import { useRef, useEffect } from 'react';
 import { PropTypes, describe } from 'react-desc';
-import { Grid } from '@elliemae/ds-basic';
+import { Grid } from '@elliemae/ds-grid';
 import { Loader } from './Loader.js';
 import { jsx } from 'react/jsx-runtime';
 
-const InfiniteLoader = ({
-  isFetching,
-  fetchData,
-  children,
-  height = window.innerHeight
-}) => {
+const InfiniteLoader = _ref => {
+  let {
+    isFetching,
+    fetchData,
+    children,
+    height = window.innerHeight
+  } = _ref;
+
   const callback = entries => {
     const {
       isIntersecting

package/esm/InfiniteLoader/Loader.js

@@ -1,16 +1,19 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
-import DSIndeterminateProgressIndicator from '@elliemae/ds-basic/IndeterminateProgressIndicator';
+import DSIndeterminateProgressIndicator from '@elliemae/ds-indeterminate-progress-indicator';
 import { LoaderBox } from './styled.js';
 
 var _DSIndeterminateProgr;
-const Loader = ({
-  isOpen
-}) => /*#__PURE__*/_jsx(LoaderBox, {
-  className: isOpen && 'opened'
-}, void 0, _DSIndeterminateProgr || (_DSIndeterminateProgr = /*#__PURE__*/_jsx(DSIndeterminateProgressIndicator, {
-  processing: true,
-  title: "Loading"
-})));
+const Loader = _ref => {
+  let {
+    isOpen
+  } = _ref;
+  return /*#__PURE__*/_jsx(LoaderBox, {
+    className: isOpen && 'opened'
+  }, void 0, _DSIndeterminateProgr || (_DSIndeterminateProgr = /*#__PURE__*/_jsx(DSIndeterminateProgressIndicator, {
+    processing: true,
+    title: "Loading"
+  })));
+};
 
 export { Loader };