@elliemae/ds-mobile 2.0.0-next.8 → 2.0.0-rc.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (138) hide show
  1. package/cjs/Accordion/Accordion.js +5 -5
  2. package/cjs/Accordion/index.js +5 -5
  3. package/cjs/CategoryBox/CategoryBox.js +12 -11
  4. package/cjs/CollectionBox/CollectionBox.js +14 -13
  5. package/cjs/FullPageContainer/FullPageContainer.js +7 -2
  6. package/cjs/FullPageContainer/FullPageContainerScroll.js +7 -2
  7. package/cjs/GlobalHeader/MobileGlobalHeader.js +28 -24
  8. package/cjs/GroupBox/GroupBox.js +13 -12
  9. package/cjs/InfiniteLoader/Infiniteloader.js +11 -9
  10. package/cjs/InfiniteLoader/Loader.js +12 -9
  11. package/cjs/InfiniteLoader/VirtualizedInfiniteLoader.js +49 -22
  12. package/cjs/LoadingPage/Page.js +24 -12
  13. package/cjs/MobileActionToolbar/MobileActionToolbar.js +8 -7
  14. package/cjs/MobileActionToolbar/MobileActionToolbarItem.js +6 -1
  15. package/cjs/MobileBanner/MobileBanner.js +21 -16
  16. package/cjs/MobileBanner/styles.js +128 -59
  17. package/cjs/MobileBanner/utils/icons.js +5 -12
  18. package/cjs/MobileBanner/utils/styleHelpers.js +8 -4
  19. package/cjs/MobileCard/ActionAddon.js +16 -14
  20. package/cjs/MobileCard/Card.js +26 -22
  21. package/cjs/MobileCard/CardIcons.js +21 -16
  22. package/cjs/MobileCard/ExpandChevron.js +8 -10
  23. package/cjs/MobileCard/ExpandableRegion.js +5 -4
  24. package/cjs/MobileCard/Group.js +22 -16
  25. package/cjs/MobileContextMenu/MobileContextMenu.js +33 -25
  26. package/cjs/MobileContextMenu/MobileContextMenuGroup.js +35 -25
  27. package/cjs/MobileContextMenu/MobileContextMenuItem.js +29 -25
  28. package/cjs/MobileDatePicker/Input.js +5 -0
  29. package/cjs/MobileDatePicker/MobileDatePicker.js +15 -16
  30. package/cjs/MobileDropdownMenu/MobileDropdownInput.js +27 -17
  31. package/cjs/MobileDropdownMenu/MobileDropdownMenu.js +19 -16
  32. package/cjs/MobileEmtpyState/MobileEmptyState.js +10 -8
  33. package/cjs/MobileFilterbar/Filterbar.js +13 -10
  34. package/cjs/MobileFilterbar/FilterbarItem.js +15 -12
  35. package/cjs/MobileFilterbar/FilterbarSort.js +17 -14
  36. package/cjs/MobileFooter/Action.js +27 -24
  37. package/cjs/MobileFooter/Footer.js +15 -8
  38. package/cjs/MobileFooter/Text.js +6 -3
  39. package/cjs/MobileListItem/MobileListItem.js +14 -13
  40. package/cjs/MobilePageHeader/MobilePageHeader.js +35 -35
  41. package/cjs/MobileSelectList/MobileSelectList.js +29 -22
  42. package/cjs/MobileSelectList/styled.js +9 -11
  43. package/cjs/MobileSeparator/Separator.js +30 -18
  44. package/cjs/MobileTimePicker/Input.js +5 -0
  45. package/cjs/MobileTimePicker/MobileTimePicker.js +15 -16
  46. package/cjs/MobileTimePicker/MobileTimePicker.stories.js +2 -2
  47. package/cjs/MobileTouchable/MobileTouchable.js +7 -2
  48. package/cjs/Modal/Modal.js +30 -25
  49. package/cjs/Modal/styled.js +7 -7
  50. package/cjs/PageFilter/PageFilter.js +20 -15
  51. package/cjs/PageForm/PageForm.js +22 -15
  52. package/cjs/PageList/PageList.js +12 -11
  53. package/cjs/PageSearch/PageSearch.js +14 -13
  54. package/cjs/PageSummary/PageSummary.js +34 -21
  55. package/cjs/PageSummary/Tags.js +12 -6
  56. package/cjs/SideNav/SideNav.js +42 -34
  57. package/cjs/SwipeToRefresh/ProgressIndicator.js +6 -5
  58. package/cjs/SwipeToRefresh/SwipeToRefresh.js +8 -7
  59. package/cjs/SwipeToRefresh/styled.js +4 -4
  60. package/cjs/SwipeToRefresh/useSwipe.js +5 -4
  61. package/cjs/Tabs/index.js +8 -3
  62. package/cjs/index.js +9 -5
  63. package/esm/Accordion/Accordion.js +1 -1
  64. package/esm/Accordion/index.js +1 -1
  65. package/esm/CategoryBox/CategoryBox.js +9 -8
  66. package/esm/CollectionBox/CollectionBox.js +9 -8
  67. package/esm/FullPageContainer/FullPageContainer.js +6 -1
  68. package/esm/FullPageContainer/FullPageContainerScroll.js +6 -1
  69. package/esm/GlobalHeader/MobileGlobalHeader.js +20 -14
  70. package/esm/GroupBox/GroupBox.js +10 -9
  71. package/esm/InfiniteLoader/Infiniteloader.js +9 -7
  72. package/esm/InfiniteLoader/Loader.js +12 -9
  73. package/esm/InfiniteLoader/VirtualizedInfiniteLoader.js +50 -23
  74. package/esm/LoadingPage/Page.js +24 -12
  75. package/esm/MobileActionToolbar/MobileActionToolbar.js +7 -6
  76. package/esm/MobileActionToolbar/MobileActionToolbarItem.js +6 -1
  77. package/esm/MobileBanner/MobileBanner.js +20 -14
  78. package/esm/MobileBanner/styles.js +128 -59
  79. package/esm/MobileBanner/utils/icons.js +1 -4
  80. package/esm/MobileBanner/utils/styleHelpers.js +8 -4
  81. package/esm/MobileCard/ActionAddon.js +16 -13
  82. package/esm/MobileCard/Card.js +20 -16
  83. package/esm/MobileCard/CardIcons.js +20 -15
  84. package/esm/MobileCard/ExpandChevron.js +8 -8
  85. package/esm/MobileCard/ExpandableRegion.js +5 -4
  86. package/esm/MobileCard/Group.js +20 -14
  87. package/esm/MobileContextMenu/MobileContextMenu.js +26 -18
  88. package/esm/MobileContextMenu/MobileContextMenuGroup.js +35 -25
  89. package/esm/MobileContextMenu/MobileContextMenuItem.js +25 -19
  90. package/esm/MobileDatePicker/Input.js +5 -0
  91. package/esm/MobileDatePicker/MobileDatePicker.js +12 -11
  92. package/esm/MobileDropdownMenu/MobileDropdownInput.js +27 -16
  93. package/esm/MobileDropdownMenu/MobileDropdownMenu.js +19 -16
  94. package/esm/MobileEmtpyState/MobileEmptyState.js +10 -7
  95. package/esm/MobileFilterbar/Filterbar.js +13 -10
  96. package/esm/MobileFilterbar/FilterbarItem.js +15 -12
  97. package/esm/MobileFilterbar/FilterbarSort.js +17 -14
  98. package/esm/MobileFooter/Action.js +26 -23
  99. package/esm/MobileFooter/Footer.js +12 -5
  100. package/esm/MobileFooter/Text.js +6 -3
  101. package/esm/MobileListItem/MobileListItem.js +10 -9
  102. package/esm/MobilePageHeader/MobilePageHeader.js +17 -16
  103. package/esm/MobileSelectList/MobileSelectList.js +25 -17
  104. package/esm/MobileSelectList/styled.js +4 -4
  105. package/esm/MobileSeparator/Separator.js +28 -16
  106. package/esm/MobileTimePicker/Input.js +5 -0
  107. package/esm/MobileTimePicker/MobileTimePicker.js +12 -11
  108. package/esm/MobileTimePicker/MobileTimePicker.stories.js +1 -1
  109. package/esm/MobileTouchable/MobileTouchable.js +6 -1
  110. package/esm/Modal/Modal.js +25 -19
  111. package/esm/Modal/styled.js +1 -1
  112. package/esm/PageFilter/PageFilter.js +15 -10
  113. package/esm/PageForm/PageForm.js +18 -11
  114. package/esm/PageList/PageList.js +10 -9
  115. package/esm/PageSearch/PageSearch.js +10 -9
  116. package/esm/PageSummary/PageSummary.js +32 -19
  117. package/esm/PageSummary/Tags.js +12 -6
  118. package/esm/SideNav/SideNav.js +38 -29
  119. package/esm/SwipeToRefresh/ProgressIndicator.js +5 -4
  120. package/esm/SwipeToRefresh/SwipeToRefresh.js +7 -6
  121. package/esm/SwipeToRefresh/styled.js +1 -1
  122. package/esm/SwipeToRefresh/useSwipe.js +5 -4
  123. package/esm/Tabs/index.js +6 -1
  124. package/esm/index.js +4 -3
  125. package/package.json +15 -7
  126. package/types/Accordion/Accordion.d.ts +1 -1
  127. package/types/CategoryBox/CategoryBox.d.ts +1 -1
  128. package/types/CollectionBox/CollectionBox.d.ts +1 -1
  129. package/types/GroupBox/GroupBox.d.ts +1 -1
  130. package/types/InfiniteLoader/Infiniteloader.d.ts +1 -1
  131. package/types/MobileBanner/styles.d.ts +60 -1
  132. package/types/MobileDatePicker/MobileDatePicker.d.ts +1 -1
  133. package/types/MobileSelectList/styled.d.ts +4 -4
  134. package/types/MobileTimePicker/MobileTimePicker.d.ts +1 -1
  135. package/types/Modal/styled.d.ts +7 -6
  136. package/types/SideNav/SideNav.d.ts +1 -1
  137. package/types/SwipeToRefresh/styled.d.ts +4 -3
  138. package/types/index.d.ts +5 -1
