@dhis2-ui/modal 9.10.3 → 9.11.1-beta.1

package/build/cjs/modal/{modal.stories.js → modal.prod.stories.js}

@@ -4,47 +4,58 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.TopScrollable = exports.SmallTitleContentAction = exports.SmallLongTitle = exports.SmallDestructivePrimary = exports.SmallContentPrimary = exports.SmallClickableScreenCover = exports.RTL = exports.ModalThatHidesWithStatefulComponens = exports.MiddleScrollable = exports.MediumTitleContentAction = exports.LargeWithSelectComponent = exports.LargeTitleContentPrimary = exports.LargeModalWithMoreNestedModals = exports.FluidTop = exports.FluidTitleContentPrimary = exports.FluidMiddle = exports.FluidBottom = exports.DefaultContent = exports.BottomScrollable = exports.AlignmentMiddle = exports.AlignmentBottom = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
+var _uiConstants = require("@dhis2/ui-constants");
 var _box = require("@dhis2-ui/box");
-
 var _button = require("@dhis2-ui/button");
-
 var _menu = require("@dhis2-ui/menu");
-
 var _select = require("@dhis2-ui/select");
-
 var _tooltip = require("@dhis2-ui/tooltip");
+var _react = _interopRequireWildcard(require("react"));
+var _index = require("../index.js");
+var _modal = require("./modal.js");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const description = `
+_**Note**: For performance reasons, only one representative example is shown here. For more (interactive) examples, see individual stories in the Canvas tab._
 
-var _uiConstants = require("@dhis2/ui-constants");
+A modal focuses user attention on a single task or piece of information inside a container. A modal blocks the rest of the application until it is dismissed.
 
-var _react = _interopRequireWildcard(require("react"));
+#### Usage
 
-var _index = require("../index.js");
+A modal should be used to focus user attention on a single task or piece of information. Modals take over the entire screen and should be used sparingly to avoid interrupting a user's flow too often.
 
-var _modal = require("./modal.js");
+Use a modal in the following cases:
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+- to collect short, focussed user input that is blocking progress
+- to present critical information that a user needs to acknowledge before continuing
+- to ask the user to confirm a destructive action that cannot be undone
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+Do not use a modal in the following cases:
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+- to display unrelated or non-critical information; use an alert bar or a notice box instead
+- to display complex, workflows that span multiple screens; navigate to a new, full page in the app instead
 
-const description = "\n_**Note**: For performance reasons, only one representative example is shown here. For more (interactive) examples, see individual stories in the Canvas tab._\n\nA modal focuses user attention on a single task or piece of information inside a container. A modal blocks the rest of the application until it is dismissed.\n\n#### Usage\n\nA modal should be used to focus user attention on a single task or piece of information. Modals take over the entire screen and should be used sparingly to avoid interrupting a user's flow too often.\n\nUse a modal in the following cases:\n\n- to collect short, focussed user input that is blocking progress\n- to present critical information that a user needs to acknowledge before continuing\n- to ask the user to confirm a destructive action that cannot be undone\n\nDo not use a modal in the following cases:\n\n- to display unrelated or non-critical information; use an alert bar or a notice box instead\n- to display complex, workflows that span multiple screens; navigate to a new, full page in the app instead\n\n#### Children\n\nModals should be used with children `<ModalTitle>` (optional), `<ModalContent>` (required), and `<ModalActions>` (recommended)\n\nSee more about modal usage, including alignment and sizing, at [Design System: Modals](https://github.com/dhis2/design-system/blob/master/molecules/modal.md#usage).\n\n```js\nimport { Modal } from '@dhis2/ui'\n```\n";
+#### Children
 
-const say = something => () => alert(something);
+Modals should be used with children \`<ModalTitle>\` (optional), \`<ModalContent>\` (required), and \`<ModalActions>\` (recommended)
 
+See more about modal usage, including alignment and sizing, at [Design System: Modals](https://github.com/dhis2/design-system/blob/master/molecules/modal.md#usage).
+
+\`\`\`js
+import { Modal } from '@dhis2/ui'
+\`\`\`
+`;
+const say = something => () => alert(something);
 window.onClose = (payload, event) => {
   console.log('onClose payload', payload);
   console.log('onClose event', event);
 };
