@plesk/ui-library 3.31.2 → 3.32.0

package/cjs/components/PageHeader/PageHeader.js

@@ -5,14 +5,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _Translate = require("../Translate");
 var _constants = require("../../constants");
 var _Heading = _interopRequireDefault(require("../Heading"));
-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); }
-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; }
+var _jsxRuntime = require("react/jsx-runtime");
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 /**
@@ -32,27 +30,40 @@ const PageHeader = _ref => {
     children,
     ...props
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-    className: (0, _classnames.default)(baseClassName, className)
-  }, props), /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__inner`
-  }, topAddon && /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__top-addon`
-  }, topAddon), breadcrumbs && /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__breadcrumbs`
-  }, breadcrumbs), title && /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__title`
-  }, titleLeftAddon && /*#__PURE__*/_react.default.createElement("span", {
-    className: `${baseClassName}__title-left-addon`
-  }, titleLeftAddon), (0, _Translate.isLikeText)(title) ? /*#__PURE__*/_react.default.createElement(_Heading.default, null, title) : title, titleRightAddon && /*#__PURE__*/_react.default.createElement("span", {
-    className: `${baseClassName}__title-right-addon`
-  }, titleRightAddon)), _react.Children.toArray(children).length ? /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__content`
-  }, children) : null), tabs && /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__tabs`
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__tabs-inner`
-  }, tabs)));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classnames.default)(baseClassName, className),
+    ...props,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `${baseClassName}__inner`,
+      children: [topAddon && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__top-addon`,
+        children: topAddon
+      }), breadcrumbs && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__breadcrumbs`,
+        children: breadcrumbs
+      }), title && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: `${baseClassName}__title`,
+        children: [titleLeftAddon && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: `${baseClassName}__title-left-addon`,
+          children: titleLeftAddon
+        }), (0, _Translate.isLikeText)(title) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Heading.default, {
+          children: title
+        }) : title, titleRightAddon && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: `${baseClassName}__title-right-addon`,
+          children: titleRightAddon
+        })]
+      }), _react.Children.toArray(children).length ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__content`,
+        children: children
+      }) : null]
+    }), tabs && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${baseClassName}__tabs`,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__tabs-inner`,
+        children: tabs
+      })
+    })]
+  });
 };
 var _default = PageHeader;
 exports.default = _default;

package/cjs/components/Pagination/Pagination.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ITEMS_PER_PAGE_OPTIONS = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../constants");
 var _InputNumber = _interopRequireDefault(require("../InputNumber"));
@@ -17,6 +15,7 @@ var _Popover = _interopRequireDefault(require("../Popover"));
 var _SegmentedControl = _interopRequireDefault(require("../SegmentedControl"));
 var _ContentLoader = _interopRequireDefault(require("../ContentLoader"));
 var _utils = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
 // Copyright 1999-2021. Plesk International GmbH. All rights reserved.
 
 const ITEMS_PER_PAGE_OPTIONS = [25, 100, 'all'];
@@ -46,74 +45,81 @@ const Pagination = _ref => {
   } = _ref;
   const handleSelect = page => (0, _utils.safeInvoke)(onSelect, page);
   const handleItemsPerPageChange = option => (0, _utils.safeInvoke)(onItemsPerPageChange, option);