@@ -5,23 +5,26 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var _jsx = require('@babel/runtime/helpers/jsx');
6
6
  require('react');
7
7
  var reactDesc = require('react-desc');
8
- var Grid = require('@elliemae/ds-basic/Grid');
8
+ var dsGrid = require('@elliemae/ds-grid');
9
9
 
10
10
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
11
 
12
12
  var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
13
13
 
14
- const DSMobileFilterbarItem = ({
15
- children,
16
- onClick
17
- }) => /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
18
- "data-testid": "filter-bar-item-wrapper",
19
- cols: ['min-content'],
20
- pr: "xxs",
21
- pt: "xxs",
22
- role: "button",
23
- onClick: onClick
24
- }, void 0, children);
14
+ const DSMobileFilterbarItem = _ref => {
15
+ let {
16
+ children,
17
+ onClick
18
+ } = _ref;
19
+ return /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
20
+ "data-testid": "filter-bar-item-wrapper",
21
+ cols: ['min-content'],
22
+ pr: "xxs",
23
+ pt: "xxs",
24
+ role: "button",
25
+ onClick: onClick
26
+ }, void 0, children);
27
+ };
25
28
 
26
29
  const filterbarItemProps = {
27
30
  children: reactDesc.PropTypes.element.description('FilterBar Items').isRequired,
@@ -6,7 +6,7 @@ var _jsx = require('@babel/runtime/helpers/jsx');
6
6
  require('react');
7
7
  var reactDesc = require('react-desc');
8
8
  var styled = require('styled-components');
9
- var Grid = require('@elliemae/ds-basic/Grid');
9
+ var dsGrid = require('@elliemae/ds-grid');
10
10
  var Separator$1 = require('../MobileSeparator/Separator.js');
11
11
  var jsxRuntime = require('react/jsx-runtime');
12
12
 
@@ -19,19 +19,22 @@ const Separator = /*#__PURE__*/styled__default["default"].div.withConfig({
19
19
  componentId: "sc-103uq0b-0"
20
20
  })(["& > *{margin-left:0;}"]);
21
21
 
22
- const DSMobileFilterbarSort = ({
23
- children
24
- }) => /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
25
- children: [children, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
26
- pb: "xxs",
27
- pt: "xxs",
28
- cols: ['min-content']
29
- }, void 0, /*#__PURE__*/_jsx__default["default"](Separator, {}, void 0, /*#__PURE__*/_jsx__default["default"](Separator$1["default"], {
30
- margin: "xxs",
31
- direction: "vertical",
32
- color: ['neutral', '300']
33
- })))]
34
- });
22
+ const DSMobileFilterbarSort = _ref => {
23
+ let {
24
+ children
25
+ } = _ref;
26
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
27
+ children: [children, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
28
+ pb: "xxs",
29
+ pt: "xxs",
30
+ cols: ['min-content']
31
+ }, void 0, /*#__PURE__*/_jsx__default["default"](Separator, {}, void 0, /*#__PURE__*/_jsx__default["default"](Separator$1["default"], {
32
+ margin: "xxs",
33
+ direction: "vertical",
34
+ color: ['neutral', '300']
35
+ })))]
36
+ });
37
+ };
35
38
 
