@elliemae/ds-mobile 2.0.0-alpha.11 → 2.0.0-alpha.12

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 = [];

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/GlobalHeader/MobileGlobalHeader.js

@@ -1,14 +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';
@@ -20,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/GroupBox/GroupBox.js

@@ -4,7 +4,7 @@ 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"
@@ -13,14 +13,15 @@ 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 ".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');

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 };

package/esm/InfiniteLoader/VirtualizedInfiniteLoader.js

@@ -1,20 +1,21 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'core-js/modules/web.dom-collections.iterator.js';
 import { useState } from 'react';
-import { describe } from 'react-desc';
+import { PropTypes, describe } from 'react-desc';
 import RWInfiniteLoader from 'react-window-infinite-loader';
 import { VariableSizeList } from 'react-window';
 import { jsx } from 'react/jsx-runtime';
 
-const VirtualizedInfiniteLoader = ({
-  moreItemsLoading = false,
-  hasNextPage = false,
-  isItemLoaded = () => true,
-  loadMoreItems,
-  getItemSize = () => 38,
-  height,
-  item: Row
-}) => {
+const VirtualizedInfiniteLoader = _ref => {
+  let {
+    moreItemsLoading = false,
+    hasNextPage = false,
+    isItemLoaded = () => true,
+    loadMoreItems,
+    getItemSize = () => 38,
+    height,
+    item: Row
+  } = _ref;
   const [itemCount, setItemCount] = useState(10);
 
   const loadMore = (startIndex, stopIndex) => {
@@ -30,19 +31,22 @@ const VirtualizedInfiniteLoader = ({
     isItemLoaded: isItemLoaded,
     itemCount: itemCount,
     loadMoreItems: loadMore
-  }, void 0, ({
-    onItemsRendered,
-    ref
-  }) => /*#__PURE__*/jsx(VariableSizeList, {
-    className: "List",
-    height: height,
-    itemCount: itemCount,
-    itemSize: getItemSize,
-    onItemsRendered: onItemsRendered,
-    ref: ref,
-    width: "100%",
-    children: Row
-  })), moreItemsLoading && /*#__PURE__*/_jsx("div", {
+  }, void 0, _ref2 => {
+    let {
+      onItemsRendered,
+      ref
+    } = _ref2;
+    return /*#__PURE__*/jsx(VariableSizeList, {
+      className: "List",
+      height: height,
+      itemCount: itemCount,
+      itemSize: getItemSize,
+      onItemsRendered: onItemsRendered,
+      ref: ref,
+      width: "100%",
+      children: Row
+    });
+  }), moreItemsLoading && /*#__PURE__*/_jsx("div", {
     style: {
       position: 'absolute',
       bottom: 0,
@@ -52,6 +56,29 @@ const VirtualizedInfiniteLoader = ({
   }, void 0, "Loading"));
 };
 
+const listProps = {
+  /** Function responsible for tracking the loaded state of each item. */
+  isItemLoaded: PropTypes.bool.description('Function responsible for tracking the loaded state of each item.'),
+
+  /**  Callback to be invoked when more rows must be loaded. It should return a Promise that is resolved once all data has finished loading. */
+  loadMoreItems: PropTypes.func.description('Callback to be invoked when more rows must be loaded. It should return a Promise that is resolved once all data has finished loading.'),
+
+  /** callback to get row item size */
+  getItemSize: PropTypes.func.description('callback to get row item size'),
+
+  /** height for the list */
+  height: PropTypes.number.description('height for the list'),
+
+  /** flag to know if virtual list should be on loading state */
+  moreItemsLoading: PropTypes.bool.description('flag to know if virtual list s'),
+
+  /** Row item to render */
+  item: PropTypes.element.description('Row item to render'),
+
+  /** flag for virtualized list */
+  hasNextPage: PropTypes.bool.description('flag for virtualized list')
+};
 const VirtualizedInfiniteLoaderWithSchema = describe(VirtualizedInfiniteLoader);
+VirtualizedInfiniteLoaderWithSchema.propTypes = listProps;
 
 export { VirtualizedInfiniteLoader, VirtualizedInfiniteLoaderWithSchema };

package/esm/LoadingPage/Page.js

@@ -1,11 +1,19 @@
 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 'core-js/modules/esnext.async-iterator.constructor.js';
+import 'core-js/modules/esnext.async-iterator.to-array.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.to-array.js';
+import 'core-js/modules/esnext.async-iterator.filter.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 React, { useState, useRef, useEffect } from 'react';
 import { withTheme } from '@elliemae/ds-system';
 import { get } from 'lodash';
 import styled from 'styled-components';
-import Backdrop from '@elliemae/ds-basic/Backdrop';
+import Backdrop from '@elliemae/ds-backdrop';
 import { jsxs, Fragment } from 'react/jsx-runtime';
 
 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; }
@@ -13,18 +21,22 @@ 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 LoadingPageLoader = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-wx0z8k-0"
-})(["", ";z-index:", ";top:25%;left:15%;width:70%;height:75%;display:flex;flex-direction:column;align-items:center;"], ({
-  type
-}) => type === 'cover' ? 'position: fixed' : 'position: absolute', props => props.zIndex);
+})(["", ";z-index:", ";top:25%;left:15%;width:70%;height:75%;display:flex;flex-direction:column;align-items:center;"], _ref => {
+  let {
+    type
+  } = _ref;
+  return type === 'cover' ? 'position: fixed' : 'position: absolute';
+}, props => props.zIndex);
 