-  const pagination = /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-    className: (0, _classnames.default)(baseClassName, className)
-  }, props), /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__pages`
-  }, /*#__PURE__*/_react.default.createElement(_ContentLoader.default, {
-    loading: loading,
-    overlay: true,
-    spinner: {
-      size: 'sm'
-    },
-    className: `${baseClassName}__loader`
-  }, /*#__PURE__*/_react.default.createElement(_InputNumber.default, {
-    value: loading ? undefined : current,
-    onChange: handleSelect,
-    min: 1,
-    max: total,
-    decrementIcon: "arrow-left",
-    incrementIcon: "arrow-right",
-    className: `${baseClassName}__input`
-  })), /*#__PURE__*/_react.default.createElement(_Translate.default, {
-    content: "Pagination.totalShort",
-    fallback: "of %%total%%",
-    params: {
-      total
-    },
-    className: `${baseClassName}__text`
-  })), onItemsPerPageChange ? /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__options`
-  }, /*#__PURE__*/_react.default.createElement(_Translate.default, {
-    content: "Pagination.itemsPerPage",
-    fallback: "Items per page",
-    className: `${baseClassName}__text`
-  }), /*#__PURE__*/_react.default.createElement(_SegmentedControl.default, {
-    ghost: true,
-    buttons: itemsPerPageOptions.map(value => {
-      let title = value;
-      if (value === 'all') {
-        title = /*#__PURE__*/_react.default.createElement(_Translate.default, {
-          content: "Pagination.all",
-          fallback: "All"
-        });
-      }
-      return {
-        value,
-        title
-      };
-    }),
-    selected: itemsPerPage,
-    onChange: handleItemsPerPageChange,
-    className: `${baseClassName}__control`
-  })) : null);
+  const pagination = /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classnames.default)(baseClassName, className),
+    ...props,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `${baseClassName}__pages`,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ContentLoader.default, {
+        loading: loading,
+        overlay: true,
+        spinner: {
+          size: 'sm'
+        },
+        className: `${baseClassName}__loader`,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputNumber.default, {
+          value: loading ? undefined : current,
+          onChange: handleSelect,
+          min: 1,
+          max: total,
+          decrementIcon: "arrow-left",
+          incrementIcon: "arrow-right",
+          className: `${baseClassName}__input`
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
+        content: "Pagination.totalShort",
+        fallback: "of %%total%%",
+        params: {
+          total
+        },
+        className: `${baseClassName}__text`
+      })]
+    }), onItemsPerPageChange ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `${baseClassName}__options`,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
+        content: "Pagination.itemsPerPage",
+        fallback: "Items per page",
+        className: `${baseClassName}__text`
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SegmentedControl.default, {
+        ghost: true,
+        buttons: itemsPerPageOptions.map(value => {
+          let title = value;
+          if (value === 'all') {
+            title = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
+              content: "Pagination.all",
+              fallback: "All"
+            });
+          }
+          return {
+            value,
+            title
+          };
+        }),
+        selected: itemsPerPage,
+        onChange: handleItemsPerPageChange,
+        className: `${baseClassName}__control`
+      })]
+    }) : null]
+  });
   if (view === VIEW_POPOVER) {
-    return /*#__PURE__*/_react.default.createElement(_Popover.default, {
-      target: /*#__PURE__*/_react.default.createElement(_Text.default, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popover.default, {
+      target: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
         fontSize: "sm",
         component: _Link.default,
-        nowrap: true
-      }, /*#__PURE__*/_react.default.createElement(_Translate.default, {
-        content: "Pagination.total",
-        fallback: "Page %%current%% of %%total%%",
-        params: {
-          current,
-          total
-        }
-      })),
+        nowrap: true,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
+          content: "Pagination.total",
+          fallback: "Page %%current%% of %%total%%",
+          params: {
+            current,
+            total
+          }
+        })
+      }),
       placement: "top",
-      className: `${baseClassName}__popover`
-    }, pagination);
+      className: `${baseClassName}__popover`,
+      children: pagination
+    });
   }
   return pagination;
 };

package/cjs/components/Panel/Panel.js

@@ -5,9 +5,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../constants");
 var _reactTransitionGroup = require("react-transition-group");
@@ -15,12 +14,9 @@ var _Translate = require("../Translate");
 var _Heading = _interopRequireDefault(require("../Heading"));
 var _Button = _interopRequireDefault(require("../Button"));
 var _utils = require("../utils");
-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); }
-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; }
+var _jsxRuntime = require("react/jsx-runtime");
 // Copyright 1999-2021. Plesk International GmbH. All rights reserved.
 
-/* eslint-disable react/no-deprecated */
-
 /**
  * `Panel` component is used for visually grouping some content.
  * @since 0.0.35
@@ -78,39 +74,45 @@ class Panel extends _react.Component {
     } = this.state;
     const handleToggle = collapsible ? this.handleToggle : undefined;
     const rootRef = /*#__PURE__*/(0, _react.createRef)();