36
39
  const filterbarSortProps = {
37
40
  children: reactDesc.PropTypes.element.description('FilterBar Sort Item').isRequired
@@ -7,7 +7,7 @@ var React = require('react');
7
7
  var styled = require('styled-components');
8
8
  var styledSystem = require('styled-system');
9
9
  var dsSystem = require('@elliemae/ds-system');
10
- var Grid = require('@elliemae/ds-basic/Grid');
10
+ var dsGrid = require('@elliemae/ds-grid');
11
11
  var reactDesc = require('react-desc');
12
12
 
13
13
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -18,29 +18,32 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
18
18
 
19
19
  const Label = /*#__PURE__*/styled__default["default"].span.withConfig({
20
20
  componentId: "sc-1op229o-0"
21
- })(["", " ", " padding-bottom:", ";padding-top:calc( ", " / 2 );"], styledSystem.typography, dsSystem.color('neutral', '800'), props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs), props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs));
22
-
23
- const DSMobileFooterAction = ({
24
- label,
25
- icon,
26
- onClick
27
- }) => /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
28
- "data-testid": "ds-mobile-footer-action",
29
- rows: ['auto'].concat(label ? 'min-content' : 'none'),
30
- justifyContent: "center",
31
- role: "button",
32
- onClick: onClick
33
- }, void 0, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
34
- justifyContent: "center",
35
- alignItems: "center"
36
- }, void 0, /*#__PURE__*/React__default["default"].cloneElement(icon, {
37
- 'data-testid': 'ds-mobile-footer-action-icon',
38
- size: !label ? 'l' : 'm'
39
- })), label && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
40
- justifyContent: "center"
41
- }, void 0, /*#__PURE__*/_jsx__default["default"](Label, {
42
- fontSize: "11px"
43
- }, void 0, label)));
21
+ })(["", " ", " padding-bottom:", ";padding-top:calc(", " / 2);"], styledSystem.typography, dsSystem.color('neutral', '800'), props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs), props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs));
22
+
23
+ const DSMobileFooterAction = _ref => {
24
+ let {
25
+ label,
26
+ icon,
27
+ onClick
28
+ } = _ref;
29
+ return /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
30
+ "data-testid": "ds-mobile-footer-action",
31
+ rows: ['auto'].concat(label ? 'min-content' : 'none'),
32
+ justifyContent: "center",
33
+ role: "button",
34
+ onClick: onClick
35
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
36
+ justifyContent: "center",
37
+ alignItems: "center"
38
+ }, void 0, /*#__PURE__*/React__default["default"].cloneElement(icon, {
39
+ 'data-testid': 'ds-mobile-footer-action-icon',
40
+ size: !label ? 'l' : 'm'
41
+ })), label && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
42
+ justifyContent: "center"
43
+ }, void 0, /*#__PURE__*/_jsx__default["default"](Label, {
44
+ fontSize: "11px"
45
+ }, void 0, label)));
46
+ };
44
47
 
