@eccenca/gui-elements 6.3.0 → 22.0.0-rc.6

package/dist/components/Card/CardTitle.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _OverviewItemLine = _interopRequireDefault(require("./../OverviewItem/OverviewItemLine"));
+
+var _constants = require("../../configuration/constants");
+
+;
+/**
+ * Display a card title, can include other markup like `h2`, `h3` and so on to define document structure.
+ */
+
+function CardTitle({
+  children,
+  className = '',
+  narrowed = false,
+  ...otherProps
+}) {
+  return /*#__PURE__*/_react.default.createElement(_OverviewItemLine.default, (0, _extends2.default)({}, otherProps, {
+    className: `${_constants.CLASSPREFIX}-card__title ` + className,
+    large: !narrowed
+  }), children);
+}
+
+;
+var _default = CardTitle;
+exports.default = _default;

package/dist/components/Card/CardTitle.jsx

@@ -0,0 +1,26 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import OverviewItemLine from './../OverviewItem/OverviewItemLine';
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+;
+/**
+ * Display a card title, can include other markup like `h2`, `h3` and so on to define document structure.
+ */
+function CardTitle(_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.narrowed, narrowed = _c === void 0 ? false : _c, otherProps = __rest(_a, ["children", "className", "narrowed"]);
+    return (<OverviewItemLine {...otherProps} className={eccgui + "-card__title " + className} large={!narrowed}>
+            {children}
+        </OverviewItemLine>);
+}
+;
+export default CardTitle;

package/dist/components/Card/index.d.ts

@@ -0,0 +1,8 @@
+import Card from './Card';
+import CardHeader from './CardHeader';
+import CardTitle from './CardTitle';
+import CardOptions from './CardOptions';
+import CardContent from './CardContent';
+import CardActions from './CardActions';
+import CardActionsAux from './CardActionsAux';
+export { Card, CardHeader, CardTitle, CardOptions, CardContent, CardActions, CardActionsAux, };

package/dist/components/Card/index.js

@@ -0,0 +1,63 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Card", {
+  enumerable: true,
+  get: function () {
+    return _Card.default;
+  }
+});
+Object.defineProperty(exports, "CardActions", {
+  enumerable: true,
+  get: function () {
+    return _CardActions.default;
+  }
+});
+Object.defineProperty(exports, "CardActionsAux", {
+  enumerable: true,
+  get: function () {
+    return _CardActionsAux.default;
+  }
+});
+Object.defineProperty(exports, "CardContent", {
+  enumerable: true,
+  get: function () {
+    return _CardContent.default;
+  }
+});
+Object.defineProperty(exports, "CardHeader", {
+  enumerable: true,
+  get: function () {
+    return _CardHeader.default;
+  }
+});
+Object.defineProperty(exports, "CardOptions", {
+  enumerable: true,
+  get: function () {
+    return _CardOptions.default;
+  }
+});
+Object.defineProperty(exports, "CardTitle", {
+  enumerable: true,
+  get: function () {
+    return _CardTitle.default;
+  }
+});
+
+var _Card = _interopRequireDefault(require("./Card"));
+
+var _CardHeader = _interopRequireDefault(require("./CardHeader"));
+
+var _CardTitle = _interopRequireDefault(require("./CardTitle"));
+
+var _CardOptions = _interopRequireDefault(require("./CardOptions"));
+
+var _CardContent = _interopRequireDefault(require("./CardContent"));
+
+var _CardActions = _interopRequireDefault(require("./CardActions"));
+
+var _CardActionsAux = _interopRequireDefault(require("./CardActionsAux"));

package/dist/components/Card/index.jsx

@@ -0,0 +1,8 @@
+import Card from './Card';
+import CardHeader from './CardHeader';
+import CardTitle from './CardTitle';
+import CardOptions from './CardOptions';
+import CardContent from './CardContent';
+import CardActions from './CardActions';
+import CardActionsAux from './CardActionsAux';
+export { Card, CardHeader, CardTitle, CardOptions, CardContent, CardActions, CardActionsAux, };

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function Checkbox({ children, className, ...restProps }: any): JSX.Element;
+export default Checkbox;

package/dist/components/Checkbox/Checkbox.js

@@ -0,0 +1,30 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _core = require("@blueprintjs/core");
+
+var _constants = require("../../configuration/constants");
+
+function Checkbox({
+  children,
+  className = '',
+  ...restProps
+}) {
+  return /*#__PURE__*/_react.default.createElement(_core.Checkbox, (0, _extends2.default)({}, restProps, {
+    className: `${_constants.CLASSPREFIX}-checkbox ` + className
+  }), children);
+}
+
+;
+var _default = Checkbox;
+exports.default = _default;

package/dist/components/Checkbox/Checkbox.jsx

