@elliemae/ds-side-panel 1.60.0 → 2.0.0-alpha.12

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/SidePanel.js CHANGED
@@ -2,7 +2,8 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var React = require('react');
5
+ var _jsx = require('@babel/runtime/helpers/jsx');
6
+ require('react');
6
7
  var reactDesc = require('react-desc');
7
8
  var styled = require('styled-components');
8
9
  var dsSystem = require('@elliemae/ds-system');
@@ -12,54 +13,50 @@ var defaultProps = require('./defaultProps.js');
12
13
 
13
14
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
14
15
 
15
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
16
+ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
16
17
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
17
18
 
18
- var Container = /*#__PURE__*/styled__default['default'].div.withConfig({
19
+ const Container = /*#__PURE__*/styled__default["default"].div.withConfig({
19
20
  componentId: "sc-71f9h4-0"
20
- })(["display:flex;height:100%;flex-direction:row;max-height:100%;overflow:hidden;", ""], function (_ref) {
21
- var noGridInfluencer = _ref.noGridInfluencer;
21
+ })(["display:flex;height:100%;flex-direction:row;max-height:100%;overflow:hidden;", ""], _ref => {
22
+ let {
23
+ noGridInfluencer
24
+ } = _ref;
22
25
  return noGridInfluencer ? 'position: relative;' : '';
23
26
  });
24
- var TransGrid = /*#__PURE__*/styled__default['default'](dsGrid.Grid).withConfig({
27
+ const TransGrid = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
25
28
  componentId: "sc-71f9h4-1"
26
- })(["box-shadow:", ";transition:300ms;border-left:", ";", " background:", ";"], function (props) {
27
- return props.withBoxShadow ? '0 2px 5px 0 rgba(53, 60, 70, 0.5)' : 'none';
28
- }, function (props) {
29
- return props.withBorder ? dsSystem.border(props.theme.colors.neutral['300'], '1px') : 'none';
30
- }, function (_ref2) {
31
- var noGridInfluencer = _ref2.noGridInfluencer;
29
+ })(["box-shadow:", ";transition:300ms;border-left:", ";", " background:", ";"], props => props.withBoxShadow ? '0 2px 5px 0 rgba(53, 60, 70, 0.5)' : 'none', props => props.withBorder ? dsSystem.border(props.theme.colors.neutral['300'], '1px') : 'none', _ref2 => {
30
+ let {
31
+ noGridInfluencer
32
+ } = _ref2;
32
33
  return noGridInfluencer ? "\n position: absolute;\n top:0;\n right:0;\n height: 100%;\n " : '';
33
- }, function (props) {
34
- return props.theme.colors.neutral['000'];
35
- });
36
- var FooterContainer = /*#__PURE__*/styled__default['default'](dsGrid.Grid).withConfig({
34
+ }, props => props.theme.colors.neutral['000']);
35
+ const FooterContainer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
37
36
  componentId: "sc-71f9h4-2"
38
- })(["border-top:", ";"], function (props) {
39
- return dsSystem.border(props.theme.colors.neutral['300']);
40
- });
37
+ })(["border-top:", ";"], props => dsSystem.border(props.theme.colors.neutral['300']));
41
38
 
