@plesk/ui-library 3.31.2 → 3.32.0

package/cjs/components/ButtonGroup/ButtonGroup.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,10 +22,12 @@ const ButtonGroup = _ref => {
     innerRef,
     ...props
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     className: (0, _classnames.default)(baseClassName, className),
-    ref: innerRef
-  }, props), children);
+    ref: innerRef,
+    ...props,
+    children: children
+  });
 };
 var _default = ButtonGroup;
 exports.default = _default;

package/cjs/components/Card/Card.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 _propTypes = _interopRequireDefault(require("prop-types"));
@@ -18,12 +17,11 @@ var _ContentLoader = _interopRequireDefault(require("../ContentLoader"));
 var _Translate = _interopRequireDefault(require("../Translate"));
 var _CardButton = _interopRequireDefault(require("./CardButton"));
 var _PreviewPanel = _interopRequireDefault(require("./PreviewPanel"));
+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 VIEW_TILE = 'tile';
 const VIEW_EXTENDED = 'extended';
 const VIEW_ROW = 'row';
@@ -72,17 +70,19 @@ class Card extends _react.Component {
       isSelected,
       onSelectionChange
     } = selection;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__selection`
-    }, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
-      checked: isSelected,
-      onChange: isSelected => onSelectionChange({
-        isSelected
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${baseClassName}__selection`,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox.default, {
+        checked: isSelected,
+        onChange: isSelected => onSelectionChange({
+          isSelected
+        }),
+        children: this.isExtended() ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
+          content: "Card.select",
+          fallback: "Select"
+        }) : null
       })