@@ -0,0 +1,22 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { Checkbox as BlueprintCheckbox } from "@blueprintjs/core";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+function Checkbox(_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b, restProps = __rest(_a, ["children", "className"]);
+    return (<BlueprintCheckbox {...restProps} className={eccgui + "-checkbox " + className}>
+            {children}
+        </BlueprintCheckbox>);
+}
+;
+export default Checkbox;

package/dist/components/ContextOverlay/ContextMenu.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function ContextMenu({ children, className, togglerElement, togglerText, togglerLarge, tooltipAsTitle, ...restProps }: any): JSX.Element;
+export default ContextMenu;

package/dist/components/ContextOverlay/ContextMenu.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _constants = require("../../configuration/constants");
+
+var _ContextOverlay = _interopRequireDefault(require("./ContextOverlay"));
+
+var _Menu = _interopRequireDefault(require("../Menu/Menu"));
+
+var _IconButton = _interopRequireDefault(require("../Icon/IconButton"));
+
+function ContextMenu({
+  children,
+  className = "",
+  togglerElement = "item-moremenu",
+  togglerText = "Show more options",
+  togglerLarge = false,
+
+  /* FIXME: The Tooltip component can interfere with the opened menu, since it is implemented via portal and may cover the menu,
+            so by default we use the title attribute instead of Tooltip. */
+  tooltipAsTitle = true,
+  ...restProps
+}) {
+  return /*#__PURE__*/_react.default.createElement(_ContextOverlay.default, (0, _extends2.default)({}, restProps, {
+    className: `${_constants.CLASSPREFIX}-contextmenu ` + className
+  }), typeof togglerElement === "string" ? /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+    tooltipAsTitle: tooltipAsTitle,
+    name: togglerElement,
+    text: togglerText,
+    large: togglerLarge,
+    "data-test-id": restProps["data-test-id"]
+  }) : {
+    togglerElement
+  }, /*#__PURE__*/_react.default.createElement(_Menu.default, null, children));
+}
+
+var _default = ContextMenu;
+exports.default = _default;

package/dist/components/ContextOverlay/ContextMenu.jsx

@@ -0,0 +1,30 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from "react";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+import ContextOverlay from "./ContextOverlay";
+import Menu from "../Menu/Menu";
+import IconButton from "../Icon/IconButton";
+function ContextMenu(_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? "" : _b, _c = _a.togglerElement, togglerElement = _c === void 0 ? "item-moremenu" : _c, _d = _a.togglerText, togglerText = _d === void 0 ? "Show more options" : _d, _e = _a.togglerLarge, togglerLarge = _e === void 0 ? false : _e, 
+    /* FIXME: The Tooltip component can interfere with the opened menu, since it is implemented via portal and may cover the menu,
+              so by default we use the title attribute instead of Tooltip. */
+    _f = _a.tooltipAsTitle, 
+    /* FIXME: The Tooltip component can interfere with the opened menu, since it is implemented via portal and may cover the menu,
+              so by default we use the title attribute instead of Tooltip. */
+    tooltipAsTitle = _f === void 0 ? true : _f, restProps = __rest(_a, ["children", "className", "togglerElement", "togglerText", "togglerLarge", "tooltipAsTitle"]);
+    return (<ContextOverlay {...restProps} className={eccgui + "-contextmenu " + className}>
+            {typeof togglerElement === "string" ? (<IconButton tooltipAsTitle={tooltipAsTitle} name={togglerElement} text={togglerText} large={togglerLarge} data-test-id={restProps["data-test-id"]}/>) : ({ togglerElement: togglerElement })}
+            <Menu>{children}</Menu>
+        </ContextOverlay>);
+}
+export default ContextMenu;

package/dist/components/ContextOverlay/ContextOverlay.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function ContextOverlay({ children, className, ...restProps }: any): JSX.Element;
+export default ContextOverlay;

package/dist/components/ContextOverlay/ContextOverlay.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _core = require("@blueprintjs/core");
+
+var _constants = require("../../configuration/constants");
+
+/*
+
+    @see https://blueprintjs.com/docs/#core/components/popover for list of
+    properties
+
+*/
+function ContextOverlay({
+  children,
+  className = '',
+  ...restProps
+}) {
+  return /*#__PURE__*/_react.default.createElement(_core.Popover, (0, _extends2.default)({
+    position: _core.Position.BOTTOM
+  }, restProps, {
+    className: `${_constants.CLASSPREFIX}-contextoverlay ` + className
+  }), children);
+}
+
+var _default = ContextOverlay;
+exports.default = _default;

package/dist/components/ContextOverlay/ContextOverlay.jsx

