@elliemae/ds-modal-slide 3.0.0-next.2 → 3.0.0-next.6
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/dist/cjs/DSModalSlide.js +152 -0
- package/dist/cjs/DSModalSlide.js.map +7 -0
- package/dist/cjs/components/Footer.js +93 -0
- package/dist/cjs/components/Footer.js.map +7 -0
- package/dist/cjs/components/Header.js +78 -0
- package/dist/cjs/components/Header.js.map +7 -0
- package/dist/cjs/components/blocks.js +65 -0
- package/dist/cjs/components/blocks.js.map +7 -0
- package/dist/cjs/index.js +40 -0
- package/dist/cjs/index.js.map +7 -0
- package/dist/esm/DSModalSlide.js +123 -0
- package/dist/esm/DSModalSlide.js.map +7 -0
- package/dist/esm/components/Footer.js +66 -0
- package/dist/esm/components/Footer.js.map +7 -0
- package/dist/esm/components/Header.js +49 -0
- package/dist/esm/components/Header.js.map +7 -0
- package/dist/esm/components/blocks.js +36 -0
- package/dist/esm/components/blocks.js.map +7 -0
- package/dist/esm/index.js +11 -0
- package/dist/esm/index.js.map +7 -0
- package/package.json +38 -29
- package/cjs/DSModalSlide.js +0 -176
- package/cjs/components/Footer.js +0 -101
- package/cjs/components/Header.js +0 -69
- package/cjs/components/blocks.js +0 -54
- package/cjs/index.js +0 -17
- package/esm/DSModalSlide.js +0 -161
- package/esm/components/Footer.js +0 -90
- package/esm/components/Header.js +0 -57
- package/esm/components/blocks.js +0 -41
- package/esm/index.js +0 -3
- package/types/DSModalSlide.d.ts +0 -105
- package/types/components/Footer.d.ts +0 -90
- package/types/components/Header.d.ts +0 -43
- package/types/components/blocks.d.ts +0 -11
- package/types/index.d.ts +0 -4
- package/types/tests/DSModalSlide.test.d.ts +0 -1
package/cjs/components/blocks.js
DELETED
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
var dsClassnames = require('@elliemae/ds-classnames');
|
|
6
|
-
|
|
7
|
-
const blockName = 'modal-slide';
|
|
8
|
-
const Wrapper = dsClassnames.aggregatedClasses('div')(blockName, 'wrapper', _ref => {
|
|
9
|
-
let {
|
|
10
|
-
show,
|
|
11
|
-
centered
|
|
12
|
-
} = _ref;
|
|
13
|
-
return {
|
|
14
|
-
showing: show,
|
|
15
|
-
disappearing: !show,
|
|
16
|
-
centered
|
|
17
|
-
};
|
|
18
|
-
});
|
|
19
|
-
const Overlay = dsClassnames.aggregatedClasses('div')(blockName, 'overlay', _ref2 => {
|
|
20
|
-
let {
|
|
21
|
-
show
|
|
22
|
-
} = _ref2;
|
|
23
|
-
return {
|
|
24
|
-
showing: show,
|
|
25
|
-
disappearing: !show
|
|
26
|
-
};
|
|
27
|
-
});
|
|
28
|
-
const Content = dsClassnames.aggregatedClasses('div')(blockName, 'content', _ref3 => {
|
|
29
|
-
let {
|
|
30
|
-
show
|
|
31
|
-
} = _ref3;
|
|
32
|
-
return {
|
|
33
|
-
showing: show,
|
|
34
|
-
disappearing: !show
|
|
35
|
-
};
|
|
36
|
-
});
|
|
37
|
-
const Title = dsClassnames.aggregatedClasses('div')(blockName, 'title', () => ({}));
|
|
38
|
-
const BreadcrumTitle = dsClassnames.aggregatedClasses('div')(blockName, 'breadcrum-title', () => ({}));
|
|
39
|
-
const HeaderLeftSide = dsClassnames.aggregatedClasses('div')(blockName, 'header-left-side', () => ({}));
|
|
40
|
-
const ActualContent = dsClassnames.aggregatedClasses('div')(blockName, 'actual-content', () => ({}));
|
|
41
|
-
const Header = dsClassnames.aggregatedClasses('div')(blockName, 'header', () => ({}));
|
|
42
|
-
const Footer = dsClassnames.aggregatedClasses('div')(blockName, 'footer', () => ({}));
|
|
43
|
-
const FooterWrapper = dsClassnames.aggregatedClasses('div')(blockName, 'footer-wrapper', () => ({}));
|
|
44
|
-
|
|
45
|
-
exports.ActualContent = ActualContent;
|
|
46
|
-
exports.BreadcrumTitle = BreadcrumTitle;
|
|
47
|
-
exports.Content = Content;
|
|
48
|
-
exports.Footer = Footer;
|
|
49
|
-
exports.FooterWrapper = FooterWrapper;
|
|
50
|
-
exports.Header = Header;
|
|
51
|
-
exports.HeaderLeftSide = HeaderLeftSide;
|
|
52
|
-
exports.Overlay = Overlay;
|
|
53
|
-
exports.Title = Title;
|
|
54
|
-
exports.Wrapper = Wrapper;
|
package/cjs/index.js
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
var DSModalSlide = require('./DSModalSlide.js');
|
|
6
|
-
var Header = require('./components/Header.js');
|
|
7
|
-
var Footer = require('./components/Footer.js');
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
exports.DSModalSlide = DSModalSlide.DSModalSlide;
|
|
12
|
-
exports.DSModalSlideWithSchema = DSModalSlide.DSModalSlideWithSchema;
|
|
13
|
-
exports["default"] = DSModalSlide.DSModalSlide;
|
|
14
|
-
exports.DSModalSlideHeaderWithSchema = Header.DSModalSlideHeaderWithSchema;
|
|
15
|
-
exports.ModalHeader = Header["default"];
|
|
16
|
-
exports.DSModalSlideFooterWithSchema = Footer.DSModalSlideFooterWithSchema;
|
|
17
|
-
exports.ModalFooter = Footer["default"];
|
package/esm/DSModalSlide.js
DELETED
|
@@ -1,161 +0,0 @@
|
|
|
1
|
-
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
-
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
3
|
-
import React, { useState, useCallback, useEffect } from 'react';
|
|
4
|
-
import { PropTypes, describe } from 'react-desc';
|
|
5
|
-
import ReactDOM from 'react-dom';
|
|
6
|
-
import { useTheme } from '@elliemae/ds-system';
|
|
7
|
-
import { Grid } from '@elliemae/ds-grid';
|
|
8
|
-
import DSSeparator from '@elliemae/ds-separator';
|
|
9
|
-
import { Wrapper, Overlay, Content, ActualContent } from './components/blocks.js';
|
|
10
|
-
export { default as ModalHeader } from './components/Header.js';
|
|
11
|
-
export { default as ModalFooter } from './components/Footer.js';
|
|
12
|
-
|
|
13
|
-
var _DSSeparator, _DSSeparator2;
|
|
14
|
-
|
|
15
|
-
const DSModalSlide = _ref => {
|
|
16
|
-
let {
|
|
17
|
-
isOpen = false,
|
|
18
|
-
children,
|
|
19
|
-
getContainer,
|
|
20
|
-
centered = false,
|
|
21
|
-
fullWidth = false,
|
|
22
|
-
header = null,
|
|
23
|
-
footer = null,
|
|
24
|
-
fadeOut = 1500,
|
|
25
|
-
fadeIn = 1500,
|
|
26
|
-
overrideHeight = false
|
|
27
|
-
} = _ref;
|
|
28
|
-
const [isMoving, setMoving] = useState(false);
|
|
29
|
-
const [show, setShow] = useState(isOpen);
|
|
30
|
-
const [width, setWidth] = useState(50);
|
|
31
|
-
const theme = useTheme();
|
|
32
|
-
const contentRows = [...(header ? [theme.space.m] : []), '0px', 'auto', '0px', ...(footer ? [theme.space.m] : [])];
|
|
33
|
-
const updateShow = useCallback(() => {
|
|
34
|
-
if (fullWidth) setWidth(100);else setWidth(50);
|
|
35
|
-
|
|
36
|
-
if (isOpen !== show) {
|
|
37
|
-
setMoving(true);
|
|
38
|
-
|
|
39
|
-
if (isOpen) {
|
|
40
|
-
setShow(isOpen);
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
}, [isOpen, fullWidth, isMoving]);
|
|
44
|
-
useEffect(updateShow, [isOpen, fullWidth]);
|
|
45
|
-
if (!show) return null;
|
|
46
|
-
const container = getContainer();
|
|
47
|
-
if (!container) return null;
|
|
48
|
-
|
|
49
|
-
const handleAnimationEnd = () => {
|
|
50
|
-
setMoving(false);
|
|
51
|
-
if (!isOpen) setShow(isOpen);
|
|
52
|
-
};
|
|
53
|
-
|
|
54
|
-
let {
|
|
55
|
-
height
|
|
56
|
-
} = container.getBoundingClientRect();
|
|
57
|
-
|
|
58
|
-
if (overrideHeight && container.scrollHeight > height) {
|
|
59
|
-
height = container.scrollHeight;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
if (!container.style.position) {
|
|
63
|
-
container.style.position = 'relative';
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/_jsx(Wrapper, {
|
|
67
|
-
classProps: {
|
|
68
|
-
show: isOpen,
|
|
69
|
-
centered
|
|
70
|
-
},
|
|
71
|
-
style: {
|
|
72
|
-
'--height': height,
|
|
73
|
-
'--fade-in': fadeIn,
|
|
74
|
-
'--fade-out': fadeOut,
|
|
75
|
-
'--width': width
|
|
76
|
-
}
|
|
77
|
-
}, void 0, /*#__PURE__*/_jsx(Overlay, {
|
|
78
|
-
classProps: {
|
|
79
|
-
show: isOpen
|
|
80
|
-
}
|
|
81
|
-
}, void 0, /*#__PURE__*/_jsx(Content, {
|
|
82
|
-
onAnimationEnd: handleAnimationEnd,
|
|
83
|
-
classProps: {
|
|
84
|
-
show: isOpen
|
|
85
|
-
}
|
|
86
|
-
}, void 0, /*#__PURE__*/_jsx(Grid, {
|
|
87
|
-
style: {
|
|
88
|
-
height: '100%',
|
|
89
|
-
width: '100%',
|
|
90
|
-
maxHeight: '100%',
|
|
91
|
-
overflow: 'hidden',
|
|
92
|
-
'-webkit-backface-visibility': 'hidden',
|
|
93
|
-
'backface-visibility': 'hidden',
|
|
94
|
-
'-webkit-transform-style': 'preserve-3d'
|
|
95
|
-
},
|
|
96
|
-
rows: contentRows,
|
|
97
|
-
"data-testid": "ds-modal-slide"
|
|
98
|
-
}, void 0, header && /*#__PURE__*/React.cloneElement(header, {
|
|
99
|
-
fullWidth
|
|
100
|
-
}), header && (_DSSeparator || (_DSSeparator = /*#__PURE__*/_jsx(DSSeparator, {
|
|
101
|
-
position: "initial",
|
|
102
|
-
type: "non-form"
|
|
103
|
-
}))), /*#__PURE__*/_jsx(Grid, {
|
|
104
|
-
style: {
|
|
105
|
-
overflow: 'hidden'
|
|
106
|
-
}
|
|
107
|
-
}, void 0, /*#__PURE__*/_jsx(Grid, {
|
|
108
|
-
style: {
|
|
109
|
-
overflow: 'auto'
|
|
110
|
-
}
|
|
111
|
-
}, void 0, /*#__PURE__*/_jsx(ActualContent, {}, void 0, children))), footer && (_DSSeparator2 || (_DSSeparator2 = /*#__PURE__*/_jsx(DSSeparator, {
|
|
112
|
-
position: "initial",
|
|
113
|
-
type: "non-form"
|
|
114
|
-
}))), footer)))), container);
|
|
115
|
-
};
|
|
116
|
-
|
|
117
|
-
const props = {
|
|
118
|
-
/**
|
|
119
|
-
* If the modal slide is centered or not
|
|
120
|
-
*/
|
|
121
|
-
centered: PropTypes.bool.description('If the modal slide is centered or not'),
|
|
122
|
-
|
|
123
|
-
/**
|
|
124
|
-
* If the modal slide is visible or not
|
|
125
|
-
*/
|
|
126
|
-
isOpen: PropTypes.bool.description('If the modal slide is visible or not'),
|
|
127
|
-
|
|
128
|
-
/**
|
|
129
|
-
* Main content of the modal
|
|
130
|
-
*/
|
|
131
|
-
children: PropTypes.oneOfType([PropTypes.element, PropTypes.string, PropTypes.any]).isRequired.description('Main content of the modal'),
|
|
132
|
-
|
|
133
|
-
/**
|
|
134
|
-
* If the modal slide takes the full width or not
|
|
135
|
-
*/
|
|
136
|
-
fullWidth: PropTypes.bool.description('If the modal slide takes the full width or not'),
|
|
137
|
-
|
|
138
|
-
/**
|
|
139
|
-
* If the modal slide has a header, only available for full width option
|
|
140
|
-
*/
|
|
141
|
-
header: PropTypes.element.description('If the modal slide has a header, only available for full width option'),
|
|
142
|
-
|
|
143
|
-
/**
|
|
144
|
-
* Ratio of fade out
|
|
145
|
-
*/
|
|
146
|
-
fadeOut: PropTypes.number.description('Ratio of fade out'),
|
|
147
|
-
|
|
148
|
-
/**
|
|
149
|
-
* Ratio of fade in
|
|
150
|
-
*/
|
|
151
|
-
fadeIn: PropTypes.number.description('Ratio of fade in'),
|
|
152
|
-
|
|
153
|
-
/**
|
|
154
|
-
* Override the panel height to scroll height of the container
|
|
155
|
-
*/
|
|
156
|
-
overrideHeight: PropTypes.bool.description('Override the panel height to scroll height of the container')
|
|
157
|
-
};
|
|
158
|
-
const DSModalSlideWithSchema = describe(DSModalSlide);
|
|
159
|
-
DSModalSlideWithSchema.propTypes = props;
|
|
160
|
-
|
|
161
|
-
export { DSModalSlide, DSModalSlideWithSchema, DSModalSlide as default };
|
package/esm/components/Footer.js
DELETED
|
@@ -1,90 +0,0 @@
|
|
|
1
|
-
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
-
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
-
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
-
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
5
|
-
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
6
|
-
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
7
|
-
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
8
|
-
import 'react';
|
|
9
|
-
import { PropTypes, describe } from 'react-desc';
|
|
10
|
-
import DSButton from '@elliemae/ds-button';
|
|
11
|
-
import { FooterWrapper } from './blocks.js';
|
|
12
|
-
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
13
|
-
|
|
14
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
15
|
-
|
|
16
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
|
-
|
|
18
|
-
const ModalFooter = _ref => {
|
|
19
|
-
let {
|
|
20
|
-
confirmLabel = 'Confirm',
|
|
21
|
-
rejectLabel = 'Cancel',
|
|
22
|
-
onConfirm,
|
|
23
|
-
onReject,
|
|
24
|
-
confirmProps = {
|
|
25
|
-
disabled: false
|
|
26
|
-
},
|
|
27
|
-
rejectProps = {
|
|
28
|
-
disabled: false
|
|
29
|
-
}
|
|
30
|
-
} = _ref;
|
|
31
|
-
return /*#__PURE__*/jsx(Fragment, {
|
|
32
|
-
children: /*#__PURE__*/_jsx(FooterWrapper, {}, void 0, !!onReject && /*#__PURE__*/jsx(DSButton, _objectSpread({
|
|
33
|
-
buttonType: "secondary",
|
|
34
|
-
className: "action-reject",
|
|
35
|
-
containerProps: {
|
|
36
|
-
'data-testid': 'modal-footer-reject-btn'
|
|
37
|
-
},
|
|
38
|
-
labelText: rejectLabel,
|
|
39
|
-
onClick: onReject
|
|
40
|
-
}, rejectProps)), !!onConfirm && /*#__PURE__*/jsx(DSButton, _objectSpread({
|
|
41
|
-
buttonType: "primary",
|
|
42
|
-
className: "action-confirm",
|
|
43
|
-
containerProps: {
|
|
44
|
-
'data-testid': 'modal-footer-confirm-btn'
|
|
45
|
-
},
|
|
46
|
-
labelText: confirmLabel,
|
|
47
|
-
onClick: onConfirm
|
|
48
|
-
}, confirmProps)))
|
|
49
|
-
});
|
|
50
|
-
};
|
|
51
|
-
|
|
52
|
-
const props = {
|
|
53
|
-
/**
|
|
54
|
-
* Confirm Label
|
|
55
|
-
*/
|
|
56
|
-
confirmLabel: PropTypes.string.description('Confirm Label'),
|
|
57
|
-
|
|
58
|
-
/**
|
|
59
|
-
* Reject Label
|
|
60
|
-
*/
|
|
61
|
-
rejectLabel: PropTypes.string.description('Reject Label'),
|
|
62
|
-
|
|
63
|
-
/**
|
|
64
|
-
* Callback
|
|
65
|
-
*/
|
|
66
|
-
onConfirm: PropTypes.func.description('Callback'),
|
|
67
|
-
|
|
68
|
-
/**
|
|
69
|
-
* Callback
|
|
70
|
-
*/
|
|
71
|
-
onReject: PropTypes.func.description('Callback'),
|
|
72
|
-
|
|
73
|
-
/**
|
|
74
|
-
* Extra DSButton props for confirm btn.
|
|
75
|
-
*/
|
|
76
|
-
confirmProps: PropTypes.shape({
|
|
77
|
-
disabled: PropTypes.bool
|
|
78
|
-
}).description('Extra DSButton props for confirm btn.'),
|
|
79
|
-
|
|
80
|
-
/**
|
|
81
|
-
* Extra DSButton props for reject btn.
|
|
82
|
-
*/
|
|
83
|
-
rejectProps: PropTypes.shape({
|
|
84
|
-
disabled: PropTypes.bool
|
|
85
|
-
}).description('Extra DSButton props for reject btn.')
|
|
86
|
-
};
|
|
87
|
-
const DSModalSlideFooterWithSchema = describe(ModalFooter);
|
|
88
|
-
DSModalSlideFooterWithSchema.propTypes = props;
|
|
89
|
-
|
|
90
|
-
export { DSModalSlideFooterWithSchema, ModalFooter as default };
|
package/esm/components/Header.js
DELETED
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
-
import 'react';
|
|
3
|
-
import { PropTypes, describe } from 'react-desc';
|
|
4
|
-
import styled from 'styled-components';
|
|
5
|
-
import DSSeparator from '@elliemae/ds-separator';
|
|
6
|
-
import { Close } from '@elliemae/ds-icons';
|
|
7
|
-
import DSButton from '@elliemae/ds-button';
|
|
8
|
-
import { HeaderLeftSide, Header, Title } from './blocks.js';
|
|
9
|
-
|
|
10
|
-
var _StyledSeparator, _Close;
|
|
11
|
-
|
|
12
|
-
const ModalHeader = _ref => {
|
|
13
|
-
let {
|
|
14
|
-
title: headerTitle = '',
|
|
15
|
-
onClose = () => null,
|
|
16
|
-
toolbar = null
|
|
17
|
-
} = _ref;
|
|
18
|
-
return /*#__PURE__*/_jsx(HeaderWrapper, {}, void 0, /*#__PURE__*/_jsx(HeaderLeftSide, {}, void 0, /*#__PURE__*/_jsx(Header, {}, void 0, /*#__PURE__*/_jsx(Title, {}, void 0, headerTitle))), toolbar, toolbar && (_StyledSeparator || (_StyledSeparator = /*#__PURE__*/_jsx(StyledSeparator, {
|
|
19
|
-
position: "initial",
|
|
20
|
-
margin: "none",
|
|
21
|
-
orientation: "vertical",
|
|
22
|
-
type: "non-form"
|
|
23
|
-
}))), /*#__PURE__*/_jsx(StyledCloseButton, {
|
|
24
|
-
"data-testid": "modal-slider-header-close",
|
|
25
|
-
"aria-label": "Close modal slide",
|
|
26
|
-
buttonType: "text",
|
|
27
|
-
icon: _Close || (_Close = /*#__PURE__*/_jsx(Close, {
|
|
28
|
-
"aria-label": "Close modal slide",
|
|
29
|
-
size: "s"
|
|
30
|
-
})),
|
|
31
|
-
onClick: onClose
|
|
32
|
-
}));
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
const HeaderWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
36
|
-
componentId: "sc-oxqqo8-0"
|
|
37
|
-
})(["display:flex;justify-content:space-between;width:100%;align-items:center;"]);
|
|
38
|
-
const StyledSeparator = /*#__PURE__*/styled(DSSeparator).withConfig({
|
|
39
|
-
componentId: "sc-oxqqo8-1"
|
|
40
|
-
})(["padding:", " 0;"], props => props.theme.space.xs);
|
|
41
|
-
const StyledCloseButton = /*#__PURE__*/styled(DSButton).withConfig({
|
|
42
|
-
componentId: "sc-oxqqo8-2"
|
|
43
|
-
})(["margin:", ";"], props => props.theme.space.xs);
|
|
44
|
-
const props = {
|
|
45
|
-
/** on modal close callback */
|
|
46
|
-
onClose: PropTypes.func.description('on modal close callback'),
|
|
47
|
-
|
|
48
|
-
/** modal toolbar component */
|
|
49
|
-
toolbar: PropTypes.node.description('modal toolbar comoponent'),
|
|
50
|
-
|
|
51
|
-
/** modal title */
|
|
52
|
-
title: PropTypes.string.description('modal title')
|
|
53
|
-
};
|
|
54
|
-
const DSModalSlideHeaderWithSchema = describe(ModalHeader);
|
|
55
|
-
DSModalSlideHeaderWithSchema.propTypes = props;
|
|
56
|
-
|
|
57
|
-
export { DSModalSlideHeaderWithSchema, ModalHeader as default };
|
package/esm/components/blocks.js
DELETED
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import { aggregatedClasses } from '@elliemae/ds-classnames';
|
|
2
|
-
|
|
3
|
-
const blockName = 'modal-slide';
|
|
4
|
-
const Wrapper = aggregatedClasses('div')(blockName, 'wrapper', _ref => {
|
|
5
|
-
let {
|
|
6
|
-
show,
|
|
7
|
-
centered
|
|
8
|
-
} = _ref;
|
|
9
|
-
return {
|
|
10
|
-
showing: show,
|
|
11
|
-
disappearing: !show,
|
|
12
|
-
centered
|
|
13
|
-
};
|
|
14
|
-
});
|
|
15
|
-
const Overlay = aggregatedClasses('div')(blockName, 'overlay', _ref2 => {
|
|
16
|
-
let {
|
|
17
|
-
show
|
|
18
|
-
} = _ref2;
|
|
19
|
-
return {
|
|
20
|
-
showing: show,
|
|
21
|
-
disappearing: !show
|
|
22
|
-
};
|
|
23
|
-
});
|
|
24
|
-
const Content = aggregatedClasses('div')(blockName, 'content', _ref3 => {
|
|
25
|
-
let {
|
|
26
|
-
show
|
|
27
|
-
} = _ref3;
|
|
28
|
-
return {
|
|
29
|
-
showing: show,
|
|
30
|
-
disappearing: !show
|
|
31
|
-
};
|
|
32
|
-
});
|
|
33
|
-
const Title = aggregatedClasses('div')(blockName, 'title', () => ({}));
|
|
34
|
-
const BreadcrumTitle = aggregatedClasses('div')(blockName, 'breadcrum-title', () => ({}));
|
|
35
|
-
const HeaderLeftSide = aggregatedClasses('div')(blockName, 'header-left-side', () => ({}));
|
|
36
|
-
const ActualContent = aggregatedClasses('div')(blockName, 'actual-content', () => ({}));
|
|
37
|
-
const Header = aggregatedClasses('div')(blockName, 'header', () => ({}));
|
|
38
|
-
const Footer = aggregatedClasses('div')(blockName, 'footer', () => ({}));
|
|
39
|
-
const FooterWrapper = aggregatedClasses('div')(blockName, 'footer-wrapper', () => ({}));
|
|
40
|
-
|
|
41
|
-
export { ActualContent, BreadcrumTitle, Content, Footer, FooterWrapper, Header, HeaderLeftSide, Overlay, Title, Wrapper };
|
package/esm/index.js
DELETED
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
export { DSModalSlide, DSModalSlideWithSchema, DSModalSlide as default } from './DSModalSlide.js';
|
|
2
|
-
export { DSModalSlideHeaderWithSchema, default as ModalHeader } from './components/Header.js';
|
|
3
|
-
export { DSModalSlideFooterWithSchema, default as ModalFooter } from './components/Footer.js';
|
package/types/DSModalSlide.d.ts
DELETED
|
@@ -1,105 +0,0 @@
|
|
|
1
|
-
/// <reference path="../../../../shared/typings/react-desc.d.ts" />
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import ModalHeader from './components/Header';
|
|
4
|
-
import ModalFooter from './components/Footer';
|
|
5
|
-
declare const DSModalSlide: {
|
|
6
|
-
({ isOpen, children, getContainer, centered, fullWidth, header, footer, fadeOut, fadeIn, overrideHeight, }: {
|
|
7
|
-
isOpen?: boolean | undefined;
|
|
8
|
-
children: any;
|
|
9
|
-
getContainer: any;
|
|
10
|
-
centered?: boolean | undefined;
|
|
11
|
-
fullWidth?: boolean | undefined;
|
|
12
|
-
header?: null | undefined;
|
|
13
|
-
footer?: null | undefined;
|
|
14
|
-
fadeOut?: number | undefined;
|
|
15
|
-
fadeIn?: number | undefined;
|
|
16
|
-
overrideHeight?: boolean | undefined;
|
|
17
|
-
}): React.ReactPortal | null;
|
|
18
|
-
propTypes: {
|
|
19
|
-
/**
|
|
20
|
-
* If the modal slide is centered or not
|
|
21
|
-
*/
|
|
22
|
-
centered: {
|
|
23
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
24
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
25
|
-
};
|
|
26
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
27
|
-
};
|
|
28
|
-
/**
|
|
29
|
-
* If the modal slide is visible or not
|
|
30
|
-
*/
|
|
31
|
-
isOpen: {
|
|
32
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
33
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
34
|
-
};
|
|
35
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
36
|
-
};
|
|
37
|
-
/**
|
|
38
|
-
* Main content of the modal
|
|
39
|
-
*/
|
|
40
|
-
children: any;
|
|
41
|
-
/**
|
|
42
|
-
* If the modal slide takes the full width or not
|
|
43
|
-
*/
|
|
44
|
-
fullWidth: {
|
|
45
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
46
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
47
|
-
};
|
|
48
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
49
|
-
};
|
|
50
|
-
/**
|
|
51
|
-
* If the modal slide has a header, only available for full width option
|
|
52
|
-
*/
|
|
53
|
-
header: {
|
|
54
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
55
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
56
|
-
};
|
|
57
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
58
|
-
};
|
|
59
|
-
/**
|
|
60
|
-
* Ratio of fade out
|
|
61
|
-
*/
|
|
62
|
-
fadeOut: {
|
|
63
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
64
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
65
|
-
};
|
|
66
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
67
|
-
};
|
|
68
|
-
/**
|
|
69
|
-
* Ratio of fade in
|
|
70
|
-
*/
|
|
71
|
-
fadeIn: {
|
|
72
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
73
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
74
|
-
};
|
|
75
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
76
|
-
};
|
|
77
|
-
/**
|
|
78
|
-
* Override the panel height to scroll height of the container
|
|
79
|
-
*/
|
|
80
|
-
overrideHeight: {
|
|
81
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
82
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
83
|
-
};
|
|
84
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
85
|
-
};
|
|
86
|
-
};
|
|
87
|
-
};
|
|
88
|
-
declare const DSModalSlideWithSchema: {
|
|
89
|
-
(props?: {
|
|
90
|
-
isOpen?: boolean | undefined;
|
|
91
|
-
children: any;
|
|
92
|
-
getContainer: any;
|
|
93
|
-
centered?: boolean | undefined;
|
|
94
|
-
fullWidth?: boolean | undefined;
|
|
95
|
-
header?: null | undefined;
|
|
96
|
-
footer?: null | undefined;
|
|
97
|
-
fadeOut?: number | undefined;
|
|
98
|
-
fadeIn?: number | undefined;
|
|
99
|
-
overrideHeight?: boolean | undefined;
|
|
100
|
-
} | undefined): JSX.Element;
|
|
101
|
-
propTypes: unknown;
|
|
102
|
-
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
103
|
-
};
|
|
104
|
-
export { ModalHeader, ModalFooter, DSModalSlide, DSModalSlideWithSchema };
|
|
105
|
-
export default DSModalSlide;
|
|
@@ -1,90 +0,0 @@
|
|
|
1
|
-
/// <reference path="../../../../../shared/typings/react-desc.d.ts" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
|
-
declare const ModalFooter: {
|
|
4
|
-
({ confirmLabel, rejectLabel, onConfirm, onReject, confirmProps, rejectProps, }: {
|
|
5
|
-
confirmLabel?: string | undefined;
|
|
6
|
-
rejectLabel?: string | undefined;
|
|
7
|
-
onConfirm: any;
|
|
8
|
-
onReject: any;
|
|
9
|
-
confirmProps?: {
|
|
10
|
-
disabled: boolean;
|
|
11
|
-
} | undefined;
|
|
12
|
-
rejectProps?: {
|
|
13
|
-
disabled: boolean;
|
|
14
|
-
} | undefined;
|
|
15
|
-
}): JSX.Element;
|
|
16
|
-
propTypes: {
|
|
17
|
-
/**
|
|
18
|
-
* Confirm Label
|
|
19
|
-
*/
|
|
20
|
-
confirmLabel: {
|
|
21
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
22
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
23
|
-
};
|
|
24
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
25
|
-
};
|
|
26
|
-
/**
|
|
27
|
-
* Reject Label
|
|
28
|
-
*/
|
|
29
|
-
rejectLabel: {
|
|
30
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
31
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
32
|
-
};
|
|
33
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
34
|
-
};
|
|
35
|
-
/**
|
|
36
|
-
* Callback
|
|
37
|
-
*/
|
|
38
|
-
onConfirm: {
|
|
39
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
40
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
41
|
-
};
|
|
42
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
43
|
-
};
|
|
44
|
-
/**
|
|
45
|
-
* Callback
|
|
46
|
-
*/
|
|
47
|
-
onReject: {
|
|
48
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
49
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
50
|
-
};
|
|
51
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
52
|
-
};
|
|
53
|
-
/**
|
|
54
|
-
* Extra DSButton props for confirm btn.
|
|
55
|
-
*/
|
|
56
|
-
confirmProps: {
|
|
57
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
58
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
59
|
-
};
|
|
60
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
61
|
-
};
|
|
62
|
-
/**
|
|
63
|
-
* Extra DSButton props for reject btn.
|
|
64
|
-
*/
|
|
65
|
-
rejectProps: {
|
|
66
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
67
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
68
|
-
};
|
|
69
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
70
|
-
};
|
|
71
|
-
};
|
|
72
|
-
};
|
|
73
|
-
declare const DSModalSlideFooterWithSchema: {
|
|
74
|
-
(props?: {
|
|
75
|
-
confirmLabel?: string | undefined;
|
|
76
|
-
rejectLabel?: string | undefined;
|
|
77
|
-
onConfirm: any;
|
|
78
|
-
onReject: any;
|
|
79
|
-
confirmProps?: {
|
|
80
|
-
disabled: boolean;
|
|
81
|
-
} | undefined;
|
|
82
|
-
rejectProps?: {
|
|
83
|
-
disabled: boolean;
|
|
84
|
-
} | undefined;
|
|
85
|
-
} | undefined): JSX.Element;
|
|
86
|
-
propTypes: unknown;
|
|
87
|
-
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
88
|
-
};
|
|
89
|
-
export { DSModalSlideFooterWithSchema };
|
|
90
|
-
export default ModalFooter;
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
/// <reference path="../../../../../shared/typings/react-desc.d.ts" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
|
-
declare const ModalHeader: {
|
|
4
|
-
({ title: headerTitle, onClose, toolbar }: {
|
|
5
|
-
title?: string | undefined;
|
|
6
|
-
onClose?: (() => null) | undefined;
|
|
7
|
-
toolbar?: null | undefined;
|
|
8
|
-
}): JSX.Element;
|
|
9
|
-
propTypes: {
|
|
10
|
-
/** on modal close callback */
|
|
11
|
-
onClose: {
|
|
12
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
13
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
14
|
-
};
|
|
15
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
16
|
-
};
|
|
17
|
-
/** modal toolbar component */
|
|
18
|
-
toolbar: {
|
|
19
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
20
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
21
|
-
};
|
|
22
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
23
|
-
};
|
|
24
|
-
/** modal title */
|
|
25
|
-
title: {
|
|
26
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
27
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
28
|
-
};
|
|
29
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
30
|
-
};
|
|
31
|
-
};
|
|
32
|
-
};
|
|
33
|
-
declare const DSModalSlideHeaderWithSchema: {
|
|
34
|
-
(props?: {
|
|
35
|
-
title?: string | undefined;
|
|
36
|
-
onClose?: (() => null) | undefined;
|
|
37
|
-
toolbar?: null | undefined;
|
|
38
|
-
} | undefined): JSX.Element;
|
|
39
|
-
propTypes: unknown;
|
|
40
|
-
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
41
|
-
};
|
|
42
|
-
export { DSModalSlideHeaderWithSchema };
|
|
43
|
-
export default ModalHeader;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
export declare const Wrapper: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|
|
3
|
-
export declare const Overlay: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|
|
4
|
-
export declare const Content: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|
|
5
|
-
export declare const Title: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|
|
6
|
-
export declare const BreadcrumTitle: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|
|
7
|
-
export declare const HeaderLeftSide: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|
|
8
|
-
export declare const ActualContent: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|
|
9
|
-
export declare const Header: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|
|
10
|
-
export declare const Footer: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|
|
11
|
-
export declare const FooterWrapper: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
|