-
 const onClose = function () {
   return window.onClose(...arguments);
 };
-
-var _default = {
+var _default = exports.default = {
   title: 'Modal',
   component: _modal.Modal,
   parameters: {
@@ -52,7 +63,6 @@ var _default = {
       // Use iframes to contain modals in docs page (otherwise chaos ensues)
       inlineStories: false,
       iframeHeight: '500px',
-
       /**
        * Due to iframes being very slow, disable stories on the docs page by default and
        * make one representative story as the primary ('SmallTitleContentAction')
@@ -64,42 +74,37 @@ var _default = {
     }
   },
   argTypes: {
-    small: { ..._uiConstants.sharedPropTypes.sizeArgType
+    small: {
+      ..._uiConstants.sharedPropTypes.sizeArgType
     },
-    large: { ..._uiConstants.sharedPropTypes.sizeArgType
+    large: {
+      ..._uiConstants.sharedPropTypes.sizeArgType
     },
-    position: { ..._uiConstants.sharedPropTypes.insideAlignmentArgType
+    position: {
+      ..._uiConstants.sharedPropTypes.insideAlignmentArgType
     }
   }
 };
-exports.default = _default;
-
 const DefaultContent = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."));
-
 exports.DefaultContent = DefaultContent;
 DefaultContent.args = {
   onClose: onClose
 };
 DefaultContent.storyName = 'Default: Content';
-
 const AlignmentMiddle = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."));
-
 exports.AlignmentMiddle = AlignmentMiddle;
 AlignmentMiddle.args = {
   onClose,
   position: 'middle'
 };
 AlignmentMiddle.storyName = 'Alignment: Middle';
-
 const AlignmentBottom = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."));
-
 exports.AlignmentBottom = AlignmentBottom;
 AlignmentBottom.args = {
   onClose,
   position: 'bottom'
 };
 AlignmentBottom.storyName = 'Position: Bottom';
-
 const SmallTitleContentAction = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a small modal with title, content and primary action"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -108,9 +113,8 @@ const SmallTitleContentAction = args => /*#__PURE__*/_react.default.createElemen
 }, "Secondary action"), /*#__PURE__*/_react.default.createElement(_button.Button, {
   onClick: say('Button primary'),
   primary: true
-}, "Primary action")))); // Have this be the primary story on the docs page
-
-
+}, "Primary action"))));
+// Have this be the primary story on the docs page
 exports.SmallTitleContentAction = SmallTitleContentAction;
 SmallTitleContentAction.parameters = {
   docs: {
@@ -125,7 +129,6 @@ SmallTitleContentAction.args = {
   onClose
 };
 SmallTitleContentAction.storyName = 'Small: Title, Content, Action';
-
 const MediumTitleContentAction = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a medium modal with title, content and primary action"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -135,10 +138,8 @@ const MediumTitleContentAction = args => /*#__PURE__*/_react.default.createEleme
   onClick: say('Button primary'),
   primary: true
 }, "Primary action"))));
-
 exports.MediumTitleContentAction = MediumTitleContentAction;
 MediumTitleContentAction.storyName = 'Medium: Title, Content, Action';
-
 const LargeTitleContentPrimary = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a large modal with title, content and primary action"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -148,13 +149,11 @@ const LargeTitleContentPrimary = args => /*#__PURE__*/_react.default.createEleme
   onClick: say('Button primary'),
   primary: true
 }, "Primary action"))));
-
 exports.LargeTitleContentPrimary = LargeTitleContentPrimary;
 LargeTitleContentPrimary.args = {
   large: true
 };
 LargeTitleContentPrimary.storyName = 'Large: Title, Content, Primary';