42
- var SidePanel = function SidePanel(_ref3) {
43
- var children = _ref3.children,
44
- isOpen = _ref3.isOpen,
45
- footer = _ref3.footer,
46
- header = _ref3.header,
47
- panelContent = _ref3.panelContent,
48
- panelWidth = _ref3.panelWidth,
49
- panelContentOverflow = _ref3.panelContentOverflow,
50
- widthWhenIsClosed = _ref3.widthWhenIsClosed,
51
- noGridInfluencer = _ref3.noGridInfluencer,
52
- _ref3$withBorder = _ref3.withBorder,
53
- withBorder = _ref3$withBorder === void 0 ? true : _ref3$withBorder,
54
- _ref3$withBoxShadow = _ref3.withBoxShadow,
55
- withBoxShadow = _ref3$withBoxShadow === void 0 ? false : _ref3$withBoxShadow;
56
- return /*#__PURE__*/React__default['default'].createElement(Container, {
39
+ const SidePanel = _ref3 => {
40
+ let {
41
+ children,
42
+ isOpen,
43
+ footer,
44
+ header,
45
+ panelContent,
46
+ panelWidth,
47
+ panelContentOverflow,
48
+ widthWhenIsClosed,
49
+ noGridInfluencer,
50
+ withBorder = true,
51
+ withBoxShadow = false
52
+ } = _ref3;
53
+ return /*#__PURE__*/_jsx__default["default"](Container, {
57
54
  noGridInfluencer: noGridInfluencer
58
- }, /*#__PURE__*/React__default['default'].createElement(TransGrid, {
55
+ }, void 0, /*#__PURE__*/_jsx__default["default"](TransGrid, {
59
56
  height: "100%",
60
57
  flex: "1",
61
58
  mr: noGridInfluencer ? "".concat(widthWhenIsClosed, "px") : 0
62
- }, children), /*#__PURE__*/React__default['default'].createElement(TransGrid, {
59
+ }, void 0, children), /*#__PURE__*/_jsx__default["default"](TransGrid, {
63
60
  style: {
64
61
  overflow: 'hidden'
65
62
  },
@@ -71,32 +68,30 @@ var SidePanel = function SidePanel(_ref3) {
71
68
  isOpen: isOpen,
72
69
  cols: [1],
73
70
  noGridInfluencer: noGridInfluencer
74
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
71
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
75
72
  rows: footer ? [header ? '48px' : '0px', 'minmax(0px, 1fr)', '48px'] : [header ? '48px' : '0px', 'minmax(0px, 1fr)'],
76
73
  style: {
77
74
  overflow: 'hidden'
78
75
  }
79
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, null, header), /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
76
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, header), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
80
77
  style: {
81
78
  overflow: 'hidden'
82
79
  }
83
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
80
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
84
81
  style: {
85
82
  overflow: panelContentOverflow
86
83
  }
87
- }, panelContent)), footer ? /*#__PURE__*/React__default['default'].createElement(FooterContainer, {
84
+ }, void 0, panelContent)), footer ? /*#__PURE__*/_jsx__default["default"](FooterContainer, {
88
85
  alignItems: "center",
89
86
  pl: "xs",
90
87
  pr: "xs"
91
- }, footer) : null)));
88
+ }, void 0, footer) : null)));
92
89
  };
93
90
 
94
- SidePanel.propTypes = props.props;
95
91
  SidePanel.defaultProps = defaultProps.defaultProps;
96
- var DSSidePanelWithSchema = reactDesc.describe(SidePanel);
92
+ const DSSidePanelWithSchema = reactDesc.describe(SidePanel);
97
93
  DSSidePanelWithSchema.propTypes = props.props;
98
94
 
99
95
  exports.DSSidePanelWithSchema = DSSidePanelWithSchema;
100
96
  exports.SidePanel = SidePanel;
101
- exports['default'] = SidePanel;
102
- //# sourceMappingURL=SidePanel.js.map
97
+ exports["default"] = SidePanel;
@@ -2,7 +2,8 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var React = require('react');
5
+ var _jsx = require('@babel/runtime/helpers/jsx');
6
+ require('react');
6
7
  var reactDesc = require('react-desc');
7
8
  var styled = require('styled-components');
8
9
  var lodash = require('lodash');
@@ -13,82 +14,73 @@ var dsGrid = require('@elliemae/ds-grid');
13
14
 
14
15
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
16
 
16
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
17
+ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
17
18
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
18
19
  var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
19
20
 
