@plesk/ui-library 3.31.0 → 3.31.2

package/cjs/components/Card/Card.js

@@ -1,56 +1,40 @@
 "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 _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _constants = require("../../constants");
-
 var _reactTransitionGroup = require("react-transition-group");
-
 var _Checkbox = _interopRequireDefault(require("../Checkbox"));
-
 var _Dropdown = _interopRequireDefault(require("../Dropdown"));
-
 var _ContentLoader = _interopRequireDefault(require("../ContentLoader"));
-
 var _Translate = _interopRequireDefault(require("../Translate"));
-
 var _CardButton = _interopRequireDefault(require("./CardButton"));
-
 var _PreviewPanel = _interopRequireDefault(require("./PreviewPanel"));
-
 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';
+
 /**
  * @deprecated `Card` component is a part of [CardList](#!/CardList).
  * @since 0.0.54
  */
-
 class Card extends _react.Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
     (0, _defineProperty2.default)(this, "state", {});
     (0, _defineProperty2.default)(this, "rootRef", /*#__PURE__*/(0, _react.createRef)());
     (0, _defineProperty2.default)(this, "handleToggleView", () => {
@@ -62,7 +46,6 @@ class Card extends _react.Component {
       });
     });
   }
-
   static getDerivedStateFromProps(props, state) {
     const {
       view
@@ -71,25 +54,20 @@ class Card extends _react.Component {
       prevView
     } = state;
     const nextState = {};
-
     if (view !== prevView) {
       nextState.view = view;
     }
-
     nextState.prevView = view;
     return nextState;
   }
-
   renderSelection() {
     const {
       baseClassName,
       selection
     } = this.props;
-
     if (!selection) {
       return null;
     }
-
     const {
       isSelected,
       onSelectionChange
@@ -106,7 +84,6 @@ class Card extends _react.Component {
       fallback: "Select"
     }) : null));
   }
-
   renderTitle() {
     const {
       baseClassName,
@@ -129,41 +106,34 @@ class Card extends _react.Component {
       })
     }, titleLinkProps)), this.isExtended() && this.renderTitleLabels());
   }
-
   renderTitleLabels() {
     const {
       baseClassName,
       titleLabels
     } = this.props;
-
     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)
     })));
   }
-
   renderLabels() {
     const {
       baseClassName,
       labels
     } = this.props;
-
     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)
     })));
   }
-
   renderHeader() {
     const {
       baseClassName
@@ -172,7 +142,6 @@ class Card extends _react.Component {
       className: `${baseClassName}__header`
     }, this.renderSelection(), this.renderTitle(), this.isExtended() && this.renderLabels(), this.renderButtons());
   }
-
   renderRowHeader() {
     const {
       baseClassName,
@@ -184,7 +153,6 @@ class Card extends _react.Component {
       className: `${baseClassName}__subtitle`
     }, subtitle), this.renderTitle());
   }
-
   renderContent() {
     const {
       baseClassName,
@@ -196,28 +164,24 @@ class Card extends _react.Component {
       className: `${baseClassName}__main-content`
     }, children));
   }
-
   isExtended() {
     const {
       view
     } = this.state;
     return !this.isTile() && view === VIEW_EXTENDED;
   }
-
   isTile() {
     const {
       view
     } = this.state;
     return view === VIEW_TILE;
   }
-
   isRow() {
     const {
       view
     } = this.state;
     return !this.isTile() && view === VIEW_ROW;
   }
-
   renderButtons() {
     const {
       baseClassName,
@@ -226,7 +190,6 @@ class Card extends _react.Component {
       buttons
     } = this.props;
     const result = [];
-
     if (!this.isRow()) {
       buttons.forEach((btn, index) => {
         result.push( /*#__PURE__*/_react.default.createElement(_CardButton.default, (0, _extends2.default)({
@@ -234,7 +197,6 @@ class Card extends _react.Component {
         }, btn)));
       });
     }
-
     if (menu) {
       result.push( /*#__PURE__*/_react.default.createElement(_Dropdown.default, {
         key: "menu",
@@ -244,7 +206,6 @@ class Card extends _react.Component {
         icon: "menu"
       })));
     }
-
     if (rowContent && !this.isTile()) {
       result.push( /*#__PURE__*/_react.default.createElement(_CardButton.default, {
         key: "toggleView",
@@ -262,60 +223,47 @@ class Card extends _react.Component {
         })
       }));
     }
-
     if (result.length === 0) {
       return null;
     }
-
     return /*#__PURE__*/_react.default.createElement("div", {
       className: `${baseClassName}__buttons`
     }, result);
   }
-
   renderSideHeader() {
     const {
       sideHeader,
       baseClassName
     } = this.props;
-
     if (!sideHeader) {
       return null;
     }
-
     let sideHeaderElement = sideHeader;
-
     if (sideHeader.type === _PreviewPanel.default) {
       const props = {
         className: (0, _classnames.default)(sideHeader.props.className, `${baseClassName}__preview-panel`)
       };
-
       if (this.isRow()) {
         props.children = null;
       }
-
       sideHeaderElement = /*#__PURE__*/(0, _react.cloneElement)(sideHeader, props);
     }
-
     return /*#__PURE__*/_react.default.createElement("div", {
       className: `${baseClassName}__side-header`
     }, sideHeaderElement);
   }
-
   renderSideContent() {
     const {
       sideContent,
       baseClassName
     } = this.props;
-
     if (!sideContent) {
       return null;
     }
-
     return /*#__PURE__*/_react.default.createElement("div", {
       className: `${baseClassName}__side-content`
     }, sideContent);
   }
-
   renderRow() {
     const {
       baseClassName,
@@ -331,7 +279,6 @@ class Card extends _react.Component {
       className: `${baseClassName}__main-content`
     }, rowContent)), this.renderButtons()));
   }