-
 const FluidTitleContentPrimary = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a modal using custom dimensions, with title, content and primary action"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, /*#__PURE__*/_react.default.createElement("div", {
   style: {
     display: 'flex',
@@ -179,14 +178,12 @@ const FluidTitleContentPrimary = args => /*#__PURE__*/_react.default.createEleme
   onClick: say('Button primary'),
   primary: true
 }, "Primary action"))));
-
 exports.FluidTitleContentPrimary = FluidTitleContentPrimary;
 FluidTitleContentPrimary.args = {
   fluid: true,
   position: 'top'
 };
 FluidTitleContentPrimary.storyName = 'Fluid (Custom sizes): Title, Content, Primary';
-
 const SmallContentPrimary = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -196,13 +193,11 @@ const SmallContentPrimary = args => /*#__PURE__*/_react.default.createElement(_m
   onClick: say('Button primary'),
   primary: true
 }, "Primary action"))));
-
 exports.SmallContentPrimary = SmallContentPrimary;
 SmallContentPrimary.args = {
   small: true
 };
 SmallContentPrimary.storyName = 'Small: Content & Primary';
-
 const SmallDestructivePrimary = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -212,13 +207,11 @@ const SmallDestructivePrimary = args => /*#__PURE__*/_react.default.createElemen
   destructive: true,
   onClick: say('Button primary')
 }, "Primary action"))));
-
 exports.SmallDestructivePrimary = SmallDestructivePrimary;
 SmallDestructivePrimary.args = {
   small: true
 };
 SmallDestructivePrimary.storyName = 'Small: Destructive Primary';
-
 const SmallClickableScreenCover = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a modal with clickable screen cover"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -228,7 +221,6 @@ const SmallClickableScreenCover = args => /*#__PURE__*/_react.default.createElem
   primary: true,
   onClick: say('Button primary')
 }, "Primary action"))));
-
 exports.SmallClickableScreenCover = SmallClickableScreenCover;
 SmallClickableScreenCover.args = {
   small: true,
@@ -238,7 +230,6 @@ SmallClickableScreenCover.args = {
   }
 };
 SmallClickableScreenCover.storyName = 'Small: Clickable screen cover';
-
 const TopScrollable = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a modal with scrollable content"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -248,12 +239,11 @@ const TopScrollable = args => /*#__PURE__*/_react.default.createElement(_modal.M
   destructive: true,
   onClick: say('Button primary')
 }, "Primary action"))));
-
 exports.TopScrollable = TopScrollable;
-TopScrollable.args = { ...SmallClickableScreenCover.args
+TopScrollable.args = {
+  ...SmallClickableScreenCover.args
 };
 TopScrollable.storyName = 'Top: scrollable';
-
 const MiddleScrollable = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a modal with scrollable content"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -263,13 +253,12 @@ const MiddleScrollable = args => /*#__PURE__*/_react.default.createElement(_moda
   destructive: true,
   onClick: say('Button primary')
 }, "Primary action"))));
-
 exports.MiddleScrollable = MiddleScrollable;
-MiddleScrollable.args = { ...TopScrollable.args,
+MiddleScrollable.args = {
+  ...TopScrollable.args,
   position: 'middle'
 };
 MiddleScrollable.storyName = 'Middle: scrollable';
-
 const BottomScrollable = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a modal with scrollable content"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -279,13 +268,12 @@ const BottomScrollable = args => /*#__PURE__*/_react.default.createElement(_moda
   destructive: true,
   onClick: say('Button primary')
 }, "Primary action"))));
-
 exports.BottomScrollable = BottomScrollable;
