@plesk/ui-library 3.31.3 → 3.32.0

package/esm/components/List/List.stories.js

@@ -1,11 +1,14 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-import React, { useState } from 'react';
+import { useState } from 'react';
 import List from './List';
 import ListActions from './ListActions';
 import ListAction from './ListAction';
-export const Basic = args => /*#__PURE__*/React.createElement(List, args);
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export const Basic = args => /*#__PURE__*/_jsx(List, {
+  ...args
+});
 Basic.args = {
   columns: [{
     key: 'col1',
@@ -102,11 +105,12 @@ export const Reorderable = args => {
     nextData.splice(newIndex, 0, nextData.splice(oldIndex, 1)[0]);
     setData(nextData);
   };
-  return /*#__PURE__*/React.createElement(Basic, _extends({
+  return /*#__PURE__*/_jsx(Basic, {
     data: data,
     reorderable: true,
-    onReorderEnd: handleReorderEnd
-  }, props));
+    onReorderEnd: handleReorderEnd,
+    ...props
+  });
 };
 Reorderable.args = {
   ...Basic.args
@@ -117,17 +121,18 @@ ReorderableFullFeatured.args = {
   columns: [...Reorderable.args.columns, {
     key: 'actions',
     type: 'actions',
-    // eslint-disable-next-line react/display-name
-    render: () => /*#__PURE__*/React.createElement(ListActions, null, /*#__PURE__*/React.createElement(ListAction, {
-      icon: "clip",
-      primary: true
-    }), /*#__PURE__*/React.createElement(ListAction, {
-      icon: "clock",
-      primary: true
-    }), /*#__PURE__*/React.createElement(ListAction, {
-      icon: "clone",
-      primary: true
-    }))
+    render: () => /*#__PURE__*/_jsxs(ListActions, {
+      children: [/*#__PURE__*/_jsx(ListAction, {
+        icon: "clip",
+        primary: true
+      }), /*#__PURE__*/_jsx(ListAction, {
+        icon: "clock",
+        primary: true
+      }), /*#__PURE__*/_jsx(ListAction, {
+        icon: "clone",
+        primary: true
+      })]
+    })
   }],
   onSelectionChange: () => {},
   renderRowBody: () => null

package/esm/components/List/ListAction.js

@@ -1,9 +1,8 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-import React from 'react';
 import Button from '../Button';
 import { MenuItem } from '../Menu';
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * `ListAction` component is a part of [ListActions](#!/ListActions) component.
  * It accepts the props of [Button](#!/Button) and [MenuItem](#!/MenuItem) components.
@@ -19,14 +18,17 @@ const ListAction = _ref => {
   } = _ref;
   const render = children => {
     if (primary) {
-      return /*#__PURE__*/React.createElement(Button, _extends({
+      return /*#__PURE__*/_jsx(Button, {
         ghost: true,
-        tooltip: children
-      }, props));
+        tooltip: children,
+        ...props
+      });
     }
-    return /*#__PURE__*/React.createElement(MenuItem, _extends({
-      tooltip: tooltip
-    }, props), children);
+    return /*#__PURE__*/_jsx(MenuItem, {
+      tooltip: tooltip,
+      ...props,
+      children: children
+    });
   };
   const unwrap = cb => cb({
     wrap: children => render(children)

package/esm/components/List/ListActions.js

@@ -1,7 +1,6 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-import React, { Children, isValidElement, useState, useEffect, useContext, cloneElement } from 'react';
+import { Children, isValidElement, useState, useEffect, useContext, cloneElement } from 'react';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
 import Button from '../Button';
@@ -9,6 +8,8 @@ import Dropdown from '../Dropdown';
 import Menu from '../Menu';
 import ListAction from './ListAction';
 import VerticalContext from '../VerticalContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * `ListActions` component is used for performing operations on individual objects in [List](#!/List).
  * @since 3.3.0
@@ -48,10 +49,9 @@ const ListActions = _ref => {
       } = node.props;
       const key = index.toString();
       if (primary && !vertical) {
-        primaryItems.push(hidden ? /*#__PURE__*/React.createElement("div", {
-          className: `${baseClassName}__hidden-action`,
-          key: key
-        }) : node);
+        primaryItems.push(hidden ? /*#__PURE__*/_jsx("div", {
+          className: `${baseClassName}__hidden-action`
+        }, key) : node);
       } else {
         secondaryCount++;
         if (!hidden) {
@@ -67,23 +67,28 @@ const ListActions = _ref => {
   });
   let secondaryDropdown;
   if (secondaryItems.length > 0) {
-    secondaryDropdown = /*#__PURE__*/React.createElement(Dropdown, {
+    secondaryDropdown = /*#__PURE__*/_jsx(Dropdown, {
       className: `${baseClassName}__menu`,
-      menu: /*#__PURE__*/React.createElement(Menu, null, secondaryItems),
+      menu: /*#__PURE__*/_jsx(Menu, {
+        children: secondaryItems
+      }),
       menuPlacement: "bottom-end",
       overlay: overlay,
-      locale: locale
-    }, /*#__PURE__*/React.createElement(Button, {
-      ghost: true,
-      icon: "kebab"
-    }));
+      locale: locale,
+      children: /*#__PURE__*/_jsx(Button, {
+        ghost: true,
+        icon: "kebab"
+      })
+    });
   } else if (secondaryCount) {
-    secondaryDropdown = /*#__PURE__*/React.createElement("div", {
+    secondaryDropdown = /*#__PURE__*/_jsx("div", {
       className: `${baseClassName}__menu ${baseClassName}__hidden-action`
     });
   }
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: classNames(baseClassName, className)
-  }, props), primaryItems, secondaryDropdown);
+  return /*#__PURE__*/_jsxs("div", {
+    className: classNames(baseClassName, className),
+    ...props,
+    children: [primaryItems, secondaryDropdown]
+  });
 };
 export default ListActions;

package/esm/components/List/ListActionsDivider.js

@@ -1,11 +1,13 @@
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-import React from 'react';
 import { MenuDivider } from '../Menu';
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * `ListActionsDivider` component is a part of [ListActions](#!/ListActions) component.
  * It accepts the props of [MenuDivider](#!/MenuDivider) component.
  * @since 3.10.0
  */
-const ListActionsDivider = props => /*#__PURE__*/React.createElement(MenuDivider, props);
+const ListActionsDivider = props => /*#__PURE__*/_jsx(MenuDivider, {
+  ...props
+});
 export default ListActionsDivider;

package/esm/components/List/ListEmptyView.js

@@ -1,7 +1,5 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2023. Plesk International GmbH. All rights reserved.
 
-import React from 'react';
 import classNames from 'classnames';
 import Heading from '../Heading';
 import Translate from '../Translate';
@@ -9,50 +7,55 @@ import empty from './images/default.png';
 import filtered from './images/filtered.png';
 import { CLS_PREFIX } from '../../constants';
 import { ButtonContext, getButtonContextValue } from '../Button/ButtonContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const createImage = (baseClassName, image, reason) => {
   if (image === undefined) {
     image = reason === 'filtered' ? filtered : empty;
   }
   let node = image;
   if (typeof image === 'string') {
-    node = /*#__PURE__*/React.createElement("img", {
+    node = /*#__PURE__*/_jsx("img", {
       src: image,
       height: "192",
       alt: ""
     });
   }
-  return node ? /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__image`
-  }, node) : null;
+  return node ? /*#__PURE__*/_jsx("div", {
+    className: `${baseClassName}__image`,
+    children: node
+  }) : null;
 };
 const createTitle = (baseClassName, title, reason) => {
   if (title === undefined) {
-    title = reason === 'filtered' ? /*#__PURE__*/React.createElement(Translate, {
+    title = reason === 'filtered' ? /*#__PURE__*/_jsx(Translate, {
       content: "ListEmptyView.filteredTitle",
       fallback: "Could not find any items matching the filter"
-    }) : /*#__PURE__*/React.createElement(Translate, {
+    }) : /*#__PURE__*/_jsx(Translate, {
       content: "ListEmptyView.emptyTitle",
       fallback: "Looks like there's nothing here"
     });
   }
-  return /*#__PURE__*/React.createElement(Heading, {
+  return /*#__PURE__*/_jsx(Heading, {
     level: 3,
-    className: `${baseClassName}__title`
-  }, title);
+    className: `${baseClassName}__title`,
+    children: title
+  });
 };
 const createDescription = (baseClassName, description, reason) => {
   if (description === undefined && !reason) {
     return null;
   }
   if (description === undefined && reason === 'filtered') {
-    description = /*#__PURE__*/React.createElement(Translate, {
+    description = /*#__PURE__*/_jsx(Translate, {
       content: "ListEmptyView.filteredDescription",
       fallback: "Refine your query or remove some of the criteria from the filter and try again."
     });
   }
-  return /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__description`
-  }, description);
+  return /*#__PURE__*/_jsx("div", {
+    className: `${baseClassName}__description`,
+    children: description
+  });
 };
 const buttonConfig = getButtonContextValue({
   defaultProps: {
@@ -76,14 +79,19 @@ const ListEmptyView = _ref => {
     reason,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: classNames(baseClassName, className)
-  }, props), createImage(baseClassName, image, reason), /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__body`
-  }, createTitle(baseClassName, title, reason), createDescription(baseClassName, description, reason), actions && /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__actions`
-  }, /*#__PURE__*/React.createElement(ButtonContext.Provider, {
-    value: buttonConfig
-  }, actions))));
+  return /*#__PURE__*/_jsxs("div", {
+    className: classNames(baseClassName, className),
+    ...props,
+    children: [createImage(baseClassName, image, reason), /*#__PURE__*/_jsxs("div", {
+      className: `${baseClassName}__body`,
+      children: [createTitle(baseClassName, title, reason), createDescription(baseClassName, description, reason), actions && /*#__PURE__*/_jsx("div", {
+        className: `${baseClassName}__actions`,
+        children: /*#__PURE__*/_jsx(ButtonContext.Provider, {
+          value: buttonConfig,
+          children: actions
+        })
+      })]
+    })]
+  });
 };
 export default ListEmptyView;

package/esm/components/List/ListOperation.js

@@ -1,6 +1,6 @@
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-import React, { useContext, useState, useRef, cloneElement, isValidElement } from 'react';
+import { useContext, useState, useRef, cloneElement, isValidElement } from 'react';
 import { safeInvoke } from '../utils';
 import ListOperationContext from './ListOperationContext';
 import Popover from '../Popover';
@@ -10,9 +10,12 @@ import Media from '../Media';
 import Icon from '../Icon';
 import Text from '../Text';
 import Paragraph from '../Paragraph';
-const toBold = value => value === undefined ? undefined : /*#__PURE__*/React.createElement(Text, {
-  bold: true
-}, value);
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const toBold = value => value === undefined ? undefined : /*#__PURE__*/_jsx(Text, {
+  bold: true,
+  children: value
+});
 const getDefaultText = key => {
   let fallback;
   switch (key) {
@@ -23,12 +26,11 @@ const getDefaultText = key => {
       throw new Error('Unknown key');
   }
   const content = `ListOperation.${key}`;
-  return /*#__PURE__*/React.createElement(Translate, {
+  return /*#__PURE__*/_jsx(Translate, {
     content: content,
     fallback: fallback
   });
 };
-
 /**
  * `ListOperation` component is used in [Toolbar](#!/Toolbar) for performing
  * operations on multiple objects in [List](#!/List).
@@ -48,7 +50,7 @@ const ListOperation = _ref => {
     selectedRows,
     selectedRowTitle
   } = useContext(ListOperationContext);
-  const [settings, setSettings] = useState();
+  const [settings, setSettings] = useState(null);
   const targetRef = useRef();
   if (! /*#__PURE__*/isValidElement(children)) {
     throw new Error('The "children" property must be an element.');
@@ -84,7 +86,7 @@ const ListOperation = _ref => {
       case !selectedRows && critical:
         setSettings({
           message: toText(noSelectionText),
-          icon: /*#__PURE__*/React.createElement(Icon, {
+          icon: /*#__PURE__*/_jsx(Icon, {
             intent: "info",
             name: "info-circle-filled"
           })
@@ -106,20 +108,28 @@ const ListOperation = _ref => {
     ...props,
     onClick: handleClick
   });
-  return /*#__PURE__*/React.createElement(Popover, {
+  return /*#__PURE__*/_jsx(Popover, {
     visible: !!settings,
     target: target,
     targetRef: targetRef,
     placement: "top",
-    onClose: handleCancel
-  }, settings && /*#__PURE__*/React.createElement(Media, {
-    image: settings.icon
-  }, /*#__PURE__*/React.createElement(Paragraph, null, settings.message), settings.actionButtonText && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
-    onClick: handleAction,
-    intent: settings.actionButtonIntent
-  }, settings.actionButtonText), ` `, /*#__PURE__*/React.createElement(Button, {
-    ghost: true,
-    onClick: handleCancel
-  }, settings.cancelButtonText))));
+    onClose: handleCancel,
+    children: settings && /*#__PURE__*/_jsxs(Media, {
+      image: settings.icon,
+      children: [/*#__PURE__*/_jsx(Paragraph, {
+        children: settings.message
+      }), settings.actionButtonText && /*#__PURE__*/_jsxs("div", {
+        children: [/*#__PURE__*/_jsx(Button, {
+          onClick: handleAction,
+          intent: settings.actionButtonIntent,
+          children: settings.actionButtonText
+        }), ` `, /*#__PURE__*/_jsx(Button, {
+          ghost: true,
+          onClick: handleCancel,
+          children: settings.cancelButtonText
+        })]
+      })]
+    })
+  });
 };
 export default ListOperation;

package/esm/components/LocaleProvider/LocaleProvider.js

@@ -1,8 +1,9 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-import React, { PureComponent, isValidElement, cloneElement, createContext, useContext, useCallback } from 'react';
+import { PureComponent, isValidElement, cloneElement, createContext, useContext, useCallback } from 'react';
 import PropTypes from 'prop-types';
+import { jsx as _jsx } from "react/jsx-runtime";
 const applyParams = function (message) {
   let params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   const result = [];
@@ -89,9 +90,10 @@ class LocaleProvider extends PureComponent {
     const {
       children
     } = this.props;
-    return /*#__PURE__*/React.createElement(LocaleContext.Provider, {
-      value: this.getChildContext()
-    }, children);
+    return /*#__PURE__*/_jsx(LocaleContext.Provider, {
+      value: this.getChildContext(),
+      children: children
+    });
   }
 }
 _defineProperty(LocaleProvider, "childContextTypes", {

package/esm/components/Markdown/Markdown.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 /* eslint-disable react/no-danger */
@@ -8,6 +7,7 @@ import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { marked } from 'marked';
 import { CLS_PREFIX } from '../../constants';
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * `Markdown` component is used for creating content with rich text formatting.
  * @since 0.0.42
@@ -20,14 +20,15 @@ const Markdown = _ref => {
     children,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/_jsx("div", {
     className: classNames(baseClassName, {
       [`${baseClassName}--compact`]: compact
     }, className),
     dangerouslySetInnerHTML: {
       __html: marked(children)
-    }
-  }, props));
+    },
+    ...props
+  });
 };
 Markdown.propTypes = {
   /**

package/esm/components/Media/Media.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 import React, { isValidElement, cloneElement, Children } from 'react';
@@ -7,6 +6,8 @@ import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
 import Icon, { ICON_SIZE_12, ICON_SIZE_16, ICON_SIZE_24, ICON_SIZE_32, ICON_SIZE_48, ICON_SIZE_64, ICON_SIZE_96, ICON_SIZE_128, ICON_SIZE_192 } from '../Icon';
 import Heading from '../Heading';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * `Media` component is a combination of icon, text title and content.
  * This layout was so widely spread in our products so we have decided to create a special component for it.
@@ -47,10 +48,11 @@ const Media = _ref => {
       return null;
     }
     if (typeof title === 'string') {
-      return /*#__PURE__*/React.createElement(Heading, {
+      return /*#__PURE__*/_jsx(Heading, {
         level: 5,
-        className: `${baseClassName}__title`
-      }, title);
+        className: `${baseClassName}__title`,
+        children: title
+      });
     }
     if ( /*#__PURE__*/isValidElement(title)) {
       return /*#__PURE__*/cloneElement(title, {
@@ -59,27 +61,34 @@ const Media = _ref => {
     }
     return null;
   };
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/_jsxs("div", {
     className: classNames(baseClassName, {
       [`${baseClassName}--${align}`]: align,
       [`${baseClassName}--vertical`]: vertical
-    }, className)
-  }, props), image && /*#__PURE__*/React.createElement("figure", {
-    className: classNames(`${baseClassName}__figure`, {
-      [`${baseClassName}__figure--${imageSpacing}`]: imageSpacing,
-      [`${baseClassName}__figure--${imageAlign}`]: imageAlign
-    })
-  }, image), /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__body`
-  }, title || titleAddon ? /*#__PURE__*/React.createElement("div", {
-    className: classNames(`${baseClassName}__header`, {
-      [`${baseClassName}__header--${titleSize}`]: titleSize
-    })
-  }, renderTitle(title), titleAddon && /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__title-addon`
-  }, titleAddon)) : null, Children.toArray(children).length ? /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__content`
-  }, children) : null));
+    }, className),
+    ...props,
+    children: [image && /*#__PURE__*/_jsx("figure", {
+      className: classNames(`${baseClassName}__figure`, {
+        [`${baseClassName}__figure--${imageSpacing}`]: imageSpacing,
+        [`${baseClassName}__figure--${imageAlign}`]: imageAlign
+      }),
+      children: image
+    }), /*#__PURE__*/_jsxs("div", {
+      className: `${baseClassName}__body`,
+      children: [title || titleAddon ? /*#__PURE__*/_jsxs("div", {
+        className: classNames(`${baseClassName}__header`, {
+          [`${baseClassName}__header--${titleSize}`]: titleSize
+        }),
+        children: [renderTitle(title), titleAddon && /*#__PURE__*/_jsx("div", {
+          className: `${baseClassName}__title-addon`,
+          children: titleAddon
+        })]
+      }) : null, Children.toArray(children).length ? /*#__PURE__*/_jsx("div", {
+        className: `${baseClassName}__content`,
+        children: children
+      }) : null]
+    })]
+  });
 };
 Media.propTypes = {
   /**

package/esm/components/Media/MediaSection.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,6 +9,7 @@ import { CLS_PREFIX } from '../../constants';
  * `MediaSection` is a part of [Media](#!/Media) component.
  * @since 0.0.68
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 const MediaSection = _ref => {
   let {
     baseClassName,
@@ -17,9 +17,11 @@ const MediaSection = _ref => {
     children,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: classNames(baseClassName, className)
-  }, props), children);
+  return /*#__PURE__*/_jsx("div", {
+    className: classNames(baseClassName, className),
+    ...props,
+    children: children
+  });
 };
 MediaSection.propTypes = {
   /**

package/esm/components/Menu/Menu.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 import React, { Children, cloneElement, isValidElement, forwardRef, useRef, useMemo } from 'react';
@@ -8,6 +7,7 @@ import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
 import MenuItem from './MenuItem';
 import MenuSelectableItem from './MenuSelectableItem';
+import { jsx as _jsx } from "react/jsx-runtime";
 const hasIconItem = children => {
   let result = false;
   Children.forEach(children, child => {
@@ -95,13 +95,13 @@ const Menu = /*#__PURE__*/forwardRef(function Menu(_ref, ref) {
     }
     return /*#__PURE__*/cloneElement(child, props);
   });
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/_jsx("div", {
     className: classNames(baseClassName, className, {
       [`${baseClassName}--icons`]: hasIconItem(children),
       [`${baseClassName}--overlay`]: overlay
     }),
-    role: "menu"
-  }, props, {
+    role: "menu",
+    ...props,
     ref: el => {
       rootRef.current = el;
       if (ref) {
@@ -110,8 +110,9 @@ const Menu = /*#__PURE__*/forwardRef(function Menu(_ref, ref) {
     },
     onKeyDown: handleKeyDown,
     onFocus: handleFocus,
-    tabIndex: -1
-  }), items);
+    tabIndex: -1,
+    children: items
+  });
 });
 Menu.displayName = 'Menu';
 Menu.propTypes = {