-    return /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.CSSTransition, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactTransitionGroup.CSSTransition, {
       classNames: `${baseClassName}-`,
       in: !collapsed,
       timeout: 300,
-      nodeRef: rootRef
-    }, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-      className: (0, _classnames.default)(baseClassName, {
-        [`${baseClassName}--collapsible`]: collapsible,
-        [`${baseClassName}--collapsed`]: collapsed,
-        [`${baseClassName}--expanded`]: !collapsed
-      }, className)
-    }, props, {
-      ref: rootRef
-    }), title && /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__header`,
-      onClick: handleToggle
-    }, (0, _Translate.isLikeText)(title) ? /*#__PURE__*/_react.default.createElement(_Heading.default, {
-      component: "div",
-      level: 4,
-      className: `${baseClassName}__title`
-    }, title) : title, (extra || collapsible) && /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__extra`
-    }, extra, collapsible && /*#__PURE__*/_react.default.createElement(_Button.default, {
-      ghost: true,
-      className: `${baseClassName}__control-button`,
-      icon: {
-        name: 'chevron-up',
-        flipVertical: collapsed
-      },
-      onClick: handleToggle
-    }))), /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__content`
-    }, children)));
+      nodeRef: rootRef,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: (0, _classnames.default)(baseClassName, {
+          [`${baseClassName}--collapsible`]: collapsible,
+          [`${baseClassName}--collapsed`]: collapsed,
+          [`${baseClassName}--expanded`]: !collapsed
+        }, className),
+        ...props,
+        ref: rootRef,
+        children: [title && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: `${baseClassName}__header`,
+          onClick: handleToggle,
+          children: [(0, _Translate.isLikeText)(title) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Heading.default, {
+            component: "div",
+            level: 4,
+            className: `${baseClassName}__title`,
+            children: title
+          }) : title, (extra || collapsible) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: `${baseClassName}__extra`,
+            children: [extra, collapsible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+              ghost: true,
+              className: `${baseClassName}__control-button`,
+              icon: {
+                name: 'chevron-up',
+                flipVertical: collapsed
+              },
+              onClick: handleToggle
+            })]
+          })]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: `${baseClassName}__content`,
+          children: children
+        })]
+      })
+    });
   }
 }
 (0, _defineProperty2.default)(Panel, "defaultProps", {

package/cjs/components/Paragraph/Paragraph.js

@@ -5,10 +5,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../constants");
+var _jsxRuntime = require("react/jsx-runtime");
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 /**
@@ -23,9 +22,11 @@ const Paragraph = _ref => {
     component: Tag = 'p',
     ...props
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(Tag, (0, _extends2.default)({
-    className: (0, _classnames.default)(baseClassName, className)
-  }, props), children);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Tag, {
+    className: (0, _classnames.default)(baseClassName, className),
+    ...props,
+    children: children
+  });
 };
 var _default = Paragraph;
 exports.default = _default;

package/cjs/components/Plaintext/Plaintext.js

@@ -9,6 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../constants");
+var _jsxRuntime = require("react/jsx-runtime");
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 /**
@@ -21,9 +22,10 @@ const Plaintext = _ref => {
     className,
     children
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement("pre", {
-    className: (0, _classnames.default)(baseClassName, className)
-  }, children);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("pre", {
+    className: (0, _classnames.default)(baseClassName, className),
+    children: children
+  });
 };
 Plaintext.propTypes = {
   /**

package/cjs/components/Popover/Popover.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactDom = require("react-dom");
@@ -21,12 +20,11 @@ var _Translate = require("../Translate");
 var _utils = require("../utils");
 var _OnDarkContext = _interopRequireDefault(require("../OnDarkContext"));
 var _FocusTrap = _interopRequireDefault(require("../FocusTrap"));
+var _jsxRuntime = require("react/jsx-runtime");
 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); }
 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; }
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-/* eslint-disable react/no-deprecated */
-
 const PLACEMENT_MAP = {
   'top-left': 'top-end',
   'top-right': 'top-start',
@@ -219,7 +217,7 @@ class Popover extends _react.Component {
         behavior = ['left', 'right', 'top', 'bottom'];
       }
     }
-    const close = /*#__PURE__*/_react.default.createElement(_Button.default, {
+    const close = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
       className: (0, _classnames.default)(`${baseClassName}__close`, title && `${baseClassName}__close--heading`),
       onClick: this.handleClose,
       ghost: true,
@@ -228,22 +226,26 @@ class Popover extends _react.Component {
         size: title ? 16 : 12
       }
     });
-    const heading = title && /*#__PURE__*/_react.default.createElement(_reactMeasure.default, {
+    const heading = title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactMeasure.default, {
       onResize: this.handleHeaderResize,
-      bounds: true
-    }, _ref => {
-      let {
-        measureRef
-      } = _ref;
-      return /*#__PURE__*/_react.default.createElement("div", {
-        ref: measureRef,
-        className: `${baseClassName}__heading`
-      }, (0, _Translate.isLikeText)(title) ? /*#__PURE__*/_react.default.createElement(_Heading.default, {
-        level: "5",
-        className: `${baseClassName}__title`
-      }, title) : title, /*#__PURE__*/_react.default.createElement("div", {
-        className: `${baseClassName}__extra`
-      }, extra, close));
+      bounds: true,
+      children: _ref => {
+        let {
+          measureRef
+        } = _ref;
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          ref: measureRef,
+          className: `${baseClassName}__heading`,
+          children: [(0, _Translate.isLikeText)(title) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Heading.default, {
+            level: "5",
+            className: `${baseClassName}__title`,
+            children: title
+          }) : title, /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: `${baseClassName}__extra`,
+            children: [extra, close]
+          })]
+        });
+      }
     });
     const trigger = isControlled(this.props) ? target : /*#__PURE__*/(0, _react.cloneElement)(target, {
       className: (0, _classnames.default)(target.props.className, `${baseClassName}__target`),
@@ -256,20 +258,23 @@ class Popover extends _react.Component {
         height: normalize(height)
       };
     }
-    const content = /*#__PURE__*/_react.default.createElement(_FocusTrap.default, {
+    const content = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_FocusTrap.default, {
       ref: this.contentRef,
       onKeyUp: canCloseOnEscapePress && show ? this.hotkeyHandler : null,
       className: `${baseClassName}__inner`,
-      style: wrapperStyle
-    }, height ? heading : heading || close, /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__content`
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__content-inner`
-    }, children)));
-    return /*#__PURE__*/_react.default.createElement(_Popper.default, (0, _extends2.default)({
+      style: wrapperStyle,
+      children: [height ? heading : heading || close, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__content`,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: `${baseClassName}__content-inner`,
+          children: children
+        })
+      })]
+    });
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popper.default, {
       target: trigger,
       targetRef: targetRef ? targetRef : this.targetRef,
-      arrow: /*#__PURE__*/_react.default.createElement("span", {
+      arrow: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: (0, _classnames.default)(`${baseClassName}__arrow`, arrowInHeader && `${baseClassName}__arrow--heading`)
       }),
       placement: popperPlacement,
@@ -284,14 +289,18 @@ class Popover extends _react.Component {
       baseClassName: baseClassName,
       behavior: behavior,
       zIndex: _constants.Z_INDEX_POPOVER,
-      show: show
-    }, props), canCloseOnOutsideClick ? /*#__PURE__*/_react.default.createElement(_AutoClosable.default, {
-      onClose: this.handleClose,
-      ignoreNodes: this.getIgnoreNodes,
-      nodeRef: this.contentRef
-    }, content) : content);
+      show: show,
+      ...props,
+      children: canCloseOnOutsideClick ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_AutoClosable.default, {
+        onClose: this.handleClose,
+        ignoreNodes: this.getIgnoreNodes,
+        nodeRef: this.contentRef,
+        children: content
+      }) : content
+    });
   }
 }