20
- var StyledSeparator = /*#__PURE__*/styled__default['default'].div.withConfig({
21
+ var _Grid, _CloseSmall;
22
+ const StyledSeparator = /*#__PURE__*/styled__default["default"].div.withConfig({
21
23
  componentId: "sc-1xdsdq5-0"
22
- })(["width:0;height:100%;margin:0 ", ";border-left:", ";"], function (props) {
23
- return props.theme.space.xxs;
24
- }, function (props) {
25
- return "".concat(props.theme.colors.neutral[300], " 1px solid");
26
- });
27
- var StyledTitle = /*#__PURE__*/styled__default['default'].div.withConfig({
24
+ })(["width:0;height:100%;margin:0 ", ";border-left:", ";"], props => props.theme.space.xxs, props => "".concat(props.theme.colors.neutral[300], " 1px solid"));
25
+ const StyledTitle = /*#__PURE__*/styled__default["default"].div.withConfig({
28
26
  componentId: "sc-1xdsdq5-1"
29
- })(["font-size:18px;font-weight:", ";color:", ";", ""], function (props) {
30
- return props.theme.fontWeights.regular;
31
- }, function (props) {
32
- return props.theme.colors.neutral['700'];
33
- }, dsSystem.truncate());
34
- var Wrapper = /*#__PURE__*/styled__default['default'](dsGrid.Grid).withConfig({
27
+ })(["font-size:18px;font-weight:", ";color:", ";", ""], props => props.theme.fontWeights.regular, props => props.theme.colors.neutral['700'], dsSystem.truncate());
28
+ const Wrapper = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
35
29
  componentId: "sc-1xdsdq5-2"
36
- })(["border-bottom:", ";"], function (props) {
37
- return dsSystem.border(props.theme.colors.neutral['300']);
38
- });
30
+ })(["border-bottom:", ";"], props => dsSystem.border(props.theme.colors.neutral['300']));
39
31
 
40
- var SidePanelHeader = function SidePanelHeader(_ref) {
41
- var _ref$title = _ref.title,
42
- title = _ref$title === void 0 ? null : _ref$title,
43
- _ref$additionalAction = _ref.additionalAction,
44
- additionalAction = _ref$additionalAction === void 0 ? null : _ref$additionalAction,
45
- _ref$onClose = _ref.onClose,
46
- onClose = _ref$onClose === void 0 ? lodash.noop : _ref$onClose,
47
- _ref$showClose = _ref.showClose,
48
- showClose = _ref$showClose === void 0 ? true : _ref$showClose;
49
- var theme = dsSystem.useTheme();
50
- var separator = /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
32
+ const SidePanelHeader = _ref => {
33
+ let {
34
+ title = null,
35
+ additionalAction = null,
36
+ onClose = lodash.noop,
37
+ showClose = true
38
+ } = _ref;
39
+ const theme = dsSystem.useTheme();
40
+
41
+ const separator = _Grid || (_Grid = /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
51
42
  height: "24px"
52
- }, /*#__PURE__*/React__default['default'].createElement(StyledSeparator, null));
53
- var cols = [1, 'auto', 'auto'];
54
- var cols2 = ['auto'];
55
- return /*#__PURE__*/React__default['default'].createElement(Wrapper, {
43
+ }, void 0, /*#__PURE__*/_jsx__default["default"](StyledSeparator, {})));
44
+
45
+ const cols = [1, 'auto', 'auto'];
46
+ const cols2 = ['auto'];
47
+ return /*#__PURE__*/_jsx__default["default"](Wrapper, {
56
48
  cols: cols,
57
49
  height: theme.space.m,
58
50
  pl: theme.space.xs,
59
51
  pr: theme.space.xs,
60
52
  alignItems: "center",
61
53
  width: "100%"
62
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
54
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
63
55
  alignItems: "center",
64
56
  justifyContent: "flex-start",
65
57
  cols: cols2
66
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
58
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
67
59
  cols: [1],
68
60
  alignItems: "center",
69
61
  pr: theme.space.xs
70
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
62
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
71
63
  flexGrow: 0
72
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
64
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
73
65
  cols: ['auto', 'auto'],
74
66
  alignItems: "center"
75
- }, /*#__PURE__*/React__default['default'].createElement(StyledTitle, {
67
+ }, void 0, /*#__PURE__*/_jsx__default["default"](StyledTitle, {
76
68
  maxWidth: "100%",
77
69
  alignItems: "center"
78
- }, title))))), /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
70
+ }, void 0, title))))), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
79
71
  ml: "xxs",