-BottomScrollable.args = { ...TopScrollable.args,
+BottomScrollable.args = {
+  ...TopScrollable.args,
   position: 'bottom'
 };
 BottomScrollable.storyName = 'Bottom: scrollable';
-
 const SmallLongTitle = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This headline should break into multiple lines because it's way too long for one!"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum."), /*#__PURE__*/_react.default.createElement(_index.ModalActions, null, /*#__PURE__*/_react.default.createElement(_button.ButtonStrip, {
   end: true
 }, /*#__PURE__*/_react.default.createElement(_button.Button, {
@@ -295,13 +283,11 @@ const SmallLongTitle = args => /*#__PURE__*/_react.default.createElement(_modal.
   onClick: say('Button primary'),
   primary: true
 }, "Primary action"))));
-
 exports.SmallLongTitle = SmallLongTitle;
 SmallLongTitle.args = {
   small: true
 };
 SmallLongTitle.storyName = 'Small: Long title';
-
 const LargeWithSelectComponent = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "Select opens on top of the Modal"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, /*#__PURE__*/_react.default.createElement(_select.SingleSelect, null, /*#__PURE__*/_react.default.createElement(_select.SingleSelectOption, {
   key: "1",
   value: "1",
@@ -351,13 +337,11 @@ const LargeWithSelectComponent = args => /*#__PURE__*/_react.default.createEleme
   onClick: say('Button primary'),
   primary: true
 }, "Primary action"))));
-
 exports.LargeWithSelectComponent = LargeWithSelectComponent;
 LargeWithSelectComponent.args = {
   large: true
 };
 LargeWithSelectComponent.storyName = 'Large: with Select component';
-
 const LargeModalWithMoreNestedModals = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "Select opens on top of the Modal - Level 1"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, /*#__PURE__*/_react.default.createElement(_select.SingleSelect, null, /*#__PURE__*/_react.default.createElement(_select.SingleSelectOption, {
   key: "1",
   value: "1",
@@ -563,20 +547,17 @@ const LargeModalWithMoreNestedModals = args => /*#__PURE__*/_react.default.creat
   onClick: say('Button primary'),
   primary: true
 }, "Primary action")))));
-
 exports.LargeModalWithMoreNestedModals = LargeModalWithMoreNestedModals;
 LargeModalWithMoreNestedModals.args = {
   large: true
 };
 LargeModalWithMoreNestedModals.storyName = 'Large: modal with more nested modals';
-
 const StatefuleComponent = () => {
   const [counter, setCounter] = (0, _react.useState)(0);
   return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "Current counter: ", counter), /*#__PURE__*/_react.default.createElement("button", {
     onClick: () => setCounter(counter + 1)
   }, "Add 1 to counter"));
 };
-
 const ModalThatHidesWithStatefulComponens = () => {
   const [render, setRender] = (0, _react.useState)(false);
   const [hide, setHide] = (0, _react.useState)(false);
@@ -598,9 +579,7 @@ const ModalThatHidesWithStatefulComponens = () => {
     primary: true
   }, "Hide modal")))));
 };
-
 exports.ModalThatHidesWithStatefulComponens = ModalThatHidesWithStatefulComponens;
-
 const FluidTop = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a modal using custom dimensions, with title, content and primary action"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, /*#__PURE__*/_react.default.createElement(_box.Box, {
   width: "666px",
   height: "666px"
@@ -613,14 +592,12 @@ const FluidTop = args => /*#__PURE__*/_react.default.createElement(_modal.Modal,
   onClick: say('Button primary'),
   primary: true
 }, "Primary action"))));
-
 exports.FluidTop = FluidTop;
 FluidTop.args = {
   fluid: true,
   position: 'top'
 };
 FluidTop.storyName = 'Fluid (Top)';
-
 const FluidMiddle = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a modal using custom dimensions, with title, content and primary action"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, /*#__PURE__*/_react.default.createElement(_box.Box, {
   width: "666px",
   height: "666px"
@@ -633,14 +610,12 @@ const FluidMiddle = args => /*#__PURE__*/_react.default.createElement(_modal.Mod
   onClick: say('Button primary'),
   primary: true
 }, "Primary action"))));
-
 exports.FluidMiddle = FluidMiddle;
 FluidMiddle.args = {
   fluid: true,
   position: 'middle'
 };
 FluidMiddle.storyName = 'Fluid (Middle)';