45
48
  const actionProps = {
46
49
  /** Action label */
@@ -3,11 +3,17 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var _jsx = require('@babel/runtime/helpers/jsx');
6
+ require('core-js/modules/esnext.async-iterator.constructor.js');
7
+ require('core-js/modules/esnext.async-iterator.to-array.js');
8
+ require('core-js/modules/esnext.iterator.constructor.js');
9
+ require('core-js/modules/esnext.iterator.to-array.js');
10
+ require('core-js/modules/esnext.async-iterator.map.js');
11
+ require('core-js/modules/esnext.iterator.map.js');
6
12
  var React = require('react');
7
13
  var styled = require('styled-components');
8
14
  var dsSystem = require('@elliemae/ds-system');
9
- var Grid = require('@elliemae/ds-basic/Grid');
10
- var DSButton = require('@elliemae/ds-basic/Button');
15
+ var dsGrid = require('@elliemae/ds-grid');
16
+ var DSButton = require('@elliemae/ds-button');
11
17
  var reactDesc = require('react-desc');
12
18
  var Text = require('./Text.js');
13
19
 
@@ -18,13 +24,14 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
18
24
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
19
25
  var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
20
26
 
21
- const FooterWrap = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
27
+ const FooterWrap = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
22
28
  componentId: "sc-ls5vfg-0"
23
29
  })(["background-color:", ";border-top:", ";height:", ";"], props => props.theme.colors.neutral['000'], props => dsSystem.border(props.theme.colors.neutral[100]), props => "calc(".concat(dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs), " * 7)"));
24
30
 
25
- const MobileFooter = ({
26
- children
27
- }) => {
31
+ const MobileFooter = _ref => {
32
+ let {
33
+ children
34
+ } = _ref;
28
35
  const childArr = React__default["default"].Children.toArray(children);
29
36
  const isButtonType = childArr[0].type === Text.DSMobileFooterText || childArr[0].type === DSButton__default["default"];
30
37
 
@@ -36,7 +43,7 @@ const MobileFooter = ({
36
43
  return childArr.map(() => "".concat(100 / childArr.length, "%"));
37
44
  };
38
45
 
39
- return /*#__PURE__*/_jsx__default["default"](FooterWrap, {}, void 0, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
46
+ return /*#__PURE__*/_jsx__default["default"](FooterWrap, {}, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
40
47
  cols: setCols(),
41
48
  gutter: isButtonType ? 'xs' : undefined,
42
49
  justifyContent: "center",
@@ -44,7 +51,7 @@ const MobileFooter = ({
44
51
  }, void 0, childArr.map((c, i) =>
45
52
  /*#__PURE__*/
46
53
  // eslint-disable-next-line react/no-array-index-key
47
- _jsx__default["default"](Grid.Grid, {}, i, c))));
54
+ _jsx__default["default"](dsGrid.Grid, {}, i, c))));
48
55
  };