80
72
  alignItems: "center",
81
73
  cols: additionalAction ? ['auto', 'auto', 'auto'] : ['auto']
82
- }, additionalAction && /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, null, additionalAction), additionalAction && showClose && separator, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, null, showClose && /*#__PURE__*/React__default['default'].createElement(DSButton__default['default'], {
74
+ }, void 0, additionalAction && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, additionalAction), additionalAction && showClose && separator, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, showClose && /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
83
75
  buttonType: "text",
84
- icon: /*#__PURE__*/React__default['default'].createElement(dsIcons.CloseSmall, null),
76
+ icon: _CloseSmall || (_CloseSmall = /*#__PURE__*/_jsx__default["default"](dsIcons.CloseSmall, {})),
85
77
  size: "m",
86
78
  onClick: onClose,
87
79
  "data-testid": "btn-close-slide-panel"
88
80
  }))));
89
81
  };
90
82
 
91
- var props = {
83
+ const props = {
92
84
  /** Page title */
93
85
  title: reactDesc.PropTypes.string.description('Page title'),
94
86
 
@@ -101,10 +93,8 @@ var props = {
101
93
  /** Show/Hide close button */
102
94
  showClose: reactDesc.PropTypes.bool.description('Show/Hide close button')
103
95
  };
104
- SidePanelHeader.propTypes = props;
105
- var DSSidePanelHeaderWithSchema = reactDesc.describe(SidePanelHeader);
96
+ const DSSidePanelHeaderWithSchema = reactDesc.describe(SidePanelHeader);
106
97
  DSSidePanelHeaderWithSchema.propTypes = props;
107
98
 
108
99
  exports.DSSidePanelHeaderWithSchema = DSSidePanelHeaderWithSchema;
109
100
  exports.SidePanelHeader = SidePanelHeader;
110
- //# sourceMappingURL=SidePanelHeader.js.map
@@ -2,34 +2,30 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var React = require('react');
5
+ var _jsx = require('@babel/runtime/helpers/jsx');
6
+ require('react');
6
7
  var reactDesc = require('react-desc');
7
8
  var dsGrid = require('@elliemae/ds-grid');
8
9
  var SidePanel = require('./SidePanel.js');
9
- require('styled-components');
10
- require('@elliemae/ds-system');
11
- require('./props.js');
12
- require('./defaultProps.js');
13
10
 
14
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
12
 
16
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
17
-
18
- var TemplateBasicPageWithSidePanel = function TemplateBasicPageWithSidePanel(_ref) {
19
- var _ref$globalHeader = _ref.globalHeader,
20
- globalHeader = _ref$globalHeader === void 0 ? null : _ref$globalHeader,
21
- _ref$mainHeader = _ref.mainHeader,
22
- mainHeader = _ref$mainHeader === void 0 ? null : _ref$mainHeader,
23
- mainContent = _ref.mainContent,
24
- mainFooter = _ref.mainFooter,
25
- _ref$isOpen = _ref.isOpen,
26
- isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
27
- onClose = _ref.onClose,
28
- panelFooter = _ref.panelFooter,
29
- panelHeader = _ref.panelHeader,
30
- panelContent = _ref.panelContent,
31
- panelWidth = _ref.panelWidth;
32
- return /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
13
+ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
14
+
15
+ const TemplateBasicPageWithSidePanel = _ref => {
16
+ let {
17
+ globalHeader = null,
18
+ mainHeader = null,
19
+ mainContent,
20
+ mainFooter,
21
+ isOpen = false,
22
+ onClose,
23
+ panelFooter,
24
+ panelHeader,
25
+ panelContent,
26
+ panelWidth
27
+ } = _ref;
28
+ return /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
33
29
  style: {
34
30
  overflow: 'hidden',
35
31
  width: '100%'
@@ -37,38 +33,38 @@ var TemplateBasicPageWithSidePanel = function TemplateBasicPageWithSidePanel(_re
37
33
  height: "100%",
38
34
  maxHeight: "100%",
39
35
  rows: ['auto', '1fr']
40
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, null, globalHeader), /*#__PURE__*/React__default['default'].createElement(SidePanel.SidePanel, {
36
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, globalHeader), /*#__PURE__*/_jsx__default["default"](SidePanel.SidePanel, {
41
37
  footer: panelFooter,
42
38
  header: panelHeader,
43
39
  panelWidth: panelWidth,
44
40
  onClose: onClose,
45
41
  panelContent: panelContent,
46
42
  isOpen: isOpen
47
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
43
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
48
44
  style: {
49
45
  overflow: 'hidden'
50
46
  },
51
47
  height: "100%",
52
48
  maxHeight: "100%"
53
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
49
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
54
50
  rows: mainFooter ? [mainHeader ? 'auto' : '0px', 'minmax(0px, 1fr)', '48px'] : [mainHeader ? 'auto' : '0px', 'minmax(0px, 1fr)'],
55
51
  style: {
56
52
  overflow: 'hidden'
57
53
  }
58
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, null, mainHeader), /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
54
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, mainHeader), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
59
55
  style: {
60
56
  overflow: 'hidden'
61
57
  }
62
- }, /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
58
+ }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
63
59
  style: {
64
60
  overflow: 'auto'
65
61
  }
66
- }, mainContent)), mainFooter && /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
62
+ }, void 0, mainContent)), mainFooter && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
67
63
  alignItems: "center"