-
 const FluidBottom = args => /*#__PURE__*/_react.default.createElement(_modal.Modal, args, /*#__PURE__*/_react.default.createElement(_index.ModalTitle, null, "This is a modal using custom dimensions, with title, content and primary action"), /*#__PURE__*/_react.default.createElement(_index.ModalContent, null, /*#__PURE__*/_react.default.createElement(_box.Box, {
   width: "666px",
   height: "666px"
@@ -653,14 +628,12 @@ const FluidBottom = args => /*#__PURE__*/_react.default.createElement(_modal.Mod
   onClick: say('Button primary'),
   primary: true
 }, "Primary action"))));
-
 exports.FluidBottom = FluidBottom;
 FluidBottom.args = {
   fluid: true,
   position: 'bottom'
 };
 FluidBottom.storyName = 'Fluid (Bottom)';
-
 const RTL = args => {
   (0, _react.useEffect)(() => {
     document.body.dir = 'rtl';
@@ -672,7 +645,6 @@ const RTL = args => {
     dir: "rtl"
   }, /*#__PURE__*/_react.default.createElement(SmallTitleContentAction, args));
 };
-
 exports.RTL = RTL;
 RTL.args = {
   small: true,

package/build/cjs/modal/modal.test.js

@@ -1,15 +1,10 @@
 "use strict";
 
 var _react = require("@testing-library/react");
-
 var _react2 = _interopRequireDefault(require("react"));
-
 var _closeButton = require("./close-button.js");
-
 var _modal = require("./modal.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 describe('Modal', () => {
   describe('Modal Accessibility', () => {
     it('closes when ESC key is pressed', () => {
@@ -17,14 +12,11 @@ describe('Modal', () => {
       (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_modal.Modal, {
         onClose: onCloseMock
       }));
-
       const modalElement = _react.screen.getByRole('dialog');
-
       _react.fireEvent.keyDown(modalElement, {
         key: 'Escape',
         code: 'Escape'
       });
-
       expect(onCloseMock).toHaveBeenCalled();
     });
     it('does not close when "Enter" is pressed', () => {
@@ -32,14 +24,11 @@ describe('Modal', () => {
       (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_modal.Modal, {
         onClose: onCloseMock
       }));
-
       const modalElement = _react.screen.getByRole('dialog');
-
       _react.fireEvent.keyDown(modalElement, {
         key: 'Enter',
         code: 'Enter'
       });
-
       expect(onCloseMock).not.toHaveBeenCalled();
     });
     it('does not close when "SpaceBar" is pressed', () => {
@@ -47,14 +36,11 @@ describe('Modal', () => {
       (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_modal.Modal, {
         onClose: onCloseMock
       }));
-
       const modalElement = _react.screen.getByRole('dialog');
-
       _react.fireEvent.keyDown(modalElement, {
         key: ' ',
         code: ' '
       });
-
       expect(onCloseMock).not.toHaveBeenCalled();
     });
     it('has a close button with proper accessibility attributes', async () => {
@@ -67,9 +53,7 @@ describe('Modal', () => {
   describe('Regular dimensions', () => {
     it('has the correct dimension styles in its default state', () => {
       (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_modal.Modal, null));
-
       const modalEl = _react.screen.getByRole('dialog');
-
       const style = window.getComputedStyle(modalEl);
       expect(style.height).toBe('auto');
       expect(style.maxHeight).toBe('calc(100vh - 128px)');
@@ -80,9 +64,7 @@ describe('Modal', () => {
       (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_modal.Modal, {
         small: true
       }));
-
       const modalEl = _react.screen.getByRole('dialog');
-
       const style = window.getComputedStyle(modalEl);
       expect(style.height).toBe('auto');
       expect(style.maxHeight).toBe('calc(100vh - 128px)');
@@ -93,9 +75,7 @@ describe('Modal', () => {
       (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_modal.Modal, {
         large: true
       }));
-
       const modalEl = _react.screen.getByRole('dialog');
-
       const style = window.getComputedStyle(modalEl);
       expect(style.height).toBe('auto');
       expect(style.maxHeight).toBe('calc(100vh - 128px)');
@@ -106,9 +86,7 @@ describe('Modal', () => {
       (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_modal.Modal, {
         fluid: true
       }));
-
       const modalEl = _react.screen.getByRole('dialog');
-
       const style = window.getComputedStyle(modalEl);
       expect(style.height).toBe('auto');
       expect(style.maxHeight).toBe('calc(100vh - 128px)');

package/build/cjs/modal-actions/features/accepts_children/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
-
 (0, _cypressCucumberPreprocessor.Given)('a ModalActions with children is rendered', () => {
   cy.visitStory('ModalActions', 'With children');
   cy.get('[data-test="dhis2-uicore-modalactions"]').should('be.visible');

package/build/cjs/modal-actions/index.js

@@ -9,5 +9,4 @@ Object.defineProperty(exports, "ModalActions", {
     return _modalActions.ModalActions;
   }
 });
-
 var _modalActions = require("./modal-actions.js");

package/build/cjs/modal-actions/modal-actions.e2e.stories.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.WithChildren = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _modalActions = require("./modal-actions.js");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = {
+  title: 'ModalActions'
+};
+const WithChildren = () => /*#__PURE__*/_react.default.createElement(_modalActions.ModalActions, null, "I am a child");
+exports.WithChildren = WithChildren;

package/build/cjs/modal-actions/modal-actions.js

@@ -4,17 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ModalActions = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _uiConstants = require("@dhis2/ui-constants");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const ModalActions = _ref => {
   let {
     children,
@@ -26,9 +20,8 @@ const ModalActions = _ref => {
   }, children, /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "2674552674",
     dynamic: [_uiConstants.spacers.dp16]
-  }, ["div.__jsx-style-dynamic-selector{-webkit-order:3;-ms-flex-order:3;order:3;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end;margin:".concat(_uiConstants.spacers.dp16, " 0 0;}")]));
+  }, [`div.__jsx-style-dynamic-selector{-webkit-order:3;-ms-flex-order:3;order:3;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end;margin:${_uiConstants.spacers.dp16} 0 0;}`]));
 };
-
 exports.ModalActions = ModalActions;
 ModalActions.defaultProps = {
   dataTest: 'dhis2-uicore-modalactions'

package/build/cjs/modal-content/features/accepts_children/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
-
 (0, _cypressCucumberPreprocessor.Given)('a ModalContent with children is rendered', () => {
   cy.visitStory('ModalContent', 'With children');
   cy.get('[data-test="dhis2-uicore-modalcontent"]').should('be.visible');

package/build/cjs/modal-content/index.js

@@ -9,5 +9,4 @@ Object.defineProperty(exports, "ModalContent", {
     return _modalContent.ModalContent;
   }
 });
-
 var _modalContent = require("./modal-content.js");

package/build/cjs/modal-content/modal-content.e2e.stories.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.WithChildren = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _modalContent = require("./modal-content.js");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = {
+  title: 'ModalContent'
+};
+const WithChildren = () => /*#__PURE__*/_react.default.createElement(_modalContent.ModalContent, null, "I am a child");
+exports.WithChildren = WithChildren;

package/build/cjs/modal-content/modal-content.js

@@ -4,15 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ModalContent = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const ModalContent = _ref => {
   let {
     children,
@@ -26,7 +21,6 @@ const ModalContent = _ref => {
     id: "3719215021"
   }, ["div.jsx-3719215021{-webkit-order:2;-ms-flex-order:2;order:2;-webkit-box-flex:2;-webkit-flex-grow:2;-ms-flex-positive:2;flex-grow:2;overflow-y:auto;}"]));
 };
-
 exports.ModalContent = ModalContent;
 ModalContent.defaultProps = {
   dataTest: 'dhis2-uicore-modalcontent'