-
   renderTile() {
     const {
       baseClassName
@@ -342,7 +289,6 @@ class Card extends _react.Component {
       className: `${baseClassName}__body`
     }, this.renderSideHeader(), this.renderContent()), this.renderSideContent());
   }
-
   renderExtended() {
     const {
       baseClassName
@@ -357,7 +303,6 @@ class Card extends _react.Component {
       className: `${baseClassName}__side`
     }, sideHeaderElement, sideContentElement) : null, this.renderContent()));
   }
-
   render() {
     const {
       baseClassName,
@@ -400,58 +345,48 @@ class Card extends _react.Component {
       text: progress === true ? null : progress
     })));
   }
-
 }
-
 Card.propTypes = {
   /**
    * Content of the `Card`.
    * @since 0.0.54
    */
   children: _propTypes.default.node,
-
   /**
    * View mode.
    * @since 0.0.54
    */
   view: _propTypes.default.oneOf([VIEW_EXTENDED, VIEW_TILE, VIEW_ROW]),
-
   /**
    * Visual intent color to apply to component.
    * @since 0.0.54
    */
   intent: _propTypes.default.oneOf(['warning', 'danger', 'inactive']),
-
   /**
    * Text of title.
    * @since 0.0.54
    */
   title: _propTypes.default.node.isRequired,
-
   /**
    * Link for title.
    * @since 0.0.54
    */
   titleLink: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
-
   /**
    * List of labels in header, which should appear right after the title. See [Label](#!/Label) component for details.
    * @since 1.6.0
    */
   titleLabels: _propTypes.default.arrayOf(_propTypes.default.element),
-
   /**
    * Text of subtitle.
    * @since 0.0.54
    */
   subtitle: _propTypes.default.node,
-
   /**
    * List of labels in header, which should appear at the end of header. See [Label](#!/Label) component for details.
    * @since 0.0.54
    */
   labels: _propTypes.default.arrayOf(_propTypes.default.element),
-
   /**
    * List of additional buttons in header.
    * @since 0.0.54
@@ -461,13 +396,11 @@ Card.propTypes = {
     onClick: _propTypes.default.func.isRequired,
     tooltip: _propTypes.default.node
   })),
-
   /**
    * See [Menu](#!/Menu).
    * @since 0.3.0
    */
   menu: _propTypes.default.element,
-
   /**
    * Selection control.
    * @since 0.0.54
@@ -476,36 +409,30 @@ Card.propTypes = {
     isSelected: _propTypes.default.bool.isRequired,
     onSelectionChange: _propTypes.default.func.isRequired
   }),
-
   /**
    * Side header section. Recommended to use [PreviewPanel](#!/PreviewPanel) component.
    * @since 0.0.54
    */
   sideHeader: _propTypes.default.element,
-
   /**
    * Side content section.
    * @since 0.0.54
    */
   sideContent: _propTypes.default.element,
-
   /**
    * Content for row view.
    * @since 0.0.54
    */
   rowContent: _propTypes.default.any,
-
   /**
    * Indicate the progress state of the card.
    * @since 0.4.1
    */
   progress: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.node]),
-
   /**
    * @ignore
    */
   className: _propTypes.default.string,
-
   /**
    * @ignore
    */

package/cjs/components/Card/CardButton.js

@@ -1,32 +1,27 @@
 "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 _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _constants = require("../../constants");
-
 var _Button = _interopRequireDefault(require("../Button"));
-
 var _Icon = _interopRequireDefault(require("../Icon"));
-
 // Copyright 1999-2017. Plesk International GmbH. All rights reserved.