49
56
 
50
57
  const footerProps = {
@@ -17,9 +17,12 @@ const Text = /*#__PURE__*/styled__default["default"].p.withConfig({
17
17
  componentId: "sc-1v0cqsw-0"
18
18
  })(["margin:auto 0;", " ", " ", ""], dsSystem.truncate(), dsSystem.textStyle('body'), dsSystem.color('neutral', '800'));
19
19
 
20
- const DSMobileFooterText = ({
21
- children
22
- }) => /*#__PURE__*/_jsx__default["default"](Text, {}, void 0, children);
20
+ const DSMobileFooterText = _ref => {
21
+ let {
22
+ children
23
+ } = _ref;
24
+ return /*#__PURE__*/_jsx__default["default"](Text, {}, void 0, children);
25
+ };
23
26
 
24
27
  const props = {
25
28
  children: reactDesc.PropTypes.string.isRequired.description('Children')
@@ -6,7 +6,7 @@ var _jsx = require('@babel/runtime/helpers/jsx');
6
6
  require('react');
7
7
  var reactDesc = require('react-desc');
8
8
  var styled = require('styled-components');
9
- var Grid = require('@elliemae/ds-basic/Grid');
9
+ var dsGrid = require('@elliemae/ds-grid');
10
10
  var dsSystem = require('@elliemae/ds-system');
11
11
 
12
12
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -14,21 +14,22 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
14
14
  var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
15
15
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
16
16
 
17
- const StyledContainer = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
17
+ const StyledContainer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
18
18
  componentId: "sc-n7r3qn-0"
19
19
  })(["background:", ";border-bottom:", ";"], props => props.theme.colors.neutral['000'], props => dsSystem.border(props.theme.colors.neutral['300']));
20
20
  const StyledTitle = /*#__PURE__*/styled__default["default"].div.withConfig({
21
21
  componentId: "sc-n7r3qn-1"
22
22
  })(["font-weight:", ";font-size:13px;color:", ";", ""], props => props.theme.fontWeights.semibold, props => props.theme.colors.neutral['800'], dsSystem.truncate());
23
23
 
24
- const MobileListItem = ({
25
- leftAddon = null,
26
- rightAddon = null,
27
- title = '',
28
- value = '',
29
- dataTestid = 'mobile-list-item',
30
- theme
31
- }) => {
24
+ const MobileListItem = _ref => {
25
+ let {
26
+ leftAddon = null,
27
+ rightAddon = null,
28
+ title = '',
29
+ value = '',
30
+ dataTestid = 'mobile-list-item',
31
+ theme
32
+ } = _ref;
32
33
  const cols = [1];
33
34
  if (leftAddon) cols.unshift(dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.m));
34
35
  if (rightAddon) cols.push(dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.m));
@@ -40,12 +41,12 @@ const MobileListItem = ({
40
41
  pr: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
41
42
  gutter: "xs",
42
43
  "data-testid": "".concat(dataTestid, "--").concat(value)
43
- }, void 0, leftAddon && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
44
+ }, void 0, leftAddon && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
44
45
  alignItems: "center",
45
46
  justifyContent: "center"
46
- }, void 0, leftAddon), /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
47
+ }, void 0, leftAddon), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
47
48
  alignItems: "center"
48
- }, void 0, /*#__PURE__*/_jsx__default["default"](StyledTitle, {}, void 0, title)), rightAddon && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
49
+ }, void 0, /*#__PURE__*/_jsx__default["default"](StyledTitle, {}, void 0, title)), rightAddon && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
49
50
  alignItems: "center",
50
51
  justifyContent: "center"
51
52
  }, void 0, rightAddon));
@@ -7,11 +7,11 @@ require('core-js/modules/web.dom-collections.iterator.js');
7
7
  var React = require('react');
8
8
  var reactDesc = require('react-desc');
9
9
  var styled = require('styled-components');
10
- var TruncatedExpandableText = require('@elliemae/ds-basic/TruncatedExpandableText');
11
- var Grid = require('@elliemae/ds-basic/Grid');
10
+ var dsTruncatedExpandableText = require('@elliemae/ds-truncated-expandable-text');
11
+ var dsGrid = require('@elliemae/ds-grid');
12
12
  var dsSystem = require('@elliemae/ds-system');