+// eslint-disable-next-line react/sort-comp
 (0, _defineProperty2.default)(Popover, "contextType", _OnDarkContext.default);
 Popover.propTypes = {
   /**

package/cjs/components/Popover/Popover.stories.js

@@ -5,38 +5,56 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ThreeButtons = exports.Basic = exports.Autofocus = void 0;
-var _react = _interopRequireDefault(require("react"));
 var _Link = _interopRequireDefault(require("../Link"));
 var _Button = _interopRequireDefault(require("../Button"));
 var _Paragraph = _interopRequireDefault(require("../Paragraph"));
 var _Popover = _interopRequireDefault(require("./Popover"));
+var _jsxRuntime = require("react/jsx-runtime");
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-const Basic = args => /*#__PURE__*/_react.default.createElement(_Popover.default, args);
+const Basic = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popover.default, {
+  ...args
+});
 exports.Basic = Basic;
 Basic.args = {
-  target: /*#__PURE__*/_react.default.createElement(_Link.default, {
-    "data-id": "trigger"
-  }, 'Trigger'),
+  target: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Link.default, {
+    "data-id": "trigger",
+    children: 'Trigger'
+  }),
   children: 'Content'
 };
-const ThreeButtons = args => /*#__PURE__*/_react.default.createElement(Basic, args);
+const ThreeButtons = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(Basic, {
+  ...args
+});
 exports.ThreeButtons = ThreeButtons;
 ThreeButtons.args = {
   ...Basic.args,
-  children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Paragraph.default, null, 'Enim ea occaecat dolor veniam.'), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    "data-id": "button-1"
-  }, 'Button 1'), /*#__PURE__*/_react.default.createElement(_Paragraph.default, null, 'Incididunt ipsum nulla officia adipisicing voluptate enim reprehenderit.'), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    "data-id": "button-2"
-  }, 'Button 2'), ` `, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    "data-id": "button-3"
-  }, 'Button 3'), /*#__PURE__*/_react.default.createElement(_Paragraph.default, null, 'Cillum sunt nisi aute amet elit ut sit dolor in aliqua minim.'))
+  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Paragraph.default, {
+      children: 'Enim ea occaecat dolor veniam.'
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+      "data-id": "button-1",
+      children: 'Button 1'
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Paragraph.default, {
+      children: 'Incididunt ipsum nulla officia adipisicing voluptate enim reprehenderit.'
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+      "data-id": "button-2",
+      children: 'Button 2'
+    }), ` `, /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+      "data-id": "button-3",
+      children: 'Button 3'
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Paragraph.default, {
+      children: 'Cillum sunt nisi aute amet elit ut sit dolor in aliqua minim.'
+    })]
+  })
 };
-const Autofocus = args => /*#__PURE__*/_react.default.createElement(Basic, args);
+const Autofocus = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(Basic, {
+  ...args
+});
 exports.Autofocus = Autofocus;
 Autofocus.args = {
   ...Basic.args,
-  children: /*#__PURE__*/_react.default.createElement("input", {
+  children: /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
     autoFocus: true
   })
 };