68
- }, mainFooter)))));
64
+ }, void 0, mainFooter)))));
69
65
  };
70
66
 
71
- var props = {
67
+ const props = {
72
68
  /**
73
69
  * Global Header
74
70
  */
@@ -119,10 +115,8 @@ var props = {
119
115
  */
120
116
  onClose: reactDesc.PropTypes.func.description('callback')
121
117
  };
122
- TemplateBasicPageWithSidePanel.propTypes = props;
123
- var DSTemplateBasicPageWithSidePanel = reactDesc.describe(TemplateBasicPageWithSidePanel);
118
+ const DSTemplateBasicPageWithSidePanel = reactDesc.describe(TemplateBasicPageWithSidePanel);
124
119
  DSTemplateBasicPageWithSidePanel.propTypes = props;
125
120
 
126
121
  exports.DSTemplateBasicPageWithSidePanel = DSTemplateBasicPageWithSidePanel;
127
122
  exports.TemplateBasicPageWithSidePanel = TemplateBasicPageWithSidePanel;
128
- //# sourceMappingURL=TemplateBasicPageWithSidePanel.js.map
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var defaultProps = {
5
+ const defaultProps = {
6
6
  isOpen: false,
7
7
  panelWidth: 300,
8
8
  widthWhenIsClosed: 0,
@@ -12,4 +12,3 @@ var defaultProps = {
12
12
  };
13
13
 
14
14
  exports.defaultProps = defaultProps;
15
- //# sourceMappingURL=defaultProps.js.map
package/cjs/index.js CHANGED
@@ -5,24 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var SidePanel = require('./SidePanel.js');
6
6
  var SidePanelHeader = require('./SidePanelHeader.js');
7
7
  var TemplateBasicPageWithSidePanel = require('./TemplateBasicPageWithSidePanel.js');
8
- require('react');
9
- require('react-desc');
10
- require('styled-components');
11
- require('@elliemae/ds-system');
12
- require('@elliemae/ds-grid');
13
- require('./props.js');
14
- require('./defaultProps.js');
15
- require('lodash');
16
- require('@elliemae/ds-icons');
17
- require('@elliemae/ds-button');
18
8
 
19
9
 
20
10
 
21
11
  exports.DSSidePanelWithSchema = SidePanel.DSSidePanelWithSchema;
22
12
  exports.SidePanel = SidePanel.SidePanel;
23
- exports.default = SidePanel.SidePanel;
13
+ exports["default"] = SidePanel.SidePanel;
24
14
  exports.DSSidePanelHeaderWithSchema = SidePanelHeader.DSSidePanelHeaderWithSchema;
25
15
  exports.SidePanelHeader = SidePanelHeader.SidePanelHeader;
26
16
  exports.DSTemplateBasicPageWithSidePanel = TemplateBasicPageWithSidePanel.DSTemplateBasicPageWithSidePanel;
27
17
  exports.TemplateBasicPageWithSidePanel = TemplateBasicPageWithSidePanel.TemplateBasicPageWithSidePanel;
28
- //# sourceMappingURL=index.js.map
package/cjs/props.js CHANGED
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var reactDesc = require('react-desc');
6
6
 
7
- var props = {
7
+ const props = {
8
8
  /**
9
9
  * Main content
10
10
  */
@@ -42,4 +42,3 @@ var props = {
42
42
  };
43
43
 
44
44
  exports.props = props;
45
- //# sourceMappingURL=props.js.map
package/esm/SidePanel.js CHANGED
@@ -1,4 +1,5 @@
1
- import React from 'react';
1
+ import _jsx from '@babel/runtime/helpers/esm/jsx';
2
+ import 'react';
2
3
  import { describe } from 'react-desc';
3
4
  import styled from 'styled-components';
4
5
  import { border } from '@elliemae/ds-system';
@@ -6,51 +7,47 @@ import { Grid } from '@elliemae/ds-grid';
6
7
  import { props } from './props.js';
7
8
  import { defaultProps } from './defaultProps.js';
8
9
 
9
- var Container = /*#__PURE__*/styled.div.withConfig({
10
+ const Container = /*#__PURE__*/styled.div.withConfig({
10
11
  componentId: "sc-71f9h4-0"
11
- })(["display:flex;height:100%;flex-direction:row;max-height:100%;overflow:hidden;", ""], function (_ref) {
12
- var noGridInfluencer = _ref.noGridInfluencer;
12
+ })(["display:flex;height:100%;flex-direction:row;max-height:100%;overflow:hidden;", ""], _ref => {
13
+ let {
14
+ noGridInfluencer
15
+ } = _ref;
13
16
  return noGridInfluencer ? 'position: relative;' : '';
14
17
  });
15
- var TransGrid = /*#__PURE__*/styled(Grid).withConfig({
18
+ const TransGrid = /*#__PURE__*/styled(Grid).withConfig({
16
19
  componentId: "sc-71f9h4-1"
17
- })(["box-shadow:", ";transition:300ms;border-left:", ";", " background:", ";"], function (props) {
18
- return props.withBoxShadow ? '0 2px 5px 0 rgba(53, 60, 70, 0.5)' : 'none';
19
- }, function (props) {
20
- return props.withBorder ? border(props.theme.colors.neutral['300'], '1px') : 'none';
21
- }, function (_ref2) {
22
- var noGridInfluencer = _ref2.noGridInfluencer;
20
+ })(["box-shadow:", ";transition:300ms;border-left:", ";", " background:", ";"], props => props.withBoxShadow ? '0 2px 5px 0 rgba(53, 60, 70, 0.5)' : 'none', props => props.withBorder ? border(props.theme.colors.neutral['300'], '1px') : 'none', _ref2 => {
21
+ let {
22
+ noGridInfluencer
23
+ } = _ref2;
23
24
  return noGridInfluencer ? "\n position: absolute;\n top:0;\n right:0;\n height: 100%;\n " : '';
24
- }, function (props) {
25
- return props.theme.colors.neutral['000'];
26
- });
27
- var FooterContainer = /*#__PURE__*/styled(Grid).withConfig({
25
+ }, props => props.theme.colors.neutral['000']);
26
+ const FooterContainer = /*#__PURE__*/styled(Grid).withConfig({
28
27
  componentId: "sc-71f9h4-2"
29
- })(["border-top:", ";"], function (props) {
30
- return border(props.theme.colors.neutral['300']);
31
- });
28
+ })(["border-top:", ";"], props => border(props.theme.colors.neutral['300']));
32
29
 
33
- var SidePanel = function SidePanel(_ref3) {
34
- var children = _ref3.children,
35
- isOpen = _ref3.isOpen,
36
- footer = _ref3.footer,
37
- header = _ref3.header,
38
- panelContent = _ref3.panelContent,
39
- panelWidth = _ref3.panelWidth,
40
- panelContentOverflow = _ref3.panelContentOverflow,
41
- widthWhenIsClosed = _ref3.widthWhenIsClosed,
42
- noGridInfluencer = _ref3.noGridInfluencer,
43
- _ref3$withBorder = _ref3.withBorder,
44
- withBorder = _ref3$withBorder === void 0 ? true : _ref3$withBorder,
45
- _ref3$withBoxShadow = _ref3.withBoxShadow,
46
- withBoxShadow = _ref3$withBoxShadow === void 0 ? false : _ref3$withBoxShadow;
47
- return /*#__PURE__*/React.createElement(Container, {
30
+ const SidePanel = _ref3 => {
31
+ let {
32
+ children,
33
+ isOpen,
34
+ footer,
35
+ header,
36
+ panelContent,
37
+ panelWidth,
38
+ panelContentOverflow,
39
+ widthWhenIsClosed,
40
+ noGridInfluencer,
41
+ withBorder = true,
42
+ withBoxShadow = false
43
+ } = _ref3;
44
+ return /*#__PURE__*/_jsx(Container, {
48
45
  noGridInfluencer: noGridInfluencer
49
- }, /*#__PURE__*/React.createElement(TransGrid, {
46
+ }, void 0, /*#__PURE__*/_jsx(TransGrid, {
50
47
  height: "100%",
51
48
  flex: "1",
52
49
  mr: noGridInfluencer ? "".concat(widthWhenIsClosed, "px") : 0
53
- }, children), /*#__PURE__*/React.createElement(TransGrid, {
50
+ }, void 0, children), /*#__PURE__*/_jsx(TransGrid, {
54
51
  style: {
55
52
  overflow: 'hidden'
56
53
  },
@@ -62,30 +59,28 @@ var SidePanel = function SidePanel(_ref3) {
62
59
  isOpen: isOpen,
63
60
  cols: [1],
64
61
  noGridInfluencer: noGridInfluencer
65
- }, /*#__PURE__*/React.createElement(Grid, {
62
+ }, void 0, /*#__PURE__*/_jsx(Grid, {
66
63
  rows: footer ? [header ? '48px' : '0px', 'minmax(0px, 1fr)', '48px'] : [header ? '48px' : '0px', 'minmax(0px, 1fr)'],
67
64
  style: {
68
65
  overflow: 'hidden'
69
66
  }
70
- }, /*#__PURE__*/React.createElement(Grid, null, header), /*#__PURE__*/React.createElement(Grid, {
67
+ }, void 0, /*#__PURE__*/_jsx(Grid, {}, void 0, header), /*#__PURE__*/_jsx(Grid, {
71
68
  style: {
72
69
  overflow: 'hidden'
73
70
  }
74
- }, /*#__PURE__*/React.createElement(Grid, {
71
+ }, void 0, /*#__PURE__*/_jsx(Grid, {
75
72
  style: {
76
73
  overflow: panelContentOverflow
77
74
  }
78
- }, panelContent)), footer ? /*#__PURE__*/React.createElement(FooterContainer, {
75
+ }, void 0, panelContent)), footer ? /*#__PURE__*/_jsx(FooterContainer, {
79
76
  alignItems: "center",
80
77
  pl: "xs",
81
78
  pr: "xs"
82
- }, footer) : null)));
79
+ }, void 0, footer) : null)));
83
80
  };
84
81
 
85
- SidePanel.propTypes = props;
86
82
  SidePanel.defaultProps = defaultProps;
87
- var DSSidePanelWithSchema = describe(SidePanel);
83
+ const DSSidePanelWithSchema = describe(SidePanel);
88
84
  DSSidePanelWithSchema.propTypes = props;
89
85
 
90
86
  export { DSSidePanelWithSchema, SidePanel, SidePanel as default };
91
- //# sourceMappingURL=SidePanel.js.map