@elliemae/ds-mobile 2.0.0-alpha.1 → 2.0.0-alpha.13
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.
- package/cjs/Accordion/Accordion.js +5 -13
- package/cjs/Accordion/index.js +5 -13
- package/cjs/CategoryBox/CategoryBox.js +17 -16
- package/cjs/CollectionBox/CollectionBox.js +21 -20
- package/cjs/FullPageContainer/FullPageContainer.js +9 -4
- package/cjs/FullPageContainer/FullPageContainerScroll.js +9 -4
- package/cjs/FullPageContainer/useMobileHeight.js +1 -0
- package/cjs/GlobalHeader/MobileGlobalHeader.js +34 -29
- package/cjs/GlobalHeader/styles.js +11 -17
- package/cjs/GroupBox/GroupBox.js +18 -17
- package/cjs/Icons/EM_logo.js +4 -4
- package/cjs/InfiniteLoader/Infiniteloader.js +12 -10
- package/cjs/InfiniteLoader/Loader.js +12 -9
- package/cjs/InfiniteLoader/VirtualizedInfiniteLoader.js +52 -24
- package/cjs/InfiniteLoader/styled.js +1 -1
- package/cjs/LoadingPage/Page.js +32 -19
- package/cjs/LoadingPage/index.js +1 -1
- package/cjs/MobileActionToolbar/MobileActionToolbar.js +11 -10
- package/cjs/MobileActionToolbar/MobileActionToolbarItem.js +11 -6
- package/cjs/MobileActionToolbar/index.js +2 -2
- package/cjs/MobileBanner/MobileBanner.js +27 -21
- package/cjs/MobileBanner/styles.js +139 -70
- package/cjs/MobileBanner/utils/icons.js +5 -10
- package/cjs/MobileBanner/utils/styleHelpers.js +20 -47
- package/cjs/MobileCard/ActionAddon.js +17 -15
- package/cjs/MobileCard/Card.js +51 -98
- package/cjs/MobileCard/CardIcons.js +21 -16
- package/cjs/MobileCard/ExpandChevron.js +11 -13
- package/cjs/MobileCard/ExpandableRegion.js +10 -10
- package/cjs/MobileCard/Group.js +29 -23
- package/cjs/MobileCard/StyledCard.js +1 -1
- package/cjs/MobileCard/index.js +3 -3
- package/cjs/MobileCard/props.js +62 -0
- package/cjs/MobileCard/useHeight.js +1 -0
- package/cjs/MobileContextMenu/MobileContextMenu.js +53 -45
- package/cjs/MobileContextMenu/MobileContextMenuGroup.js +37 -27
- package/cjs/MobileContextMenu/MobileContextMenuItem.js +40 -46
- package/cjs/MobileDatePicker/Input.js +8 -3
- package/cjs/MobileDatePicker/MobileDatePicker.js +18 -19
- package/cjs/MobileDropdownMenu/MobileDropdownInput.js +31 -21
- package/cjs/MobileDropdownMenu/MobileDropdownMenu.js +26 -22
- package/cjs/MobileEmtpyState/MobileEmptyState.js +12 -10
- package/cjs/MobileEmtpyState/index.js +1 -1
- package/cjs/MobileFilterbar/Filterbar.js +15 -12
- package/cjs/MobileFilterbar/FilterbarItem.js +15 -12
- package/cjs/MobileFilterbar/FilterbarSort.js +18 -15
- package/cjs/MobileFooter/Action.js +28 -25
- package/cjs/MobileFooter/Footer.js +20 -13
- package/cjs/MobileFooter/Text.js +7 -4
- package/cjs/MobileFooter/index.js +1 -1
- package/cjs/MobileListItem/MobileListItem.js +17 -16
- package/cjs/MobilePageHeader/MobilePageHeader.js +47 -46
- package/cjs/MobileSelectList/MobileSelectList.js +41 -33
- package/cjs/MobileSelectList/styled.js +10 -12
- package/cjs/MobileSeparator/Separator.js +32 -20
- package/cjs/MobileSeparator/index.js +1 -1
- package/cjs/MobileTimePicker/Input.js +8 -3
- package/cjs/MobileTimePicker/MobileTimePicker.js +18 -19
- package/cjs/MobileTimePicker/MobileTimePicker.stories.js +4 -4
- package/cjs/MobileTouchable/MobileTouchable.js +10 -4
- package/cjs/Modal/Modal.js +41 -36
- package/cjs/Modal/styled.js +11 -12
- package/cjs/PageFilter/PageFilter.js +29 -24
- package/cjs/PageForm/PageForm.js +23 -16
- package/cjs/PageList/PageList.js +13 -12
- package/cjs/PageSearch/PageSearch.js +14 -13
- package/cjs/PageSummary/PageSummary.js +34 -21
- package/cjs/PageSummary/Tags.js +16 -10
- package/cjs/SideNav/SideNav.js +50 -41
- package/cjs/SideNav/styles.js +8 -8
- package/cjs/SwipeToRefresh/ProgressIndicator.js +13 -12
- package/cjs/SwipeToRefresh/ProgressLoader.js +37 -37
- package/cjs/SwipeToRefresh/SwipeToRefresh.js +13 -12
- package/cjs/SwipeToRefresh/styled.js +5 -5
- package/cjs/SwipeToRefresh/useSwipe.js +6 -4
- package/cjs/Tabs/index.js +19 -8
- package/cjs/Tabs/propTypes.js +28 -0
- package/cjs/index.js +13 -15
- package/esm/Accordion/Accordion.js +1 -1
- package/esm/Accordion/index.js +1 -1
- package/esm/CategoryBox/CategoryBox.js +11 -10
- package/esm/CollectionBox/CollectionBox.js +10 -9
- package/esm/FullPageContainer/FullPageContainer.js +6 -1
- package/esm/FullPageContainer/FullPageContainerScroll.js +6 -1
- package/esm/FullPageContainer/useMobileHeight.js +1 -0
- package/esm/GlobalHeader/MobileGlobalHeader.js +21 -14
- package/esm/GlobalHeader/styles.js +4 -11
- package/esm/GroupBox/GroupBox.js +12 -11
- package/esm/InfiniteLoader/Infiniteloader.js +9 -7
- package/esm/InfiniteLoader/Loader.js +12 -9
- package/esm/InfiniteLoader/VirtualizedInfiniteLoader.js +51 -23
- package/esm/LoadingPage/Page.js +25 -12
- package/esm/MobileActionToolbar/MobileActionToolbar.js +7 -6
- package/esm/MobileActionToolbar/MobileActionToolbarItem.js +6 -1
- package/esm/MobileBanner/MobileBanner.js +21 -14
- package/esm/MobileBanner/styles.js +129 -60
- package/esm/MobileBanner/utils/icons.js +2 -4
- package/esm/MobileBanner/utils/styleHelpers.js +16 -47
- package/esm/MobileCard/ActionAddon.js +16 -13
- package/esm/MobileCard/Card.js +29 -76
- package/esm/MobileCard/CardIcons.js +20 -15
- package/esm/MobileCard/ExpandChevron.js +8 -8
- package/esm/MobileCard/ExpandableRegion.js +7 -7
- package/esm/MobileCard/Group.js +21 -15
- package/esm/MobileCard/props.js +58 -0
- package/esm/MobileCard/useHeight.js +1 -0
- package/esm/MobileContextMenu/MobileContextMenu.js +39 -31
- package/esm/MobileContextMenu/MobileContextMenuGroup.js +35 -25
- package/esm/MobileContextMenu/MobileContextMenuItem.js +26 -30
- package/esm/MobileDatePicker/Input.js +5 -0
- package/esm/MobileDatePicker/MobileDatePicker.js +13 -12
- package/esm/MobileDropdownMenu/MobileDropdownInput.js +27 -16
- package/esm/MobileDropdownMenu/MobileDropdownMenu.js +21 -17
- package/esm/MobileEmtpyState/MobileEmptyState.js +10 -7
- package/esm/MobileFilterbar/Filterbar.js +13 -10
- package/esm/MobileFilterbar/FilterbarItem.js +15 -12
- package/esm/MobileFilterbar/FilterbarSort.js +17 -14
- package/esm/MobileFooter/Action.js +26 -23
- package/esm/MobileFooter/Footer.js +14 -7
- package/esm/MobileFooter/Text.js +6 -3
- package/esm/MobileListItem/MobileListItem.js +11 -10
- package/esm/MobilePageHeader/MobilePageHeader.js +19 -17
- package/esm/MobileSelectList/MobileSelectList.js +28 -19
- package/esm/MobileSelectList/styled.js +4 -4
- package/esm/MobileSeparator/Separator.js +28 -16
- package/esm/MobileTimePicker/Input.js +5 -0
- package/esm/MobileTimePicker/MobileTimePicker.js +13 -12
- package/esm/MobileTimePicker/MobileTimePicker.stories.js +1 -1
- package/esm/MobileTouchable/MobileTouchable.js +7 -1
- package/esm/Modal/Modal.js +27 -21
- package/esm/Modal/styled.js +4 -6
- package/esm/PageFilter/PageFilter.js +15 -10
- package/esm/PageForm/PageForm.js +18 -11
- package/esm/PageList/PageList.js +10 -9
- package/esm/PageSearch/PageSearch.js +10 -9
- package/esm/PageSummary/PageSummary.js +32 -19
- package/esm/PageSummary/Tags.js +12 -6
- package/esm/SideNav/SideNav.js +39 -29
- package/esm/SwipeToRefresh/ProgressIndicator.js +9 -8
- package/esm/SwipeToRefresh/SwipeToRefresh.js +9 -8
- package/esm/SwipeToRefresh/styled.js +1 -1
- package/esm/SwipeToRefresh/useSwipe.js +6 -4
- package/esm/Tabs/index.js +13 -4
- package/esm/Tabs/propTypes.js +23 -0
- package/esm/index.js +5 -4
- package/package.json +35 -7
- package/types/Accordion/Accordion.d.ts +1 -1
- package/types/CategoryBox/CategoryBox.d.ts +37 -6
- package/types/CollectionBox/CollectionBox.d.ts +37 -6
- package/types/GlobalHeader/MobileGlobalHeader.d.ts +43 -6
- package/types/GlobalHeader/styles.d.ts +6 -6
- package/types/GroupBox/GroupBox.d.ts +44 -7
- package/types/InfiniteLoader/Infiniteloader.d.ts +30 -5
- package/types/InfiniteLoader/VirtualizedInfiniteLoader.d.ts +56 -8
- package/types/InfiniteLoader/styled.d.ts +1 -1
- package/types/LoadingPage/Page.d.ts +1 -1
- package/types/MobileActionToolbar/MobileActionToolbar.d.ts +16 -4
- package/types/MobileActionToolbar/MobileActionToolbarItem.d.ts +15 -2
- package/types/MobileBanner/MobileBanner.d.ts +72 -12
- package/types/MobileBanner/propTypes.d.ts +67 -11
- package/types/MobileBanner/styles.d.ts +10 -10
- package/types/MobileCard/Card.d.ts +20 -13
- package/types/MobileCard/ExpandableRegion.d.ts +2 -2
- package/types/MobileCard/Group.d.ts +18 -8
- package/types/MobileCard/StyledCard.d.ts +3 -1
- package/types/MobileCard/index.d.ts +13 -12
- package/types/MobileCard/props.d.ts +118 -0
- package/types/MobileContextMenu/MobileContextMenu.d.ts +13 -2
- package/types/MobileContextMenu/MobileContextMenuGroup.d.ts +37 -5
- package/types/MobileContextMenu/MobileContextMenuItem.d.ts +54 -9
- package/types/MobileDatePicker/MobileDatePicker.d.ts +43 -7
- package/types/MobileDropdownMenu/MobileDropdownInput.d.ts +2 -2
- package/types/MobileDropdownMenu/MobileDropdownMenu.d.ts +24 -4
- package/types/MobileEmtpyState/MobileEmptyState.d.ts +14 -2
- package/types/MobileFilterbar/Filterbar.d.ts +9 -2
- package/types/MobileFilterbar/FilterbarItem.d.ts +15 -2
- package/types/MobileFilterbar/FilterbarSort.d.ts +9 -2
- package/types/MobileFooter/Action.d.ts +19 -3
- package/types/MobileFooter/Footer.d.ts +8 -1
- package/types/MobileFooter/Text.d.ts +8 -1
- package/types/MobileListItem/MobileListItem.d.ts +17 -7
- package/types/MobilePageHeader/MobilePageHeader.d.ts +21 -11
- package/types/MobileSelectList/MobileSelectList.d.ts +3 -3
- package/types/MobileSelectList/styled.d.ts +5 -5
- package/types/MobileSeparator/Separator.d.ts +23 -5
- package/types/MobileTimePicker/MobileTimePicker.d.ts +32 -6
- package/types/MobileTimePicker/MobileTimePicker.stories.d.ts +1 -0
- package/types/MobileTouchable/MobileTouchable.d.ts +1 -1
- package/types/Modal/Modal.d.ts +50 -9
- package/types/Modal/styled.d.ts +7 -6
- package/types/PageList/PageList.d.ts +2 -2
- package/types/PageSearch/PageSearch.d.ts +2 -2
- package/types/PageSummary/Tags.d.ts +4 -4
- package/types/SideNav/SideNav.d.ts +26 -5
- package/types/SideNav/styles.d.ts +8 -8
- package/types/SwipeToRefresh/SwipeToRefresh.d.ts +22 -3
- package/types/SwipeToRefresh/styled.d.ts +5 -4
- package/types/Tabs/index.d.ts +24 -9
- package/types/Tabs/propTypes.d.ts +42 -0
- package/types/index.d.ts +5 -1
- package/cjs/package.json +0 -7
- package/esm/package.json +0 -7
|
@@ -2,11 +2,16 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
11
|
require('react');
|
|
7
12
|
var reactDesc = require('react-desc');
|
|
8
13
|
var styled = require('styled-components');
|
|
9
|
-
var
|
|
14
|
+
var dsGrid = require('@elliemae/ds-grid');
|
|
10
15
|
var jsxRuntime = require('react/jsx-runtime');
|
|
11
16
|
|
|
12
17
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -16,25 +21,32 @@ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
|
16
21
|
|
|
17
22
|
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; }
|
|
18
23
|
|
|
19
|
-
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[
|
|
20
|
-
const Separator = /*#__PURE__*/styled__default[
|
|
24
|
+
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; }
|
|
25
|
+
const Separator = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
21
26
|
componentId: "sc-lje3kq-0"
|
|
22
|
-
})(["border-top:", ";border-left:", ";"],
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
color,
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
27
|
+
})(["border-top:", ";border-left:", ";"], _ref => {
|
|
28
|
+
let {
|
|
29
|
+
theme,
|
|
30
|
+
color,
|
|
31
|
+
borderType
|
|
32
|
+
} = _ref;
|
|
33
|
+
return "".concat(theme.colors[color[0]][color[1]], " 1px ").concat(borderType);
|
|
34
|
+
}, _ref2 => {
|
|
35
|
+
let {
|
|
36
|
+
theme,
|
|
37
|
+
color,
|
|
38
|
+
borderType
|
|
39
|
+
} = _ref2;
|
|
40
|
+
return "".concat(theme.colors[color[0]][color[1]], " 1px ").concat(borderType);
|
|
41
|
+
});
|
|
42
|
+
|
|
43
|
+
const MobileSeparator = _ref3 => {
|
|
44
|
+
let {
|
|
45
|
+
color = ['neutral', '800'],
|
|
46
|
+
direction = 'horizontal',
|
|
47
|
+
type = 'solid',
|
|
48
|
+
margin = 'xs'
|
|
49
|
+
} = _ref3;
|
|
38
50
|
const orientation = direction === 'vertical' ? 'height' : 'width';
|
|
39
51
|
const xORy = direction === 'vertical' ? 'mx' : 'my';
|
|
40
52
|
const styles = {
|
|
@@ -58,4 +70,4 @@ const MobileSeparatorWithSchema = reactDesc.describe(MobileSeparator);
|
|
|
58
70
|
MobileSeparatorWithSchema.propTypes = mobileSeparatorProps;
|
|
59
71
|
|
|
60
72
|
exports.MobileSeparatorWithSchema = MobileSeparatorWithSchema;
|
|
61
|
-
exports[
|
|
73
|
+
exports["default"] = MobileSeparator;
|
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
11
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
7
12
|
require('react');
|
|
@@ -19,15 +24,15 @@ const _excluded = ["innerRef"];
|
|
|
19
24
|
|
|
20
25
|
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; }
|
|
21
26
|
|
|
22
|
-
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[
|
|
23
|
-
const StyledInput = /*#__PURE__*/styled__default[
|
|
27
|
+
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; }
|
|
28
|
+
const StyledInput = /*#__PURE__*/styled__default["default"].input.withConfig({
|
|
24
29
|
componentId: "sc-ra7fth-0"
|
|
25
30
|
})(["input[type=time]&{-webkit-appearance:none;-moz-appearance:none;-webkit-tap-highlight-color:transparent;appearance:none;color:transparent;white-space:nowrap;position:relative;height:", ";width:100%;max-width:calc(100% - 32px);outline:none;box-sizing:border-box;display:flex;background:", ";padding:0 ", ";z-index:1;border-radius:2px;border:solid 1px ", ";}input[type=time]&:active,input[type=time]&:focus{", "}&:before{color:", ";content:'", "';}input[type=time]&::-webkit-datetime-edit,input[type=time]&::-webkit-inner-spin-button,input[type=time]&::-webkit-clear-button{-webkit-appearance:none;display:none;}"], props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l), props => props.theme.colors.neutral['000'], props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs), props => props.theme.colors.neutral[200], props => dsSystem.focus(props.theme.colors.brand[700]), props => props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'], props => props.value === '' ? props.placeholder : props['data-displayvalue']);
|
|
26
31
|
const Input = _ref => {
|
|
27
32
|
let {
|
|
28
33
|
innerRef
|
|
29
34
|
} = _ref,
|
|
30
|
-
props = _objectWithoutProperties__default[
|
|
35
|
+
props = _objectWithoutProperties__default["default"](_ref, _excluded);
|
|
31
36
|
|
|
32
37
|
return /*#__PURE__*/jsxRuntime.jsx(StyledInput, _objectSpread({
|
|
33
38
|
ref: innerRef
|
|
@@ -5,28 +5,27 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
6
|
var React = require('react');
|
|
7
7
|
var reactDesc = require('react-desc');
|
|
8
|
-
var
|
|
9
|
-
var
|
|
10
|
-
var DSButton = require('@elliemae/ds-
|
|
11
|
-
var
|
|
8
|
+
var dsIcon = require('@elliemae/ds-icon');
|
|
9
|
+
var dsIcons = require('@elliemae/ds-icons');
|
|
10
|
+
var DSButton = require('@elliemae/ds-button');
|
|
11
|
+
var dsForm = require('@elliemae/ds-form');
|
|
12
12
|
var Input = require('./Input.js');
|
|
13
13
|
|
|
14
14
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
15
15
|
|
|
16
16
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
17
|
-
var RecentDocuments__default = /*#__PURE__*/_interopDefaultLegacy(RecentDocuments);
|
|
18
17
|
var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
|
|
19
|
-
var DSInputGroup__default = /*#__PURE__*/_interopDefaultLegacy(DSInputGroup);
|
|
20
18
|
|
|
21
19
|
var _RecentDocuments;
|
|
22
20
|
|
|
23
|
-
const DSMobileTimePicker =
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
21
|
+
const DSMobileTimePicker = _ref => {
|
|
22
|
+
let {
|
|
23
|
+
disabled,
|
|
24
|
+
value,
|
|
25
|
+
tabIndex,
|
|
26
|
+
placeholder,
|
|
27
|
+
onChange
|
|
28
|
+
} = _ref;
|
|
30
29
|
const inputRef = React.useRef(null);
|
|
31
30
|
const valueArr = value.split(':');
|
|
32
31
|
React.useEffect(() => {
|
|
@@ -43,14 +42,14 @@ const DSMobileTimePicker = ({
|
|
|
43
42
|
if (!value || !valueArr[0] || !valueArr[1]) return '';
|
|
44
43
|
const ampm = valueArr[0] >= 12 ? 'pm' : 'am';
|
|
45
44
|
const h = valueArr[0] > 12 ? valueArr[0] - 12 : valueArr[0];
|
|
46
|
-
return
|
|
45
|
+
return "".concat(h, " : ").concat(valueArr[1], " ").concat(ampm);
|
|
47
46
|
}, [value]);
|
|
48
|
-
return /*#__PURE__*/_jsx__default[
|
|
49
|
-
rightAddon: /*#__PURE__*/_jsx__default[
|
|
47
|
+
return /*#__PURE__*/_jsx__default["default"](dsForm.DSInputGroup, {
|
|
48
|
+
rightAddon: /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
|
|
50
49
|
"aria-label": "Time Picker Button",
|
|
51
|
-
color: !disabled ?
|
|
50
|
+
color: !disabled ? dsIcon.DSIconColors.PRIMARY : dsIcon.DSIconColors.NEUTRAL,
|
|
52
51
|
disabled: disabled,
|
|
53
|
-
icon: _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx__default[
|
|
52
|
+
icon: _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx__default["default"](dsIcons.RecentDocuments, {})),
|
|
54
53
|
type: "button",
|
|
55
54
|
buttonType: "secondary",
|
|
56
55
|
onClick: () => {
|
|
@@ -58,7 +57,7 @@ const DSMobileTimePicker = ({
|
|
|
58
57
|
inputRef.current.click();
|
|
59
58
|
}
|
|
60
59
|
})
|
|
61
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
60
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](Input.Input, {
|
|
62
61
|
innerRef: inputRef,
|
|
63
62
|
type: "time",
|
|
64
63
|
"data-testid": "ds-mobile-time-picker",
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
6
|
require('react');
|
|
7
|
-
var
|
|
7
|
+
var dsGrid = require('@elliemae/ds-grid');
|
|
8
8
|
var dsDevutils = require('@elliemae/ds-devutils');
|
|
9
9
|
var MobileTimePicker = require('./MobileTimePicker.js');
|
|
10
10
|
|
|
@@ -22,9 +22,9 @@ const Basic = () => {
|
|
|
22
22
|
onChange
|
|
23
23
|
} = dsDevutils.useMobileTimePicker(); // KNOBS
|
|
24
24
|
|
|
25
|
-
return /*#__PURE__*/_jsx__default[
|
|
25
|
+
return /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
26
26
|
m: "xs"
|
|
27
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
27
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](MobileTimePicker.DSMobileTimePicker, {
|
|
28
28
|
value: value,
|
|
29
29
|
onChange: onChange
|
|
30
30
|
}));
|
|
@@ -32,4 +32,4 @@ const Basic = () => {
|
|
|
32
32
|
dsDevutils.addDefaultMobileView(Basic);
|
|
33
33
|
|
|
34
34
|
exports.Basic = Basic;
|
|
35
|
-
exports[
|
|
35
|
+
exports["default"] = MobileTimePicker_stories;
|
|
@@ -4,10 +4,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
6
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
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.for-each.js');
|
|
12
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
7
13
|
var React = require('react');
|
|
8
14
|
var lodash = require('lodash');
|
|
9
15
|
var styled = require('styled-components');
|
|
10
|
-
var
|
|
16
|
+
var dsGrid = require('@elliemae/ds-grid');
|
|
11
17
|
var dsSystem = require('@elliemae/ds-system');
|
|
12
18
|
var jsxRuntime = require('react/jsx-runtime');
|
|
13
19
|
|
|
@@ -21,8 +27,8 @@ const _excluded = ["children", "onClick", "theme", "dataTestid", "render"];
|
|
|
21
27
|
|
|
22
28
|
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; }
|
|
23
29
|
|
|
24
|
-
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[
|
|
25
|
-
const StyledContainer = /*#__PURE__*/styled__default[
|
|
30
|
+
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; }
|
|
31
|
+
const StyledContainer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
26
32
|
componentId: "sc-6cxve6-0"
|
|
27
33
|
})(["cursor:pointer;background:", ";"], props => props.touching ? props.theme.colors.brand['100'] : props.theme.colors.neutral['000']);
|
|
28
34
|
|
|
@@ -34,7 +40,7 @@ const MobileTouchable = _ref => {
|
|
|
34
40
|
dataTestid = 'mobile-touchable',
|
|
35
41
|
render
|
|
36
42
|
} = _ref,
|
|
37
|
-
gridProps = _objectWithoutProperties__default[
|
|
43
|
+
gridProps = _objectWithoutProperties__default["default"](_ref, _excluded);
|
|
38
44
|
|
|
39
45
|
const [touching, setTouching] = React.useState(false);
|
|
40
46
|
const handleStart = React.useCallback(() => setTouching(true));
|
package/cjs/Modal/Modal.js
CHANGED
|
@@ -2,14 +2,19 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
11
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
7
12
|
require('react');
|
|
8
13
|
var reactDesc = require('react-desc');
|
|
9
14
|
var lodash = require('lodash');
|
|
10
|
-
var
|
|
11
|
-
var
|
|
12
|
-
var DSButton = require('@elliemae/ds-
|
|
15
|
+
var dsGrid = require('@elliemae/ds-grid');
|
|
16
|
+
var dsIcons = require('@elliemae/ds-icons');
|
|
17
|
+
var DSButton = require('@elliemae/ds-button');
|
|
13
18
|
var dsSystem = require('@elliemae/ds-system');
|
|
14
19
|
var styled = require('./styled.js');
|
|
15
20
|
var jsxRuntime = require('react/jsx-runtime');
|
|
@@ -18,71 +23,71 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
18
23
|
|
|
19
24
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
20
25
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
21
|
-
var WarningTriangle__default = /*#__PURE__*/_interopDefaultLegacy(WarningTriangle);
|
|
22
26
|
var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
|
|
23
27
|
|
|
24
28
|
var _ModalIcon;
|
|
25
29
|
|
|
26
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; }
|
|
27
31
|
|
|
28
|
-
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[
|
|
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; }
|
|
29
33
|
|
|
30
|
-
const Modal =
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
34
|
+
const Modal = _ref => {
|
|
35
|
+
let {
|
|
36
|
+
zIndex = 1,
|
|
37
|
+
title = '',
|
|
38
|
+
description = '',
|
|
39
|
+
onClose = lodash.noop,
|
|
40
|
+
showSecondaryAction = true,
|
|
41
|
+
secondaryActionProps = {
|
|
42
|
+
onClick: lodash.noop,
|
|
43
|
+
labelText: 'Cancel'
|
|
44
|
+
},
|
|
45
|
+
primaryActionProps = {
|
|
46
|
+
onClick: lodash.noop,
|
|
47
|
+
labelText: 'Accept'
|
|
48
|
+
},
|
|
49
|
+
isOpen = false
|
|
50
|
+
} = _ref;
|
|
46
51
|
const theme = dsSystem.useTheme();
|
|
47
52
|
if (!isOpen) return null;
|
|
48
53
|
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
49
|
-
children: [/*#__PURE__*/_jsx__default[
|
|
54
|
+
children: [/*#__PURE__*/_jsx__default["default"](styled.BodyFix, {
|
|
50
55
|
isOpen: isOpen
|
|
51
|
-
}), /*#__PURE__*/_jsx__default[
|
|
56
|
+
}), /*#__PURE__*/_jsx__default["default"](styled.BackShadow, {
|
|
52
57
|
onClick: onClose,
|
|
53
58
|
zIndex: zIndex
|
|
54
|
-
}), /*#__PURE__*/_jsx__default[
|
|
59
|
+
}), /*#__PURE__*/_jsx__default["default"](styled.ModalPosition, {
|
|
55
60
|
zIndex: zIndex,
|
|
56
61
|
cols: ['auto']
|
|
57
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
58
|
-
maxHeight:
|
|
62
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](styled.ModalBox, {
|
|
63
|
+
maxHeight: "".concat(window.innerHeight * 0.75, "px"),
|
|
59
64
|
rows: [1, '80px'],
|
|
60
65
|
style: {
|
|
61
66
|
overflow: 'hidden'
|
|
62
67
|
}
|
|
63
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
68
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
64
69
|
pl: "xs",
|
|
65
70
|
pr: "xs",
|
|
66
71
|
style: {
|
|
67
72
|
overflow: 'hidden'
|
|
68
73
|
}
|
|
69
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
74
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
70
75
|
rows: ['auto', 'auto', 1],
|
|
71
76
|
style: {
|
|
72
77
|
overflow: 'hidden'
|
|
73
78
|
}
|
|
74
|
-
}, void 0, _ModalIcon || (_ModalIcon = /*#__PURE__*/_jsx__default[
|
|
79
|
+
}, void 0, _ModalIcon || (_ModalIcon = /*#__PURE__*/_jsx__default["default"](styled.ModalIcon, {}, void 0, /*#__PURE__*/_jsx__default["default"](dsIcons.WarningTriangle, {
|
|
75
80
|
size: "xxl"
|
|
76
|
-
}))), /*#__PURE__*/_jsx__default[
|
|
81
|
+
}))), /*#__PURE__*/_jsx__default["default"](styled.ModalTitle, {
|
|
77
82
|
"data-testid": "modal-title"
|
|
78
|
-
}, void 0, title), /*#__PURE__*/_jsx__default[
|
|
83
|
+
}, void 0, title), /*#__PURE__*/_jsx__default["default"](styled.ModalDescription, {
|
|
79
84
|
"data-testid": "modal-desc",
|
|
80
85
|
style: {
|
|
81
86
|
overflow: 'auto'
|
|
82
87
|
}
|
|
83
|
-
}, void 0, description))), /*#__PURE__*/_jsx__default[
|
|
88
|
+
}, void 0, description))), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
84
89
|
pt: "24px"
|
|
85
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
90
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
86
91
|
pl: "xs",
|
|
87
92
|
pr: "xs",
|
|
88
93
|
cols: showSecondaryAction ? [1, 1] : [1],
|
|
@@ -90,13 +95,13 @@ const Modal = ({
|
|
|
90
95
|
justifyContent: "center",
|
|
91
96
|
alignItems: "center",
|
|
92
97
|
style: {
|
|
93
|
-
borderTop:
|
|
98
|
+
borderTop: "1px solid ".concat(theme.colors.neutral[100])
|
|
94
99
|
}
|
|
95
|
-
}, void 0, showSecondaryAction && /*#__PURE__*/jsxRuntime.jsx(DSButton__default[
|
|
100
|
+
}, void 0, showSecondaryAction && /*#__PURE__*/jsxRuntime.jsx(DSButton__default["default"], _objectSpread(_objectSpread({}, secondaryActionProps), {}, {
|
|
96
101
|
labelText: secondaryActionProps.labelText || ' Cancel',
|
|
97
102
|
buttonType: "secondary",
|
|
98
103
|
"data-testid": "modal-secondary-btn"
|
|
99
|
-
})), /*#__PURE__*/jsxRuntime.jsx(DSButton__default[
|
|
104
|
+
})), /*#__PURE__*/jsxRuntime.jsx(DSButton__default["default"], _objectSpread(_objectSpread({
|
|
100
105
|
labelText: primaryActionProps.labelText || ' Accept'
|
|
101
106
|
}, primaryActionProps), {}, {
|
|
102
107
|
buttonType: "primary",
|
package/cjs/Modal/styled.js
CHANGED
|
@@ -2,35 +2,34 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
|
|
6
|
+
var dsGrid = require('@elliemae/ds-grid');
|
|
6
7
|
var styled = require('styled-components');
|
|
7
8
|
var dsSystem = require('@elliemae/ds-system');
|
|
8
9
|
|
|
9
10
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
10
11
|
|
|
12
|
+
var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);
|
|
11
13
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
12
14
|
|
|
13
|
-
|
|
14
|
-
body{
|
|
15
|
-
|
|
16
|
-
}
|
|
17
|
-
`;
|
|
18
|
-
const ModalBox = /*#__PURE__*/styled__default['default'](Grid.Grid).withConfig({
|
|
15
|
+
var _templateObject;
|
|
16
|
+
const BodyFix = dsSystem.createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\n body{\n ", ";\n }\n"])), props => props.isOpen ? 'overflow: hidden;' : '');
|
|
17
|
+
const ModalBox = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
19
18
|
componentId: "sc-cke90o-0"
|
|
20
19
|
})(["width:100%;background:", ";max-height:", ";box-shadow:0 2px 4px 0 rgba(0,0,0,0.5);"], props => props.theme.colors.neutral['000'], props => props.maxHeight);
|
|
21
|
-
const ModalPosition = /*#__PURE__*/styled__default[
|
|
20
|
+
const ModalPosition = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
22
21
|
componentId: "sc-cke90o-1"
|
|
23
22
|
})(["z-index:", ";background:", ";position:absolute;top:12.5%;width:80%;left:10%;"], props => props.zIndex, props => props.theme.colors.neutral['000']);
|
|
24
|
-
const BackShadow = /*#__PURE__*/styled__default[
|
|
23
|
+
const BackShadow = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
25
24
|
componentId: "sc-cke90o-2"
|
|
26
25
|
})(["z-index:", ";position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);overflow:hidden;"], props => props.zIndex);
|
|
27
|
-
const ModalIcon = /*#__PURE__*/styled__default[
|
|
26
|
+
const ModalIcon = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
28
27
|
componentId: "sc-cke90o-3"
|
|
29
28
|
})(["padding-top:24px;justify-content:center;span.em-ds-icon svg,svg:not([fill]){fill:", ";}"], props => props.theme.colors.warning[600]);
|
|
30
|
-
const ModalTitle = /*#__PURE__*/styled__default[
|
|
29
|
+
const ModalTitle = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
31
30
|
componentId: "sc-cke90o-4"
|
|
32
31
|
})(["padding-top:24px;font-size:22px;font-weight:600;color:", ";text-align:center;"], props => props.theme.colors.neutral[600]);
|
|
33
|
-
const ModalDescription = /*#__PURE__*/styled__default[
|
|
32
|
+
const ModalDescription = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
34
33
|
componentId: "sc-cke90o-5"
|
|
35
34
|
})(["padding-top:", ";font-size:16px;font-weight:400;color:", ";text-align:center;"], props => props.theme.space.xxs, props => props.theme.colors.neutral[500]);
|
|
36
35
|
|
|
@@ -5,12 +5,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
6
|
require('react');
|
|
7
7
|
var styled = require('styled-components');
|
|
8
|
-
var
|
|
8
|
+
var dsGrid = require('@elliemae/ds-grid');
|
|
9
9
|
var dsSystem = require('@elliemae/ds-system');
|
|
10
10
|
var FullPageContainer = require('../FullPageContainer/FullPageContainer.js');
|
|
11
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
12
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
13
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
14
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
15
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
11
16
|
require('@babel/runtime/helpers/defineProperty');
|
|
12
17
|
require('@babel/runtime/helpers/objectWithoutProperties');
|
|
13
|
-
require('@elliemae/ds-basic');
|
|
14
18
|
require('react/jsx-runtime');
|
|
15
19
|
|
|
16
20
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -18,33 +22,34 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
18
22
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
19
23
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
20
24
|
|
|
21
|
-
const Header = /*#__PURE__*/styled__default[
|
|
25
|
+
const Header = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
22
26
|
componentId: "sc-15cmidp-0"
|
|
23
27
|
})(["border-bottom:1px solid ", ";"], props => props.theme.colors.neutral['300']);
|
|
24
|
-
const ButtonSlot = /*#__PURE__*/styled__default[
|
|
28
|
+
const ButtonSlot = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
25
29
|
componentId: "sc-15cmidp-1"
|
|
26
30
|
})(["display:flex;justify-content:center;align-items:center;"]);
|
|
27
|
-
const Title = /*#__PURE__*/styled__default[
|
|
31
|
+
const Title = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
28
32
|
componentId: "sc-15cmidp-2"
|
|
29
33
|
})(["display:flex;justify-content:flex-start;align-items:center;font-size:22px;"]);
|
|
30
|
-
const BreadCrumb = /*#__PURE__*/styled__default[
|
|
34
|
+
const BreadCrumb = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
31
35
|
componentId: "sc-15cmidp-3"
|
|
32
36
|
})(["align-items:flex-end;font-size:16px;color:", ";"], props => props.theme.colors.neutral[500]);
|
|
33
|
-
const Body = /*#__PURE__*/styled__default[
|
|
37
|
+
const Body = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
34
38
|
componentId: "sc-15cmidp-4"
|
|
35
39
|
})(["margin:0 auto;width:100%;overflow:auto;"]);
|
|
36
|
-
const Footer = /*#__PURE__*/styled__default[
|
|
40
|
+
const Footer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
37
41
|
componentId: "sc-15cmidp-5"
|
|
38
42
|
})(["display:flex;justify-content:space-around;align-items:center;width:100%;padding:0.67rem;border-top:1px solid ", ";& > button{flex-grow:1;margin:0 0.33rem;}"], props => props.theme.colors.neutral[300]);
|
|
39
43
|
|
|
40
|
-
const PageFilter =
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
44
|
+
const PageFilter = _ref => {
|
|
45
|
+
let {
|
|
46
|
+
children = null,
|
|
47
|
+
breadCrumb = null,
|
|
48
|
+
pageTitle = null,
|
|
49
|
+
leftProp = null,
|
|
50
|
+
rightProp = null,
|
|
51
|
+
footerButton = null
|
|
52
|
+
} = _ref;
|
|
48
53
|
const theme = dsSystem.useTheme();
|
|
49
54
|
const headerDimension = theme.space.l;
|
|
50
55
|
const rows = [headerDimension, 1];
|
|
@@ -55,24 +60,24 @@ const PageFilter = ({
|
|
|
55
60
|
const bodyStyle = {
|
|
56
61
|
maxWidth: dsSystem.op('*', dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl), 6.25)
|
|
57
62
|
};
|
|
58
|
-
return /*#__PURE__*/_jsx__default[
|
|
63
|
+
return /*#__PURE__*/_jsx__default["default"](FullPageContainer.DSFullPageContainer, {
|
|
59
64
|
rows: rows
|
|
60
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
65
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](Header, {
|
|
61
66
|
cols: cols,
|
|
62
67
|
height: headerDimension
|
|
63
|
-
}, void 0, leftProp && /*#__PURE__*/_jsx__default[
|
|
68
|
+
}, void 0, leftProp && /*#__PURE__*/_jsx__default["default"](ButtonSlot, {
|
|
64
69
|
ml: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
|
|
65
|
-
}, void 0, leftProp), /*#__PURE__*/_jsx__default[
|
|
70
|
+
}, void 0, leftProp), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, breadCrumb && /*#__PURE__*/_jsx__default["default"](BreadCrumb, {
|
|
66
71
|
pl: !leftProp && '1rem'
|
|
67
|
-
}, void 0, breadCrumb), /*#__PURE__*/_jsx__default[
|
|
72
|
+
}, void 0, breadCrumb), /*#__PURE__*/_jsx__default["default"](Title, {
|
|
68
73
|
style: leftProp ? {} : {
|
|
69
74
|
paddingLeft: '1rem'
|
|
70
75
|
}
|
|
71
|
-
}, void 0, pageTitle)), rightProp && /*#__PURE__*/_jsx__default[
|
|
76
|
+
}, void 0, pageTitle)), rightProp && /*#__PURE__*/_jsx__default["default"](ButtonSlot, {
|
|
72
77
|
ml: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
|
|
73
|
-
}, void 0, rightProp)), /*#__PURE__*/_jsx__default[
|
|
78
|
+
}, void 0, rightProp)), /*#__PURE__*/_jsx__default["default"](Body, {
|
|
74
79
|
style: bodyStyle
|
|
75
|
-
}, void 0, children), footerButton && /*#__PURE__*/_jsx__default[
|
|
80
|
+
}, void 0, children), footerButton && /*#__PURE__*/_jsx__default["default"](Footer, {}, void 0, footerButton));
|
|
76
81
|
};
|
|
77
82
|
|
|
78
83
|
const DSPageFilter = PageFilter;
|
package/cjs/PageForm/PageForm.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
6
|
require('react');
|
|
7
|
-
var
|
|
7
|
+
var dsGrid = require('@elliemae/ds-grid');
|
|
8
8
|
var styled = require('styled-components');
|
|
9
9
|
var dsSystem = require('@elliemae/ds-system');
|
|
10
10
|
var FullPageContainer = require('../FullPageContainer/FullPageContainer.js');
|
|
@@ -15,30 +15,37 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
15
15
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
16
16
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
17
17
|
|
|
18
|
-
const Body = /*#__PURE__*/styled__default[
|
|
18
|
+
const Body = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
19
19
|
componentId: "sc-1qg3tcm-0"
|
|
20
|
-
})(["margin:0 auto;width:100%;@media (min-width:", "){", "}"],
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
})
|
|
20
|
+
})(["margin:0 auto;width:100%;@media (min-width:", "){", "}"], _ref => {
|
|
21
|
+
let {
|
|
22
|
+
theme
|
|
23
|
+
} = _ref;
|
|
24
|
+
return theme.breakpoints.small;
|
|
25
|
+
}, _ref2 => {
|
|
26
|
+
let {
|
|
27
|
+
theme
|
|
28
|
+
} = _ref2;
|
|
29
|
+
return "width: ".concat(dsSystem.op('*', dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl), 6.25), ";");
|
|
30
|
+
});
|
|
31
|
+
|
|
32
|
+
const PageForm = _ref3 => {
|
|
33
|
+
let {
|
|
34
|
+
header = null,
|
|
35
|
+
body = null,
|
|
36
|
+
footer = null
|
|
37
|
+
} = _ref3;
|
|
31
38
|
const theme = dsSystem.useTheme();
|
|
32
39
|
const rows = [1];
|
|
33
40
|
if (header) rows.unshift(dsSystem.op('*', dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl), 1.125));
|
|
34
41
|
if (footer) rows.push(theme.space.l);
|
|
35
|
-
return /*#__PURE__*/_jsx__default[
|
|
42
|
+
return /*#__PURE__*/_jsx__default["default"](FullPageContainer.DSFullPageContainer, {
|
|
36
43
|
rows: rows
|
|
37
|
-
}, void 0, header && /*#__PURE__*/_jsx__default[
|
|
44
|
+
}, void 0, header && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, header), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
|
|
38
45
|
style: {
|
|
39
46
|
overflow: 'hidden'
|
|
40
47
|
}
|
|
41
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
48
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](FullPageContainerScroll.DSFullPageContainerScroll, {}, void 0, /*#__PURE__*/_jsx__default["default"](Body, {}, void 0, body))), footer && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, footer));
|
|
42
49
|
};
|
|
43
50
|
|
|
44
51
|
const DSPageForm = PageForm;
|