@dfds-ui/modal 2.2.0-alpha.e010e72f → 2.2.0-alpha.eac8b0de
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/index.js +1 -1
- package/cjs/modal/Modal.d.ts +7 -3
- package/cjs/modal/Modal.js +41 -49
- package/cjs/modal/ModalAction.d.ts +2 -2
- package/cjs/modal/ModalAction.js +10 -13
- package/cjs/modal/ModalActionsContainer.d.ts +1 -1
- package/cjs/modal/ModalActionsContainer.js +16 -13
- package/cjs/modal/ModalBody.d.ts +3 -4
- package/cjs/modal/ModalBody.js +2 -4
- package/cjs/modal/ModalCloseButton.d.ts +2 -2
- package/cjs/modal/ModalCloseButton.js +14 -19
- package/cjs/modal/ModalDialog.d.ts +7 -7
- package/cjs/modal/ModalDialog.js +63 -83
- package/cjs/modal/ModalFooter.d.ts +3 -3
- package/cjs/modal/ModalFooter.js +13 -14
- package/cjs/modal/ModalHeader.d.ts +3 -3
- package/cjs/modal/ModalHeader.js +18 -18
- package/cjs/modal/ModalHeadline.d.ts +3 -3
- package/cjs/modal/ModalHeadline.js +6 -5
- package/cjs/modal/ModalPanel.d.ts +9 -9
- package/cjs/modal/ModalPanel.js +32 -28
- package/cjs/modal/ReactModalWrapper.d.ts +2 -2
- package/cjs/modal/ReactModalWrapper.js +9 -11
- package/cjs/modal/index.js +12 -12
- package/modal/Modal.d.ts +7 -3
- package/modal/Modal.js +27 -16
- package/modal/ModalAction.d.ts +2 -2
- package/modal/ModalAction.js +10 -5
- package/modal/ModalActionsContainer.d.ts +1 -1
- package/modal/ModalActionsContainer.js +16 -7
- package/modal/ModalBody.d.ts +3 -4
- package/modal/ModalCloseButton.d.ts +2 -2
- package/modal/ModalCloseButton.js +10 -5
- package/modal/ModalDialog.d.ts +7 -7
- package/modal/ModalDialog.js +32 -31
- package/modal/ModalFooter.d.ts +3 -3
- package/modal/ModalFooter.js +13 -6
- package/modal/ModalHeader.d.ts +3 -3
- package/modal/ModalHeader.js +17 -8
- package/modal/ModalHeadline.d.ts +3 -3
- package/modal/ModalHeadline.js +5 -4
- package/modal/ModalPanel.d.ts +9 -9
- package/modal/ModalPanel.js +32 -29
- package/modal/ReactModalWrapper.d.ts +2 -2
- package/modal/ReactModalWrapper.js +10 -5
- package/package.json +12 -12
package/modal/Modal.js
CHANGED
|
@@ -1,7 +1,12 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
1
2
|
var _excluded = ["showClose", "heading", "headerClassName", "noContentPadding", "onRequestClose", "children", "closeTabIndex", "closeLabel", "column", "zIndex", "sizes", "renderWhenClosed", "backdrop", "backdropVariant", "actions"];
|
|
2
|
-
function
|
|
3
|
-
function
|
|
4
|
-
function
|
|
3
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
6
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
7
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
8
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
9
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
5
10
|
import React from 'react';
|
|
6
11
|
import ModalHeader from './ModalHeader';
|
|
7
12
|
import ModalCloseButton from './ModalCloseButton';
|
|
@@ -9,7 +14,7 @@ import ModalDialog, { defaultProps } from './ModalDialog';
|
|
|
9
14
|
import ModalBody from './ModalBody';
|
|
10
15
|
import ModalActionsContainer from './ModalActionsContainer';
|
|
11
16
|
import ModalHeadline from './ModalHeadline';
|
|
12
|
-
import { jsx as
|
|
17
|
+
import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
|
|
13
18
|
export var Modal = function Modal(_ref) {
|
|
14
19
|
var _ref$showClose = _ref.showClose,
|
|
15
20
|
showClose = _ref$showClose === void 0 ? true : _ref$showClose,
|
|
@@ -38,23 +43,29 @@ export var Modal = function Modal(_ref) {
|
|
|
38
43
|
actions = _ref.actions,
|
|
39
44
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
40
45
|
var showHeader = heading !== undefined || showClose;
|
|
41
|
-
return
|
|
46
|
+
return _jsxs(ModalDialog, _objectSpread(_objectSpread({
|
|
42
47
|
onRequestClose: onRequestClose,
|
|
43
48
|
sizes: sizes,
|
|
44
49
|
renderWhenClosed: renderWhenClosed,
|
|
45
50
|
backdrop: backdrop,
|
|
46
51
|
backdropVariant: backdropVariant
|
|
47
|
-
}, rest),
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
52
|
+
}, rest), {}, {
|
|
53
|
+
children: [showHeader && _jsxs(ModalHeader, {
|
|
54
|
+
className: headerClassName,
|
|
55
|
+
children: [_jsx(ModalHeadline, {
|
|
56
|
+
children: heading
|
|
57
|
+
}), showClose && _jsx(ModalCloseButton, {
|
|
58
|
+
onRequestClose: onRequestClose,
|
|
59
|
+
tabIndex: closeTabIndex,
|
|
60
|
+
closeLabel: closeLabel
|
|
61
|
+
})]
|
|
62
|
+
}), _jsx(ModalBody, {
|
|
63
|
+
hasPadding: !noContentPadding,
|
|
64
|
+
column: column,
|
|
65
|
+
children: children
|
|
66
|
+
}), _jsx(ModalActionsContainer, {
|
|
67
|
+
actions: actions
|
|
68
|
+
})]
|
|
58
69
|
}));
|
|
59
70
|
};
|
|
60
71
|
export default Modal;
|
package/modal/ModalAction.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ButtonProps } from '@dfds-ui/react-components';
|
|
3
|
-
export
|
|
4
|
-
export
|
|
3
|
+
export type ModalActionVariation = 'primary' | 'secondary';
|
|
4
|
+
export type ModalActionProps = {
|
|
5
5
|
actionVariation?: ModalActionVariation;
|
|
6
6
|
onClick?: () => void;
|
|
7
7
|
/**
|
package/modal/ModalAction.js
CHANGED
|
@@ -1,13 +1,18 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
1
2
|
var _excluded = ["actionVariation"];
|
|
2
|
-
function
|
|
3
|
-
function
|
|
4
|
-
function
|
|
3
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
6
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
7
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
8
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
9
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
5
10
|
import React from 'react';
|
|
6
11
|
import { css } from '@emotion/react';
|
|
7
12
|
import { theme } from '@dfds-ui/theme';
|
|
8
13
|
import { typography } from '@dfds-ui/typography';
|
|
9
14
|
import { Button } from '@dfds-ui/react-components';
|
|
10
|
-
import { jsx as
|
|
15
|
+
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
11
16
|
var getVariationStyle = function getVariationStyle(actionVariation) {
|
|
12
17
|
if (actionVariation === 'primary') {
|
|
13
18
|
return /*#__PURE__*/css("color:", theme.colors.text.light.primary, ";background:", theme.colors.secondary.main, ";margin-right:", theme.spacing.s, ";&:hover{color:", theme.colors.text.light.primary, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:getVariationStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9tb2RhbC9Nb2RhbEFjdGlvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUJjIiwiZmlsZSI6Ii4uLy4uL3NyYy9tb2RhbC9Nb2RhbEFjdGlvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSAnQGRmZHMtdWkvdGhlbWUnXG5pbXBvcnQgeyB0eXBvZ3JhcGh5IH0gZnJvbSAnQGRmZHMtdWkvdHlwb2dyYXBoeSdcbmltcG9ydCB7IEJ1dHRvbiwgQnV0dG9uUHJvcHMgfSBmcm9tICdAZGZkcy11aS9yZWFjdC1jb21wb25lbnRzJ1xuXG5leHBvcnQgdHlwZSBNb2RhbEFjdGlvblZhcmlhdGlvbiA9ICdwcmltYXJ5JyB8ICdzZWNvbmRhcnknXG5cbmV4cG9ydCB0eXBlIE1vZGFsQWN0aW9uUHJvcHMgPSB7XG4gIGFjdGlvblZhcmlhdGlvbj86IE1vZGFsQWN0aW9uVmFyaWF0aW9uXG4gIG9uQ2xpY2s/OiAoKSA9PiB2b2lkXG4gIC8qKlxuICAgKiBDbGFzcyBuYW1lIHRvIGJlIGFzc2lnbmVkIHRvIHRoZSBidXR0b25cbiAgICovXG4gIGNsYXNzTmFtZT86IHN0cmluZ1xuICAvKipcbiAgICogSFRNTCB0YWcgb3IgY3VzdG9tIGNvbXBvbmVudCBiZWluZyByZW5kZXJlZFxuICAgKi9cbiAgYXM/OiBSZWFjdC5FbGVtZW50VHlwZVxufSAmIE9taXQ8QnV0dG9uUHJvcHMsICd2YXJpYXRpb24nPlxuXG5jb25zdCBnZXRWYXJpYXRpb25TdHlsZSA9IChhY3Rpb25WYXJpYXRpb246IE1vZGFsQWN0aW9uVmFyaWF0aW9uKSA9PiB7XG4gIGlmIChhY3Rpb25WYXJpYXRpb24gPT09ICdwcmltYXJ5Jykge1xuICAgIHJldHVybiBjc3NgXG4gICAgICBjb2xvcjogJHt0aGVtZS5jb2xvcnMudGV4dC5saWdodC5wcmltYXJ5fTtcbiAgICAgIGJhY2tncm91bmQ6ICR7dGhlbWUuY29sb3JzLnNlY29uZGFyeS5tYWlufTtcbiAgICAgIG1hcmdpbi1yaWdodDogJHt0aGVtZS5zcGFjaW5nLnN9O1xuXG4gICAgICAmOmhvdmVyIHtcbiAgICAgICAgY29sb3I6ICR7dGhlbWUuY29sb3JzLnRleHQubGlnaHQucHJpbWFyeX07XG4gICAgICB9XG4gICAgYFxuICB9IGVsc2Uge1xuICAgIHJldHVybiBjc3NgXG4gICAgICBib3JkZXI6IDFweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5zZWNvbmRhcnkubWFpbn07XG4gICAgYFxuICB9XG59XG5cbmV4cG9ydCBjb25zdCBNb2RhbEFjdGlvbjogUmVhY3QuRnVuY3Rpb25Db21wb25lbnQ8TW9kYWxBY3Rpb25Qcm9wcz4gPSAoeyBhY3Rpb25WYXJpYXRpb24gPSAncHJpbWFyeScsIC4uLnJlc3QgfSkgPT4ge1xuICByZXR1cm4gKFxuICAgIDxCdXR0b25cbiAgICAgIHZhcmlhdGlvbj1cInRleHRcIlxuICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgJHt0eXBvZ3JhcGh5LmFjdGlvbn07XG4gICAgICAgIGZsZXg6IGF1dG87XG4gICAgICAgIGZsZXgtYmFzaXM6IGF1dG87XG4gICAgICAgIGZsZXgtZ3JvdzogMDtcbiAgICAgICAgbWFyZ2luLWxlZnQ6ICR7dGhlbWUuc3BhY2luZy54c307XG4gICAgICAgIHBhZGRpbmc6IDAgJHt0aGVtZS5zcGFjaW5nLnhzfTtcbiAgICAgICAgJHtnZXRWYXJpYXRpb25TdHlsZShhY3Rpb25WYXJpYXRpb24pfVxuICAgICAgYH1cbiAgICAgIHsuLi5yZXN0fVxuICAgIC8+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgTW9kYWxBY3Rpb25cbiJdfQ== */");
|
|
@@ -19,7 +24,7 @@ export var ModalAction = function ModalAction(_ref) {
|
|
|
19
24
|
var _ref$actionVariation = _ref.actionVariation,
|
|
20
25
|
actionVariation = _ref$actionVariation === void 0 ? 'primary' : _ref$actionVariation,
|
|
21
26
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
22
|
-
return
|
|
27
|
+
return _jsx(Button, _objectSpread({
|
|
23
28
|
variation: "text",
|
|
24
29
|
type: "button",
|
|
25
30
|
css: /*#__PURE__*/css(typography.action, ";flex:auto;flex-basis:auto;flex-grow:0;margin-left:", theme.spacing.xs, ";padding:0 ", theme.spacing.xs, ";", getVariationStyle(actionVariation), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:ModalAction;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9tb2RhbC9Nb2RhbEFjdGlvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNENjIiwiZmlsZSI6Ii4uLy4uL3NyYy9tb2RhbC9Nb2RhbEFjdGlvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSAnQGRmZHMtdWkvdGhlbWUnXG5pbXBvcnQgeyB0eXBvZ3JhcGh5IH0gZnJvbSAnQGRmZHMtdWkvdHlwb2dyYXBoeSdcbmltcG9ydCB7IEJ1dHRvbiwgQnV0dG9uUHJvcHMgfSBmcm9tICdAZGZkcy11aS9yZWFjdC1jb21wb25lbnRzJ1xuXG5leHBvcnQgdHlwZSBNb2RhbEFjdGlvblZhcmlhdGlvbiA9ICdwcmltYXJ5JyB8ICdzZWNvbmRhcnknXG5cbmV4cG9ydCB0eXBlIE1vZGFsQWN0aW9uUHJvcHMgPSB7XG4gIGFjdGlvblZhcmlhdGlvbj86IE1vZGFsQWN0aW9uVmFyaWF0aW9uXG4gIG9uQ2xpY2s/OiAoKSA9PiB2b2lkXG4gIC8qKlxuICAgKiBDbGFzcyBuYW1lIHRvIGJlIGFzc2lnbmVkIHRvIHRoZSBidXR0b25cbiAgICovXG4gIGNsYXNzTmFtZT86IHN0cmluZ1xuICAvKipcbiAgICogSFRNTCB0YWcgb3IgY3VzdG9tIGNvbXBvbmVudCBiZWluZyByZW5kZXJlZFxuICAgKi9cbiAgYXM/OiBSZWFjdC5FbGVtZW50VHlwZVxufSAmIE9taXQ8QnV0dG9uUHJvcHMsICd2YXJpYXRpb24nPlxuXG5jb25zdCBnZXRWYXJpYXRpb25TdHlsZSA9IChhY3Rpb25WYXJpYXRpb246IE1vZGFsQWN0aW9uVmFyaWF0aW9uKSA9PiB7XG4gIGlmIChhY3Rpb25WYXJpYXRpb24gPT09ICdwcmltYXJ5Jykge1xuICAgIHJldHVybiBjc3NgXG4gICAgICBjb2xvcjogJHt0aGVtZS5jb2xvcnMudGV4dC5saWdodC5wcmltYXJ5fTtcbiAgICAgIGJhY2tncm91bmQ6ICR7dGhlbWUuY29sb3JzLnNlY29uZGFyeS5tYWlufTtcbiAgICAgIG1hcmdpbi1yaWdodDogJHt0aGVtZS5zcGFjaW5nLnN9O1xuXG4gICAgICAmOmhvdmVyIHtcbiAgICAgICAgY29sb3I6ICR7dGhlbWUuY29sb3JzLnRleHQubGlnaHQucHJpbWFyeX07XG4gICAgICB9XG4gICAgYFxuICB9IGVsc2Uge1xuICAgIHJldHVybiBjc3NgXG4gICAgICBib3JkZXI6IDFweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5zZWNvbmRhcnkubWFpbn07XG4gICAgYFxuICB9XG59XG5cbmV4cG9ydCBjb25zdCBNb2RhbEFjdGlvbjogUmVhY3QuRnVuY3Rpb25Db21wb25lbnQ8TW9kYWxBY3Rpb25Qcm9wcz4gPSAoeyBhY3Rpb25WYXJpYXRpb24gPSAncHJpbWFyeScsIC4uLnJlc3QgfSkgPT4ge1xuICByZXR1cm4gKFxuICAgIDxCdXR0b25cbiAgICAgIHZhcmlhdGlvbj1cInRleHRcIlxuICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgJHt0eXBvZ3JhcGh5LmFjdGlvbn07XG4gICAgICAgIGZsZXg6IGF1dG87XG4gICAgICAgIGZsZXgtYmFzaXM6IGF1dG87XG4gICAgICAgIGZsZXgtZ3JvdzogMDtcbiAgICAgICAgbWFyZ2luLWxlZnQ6ICR7dGhlbWUuc3BhY2luZy54c307XG4gICAgICAgIHBhZGRpbmc6IDAgJHt0aGVtZS5zcGFjaW5nLnhzfTtcbiAgICAgICAgJHtnZXRWYXJpYXRpb25TdHlsZShhY3Rpb25WYXJpYXRpb24pfVxuICAgICAgYH1cbiAgICAgIHsuLi5yZXN0fVxuICAgIC8+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgTW9kYWxBY3Rpb25cbiJdfQ== */")
|
|
@@ -1,19 +1,28 @@
|
|
|
1
1
|
var _excluded = ["actions"];
|
|
2
|
-
function
|
|
3
|
-
function
|
|
4
|
-
function
|
|
2
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
3
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
4
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
5
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
6
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
7
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
8
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
9
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
5
10
|
import React from 'react';
|
|
6
11
|
import { theme } from '@dfds-ui/theme';
|
|
7
12
|
import { css } from '@emotion/react';
|
|
8
|
-
import { jsx as
|
|
13
|
+
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
9
14
|
var ModalAction = function ModalAction(props) {
|
|
10
|
-
return
|
|
11
|
-
css: /*#__PURE__*/css("display:flex;flex-wrap:nowrap;justify-content:flex-end;flex-grow:1;padding-top:", theme.spacing.s, ";padding-bottom:", theme.spacing.s, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:ModalAction;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
15
|
+
return _jsx("div", _objectSpread({
|
|
16
|
+
css: /*#__PURE__*/css("display:flex;flex-wrap:nowrap;justify-content:flex-end;flex-grow:1;padding-top:", theme.spacing.s, ";padding-bottom:", theme.spacing.s, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:ModalAction;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9tb2RhbC9Nb2RhbEFjdGlvbnNDb250YWluZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWNjIiwiZmlsZSI6Ii4uLy4uL3NyYy9tb2RhbC9Nb2RhbEFjdGlvbnNDb250YWluZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tICdAZGZkcy11aS90aGVtZSdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuXG5leHBvcnQgdHlwZSBNb2RhbEFjdGlvbnNQcm9wcyA9IHtcbiAgLyoqXG4gICAqIEFjdGlvbnMgdG8gYmUgZGlzcGxheWVkIGF0IHRoZSBib3R0b20gb2YgdGhlIG1vZGFsXG4gICAqL1xuICBhY3Rpb25zPzogUmVhY3QuUmVhY3ROb2RlXG59XG5cbmNvbnN0IE1vZGFsQWN0aW9uOiBSZWFjdC5GdW5jdGlvbkNvbXBvbmVudDx7IGNoaWxkcmVuPzogUmVhY3QuUmVhY3ROb2RlOyBjbGFzc05hbWU/OiBzdHJpbmcgfT4gPSAocHJvcHMpID0+IHtcbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgZmxleC13cmFwOiBub3dyYXA7XG4gICAgICAgIGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7XG4gICAgICAgIGZsZXgtZ3JvdzogMTtcbiAgICAgICAgcGFkZGluZy10b3A6ICR7dGhlbWUuc3BhY2luZy5zfTtcbiAgICAgICAgcGFkZGluZy1ib3R0b206ICR7dGhlbWUuc3BhY2luZy5zfTtcbiAgICAgIGB9XG4gICAgICB7Li4ucHJvcHN9XG4gICAgLz5cbiAgKVxufVxuXG5jb25zdCBNb2RhbEFjdGlvbnNDb250YWluZXI6IFJlYWN0LkZ1bmN0aW9uQ29tcG9uZW50PE1vZGFsQWN0aW9uc1Byb3BzPiA9ICh7IGFjdGlvbnMsIC4uLnJlc3QgfSkgPT4ge1xuICByZXR1cm4gPGRpdiB7Li4ucmVzdH0+e2FjdGlvbnMgJiYgPE1vZGFsQWN0aW9uPnthY3Rpb25zfTwvTW9kYWxBY3Rpb24+fTwvZGl2PlxufVxuXG5leHBvcnQgZGVmYXVsdCBNb2RhbEFjdGlvbnNDb250YWluZXJcbiJdfQ== */")
|
|
12
17
|
}, props));
|
|
13
18
|
};
|
|
14
19
|
var ModalActionsContainer = function ModalActionsContainer(_ref) {
|
|
15
20
|
var actions = _ref.actions,
|
|
16
21
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
17
|
-
return
|
|
22
|
+
return _jsx("div", _objectSpread(_objectSpread({}, rest), {}, {
|
|
23
|
+
children: actions && _jsx(ModalAction, {
|
|
24
|
+
children: actions
|
|
25
|
+
})
|
|
26
|
+
}));
|
|
18
27
|
};
|
|
19
28
|
export default ModalActionsContainer;
|
package/modal/ModalBody.d.ts
CHANGED
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
export declare type ModalBodyProps = {
|
|
1
|
+
export type ModalBodyProps = {
|
|
3
2
|
hasPadding?: boolean;
|
|
4
3
|
column?: boolean;
|
|
5
4
|
};
|
|
6
5
|
export declare const ModalBody: import("@emotion/styled").StyledComponent<{
|
|
7
|
-
theme?: import("@emotion/react").Theme
|
|
8
|
-
as?:
|
|
6
|
+
theme?: import("@emotion/react").Theme;
|
|
7
|
+
as?: React.ElementType;
|
|
9
8
|
} & ModalBodyProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
10
9
|
export default ModalBody;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { IconButtonSize } from '@dfds-ui/react-components';
|
|
3
|
-
export
|
|
3
|
+
export type ModalCloseButtonProps = {
|
|
4
4
|
onRequestClose?: () => void;
|
|
5
5
|
className?: string;
|
|
6
6
|
icon?: React.ElementType;
|
|
@@ -9,5 +9,5 @@ export declare type ModalCloseButtonProps = {
|
|
|
9
9
|
closeLabel?: string;
|
|
10
10
|
children?: React.ReactNode;
|
|
11
11
|
};
|
|
12
|
-
export declare const ModalCloseButton: ({ onRequestClose, className, icon, size, closeLabel, ...rest }: ModalCloseButtonProps) => JSX.Element;
|
|
12
|
+
export declare const ModalCloseButton: ({ onRequestClose, className, icon, size, closeLabel, ...rest }: ModalCloseButtonProps) => React.JSX.Element;
|
|
13
13
|
export default ModalCloseButton;
|
|
@@ -1,13 +1,18 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
1
2
|
var _excluded = ["onRequestClose", "className", "icon", "size", "closeLabel"];
|
|
2
|
-
function
|
|
3
|
-
function
|
|
4
|
-
function
|
|
3
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
6
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
7
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
8
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
9
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
5
10
|
import React from 'react';
|
|
6
11
|
import { IconButton } from '@dfds-ui/react-components';
|
|
7
12
|
import { Close } from '@dfds-ui/icons/system';
|
|
8
13
|
import { css } from '@emotion/react';
|
|
9
14
|
import { theme } from '@dfds-ui/theme';
|
|
10
|
-
import { jsx as
|
|
15
|
+
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
11
16
|
export var ModalCloseButton = function ModalCloseButton(_ref) {
|
|
12
17
|
var onRequestClose = _ref.onRequestClose,
|
|
13
18
|
className = _ref.className,
|
|
@@ -18,7 +23,7 @@ export var ModalCloseButton = function ModalCloseButton(_ref) {
|
|
|
18
23
|
_ref$closeLabel = _ref.closeLabel,
|
|
19
24
|
closeLabel = _ref$closeLabel === void 0 ? 'Close' : _ref$closeLabel,
|
|
20
25
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
21
|
-
return
|
|
26
|
+
return _jsx(IconButton, _objectSpread({
|
|
22
27
|
disableOverlay: true,
|
|
23
28
|
disableTooltip: true,
|
|
24
29
|
hoverColor: theme.colors.secondary.main,
|
package/modal/ModalDialog.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { theme } from '@dfds-ui/theme';
|
|
3
|
-
export
|
|
4
|
-
export
|
|
5
|
-
export
|
|
6
|
-
export
|
|
7
|
-
export
|
|
3
|
+
export type ModalVariation = 'default' | 'fullscreen';
|
|
4
|
+
export type ModalSizes = Record<keyof typeof theme.breakpoints, string>;
|
|
5
|
+
export type Backdrop = keyof typeof backdropsTransparent;
|
|
6
|
+
export type BackdropVariant = 'transparent' | 'solid';
|
|
7
|
+
export type ModalDialogProps = {
|
|
8
8
|
isOpen: boolean;
|
|
9
9
|
onRequestClose?: () => void;
|
|
10
10
|
shouldCloseOnOverlayClick?: boolean;
|
|
@@ -35,8 +35,8 @@ export declare const defaultProps: {
|
|
|
35
35
|
};
|
|
36
36
|
zIndex: number;
|
|
37
37
|
renderWhenClosed: boolean;
|
|
38
|
-
backdrop:
|
|
38
|
+
backdrop: Backdrop;
|
|
39
39
|
backdropVariant: BackdropVariant;
|
|
40
40
|
};
|
|
41
|
-
declare const ModalDialog: ({ isOpen, onRequestClose, shouldCloseOnOverlayClick, shouldCloseOnEsc, variation, zIndex, className, sizes, fixedTopPosition, renderWhenClosed, backdrop, backdropVariant, children, ...rest }: ModalDialogProps) => JSX.Element | null;
|
|
41
|
+
declare const ModalDialog: ({ isOpen, onRequestClose, shouldCloseOnOverlayClick, shouldCloseOnEsc, variation, zIndex, className, sizes, fixedTopPosition, renderWhenClosed, backdrop, backdropVariant, children, ...rest }: ModalDialogProps) => React.JSX.Element | null;
|
|
42
42
|
export default ModalDialog;
|