-const LoadingPage = ({
-  backdropZIndex,
-  children,
-  loader,
-  loading,
-  type = 'fill',
-  zIndex = 1
-}) => {
+const LoadingPage = _ref2 => {
+  let {
+    backdropZIndex,
+    children,
+    loader,
+    loading,
+    type = 'fill',
+    zIndex = 1
+  } = _ref2;
   const [position, setPosition] = useState(null);
   const childRef = useRef(null);
   useEffect(() => {

package/esm/MobileActionToolbar/MobileActionToolbar.js

@@ -1,7 +1,7 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
 import { PropTypes, describe } from 'react-desc';
-import { Grid } from '@elliemae/ds-basic/Grid';
+import { Grid } from '@elliemae/ds-grid';
 import styled from 'styled-components';
 import { withTheme } from '@elliemae/ds-system';
 export { default as ToolbarItem } from './MobileActionToolbarItem.js';
@@ -10,11 +10,12 @@ const ToolStrip = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-162vd15-0"
 })(["display:flex;justify-content:space-around;align-items:center;background-color:", ";"], props => props.theme.colors.neutral['000']);
 
-const Toolbar = ({
-  withDepth = true,
-  buttons = [],
-  theme
-}) => {
+const Toolbar = _ref => {
+  let {
+    withDepth = true,
+    buttons = [],
+    theme
+  } = _ref;
   const rows = [1];
   const toolbarHeight = theme.space.m;
   const borderStyle = withDepth ? {

package/esm/MobileActionToolbar/MobileActionToolbarItem.js

@@ -1,8 +1,13 @@
+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 from 'react';
 import { PropTypes, describe } from 'react-desc';
-import DSButton from '@elliemae/ds-basic/Button';
+import DSButton from '@elliemae/ds-button';
 import { jsx } from 'react/jsx-runtime';
 
 const _excluded = ["icon"];

package/esm/MobileBanner/MobileBanner.js

@@ -1,8 +1,13 @@
+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 { useRef, useState, useEffect, useLayoutEffect } from 'react';
-import CloseX from '@elliemae/ds-icons/CloseX';
+import { CloseX } from '@elliemae/ds-icons';
 import { describe } from 'react-desc';
 import { icons } from './utils/icons.js';
 import { propTypes } from './propTypes.js';
@@ -16,19 +21,20 @@ 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 DSMobileBanner = ({
-  type,
-  isOpen,
-  closeButtonOnClick,
-  label,
-  body,
-  actionLinkLabel,
-  actionLinkHref,
-  actionLinkOnClick,
-  showCloseButton,
-  containerProps,
-  focusOnOpen
-}) => {
+const DSMobileBanner = _ref => {
+  let {
+    type,
+    isOpen,
+    closeButtonOnClick,
+    label,
+    body,
+    actionLinkLabel,
+    actionLinkHref,
+    actionLinkOnClick,
+    showCloseButton,
+    containerProps,
+    focusOnOpen
+  } = _ref;
   const innerContainerRef = useRef(null);
   const closeRef = useRef(null);
   const [current, setCurrent] = useState(isOpen);