13
- var ChevronSmallDown = require('@elliemae/ds-icons/ChevronSmallDown');
14
- var DSButton = require('@elliemae/ds-basic/Button');
13
+ var dsIcons = require('@elliemae/ds-icons');
14
+ var DSButton = require('@elliemae/ds-button');
15
15
  var Separator = require('../MobileSeparator/Separator.js');
16
16
 
17
17
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -19,11 +19,10 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
19
19
  var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
20
20
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
21
21
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
22
- var ChevronSmallDown__default = /*#__PURE__*/_interopDefaultLegacy(ChevronSmallDown);
23
22
  var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
24
23
 
25
24
  var _ChevronSmallDown;
26
- const StyledTitle = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
25
+ const StyledTitle = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
27
26
  componentId: "sc-1tfu1y9-0"
28
27
  })(["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');
29
28
  const StyledBreadCrumb = /*#__PURE__*/styled__default["default"].div.withConfig({
@@ -35,22 +34,23 @@ const Label = /*#__PURE__*/styled__default["default"].div.withConfig({
35
34
  const Value = /*#__PURE__*/styled__default["default"].div.withConfig({
36
35
  componentId: "sc-1tfu1y9-3"
37
36
  })(["", " color:", ";", " margin-top:", ";"], dsSystem.truncate(), props => props.theme.colors.neutral['600'], props => props.withMarginRight ? "margin-right: 4px;" : '', props => props.withBreadcrumb ? '12px' : '0');
38
- const Wrapper = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
37
+ const Wrapper = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
39
38
  componentId: "sc-1tfu1y9-4"
40
39
  })(["border-bottom:", ";"], props => dsSystem.border(props.theme.colors.neutral['300']));
41
40
 
42
- const MobilePageHeader = ({
43
- pageTitle = null,
44
- contextMenu = null,
45
- firstAction = null,
46
- secondAction = null,
47
- backArrow = null,
48
- breadCrumb = null,
49
- onOpenContextMenu = () => null,
50
- value,
51
- label,
52
- theme
53
- }) => {
41
+ const MobilePageHeader = _ref => {
42
+ let {
43
+ pageTitle = null,
44
+ contextMenu = null,
45
+ firstAction = null,
46
+ secondAction = null,
47
+ backArrow = null,
48
+ breadCrumb = null,
49
+ onOpenContextMenu = () => null,
50
+ value,
51
+ label,
52
+ theme
53
+ } = _ref;
54
54
  const hasValue = value === 0 || value;
55
55
  const countActions = React.useMemo(() => {
56
56
  let count = 0;
@@ -63,10 +63,10 @@ const MobilePageHeader = ({
63
63
  setOpen(!open);
64
64
  }, [open]);
65
65
 
66
- const separator = /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
66
+ const separator = /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
67
67
  height: "32px",
68
68
  alignItems: "center"
69
- }, void 0, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
69
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
70
70
  height: "24px"
71
71
  }, void 0, /*#__PURE__*/_jsx__default["default"](Separator["default"], {
72
72
  direction: "vertical",
@@ -86,40 +86,40 @@ const MobilePageHeader = ({
86
86
  alignItems: "flex-start",
87
87
  width: "100%",
88
88
  "data-testid": "page-header-wrapper"
89
- }, void 0, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
89
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
90
90
  alignItems: "flex-start",
91
91
  justifyContent: "flex-start",
92
92
  cols: cols2
93
- }, void 0, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
93
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
94
94
  cols: backArrow ? ['auto', 1] : [1],
95
95
  alignItems: "flex-start",
96
96
  pr: countActions === 0 && !hasValue && !label ? dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : 0
97
- }, void 0, backArrow && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
97
+ }, void 0, backArrow && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
98
98
  height: breadCrumb ? '56px' : '44px',
99
99
  alignItems: "center"
100
- }, void 0, backArrow), /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
100
+ }, void 0, backArrow), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
101
101
  flexGrow: 0,
102
102
  pt: !breadCrumb ? 0 : theme.space.xxs
103
- }, void 0, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
103
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
104
104
  cols: ['auto', 'auto'],
105
105
  alignItems: "flex-start"
106
- }, void 0, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {}, void 0, breadCrumb && /*#__PURE__*/_jsx__default["default"](StyledBreadCrumb, {
106
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, breadCrumb && /*#__PURE__*/_jsx__default["default"](StyledBreadCrumb, {
107
107
  "data-testid": "page-header-breadcrum"
108
108
  }, void 0, breadCrumb), /*#__PURE__*/_jsx__default["default"](StyledTitle, {
109
109
  maxWidth: "100%",
110
110
  alignItems: "flex-start",
111
111
  withBreadcrumb: !!breadCrumb,
112
112
  "data-testid": "page-header-title"
113
- }, void 0, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
113
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
114
114
  pt: breadCrumb ? 0 : theme.space.xxxs
115
- }, void 0, /*#__PURE__*/_jsx__default["default"](TruncatedExpandableText.TruncatedExpandableText, {
115
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsTruncatedExpandableText.TruncatedExpandableText, {
116
116
  value: pageTitle
117
- })))), contextMenu && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
117
+ })))), contextMenu && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
118
118
  alignItems: "center",