@@ -0,0 +1,27 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { Popover as BlueprintPropover, Position as BlueprintPosition } from "@blueprintjs/core";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+/*
+
+    @see https://blueprintjs.com/docs/#core/components/popover for list of
+    properties
+
+*/
+function ContextOverlay(_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b, restProps = __rest(_a, ["children", "className"]);
+    return (<BlueprintPropover position={BlueprintPosition.BOTTOM} {...restProps} className={eccgui + "-contextoverlay " + className}>
+            {children}
+        </BlueprintPropover>);
+}
+export default ContextOverlay;

package/dist/components/Dialog/AlertDialog.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { SimpleDialogProps } from './SimpleDialog';
+export interface IAlertDialogProps extends Omit<SimpleDialogProps, "intent"> {
+    /**
+     * set to true if alert dialog displays a success message
+     */
+    success?: boolean;
+    /**
+     *  set to true if alert dialog displays a warning
+     */
+    warning?: boolean;
+    /**
+     * set to true if alert dialog displays a strong message about errors or disruptive actions
+     */
+    danger?: boolean;
+}
+/**
+ * Special element to display alert notification in modal dialogs.
+ * Inherits all properties from `SimpleDialog`, except `intent`.
+ */
+declare function AlertDialog({ children, success, warning, danger, ...otherProps }: IAlertDialogProps): JSX.Element;
+export default AlertDialog;

package/dist/components/Dialog/AlertDialog.js

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Intent = require("../../common/Intent");
+
+var _SimpleDialog = _interopRequireDefault(require("./SimpleDialog"));
+
+/*
+    provides a simple interface for alert dialogs
+*/
+
+/**
+ * Special element to display alert notification in modal dialogs.
+ * Inherits all properties from `SimpleDialog`, except `intent`.
+ */
+function AlertDialog({
+  children,
+  success = false,
+  warning = false,
+  danger = false,
+  ...otherProps
+}) {
+  let intentLevel = _Intent.Definitions.INFO;
+
+  if (success) {
+    intentLevel = _Intent.Definitions.SUCCESS;
+  }
+
+  if (warning) {
+    intentLevel = _Intent.Definitions.WARNING;
+  }
+
+  if (danger) {
+    intentLevel = _Intent.Definitions.DANGER;
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_SimpleDialog.default, (0, _extends2.default)({
+    size: "tiny",
+    preventSimpleClosing: true,
+    intent: intentLevel
+  }, otherProps), children);
+}
+
+;
+var _default = AlertDialog;
+exports.default = _default;

package/dist/components/Dialog/AlertDialog.jsx

@@ -0,0 +1,39 @@
+/*
+    provides a simple interface for alert dialogs
+*/
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { Definitions as IntentStates } from "../../common/Intent";
+import SimpleDialog from './SimpleDialog';
+/**
+ * Special element to display alert notification in modal dialogs.
+ * Inherits all properties from `SimpleDialog`, except `intent`.
+ */
+function AlertDialog(_a) {
+    var children = _a.children, _b = _a.success, success = _b === void 0 ? false : _b, _c = _a.warning, warning = _c === void 0 ? false : _c, _d = _a.danger, danger = _d === void 0 ? false : _d, otherProps = __rest(_a, ["children", "success", "warning", "danger"]);
+    var intentLevel = IntentStates.INFO;
+    if (success) {
+        intentLevel = IntentStates.SUCCESS;
+    }
+    if (warning) {
+        intentLevel = IntentStates.WARNING;
+    }
+    if (danger) {
+        intentLevel = IntentStates.DANGER;
+    }
+    return (<SimpleDialog size="tiny" preventSimpleClosing={true} intent={intentLevel} {...otherProps}>
+            {children}
+        </SimpleDialog>);
+}
+;
+export default AlertDialog;

package/dist/components/Dialog/Modal.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { OverlayProps } from "@blueprintjs/core";
+import { IOverlayState } from '@blueprintjs/core';
+export interface ModalProps extends OverlayProps, IOverlayState {
+    children: React.ReactNode | React.ReactNode[];
+    /**
+     * A space-delimited list of class names to pass along to the BlueprintJS `Overlay` element that is used to create the modal.
+     */
+    overlayClassName?: string;
+    /**
+     * Size of the modal.
+     */
+    size?: "tiny" | "small" | "regular" | "large" | "fullscreen";
+    /**
+     * Prevents that a backdrop area is displayed behind the modal elements.
+     */
+    preventBackdrop?: boolean;
+}
+/**
+ * Displays contents on top of other elements, used to create dialogs.
+ * This element can be used to create own modal elements and edge cases for modal dialogs.
+ * For most situations the usage of `SimpleDialog` and `AlertDialog` should be sufficent.
+ */
+declare function Modal({ children, className, overlayClassName, size, canOutsideClickClose, canEscapeKeyClose, preventBackdrop, ...otherProps }: ModalProps): JSX.Element;
+export default Modal;