-    }, this.isExtended() ? /*#__PURE__*/_react.default.createElement(_Translate.default, {
-      content: "Card.select",
-      fallback: "Select"
-    }) : null));
+    });
   }
   renderTitle() {
     const {
@@ -93,18 +93,21 @@ class Card extends _react.Component {
     const titleLinkProps = typeof titleLink === 'string' ? {
       href: titleLink
     } : titleLink;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__title`
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      className: `${baseClassName}__title-text`
-    }, title), titleLinkProps && /*#__PURE__*/_react.default.createElement(_CardButton.default, (0, _extends2.default)({
-      component: "a",
-      icon: "chain",
-      tooltip: /*#__PURE__*/_react.default.createElement(_Translate.default, {
-        content: "Card.titleLinkTooltip",
-        fallback: "Go to page"
-      })
-    }, titleLinkProps)), this.isExtended() && this.renderTitleLabels());
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `${baseClassName}__title`,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: `${baseClassName}__title-text`,
+        children: title
+      }), titleLinkProps && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardButton.default, {
+        component: "a",
+        icon: "chain",
+        tooltip: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
+          content: "Card.titleLinkTooltip",
+          fallback: "Go to page"
+        }),
+        ...titleLinkProps
+      }), this.isExtended() && this.renderTitleLabels()]
+    });
   }
   renderTitleLabels() {
     const {
@@ -114,11 +117,12 @@ class Card extends _react.Component {
     if (titleLabels.length === 0) {
       return null;
     }
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__title-labels`
-    }, _react.Children.map(titleLabels, label => /*#__PURE__*/(0, _react.cloneElement)(label, {
-      className: (0, _classnames.default)(`${baseClassName}__label`, label.props.className)
-    })));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${baseClassName}__title-labels`,
+      children: _react.Children.map(titleLabels, label => /*#__PURE__*/(0, _react.cloneElement)(label, {
+        className: (0, _classnames.default)(`${baseClassName}__label`, label.props.className)
+      }))
+    });
   }
   renderLabels() {
     const {
@@ -128,41 +132,47 @@ class Card extends _react.Component {
     if (labels.length === 0) {
       return null;
     }
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__labels`
-    }, _react.Children.map(labels, label => /*#__PURE__*/(0, _react.cloneElement)(label, {
-      className: (0, _classnames.default)(`${baseClassName}__label`, label.props.className)
-    })));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${baseClassName}__labels`,
+      children: _react.Children.map(labels, label => /*#__PURE__*/(0, _react.cloneElement)(label, {
+        className: (0, _classnames.default)(`${baseClassName}__label`, label.props.className)
+      }))
+    });
   }
   renderHeader() {
     const {
       baseClassName
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__header`
-    }, this.renderSelection(), this.renderTitle(), this.isExtended() && this.renderLabels(), this.renderButtons());
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `${baseClassName}__header`,
+      children: [this.renderSelection(), this.renderTitle(), this.isExtended() && this.renderLabels(), this.renderButtons()]
+    });
   }
   renderRowHeader() {
     const {
       baseClassName,
       subtitle
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__header`
-    }, subtitle && /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__subtitle`
-    }, subtitle), this.renderTitle());
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `${baseClassName}__header`,
+      children: [subtitle && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__subtitle`,
+        children: subtitle
+      }), this.renderTitle()]
+    });
   }
   renderContent() {
     const {
       baseClassName,
       children
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__main`
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__main-content`
-    }, children));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${baseClassName}__main`,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__main-content`,
+        children: children
+      })
+    });
   }
   isExtended() {
     const {
@@ -192,43 +202,43 @@ class Card extends _react.Component {
     const result = [];
     if (!this.isRow()) {
       buttons.forEach((btn, index) => {
-        result.push( /*#__PURE__*/_react.default.createElement(_CardButton.default, (0, _extends2.default)({
-          key: btn.key || index
-        }, btn)));
+        result.push( /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardButton.default, {
+          ...btn
+        }, btn.key || index));
       });
     }
     if (menu) {
-      result.push( /*#__PURE__*/_react.default.createElement(_Dropdown.default, {
-        key: "menu",
+      result.push( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default, {
         menu: menu,
-        menuPlacement: 'bottom-end'
-      }, /*#__PURE__*/_react.default.createElement(_CardButton.default, {
-        icon: "menu"
-      })));
+        menuPlacement: 'bottom-end',
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardButton.default, {
+          icon: "menu"
+        })
+      }, "menu"));
     }
     if (rowContent && !this.isTile()) {
-      result.push( /*#__PURE__*/_react.default.createElement(_CardButton.default, {
-        key: "toggleView",
+      result.push( /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardButton.default, {
         icon: {
           name: 'chevron-down',
           flipVertical: this.isExtended()
         },
         onClick: this.handleToggleView,
-        tooltip: this.isExtended() ? /*#__PURE__*/_react.default.createElement(_Translate.default, {
+        tooltip: this.isExtended() ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
           content: "Card.collapseCardTooltip",
           fallback: "Collapse the card"
-        }) : /*#__PURE__*/_react.default.createElement(_Translate.default, {
+        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
           content: "Card.expandCardTooltip",
           fallback: "Expand the card"
         })
-      }));
+      }, "toggleView"));
     }
     if (result.length === 0) {
       return null;
     }
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__buttons`
-    }, result);
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${baseClassName}__buttons`,
+      children: result
+    });
   }
   renderSideHeader() {
     const {
@@ -248,9 +258,10 @@ class Card extends _react.Component {
       }
       sideHeaderElement = /*#__PURE__*/(0, _react.cloneElement)(sideHeader, props);
     }
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__side-header`
-    }, sideHeaderElement);
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${baseClassName}__side-header`,
+      children: sideHeaderElement
+    });
   }
   renderSideContent() {
     const {
@@ -260,34 +271,41 @@ class Card extends _react.Component {
     if (!sideContent) {
       return null;
     }
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__side-content`
-    }, sideContent);
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${baseClassName}__side-content`,
+      children: sideContent
+    });
   }
   renderRow() {
     const {
       baseClassName,
       rowContent
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__inner`
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__body`
-    }, this.renderSelection(), this.renderSideHeader(), this.renderRowHeader(), /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__main`
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__main-content`
-    }, rowContent)), this.renderButtons()));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${baseClassName}__inner`,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: `${baseClassName}__body`,
+        children: [this.renderSelection(), this.renderSideHeader(), this.renderRowHeader(), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: `${baseClassName}__main`,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: `${baseClassName}__main-content`,
+            children: rowContent
+          })
+        }), this.renderButtons()]
+      })
+    });
   }
   renderTile() {
     const {
       baseClassName
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__inner`
-    }, this.renderHeader(), /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__body`
-    }, this.renderSideHeader(), this.renderContent()), this.renderSideContent());
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `${baseClassName}__inner`,
+      children: [this.renderHeader(), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: `${baseClassName}__body`,
+        children: [this.renderSideHeader(), this.renderContent()]
+      }), this.renderSideContent()]
+    });
   }
   renderExtended() {
     const {
@@ -295,13 +313,16 @@ class Card extends _react.Component {
     } = this.props;
     const sideHeaderElement = this.renderSideHeader();
     const sideContentElement = this.renderSideContent();
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__inner`
-    }, this.renderHeader(), /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__body`
-    }, sideHeaderElement || sideContentElement ? /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__side`
-    }, sideHeaderElement, sideContentElement) : null, this.renderContent()));
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `${baseClassName}__inner`,
+      children: [this.renderHeader(), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: `${baseClassName}__body`,
+        children: [sideHeaderElement || sideContentElement ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: `${baseClassName}__side`,
+          children: [sideHeaderElement, sideContentElement]
+        }) : null, this.renderContent()]
+      })]
+    });
   }
   render() {
     const {
@@ -324,26 +345,28 @@ class Card extends _react.Component {
       progress,
       ...props
     } = this.props;
-    return /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.CSSTransition, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactTransitionGroup.CSSTransition, {
       classNames: `${baseClassName}-`,
       in: this.isExtended(),
       timeout: 300,
-      nodeRef: this.rootRef
-    }, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-      className: (0, _classnames.default)(baseClassName, {
-        [`${baseClassName}--extended`]: this.isExtended(),
-        [`${baseClassName}--tile`]: this.isTile(),
-        [`${baseClassName}--row`]: this.isRow(),
-        [`${baseClassName}--${intent}`]: intent,
-        [`${baseClassName}--progress`]: progress
-      }, className)
-    }, props, {
-      ref: this.rootRef
-    }), this.isExtended() && this.renderExtended(), this.isTile() && this.renderTile(), this.isRow() && this.renderRow(), progress && /*#__PURE__*/_react.default.createElement(_ContentLoader.default, {
-      overlay: true,
-      backdrop: true,
-      text: progress === true ? null : progress
-    })));
+      nodeRef: this.rootRef,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: (0, _classnames.default)(baseClassName, {
+          [`${baseClassName}--extended`]: this.isExtended(),
+          [`${baseClassName}--tile`]: this.isTile(),
+          [`${baseClassName}--row`]: this.isRow(),
+          [`${baseClassName}--${intent}`]: intent,
+          [`${baseClassName}--progress`]: progress
+        }, className),
+        ...props,
+        ref: this.rootRef,
+        children: [this.isExtended() && this.renderExtended(), this.isTile() && this.renderTile(), this.isRow() && this.renderRow(), progress && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ContentLoader.default, {
+          overlay: true,
+          backdrop: true,
+          text: progress === true ? null : progress
+        })]
+      })
+    });
   }
 }
 Card.propTypes = {

package/cjs/components/Card/CardButton.js

@@ -5,12 +5,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _constants = require("../../constants");
 var _Button = _interopRequireDefault(require("../Button"));
 var _Icon = _interopRequireDefault(require("../Icon"));
+var _jsxRuntime = require("react/jsx-runtime");
 // Copyright 1999-2017. Plesk International GmbH. All rights reserved.
 
 const CardButton = _ref => {
@@ -18,9 +18,10 @@ const CardButton = _ref => {
     icon,
     ...props
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({
-    icon: _Icon.default.create(icon)
-  }, props));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+    icon: _Icon.default.create(icon),
+    ...props
+  });
 };
 CardButton.propTypes = {
   /**

package/cjs/components/Card/PreviewPanel.js

@@ -5,19 +5,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _ContentLoader = _interopRequireDefault(require("../ContentLoader"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../constants");
 var _helpers = require("./helpers");
 var _noImage = _interopRequireDefault(require("./images/no-image.svg"));
-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.
 
-/* eslint-disable react/no-deprecated */
-
 const determineSource = _ref => {
   let {
     image,
@@ -79,9 +75,10 @@ const PreviewPanel = _ref2 => {
   }, [source.type, source.url]);
   const renderLoader = () => {
     if (status === 'loading') {
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: `${baseClassName}__loader`
-      }, /*#__PURE__*/_react.default.createElement(_ContentLoader.default, null));
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__loader`,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ContentLoader.default, {})
+      });
     }
     return null;
   };
@@ -132,21 +129,27 @@ const PreviewPanel = _ref2 => {
         padding: `${padding instanceof Array ? padding.join('px ') : padding}px`
       };
     }
-    return /*#__PURE__*/_react.default.createElement("img", (0, _extends2.default)({
-      className: `${baseClassName}__image`
-    }, imageProps));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+      className: `${baseClassName}__image`,
+      ...imageProps
+    });
   };
-  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: (0, _classnames.default)(baseClassName, {
       [`${baseClassName}--background`]: source.type === 'background'
-    }, `${baseClassName}--${status}`, className)
-  }, props, renderBackground()), renderLoader(), renderImage(), /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)(`${baseClassName}__content`, {
-      [`${baseClassName}__content--empty`]: !children
-    })
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: `${baseClassName}__content-inner`
-  }, children)));
+    }, `${baseClassName}--${status}`, className),
+    ...props,
+    ...renderBackground(),
+    children: [renderLoader(), renderImage(), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classnames.default)(`${baseClassName}__content`, {
+        [`${baseClassName}__content--empty`]: !children
+      }),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__content-inner`,
+        children: children
+      })
+    })]
+  });
 };
 var _default = PreviewPanel;
 exports.default = _default;