119
119
  mt: breadCrumb ? '20px' : '8px'
120
120
  }, void 0, /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
121
121
  buttonType: "text",
122
- icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](ChevronSmallDown__default["default"], {})),
122
+ icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallDown, {})),
123
123
  size: "s",
124
124
  onClick: () => {
125
125
  handleContext();
@@ -134,24 +134,24 @@ const MobilePageHeader = ({
134
134
  if (contextMenu.props.onChange) contextMenu.props.onChange(event, item);
135
135
  handleContext();
136
136
  }
137
- }))))), hasValue && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
137
+ }))))), hasValue && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
138
138
  height: breadCrumb ? '56px' : '44px',
139
139
  alignItems: "center",
140
140
  cols: ['auto', 'auto']
141
141
  }, void 0, separator, /*#__PURE__*/_jsx__default["default"](Value, {
142
142
  withMarginRight: !!label,
143
143
  "data-testid": "page-header-value"
144
- }, void 0, value)), label && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
144
+ }, void 0, value)), label && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
145
145
  height: breadCrumb ? '56px' : '44px',
146
146
  alignItems: "center"
147
147
  }, void 0, /*#__PURE__*/_jsx__default["default"](Label, {
148
148
  withBreadcrumb: !!breadCrumb,
149
149
  "data-testid": "page-header-label"
150
- }, void 0, label))), countActions > 0 && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
150
+ }, void 0, label))), countActions > 0 && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
151
151
  height: breadCrumb ? '56px' : '44px',
152
152
  alignItems: "center",
153
153
  cols: countActions === 1 ? ['auto'] : ['auto', 'auto', 'auto']
154
- }, void 0, firstAction && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {}, void 0, firstAction), countActions === 2 && separator, secondAction && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {}, void 0, secondAction)));
154
+ }, void 0, firstAction && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, firstAction), countActions === 2 && separator, secondAction && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, secondAction)));
155
155
  };
156
156
 
157
157
  const pageHeaderProps = {
@@ -5,10 +5,17 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
6
6
  var _jsx = require('@babel/runtime/helpers/jsx');
7
7
  require('core-js/modules/web.dom-collections.iterator.js');
8
+ require('core-js/modules/esnext.async-iterator.filter.js');
9
+ require('core-js/modules/esnext.iterator.constructor.js');
10
+ require('core-js/modules/esnext.iterator.filter.js');
11
+ require('core-js/modules/esnext.async-iterator.map.js');
12
+ require('core-js/modules/esnext.iterator.map.js');
13
+ require('core-js/modules/esnext.async-iterator.for-each.js');
14
+ require('core-js/modules/esnext.iterator.for-each.js');
8
15
  var React = require('react');
9
16
  var lodash = require('lodash');
10
- var Grid = require('@elliemae/ds-basic/Grid');
11
- var DSTextBox = require('@elliemae/ds-basic/form/TextBox');
17
+ var dsGrid = require('@elliemae/ds-grid');
18
+ var dsForm = require('@elliemae/ds-form');
12
19
  var dsSystem = require('@elliemae/ds-system');
13
20
  var MobileTouchable = require('../MobileTouchable/MobileTouchable.js');
14
21
  var styled = require('./styled.js');
@@ -19,27 +26,27 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
19
26
  var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
20
27
  var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
21
28
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
22
- var DSTextBox__default = /*#__PURE__*/_interopDefaultLegacy(DSTextBox);
23
29
 
24
30
  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; }
25
31
 
26
32
  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; }
27
33
 