package/dist/components/Dialog/Modal.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _core = require("@blueprintjs/core");
+
+var _Card = require("./../Card");
+
+var _constants = require("../../configuration/constants");
+
+/*
+    we only use Dialog as pre-configured and enhanced Overlay, it is
+    recommended to use Card elements inside.
+*/
+
+/**
+ * Displays contents on top of other elements, used to create dialogs.
+ * This element can be used to create own modal elements and edge cases for modal dialogs.
+ * For most situations the usage of `SimpleDialog` and `AlertDialog` should be sufficent.
+ */
+function Modal({
+  children,
+  className = '',
+  overlayClassName = '',
+  size = "regular",
+  canOutsideClickClose = false,
+  canEscapeKeyClose = false,
+  preventBackdrop = false,
+  ...otherProps
+}) {
+  const alteredChildren = _react.default.Children.map(children, (child, index) => {
+    if (child.type && child.type === _Card.Card) {
+      return /*#__PURE__*/_react.default.cloneElement(child, {
+        isOnlyLayout: true,
+        elevation: 4
+      });
+    }
+
+    return child;
+  });
+
+  return /*#__PURE__*/_react.default.createElement(_core.Overlay, (0, _extends2.default)({}, otherProps, {
+    className: overlayClassName,
+    backdropClassName: `${_constants.CLASSPREFIX}-dialog__backdrop`,
+    canOutsideClickClose: canOutsideClickClose,
+    canEscapeKeyClose: canEscapeKeyClose,
+    hasBackdrop: !preventBackdrop
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: _core.Classes.DIALOG_CONTAINER // this is a workaround because data attribute on SimpleDialog is not correctly routed to the overlay by blueprint js
+    ,
+    "data-test-id": otherProps["data-test-id"] ?? "simpleDialogWidget"
+  }, /*#__PURE__*/_react.default.createElement("section", {
+    className: `${_constants.CLASSPREFIX}-dialog__wrapper` + (typeof size === 'string' ? ` ${_constants.CLASSPREFIX}-dialog__wrapper--` + size : '') + (className ? ' ' + className : '')
+  }, alteredChildren)));
+}
+
+var _default = Modal;
+exports.default = _default;

package/dist/components/Dialog/Modal.jsx

@@ -0,0 +1,49 @@
+/*
+    we only use Dialog as pre-configured and enhanced Overlay, it is
+    recommended to use Card elements inside.
+*/
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { Classes as BlueprintClassNames, Overlay as BlueprintOverlay, } from "@blueprintjs/core";
+import { Card } from "./../Card";
+import { CLASSPREFIX as eccgui } from "../../configuration/constants";
+/**
+ * Displays contents on top of other elements, used to create dialogs.
+ * This element can be used to create own modal elements and edge cases for modal dialogs.
+ * For most situations the usage of `SimpleDialog` and `AlertDialog` should be sufficent.
+ */
+function Modal(_a) {
+    var _b;
+    var children = _a.children, _c = _a.className, className = _c === void 0 ? '' : _c, _d = _a.overlayClassName, overlayClassName = _d === void 0 ? '' : _d, _e = _a.size, size = _e === void 0 ? "regular" : _e, _f = _a.canOutsideClickClose, canOutsideClickClose = _f === void 0 ? false : _f, _g = _a.canEscapeKeyClose, canEscapeKeyClose = _g === void 0 ? false : _g, _h = _a.preventBackdrop, preventBackdrop = _h === void 0 ? false : _h, otherProps = __rest(_a, ["children", "className", "overlayClassName", "size", "canOutsideClickClose", "canEscapeKeyClose", "preventBackdrop"]);
+    var alteredChildren = React.Children.map(children, function (child, index) {
+        if (child.type && child.type === Card) {
+            return React.cloneElement(child, {
+                isOnlyLayout: true,
+                elevation: 4
+            });
+        }
+        return child;
+    });
+    return (<BlueprintOverlay {...otherProps} className={overlayClassName} backdropClassName={eccgui + "-dialog__backdrop"} canOutsideClickClose={canOutsideClickClose} canEscapeKeyClose={canEscapeKeyClose} hasBackdrop={!preventBackdrop}>
+            <div className={BlueprintClassNames.DIALOG_CONTAINER} 
+    // this is a workaround because data attribute on SimpleDialog is not correctly routed to the overlay by blueprint js
+    data-test-id={(_b = otherProps["data-test-id"]) !== null && _b !== void 0 ? _b : "simpleDialogWidget"}>
+                <section className={eccgui + "-dialog__wrapper" +
+            (typeof size === 'string' ? " " + eccgui + "-dialog__wrapper--" + size : '') +
+            (className ? ' ' + className : '')}>
+                    {alteredChildren}
+                </section>
+            </div>
+        </BlueprintOverlay>);
+}
+export default Modal;