@plesk/ui-library 3.31.2 → 3.32.0

package/esm/components/Menu/Menu.stories.js

@@ -1,21 +1,24 @@
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-import React, { cloneElement } from 'react';
+import { cloneElement } from 'react';
 import Menu, { MenuItem, MenuDivider, MenuHeader } from '.';
 import Label from '../Label';
-export const Basic = args => /*#__PURE__*/React.createElement(Menu, args);
+import { jsx as _jsx } from "react/jsx-runtime";
+export const Basic = args => /*#__PURE__*/_jsx(Menu, {
+  ...args
+});
 Basic.args = {
-  children: [/*#__PURE__*/React.createElement(MenuItem, {
-    key: "1",
-    "data-test": "one"
-  }, 'One'), /*#__PURE__*/React.createElement(MenuItem, {
-    key: "2",
-    "data-test": "two"
-  }, 'Two'), /*#__PURE__*/React.createElement(MenuItem, {
-    key: "3",
+  children: [/*#__PURE__*/_jsx(MenuItem, {
+    "data-test": "one",
+    children: 'One'
+  }, "1"), /*#__PURE__*/_jsx(MenuItem, {
+    "data-test": "two",
+    children: 'Two'
+  }, "2"), /*#__PURE__*/_jsx(MenuItem, {
     "data-test": "three",
-    disabled: true
-  }, 'Three')]
+    disabled: true,
+    children: 'Three'
+  }, "3")]
 };
 export const Tooltip = Basic.bind(null);
 Tooltip.args = {
@@ -30,34 +33,33 @@ Tooltip.args = {
 };
 export const FullFeatured = Basic.bind(null);
 FullFeatured.args = {
-  children: [/*#__PURE__*/React.createElement(MenuHeader, {
-    key: "1"
-  }, 'Header 1'), /*#__PURE__*/React.createElement(MenuItem, {
-    key: "2",
+  children: [/*#__PURE__*/_jsx(MenuHeader, {
+    children: 'Header 1'
+  }, "1"), /*#__PURE__*/_jsx(MenuItem, {
     "data-test": "2",
     onClick: () => {},
-    icon: "folder-open"
-  }, 'One'), /*#__PURE__*/React.createElement(MenuItem, {
-    key: "3",
+    icon: "folder-open",
+    children: 'One'
+  }, "2"), /*#__PURE__*/_jsx(MenuItem, {
     "data-test": "3",
     onClick: () => {},
     icon: "folder-open",
-    label: /*#__PURE__*/React.createElement(Label, {
-      intent: "danger"
-    }, '99')
-  }, 'Two'), /*#__PURE__*/React.createElement(MenuDivider, {
-    key: "4"
-  }), /*#__PURE__*/React.createElement(MenuHeader, {
-    key: "5"
-  }, 'Header 2'), /*#__PURE__*/React.createElement(MenuItem, {
-    key: "6",
+    label: /*#__PURE__*/_jsx(Label, {
+      intent: "danger",
+      children: '99'
+    }),
+    children: 'Two'
+  }, "3"), /*#__PURE__*/_jsx(MenuDivider, {}, "4"), /*#__PURE__*/_jsx(MenuHeader, {
+    children: 'Header 2'
+  }, "5"), /*#__PURE__*/_jsx(MenuItem, {
     "data-test": "6",
     onClick: () => {},
-    icon: "folder-open"
-  }, 'Three'), /*#__PURE__*/React.createElement(MenuItem, {
-    key: "7",
+    icon: "folder-open",
+    children: 'Three'
+  }, "6"), /*#__PURE__*/_jsx(MenuItem, {
     "data-test": "7",
     onClick: () => {},
-    icon: "folder-open"
-  }, 'Four')]
+    icon: "folder-open",
+    children: 'Four'
+  }, "7")]
 };

package/esm/components/Menu/MenuBaseItem.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 import React from 'react';
@@ -11,6 +10,8 @@ import Icon, { ICON_SIZE_16 } from '../Icon';
  * `MenuBaseItem` component.
  * @since 0.0.60
  */
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const MenuBaseItem = _ref => {
   let {
     baseClassName,
@@ -21,17 +22,22 @@ const MenuBaseItem = _ref => {
     component: Component,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement(Component, _extends({
-    className: classNames(baseClassName, className)
-  }, props), /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}-icon`
-  }, Icon.create(icon, {
-    size: ICON_SIZE_16
-  })), /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}-content`
-  }, children), /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}-label`
-  }, label));
+  return /*#__PURE__*/_jsxs(Component, {
+    className: classNames(baseClassName, className),
+    ...props,
+    children: [/*#__PURE__*/_jsx("div", {
+      className: `${baseClassName}-icon`,
+      children: Icon.create(icon, {
+        size: ICON_SIZE_16
+      })
+    }), /*#__PURE__*/_jsx("div", {
+      className: `${baseClassName}-content`,
+      children: children
+    }), /*#__PURE__*/_jsx("div", {
+      className: `${baseClassName}-label`,
+      children: label
+    })]
+  });
 };
 MenuBaseItem.propTypes = {
   /**

package/esm/components/Menu/MenuDivider.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 import React from 'react';
@@ -10,16 +9,18 @@ import { CLS_PREFIX } from '../../constants';
  * `MenuDivider` is a part of [Menu](#!/Menu) component.
  * @since 0.0.57
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 const MenuDivider = _ref => {
   let {
     baseClassName,
     className,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/_jsx("div", {
     className: classNames(baseClassName, className),
-    role: "separator"
-  }, props));
+    role: "separator",
+    ...props
+  });
 };
 MenuDivider.propTypes = {
   /**

package/esm/components/Menu/MenuHeader.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 import React from 'react';
@@ -11,6 +10,7 @@ import MenuBaseItem from './MenuBaseItem';
  * `MenuHeader` is a part of [Menu](#!/Menu) component.
  * @since 0.0.57
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 const MenuHeader = _ref => {
   let {
     baseClassName,
@@ -18,10 +18,12 @@ const MenuHeader = _ref => {
     children,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement(MenuBaseItem, _extends({
+  return /*#__PURE__*/_jsx(MenuBaseItem, {
     className: classNames(baseClassName, className),
-    role: "none"
-  }, props), children);
+    role: "none",
+    ...props,
+    children: children
+  });
 };
 MenuHeader.propTypes = {
   /**

package/esm/components/Menu/MenuItem.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 import React, { cloneElement } from 'react';
@@ -13,6 +12,7 @@ import MenuBaseItem from './MenuBaseItem';
  * `MenuItem` is a part of [Menu](#!/Menu) component.
  * @since 0.0.55
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 const MenuItem = _ref => {
   let {
     baseClassName,
@@ -26,7 +26,7 @@ const MenuItem = _ref => {
     tooltip,
     ...props
   } = _ref;
-  const element = /*#__PURE__*/React.createElement(MenuBaseItem, _extends({
+  const element = /*#__PURE__*/_jsx(MenuBaseItem, {
     className: classNames(baseClassName, className, {
       [`${baseClassName}--active`]: active,
       [`${baseClassName}--disabled`]: disabled
@@ -40,12 +40,15 @@ const MenuItem = _ref => {
     "aria-disabled": disabled ? 'true' : undefined,
     tabIndex: disabled ? -1 : 0,
     icon: icon,
-    label: label
-  }, props), children);
+    label: label,
+    ...props,
+    children: children
+  });
   if (tooltip) {
-    return createProxyProps(props => /*#__PURE__*/React.createElement(Tooltip, {
-      title: tooltip
-    }, /*#__PURE__*/cloneElement(element, props)));
+    return createProxyProps(props => /*#__PURE__*/_jsx(Tooltip, {
+      title: tooltip,
+      children: /*#__PURE__*/cloneElement(element, props)
+    }));
   }
   return element;
 };
@@ -74,6 +77,7 @@ MenuItem.propTypes = {
    * Tooltip for component.
    * @since 2.6.1
    */
+  // eslint-disable-next-line react/require-default-props
   tooltip: PropTypes.node,
   /**
    * Content of the `MenuItem`.

package/esm/components/Menu/MenuSelectableItem.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 import React from 'react';
@@ -11,6 +10,7 @@ import MenuItem from './MenuItem';
  * `MenuSelectableItem` is a part of [Menu](#!/Menu) component.
  * @since 0.0.57
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 const MenuSelectableItem = _ref => {
   let {
     baseClassName,
@@ -19,12 +19,14 @@ const MenuSelectableItem = _ref => {
     selected,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement(MenuItem, _extends({
+  return /*#__PURE__*/_jsx(MenuItem, {
     className: classNames(baseClassName, className),
     icon: selected ? 'check-mark' : null,
     role: "menuitemcheckbox",
-    "aria-checked": selected ? 'true' : 'false'
-  }, props), children);
+    "aria-checked": selected ? 'true' : 'false',
+    ...props,
+    children: children
+  });
 };
 MenuSelectableItem.propTypes = {
   /**

package/esm/components/Overlay/Backdrop.js

@@ -1,10 +1,10 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
+import { jsx as _jsx } from "react/jsx-runtime";
 const Backdrop = _ref => {
   let {
     baseClassName,
@@ -12,10 +12,11 @@ const Backdrop = _ref => {
     innerRef,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/_jsx("div", {
     ref: innerRef,
-    className: classNames(baseClassName, className)
-  }, props));
+    className: classNames(baseClassName, className),
+    ...props
+  });
 };
 Backdrop.propTypes = {
   /**

package/esm/components/Overlay/Overlay.js

@@ -1,9 +1,8 @@
-import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2021. Plesk International GmbH. All rights reserved.
 
 import { disableDocumentScroll, enableDocumentScroll } from '../../utils';
-import React, { Component, Fragment, createRef, isValidElement } from 'react';
+import React, { Component, createRef, isValidElement } from 'react';
 import { safeInvoke } from '../utils';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -12,6 +11,8 @@ import { CSSTransition } from 'react-transition-group';
 import Backdrop from './Backdrop';
 import Layer from '../Layer';
 import FocusTrap from '../FocusTrap';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * `Overlay` component.
  */
@@ -118,7 +119,7 @@ export default class Overlay extends Component {
       canCloseOnEscapePress,
       sideBanner
     } = _ref;
-    return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(CSSTransition, {
+    return /*#__PURE__*/_jsx(CSSTransition, {
       in: this.state.isOpened,
       classNames: `${baseClassName}-`,
       timeout: 300,
@@ -127,33 +128,37 @@ export default class Overlay extends Component {
           isExist: false
         });
       },
-      nodeRef: this.contentRef
-    }, /*#__PURE__*/React.createElement(FocusTrap, {
-      className: `${baseClassName}__content`,
-      onKeyUp: canCloseOnEscapePress ? this.handleContentKeyUp : null,
-      ref: this.contentRef,
-      role: "dialog",
-      "aria-modal": "true"
-    }, /*#__PURE__*/React.createElement("div", {
-      className: `${baseClassName}__body`
-    }, children), this.renderImage({
-      baseClassName,
-      image: sideBanner
-    }))));
+      nodeRef: this.contentRef,
+      children: /*#__PURE__*/_jsxs(FocusTrap, {
+        className: `${baseClassName}__content`,
+        onKeyUp: canCloseOnEscapePress ? this.handleContentKeyUp : null,
+        ref: this.contentRef,
+        role: "dialog",
+        "aria-modal": "true",
+        children: [/*#__PURE__*/_jsx("div", {
+          className: `${baseClassName}__body`,
+          children: children
+        }), this.renderImage({
+          baseClassName,
+          image: sideBanner
+        })]
+      })
+    });
   }
   renderBackdrop(_ref2) {
     let {
       baseClassName
     } = _ref2;
-    return /*#__PURE__*/React.createElement(CSSTransition, {
+    return /*#__PURE__*/_jsx(CSSTransition, {
       in: this.state.isOpened,
       classNames: `${baseClassName}-`,
       timeout: 300,
-      nodeRef: this.backdropRef
-    }, /*#__PURE__*/React.createElement(Backdrop, {
-      onClick: () => this.handleBackdropClick(),
-      innerRef: this.backdropRef
-    }));
+      nodeRef: this.backdropRef,
+      children: /*#__PURE__*/_jsx(Backdrop, {
+        onClick: () => this.handleBackdropClick(),
+        innerRef: this.backdropRef
+      })
+    });
   }
   renderImage(_ref3) {
     let {
@@ -165,23 +170,27 @@ export default class Overlay extends Component {
       return null;
     }
     if ( /*#__PURE__*/isValidElement(image)) {
-      return /*#__PURE__*/React.createElement("div", {
-        className: `${classPrefix}`
-      }, image);
+      return /*#__PURE__*/_jsx("div", {
+        className: `${classPrefix}`,
+        children: image
+      });
     }
     if (typeof image === 'string') {
-      return /*#__PURE__*/React.createElement("div", {
-        className: classPrefix
-      }, /*#__PURE__*/React.createElement("img", {
-        className: `${classPrefix}-image`,
-        src: image
-      }));
+      return /*#__PURE__*/_jsx("div", {
+        className: classPrefix,
+        children: /*#__PURE__*/_jsx("img", {
+          className: `${classPrefix}-image`,
+          src: image
+        })
+      });
     }
-    return /*#__PURE__*/React.createElement("div", {
-      className: classPrefix
-    }, /*#__PURE__*/React.createElement("img", _extends({
-      className: `${classPrefix}-image`
-    }, image)));
+    return /*#__PURE__*/_jsx("div", {
+      className: classPrefix,
+      children: /*#__PURE__*/_jsx("img", {
+        className: `${classPrefix}-image`,
+        ...image
+      })
+    });
   }
   render() {
     const {
@@ -205,23 +214,26 @@ export default class Overlay extends Component {
     if (!isExist) {
       return null;
     }
-    return /*#__PURE__*/React.createElement(Layer, {
-      level: Z_INDEX_OVERLAY
-    }, /*#__PURE__*/React.createElement("div", _extends({
-      className: classNames(baseClassName, `${baseClassName}--${placement}`, `${baseClassName}--${size}`, sideBanner && `${baseClassName}--side`, className),
-      style: {
-        '--sideBannerBackground': sideBannerContainer?.background,
-        '--sideBannerAlign': sideBannerContainer?.align,
-        ...style
-      }
-    }, props), this.renderBackdrop({
-      baseClassName
-    }), this.renderContent({
-      baseClassName,
-      children,
-      canCloseOnEscapePress,
-      sideBanner
-    })));
+    return /*#__PURE__*/_jsx(Layer, {
+      level: Z_INDEX_OVERLAY,
+      children: /*#__PURE__*/_jsxs("div", {
+        className: classNames(baseClassName, `${baseClassName}--${placement}`, `${baseClassName}--${size}`, sideBanner && `${baseClassName}--side`, className),
+        style: {
+          '--sideBannerBackground': sideBannerContainer?.background,
+          '--sideBannerAlign': sideBannerContainer?.align,
+          ...style
+        },
+        ...props,
+        children: [this.renderBackdrop({
+          baseClassName
+        }), this.renderContent({
+          baseClassName,
+          children,
+          canCloseOnEscapePress,
+          sideBanner
+        })]
+      })
+    });
   }
 }
 _defineProperty(Overlay, "propTypes", {

package/esm/components/PageHeader/PageHeader.js

@@ -1,11 +1,12 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 import classNames from 'classnames';
-import React, { Children } from 'react';
+import { Children } from 'react';
 import { isLikeText } from '../Translate';
 import { CLS_PREFIX } from '../../constants';
 import Heading from '../Heading';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * `PageHeader` component is used for identification of the current page.
  * @since 0.0.35
@@ -23,26 +24,39 @@ const PageHeader = _ref => {
     children,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: classNames(baseClassName, className)
-  }, props), /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__inner`
-  }, topAddon && /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__top-addon`
-  }, topAddon), breadcrumbs && /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__breadcrumbs`
-  }, breadcrumbs), title && /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__title`
-  }, titleLeftAddon && /*#__PURE__*/React.createElement("span", {
-    className: `${baseClassName}__title-left-addon`
-  }, titleLeftAddon), isLikeText(title) ? /*#__PURE__*/React.createElement(Heading, null, title) : title, titleRightAddon && /*#__PURE__*/React.createElement("span", {
-    className: `${baseClassName}__title-right-addon`
-  }, titleRightAddon)), Children.toArray(children).length ? /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__content`
-  }, children) : null), tabs && /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__tabs`
-  }, /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__tabs-inner`
-  }, tabs)));
+  return /*#__PURE__*/_jsxs("div", {
+    className: classNames(baseClassName, className),
+    ...props,
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: `${baseClassName}__inner`,
+      children: [topAddon && /*#__PURE__*/_jsx("div", {
+        className: `${baseClassName}__top-addon`,
+        children: topAddon
+      }), breadcrumbs && /*#__PURE__*/_jsx("div", {
+        className: `${baseClassName}__breadcrumbs`,
+        children: breadcrumbs
+      }), title && /*#__PURE__*/_jsxs("div", {
+        className: `${baseClassName}__title`,
+        children: [titleLeftAddon && /*#__PURE__*/_jsx("span", {
+          className: `${baseClassName}__title-left-addon`,
+          children: titleLeftAddon
+        }), isLikeText(title) ? /*#__PURE__*/_jsx(Heading, {
+          children: title
+        }) : title, titleRightAddon && /*#__PURE__*/_jsx("span", {
+          className: `${baseClassName}__title-right-addon`,
+          children: titleRightAddon
+        })]
+      }), Children.toArray(children).length ? /*#__PURE__*/_jsx("div", {
+        className: `${baseClassName}__content`,
+        children: children
+      }) : null]
+    }), tabs && /*#__PURE__*/_jsx("div", {
+      className: `${baseClassName}__tabs`,
+      children: /*#__PURE__*/_jsx("div", {
+        className: `${baseClassName}__tabs-inner`,
+        children: tabs
+      })
+    })]
+  });
 };
 export default PageHeader;