28
- const MobileSelectList = ({
29
- open = false,
30
- header = null,
31
- multiple = false,
32
- onChange = lodash.noop,
33
- children,
34
- theme,
35
- zIndex = 1,
36
- useSearch,
37
- onSearch = lodash.noop,
38
- dataTestid = 'mobile-select-list',
39
- buttonFooter = null,
40
- onApply = lodash.noop,
41
- selecteds: initSelecteds = []
42
- }) => {
34
+ const MobileSelectList = _ref => {
35
+ let {
36
+ open = false,
37
+ header = null,
38
+ multiple = false,
39
+ onChange = lodash.noop,
40
+ children,
41
+ theme,
42
+ zIndex = 1,
43
+ useSearch,
44
+ onSearch = lodash.noop,
45
+ dataTestid = 'mobile-select-list',
46
+ buttonFooter = null,
47
+ onApply = lodash.noop,
48
+ selecteds: initSelecteds = []
49
+ } = _ref;
43
50
  const rows = ['auto', 1];
44
51
  const [selecteds, setSelected] = React.useState(initSelecteds);
45
52
  const [filter, setFilter] = React.useState('');
@@ -76,20 +83,20 @@ const MobileSelectList = ({
76
83
  "data-testid": dataTestid,
77
84
  rows: rows,
78
85
  zIndex: zIndex
79
- }, void 0, /*#__PURE__*/_jsx__default["default"](styled.HeaderContainer, {}, void 0, header, useSearch && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
86
+ }, void 0, /*#__PURE__*/_jsx__default["default"](styled.HeaderContainer, {}, void 0, header, useSearch && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
80
87
  alignItems: "center",
81
88
  height: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.xl),
82
89
  pl: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
83
90
  pr: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
84
- }, void 0, /*#__PURE__*/_jsx__default["default"](DSTextBox__default["default"], {
91
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSTextBox, {
85
92
  onChange: handleOnSearch,
86
93
  placeholder: "Filter by name",
87
94
  value: filter
88
- }))), /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
95
+ }))), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
89
96
  style: {
90
97
  overflow: 'hidden'
91
98
  }
92
- }, void 0, /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
99
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
93
100
  style: {
94
101
  overflow: 'auto'
95
102
  }
@@ -6,9 +6,9 @@ var _jsx = require('@babel/runtime/helpers/jsx');
6
6
  require('react');
7
7
  var lodash = require('lodash');
8
8
  var styled = require('styled-components');
9
- var Grid = require('@elliemae/ds-basic/Grid');
10
- var DSCheckbox = require('@elliemae/ds-basic/form/Checkbox');
11
- var DSCheckmark = require('@elliemae/ds-icons/Checkmark');
9
+ var dsGrid = require('@elliemae/ds-grid');
10
+ var dsForm = require('@elliemae/ds-form');
11
+ var dsIcons = require('@elliemae/ds-icons');
12
12
  var dsSystem = require('@elliemae/ds-system');
13
13
  var MobileTouchable = require('../MobileTouchable/MobileTouchable.js');
14
14
  var MobileListItem = require('../MobileListItem/MobileListItem.js');
@@ -17,36 +17,34 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
17
17
 
18
18
  var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
19
19
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
20
- var DSCheckbox__default = /*#__PURE__*/_interopDefaultLegacy(DSCheckbox);
21
- var DSCheckmark__default = /*#__PURE__*/_interopDefaultLegacy(DSCheckmark);
22
20
 
23
- const StyledContainer = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
21
+ const StyledContainer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
24
22
  componentId: "sc-1dckxve-0"
25
23
  })(["background:", ";z-index:", ";position:fixed;width:100%;top:0;left:0;right:0;height:100%;"], props => props.theme.colors.neutral['000'], props => props.zIndex);
26
- const HeaderContainer = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
24
+ const HeaderContainer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
27
25
  componentId: "sc-1dckxve-1"
28
26
  })(["border-bottom:", ";"], props => dsSystem.border(props.theme.colors.neutral['300']));
29
- const Footer = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
27
+ const Footer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
30
28
  componentId: "sc-1dckxve-2"
31
29
  })(["border-top:", ";"], props => dsSystem.border(props.theme.colors.neutral['300']));
32
30
  const ListContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
33
31
  componentId: "sc-1dckxve-3"
34
32
  })(["& ", ":last-child ", "{border:none;}"], MobileTouchable.DSMobileTouchable, MobileListItem.DSMobileListItem);
35
- const checkbox = /*#__PURE__*/_jsx__default["default"](DSCheckbox__default["default"], {
33
+ const checkbox = /*#__PURE__*/_jsx__default["default"](dsForm.DSCheckbox, {
36
34
  checked: false,
37
35
  onChange: lodash.noop,
38
36
  style: {
39
37
  pointerEvents: 'none'
40
38
  }
41
39
  });
42
- const checked = /*#__PURE__*/_jsx__default["default"](DSCheckbox__default["default"], {
40
+ const checked = /*#__PURE__*/_jsx__default["default"](dsForm.DSCheckbox, {
43
41
  checked: true,
44
42
  onChange: lodash.noop,
45
43
  style: {
46
44
  pointerEvents: 'none'
47
45
  }
48
46
  });
49
- const selectedMark = /*#__PURE__*/_jsx__default["default"](DSCheckmark__default["default"], {
47
+ const selectedMark = /*#__PURE__*/_jsx__default["default"](dsIcons.Checkmark, {
50
48
  color: ['brand-primary', 600]
51
49
  });
52
50