-const CardButton = ({
-  icon,
-  ...props
-}) => /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({
-  icon: _Icon.default.create(icon)
-}, props));
 
+const CardButton = _ref => {
+  let {
+    icon,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({
+    icon: _Icon.default.create(icon)
+  }, props));
+};
 CardButton.propTypes = {
   /**
    * @ignore

package/cjs/components/Card/PreviewPanel.js

@@ -1,37 +1,28 @@
 "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 = _interopRequireWildcard(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; }
-
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 /* eslint-disable react/no-deprecated */
-const determineSource = ({
-  image,
-  background
-}) => {
+
+const determineSource = _ref => {
+  let {
+    image,
+    background
+  } = _ref;
   if (image) {
     return {
       url: image,
@@ -43,29 +34,28 @@ const determineSource = ({
       type: 'background'
     };
   }
-
   return {
     url: _noImage.default,
     type: 'noImage'
   };
 };
+
 /**
  * `PreviewPanel` component is used for displaying website preview.
  * @since 0.3.0
  */
-
-
-const PreviewPanel = ({
-  background,
-  image,
-  padding = 0,
-  alt,
-  children,
-  className,
-  baseClassName = `${_constants.CLS_PREFIX}preview-panel`,
-  html,
-  ...props
-}) => {
+const PreviewPanel = _ref2 => {
+  let {
+    background,
+    image,
+    padding = 0,
+    alt,
+    children,
+    className,
+    baseClassName = `${_constants.CLS_PREFIX}preview-panel`,
+    html,
+    ...props
+  } = _ref2;
   const source = determineSource({
     image,
     background
@@ -73,16 +63,13 @@ const PreviewPanel = ({
   const [status, setStatus] = (0, _react.useState)(source.type === 'noImage' ? 'success' : 'loading');
   (0, _react.useEffect)(() => {
     let applyStatus = setStatus;
-
     const cleanup = () => {
       applyStatus = () => {};
     };
-
     if (source.type === 'noImage') {
       applyStatus('success');
       return cleanup;
     }
-
     setStatus('loading');
     (0, _helpers.loadImage)(source.url, {
       onSuccess: () => applyStatus('success'),
@@ -90,82 +77,65 @@ const PreviewPanel = ({
     });
     return cleanup;
   }, [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 null;
   };
-
   const renderBackground = () => {
     if (source.type !== 'background') {
       return null;
     }
-
     let src;
-
     switch (status) {
       case 'success':
         src = source.url;
         break;
-
       case 'failure':
         src = _noImage.default;
         break;
-
       default:
         return null;
     }
-
     return {
-      style: { ...props.style,
+      style: {
+        ...props.style,
         backgroundImage: `url("${src}")`
       }
     };
   };
-
   const renderImage = () => {
     if (source.type !== 'image' && source.type !== 'noImage') {
       return null;
     }
-
     let src;
-
     switch (status) {
       case 'success':
         src = source.url;
         break;
-
       case 'failure':
         src = _noImage.default;
         break;
     }
-
     const imageProps = {};
-
     if (status !== 'loading') {
       imageProps.src = src;
-
       if (alt) {
         imageProps.alt = alt;
       }
     }
-
     if (padding) {
       imageProps.style = {
         padding: `${padding instanceof Array ? padding.join('px ') : padding}px`
       };
     }
-
     return /*#__PURE__*/_react.default.createElement("img", (0, _extends2.default)({
       className: `${baseClassName}__image`
     }, imageProps));
   };
-
   return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
     className: (0, _classnames.default)(baseClassName, {
       [`${baseClassName}--background`]: source.type === 'background'
@@ -178,6 +148,5 @@ const PreviewPanel = ({
     className: `${baseClassName}__content-inner`
   }, children)));
 };
-
 var _default = PreviewPanel;
 exports.default = _default;

package/cjs/components/Card/helpers.js

@@ -4,16 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.loadImage = void 0;
-
 // Copyright 1999-2019. Plesk International GmbH. All rights reserved.
-const loadImage = (src, {
-  onSuccess,
-  onFailure
-}) => {
+
+const loadImage = (src, _ref) => {
+  let {
+    onSuccess,
+    onFailure
+  } = _ref;
   const image = new Image();
   image.onload = onSuccess;
   image.onerror = onFailure;
   image.src = src;
 };
-
 exports.loadImage = loadImage;

package/cjs/components/Card/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -17,7 +16,5 @@ Object.defineProperty(exports, "default", {
     return _Card.default;
   }
 });
-
 var _Card = _interopRequireDefault(require("./Card"));
-
 var _PreviewPanel = _interopRequireDefault(require("./PreviewPanel"));