@plesk/ui-library 3.31.0 → 3.31.1

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

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import React, { useState } from 'react';
 import List from './List';
 import ListActions from './ListActions';
@@ -38,11 +39,13 @@ Basic.args = {
   }]
 };
 export const Vertical = Basic.bind(null);
-Vertical.args = { ...Basic.args,
+Vertical.args = {
+  ...Basic.args,
   vertical: 480
 };
 export const Nested = Basic.bind(null);
-Nested.args = { ...Basic.args,
+Nested.args = {
+  ...Basic.args,
   data: [{
     key: '1',
     col1: 'China',
@@ -72,12 +75,14 @@ Nested.args = { ...Basic.args,
   }]
 };
 export const NestedFullFeatured = Nested.bind(null);
-NestedFullFeatured.args = { ...Nested.args,
+NestedFullFeatured.args = {
+  ...Nested.args,
   onSelectionChange: () => {},
   renderRowBody: () => null
 };
 export const ExpandedList = Nested.bind(null);
-ExpandedList.args = { ...Nested.args,
+ExpandedList.args = {
+  ...Nested.args,
   onSelectionChange: () => {},
   renderRowBody: () => 'row body',
   expandedRows: ['1', '2', '4', '6']
@@ -88,26 +93,27 @@ export const Reorderable = args => {
     ...props
   } = args;
   const [data, setData] = useState(initialData);
-
-  const handleReorderEnd = ({
-    oldIndex,
-    newIndex
-  }) => {
+  const handleReorderEnd = _ref => {
+    let {
+      oldIndex,
+      newIndex
+    } = _ref;
     const nextData = [...data];
     nextData.splice(newIndex, 0, nextData.splice(oldIndex, 1)[0]);
     setData(nextData);
   };
-
   return /*#__PURE__*/React.createElement(Basic, _extends({
     data: data,
     reorderable: true,
     onReorderEnd: handleReorderEnd
   }, props));
 };
-Reorderable.args = { ...Basic.args
+Reorderable.args = {
+  ...Basic.args
 };
 export const ReorderableFullFeatured = Reorderable.bind(null);
-ReorderableFullFeatured.args = { ...Reorderable.args,
+ReorderableFullFeatured.args = {
+  ...Reorderable.args,
   columns: [...Reorderable.args.columns, {
     key: 'actions',
     type: 'actions',

package/esm/components/List/ListAction.js

@@ -1,20 +1,22 @@
 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';
-
 /**
  * `ListAction` component is a part of [ListActions](#!/ListActions) component.
  * It accepts the props of [Button](#!/Button) and [MenuItem](#!/MenuItem) components.
  * @since 3.3.0
  */
-const ListAction = ({
-  primary,
-  children,
-  tooltip,
-  ...props
-}) => {
+
+const ListAction = _ref => {
+  let {
+    primary,
+    children,
+    tooltip,
+    ...props
+  } = _ref;
   const render = children => {
     if (primary) {
       return /*#__PURE__*/React.createElement(Button, _extends({
@@ -22,21 +24,16 @@ const ListAction = ({
         tooltip: children
       }, props));
     }
-
     return /*#__PURE__*/React.createElement(MenuItem, _extends({
       tooltip: tooltip
     }, props), children);
   };
-
   const unwrap = cb => cb({
     wrap: children => render(children)
   });
-
   if (typeof children === 'function') {
     return unwrap(children);
   }
-
   return render(children);
 };
-
 export default ListAction;

package/esm/components/List/ListActions.js

@@ -1,5 +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 classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
@@ -8,27 +9,27 @@ import Dropdown from '../Dropdown';
 import Menu from '../Menu';
 import ListAction from './ListAction';
 import VerticalContext from '../VerticalContext';
-
 /**
  * `ListActions` component is used for performing operations on individual objects in [List](#!/List).
  * @since 3.3.0
  */
-const ListActions = ({
-  baseClassName = `${CLS_PREFIX}list-actions`,
-  className,
-  children,
-  locale,
-  ...props
-}) => {
+const ListActions = _ref => {
+  let {
+    baseClassName = `${CLS_PREFIX}list-actions`,
+    className,
+    children,
+    locale,
+    ...props
+  } = _ref;
   const [overlay, setOverlay] = useState(false);
   const vertical = useContext(VerticalContext);
   useEffect(() => {
-    const handler = ({
-      matches
-    }) => {
+    const handler = _ref2 => {
+      let {
+        matches
+      } = _ref2;
       setOverlay(!matches);
     };
-
     const mql = window.matchMedia('(min-width: 768px)');
     handler(mql);
     mql.addListener(handler);
@@ -46,7 +47,6 @@ const ListActions = ({
         hidden
       } = node.props;
       const key = index.toString();
-
       if (primary && !vertical) {
         primaryItems.push(hidden ? /*#__PURE__*/React.createElement("div", {
           className: `${baseClassName}__hidden-action`,
@@ -54,7 +54,6 @@ const ListActions = ({
         }) : node);
       } else {
         secondaryCount++;
-
         if (!hidden) {
           secondaryItems.push( /*#__PURE__*/cloneElement(node, {
             primary: false
@@ -67,7 +66,6 @@ const ListActions = ({
     }
   });
   let secondaryDropdown;
-
   if (secondaryItems.length > 0) {
     secondaryDropdown = /*#__PURE__*/React.createElement(Dropdown, {
       className: `${baseClassName}__menu`,
@@ -84,10 +82,8 @@ const ListActions = ({
       className: `${baseClassName}__menu ${baseClassName}__hidden-action`
     });
   }
-
   return /*#__PURE__*/React.createElement("div", _extends({
     className: classNames(baseClassName, className)
   }, props), primaryItems, secondaryDropdown);
 };
-
 export default ListActions;

package/esm/components/List/ListActionsDivider.js

@@ -1,12 +1,11 @@
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import React from 'react';
 import { MenuDivider } from '../Menu';
-
 /**
  * `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);
-
 export default ListActionsDivider;

package/esm/components/List/ListEmptyView.js

@@ -1,20 +1,18 @@
 import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import React from 'react';
 import classNames from 'classnames';
 import Heading from '../Heading';
 import Translate from '../Translate';
-import empty from './images/default.svg';
-import filtered from './images/filtered.svg';
+import empty from './images/default.png';
+import filtered from './images/filtered.png';
 import { CLS_PREFIX } from '../../constants';
-
 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", {
       src: image,
@@ -22,12 +20,10 @@ const createImage = (baseClassName, image, reason) => {
       alt: ""
     });
   }
-
   return node ? /*#__PURE__*/React.createElement("div", {
     className: `${baseClassName}__image`
   }, node) : null;
 };
-
 const createTitle = (baseClassName, title, reason) => {
   if (title === undefined) {
     title = reason === 'filtered' ? /*#__PURE__*/React.createElement(Translate, {
@@ -38,51 +34,48 @@ const createTitle = (baseClassName, title, reason) => {
       fallback: "Looks like there's nothing here"
     });
   }
-
   return /*#__PURE__*/React.createElement(Heading, {
     level: 3,
     className: `${baseClassName}__title`
   }, title);
 };
-
 const createDescription = (baseClassName, description, reason) => {
   if (description === undefined && !reason) {
     return null;
   }
-
   if (description === undefined && reason === 'filtered') {
     description = /*#__PURE__*/React.createElement(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);
 };
+
 /**
  * `ListEmptyView` component is used for displaying "empty" state of [List](#!/List)
  * when there are no any objects are added to the list.
  * @since 2.5.0
  */
-
-
-const ListEmptyView = ({
-  baseClassName = `${CLS_PREFIX}list-empty-view`,
-  className,
-  title,
-  image,
-  description,
-  actions,
-  reason,
-  ...props
-}) => /*#__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`
-}, actions)));
-
+const ListEmptyView = _ref => {
+  let {
+    baseClassName = `${CLS_PREFIX}list-empty-view`,
+    className,
+    title,
+    image,
+    description,
+    actions,
+    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`
+  }, actions)));
+};
 export default ListEmptyView;

package/esm/components/List/ListOperation.js

@@ -1,4 +1,5 @@
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import React, { useContext, useState, useRef, cloneElement, isValidElement } from 'react';
 import { safeInvoke } from '../utils';
 import ListOperationContext from './ListOperationContext';
@@ -9,56 +10,49 @@ 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);
-
 const getDefaultText = key => {
   let fallback;
-
   switch (key) {
     case 'cancelButton':
       fallback = 'Cancel';
       break;
-
     default:
       throw new Error('Unknown key');
   }
-
   const content = `ListOperation.${key}`;
   return /*#__PURE__*/React.createElement(Translate, {
     content: content,
     fallback: fallback
   });
 };
+
 /**
  * `ListOperation` component is used in [Toolbar](#!/Toolbar) for performing
  * operations on multiple objects in [List](#!/List).
  * @since 2.4.0
  */
-
-
-const ListOperation = ({
-  critical = false,
-  noSelectionText,
-  confirmationText,
-  actionButtonText,
-  cancelButtonText,
-  children,
-  ...props
-}) => {
+const ListOperation = _ref => {
+  let {
+    critical = false,
+    noSelectionText,
+    confirmationText,
+    actionButtonText,
+    cancelButtonText,
+    children,
+    ...props
+  } = _ref;
   const {
     selectedRows,
     selectedRowTitle
   } = useContext(ListOperationContext);
   const [settings, setSettings] = useState();
   const targetRef = useRef();
-
   if (! /*#__PURE__*/isValidElement(children)) {
     throw new Error('The "children" property must be an element.');
   }
-
   const toText = prop => {
     if (typeof prop === 'function') {
       return prop({
@@ -66,13 +60,10 @@ const ListOperation = ({
         selectedRowTitle: toBold(selectedRowTitle)
       });
     }
-
     return prop;
   };
-
   const handleClick = e => {
     targetRef.current = e.currentTarget;
-
     switch (true) {
       case selectedRows && critical:
         setSettings({
@@ -82,7 +73,6 @@ const ListOperation = ({
           cancelButtonText: toText(cancelButtonText) || getDefaultText('cancelButton')
         });
         break;
-
       case !selectedRows && !critical:
         setSettings({
           message: toText(noSelectionText),
@@ -91,7 +81,6 @@ const ListOperation = ({
           cancelButtonText: toText(cancelButtonText) || getDefaultText('cancelButton')
         });
         break;
-
       case !selectedRows && critical:
         setSettings({
           message: toText(noSelectionText),
@@ -101,23 +90,20 @@ const ListOperation = ({
           })
         });
         break;
-
       case selectedRows && !critical:
         safeInvoke(children.props.onClick, e);
         break;
     }
   };
-
   const handleCancel = () => {
     setSettings(null);
   };
-
   const handleAction = e => {
     setSettings(null);
     safeInvoke(children.props.onClick, e);
   };
-
-  const target = /*#__PURE__*/cloneElement(children, { ...props,
+  const target = /*#__PURE__*/cloneElement(children, {
+    ...props,
     onClick: handleClick
   });
   return /*#__PURE__*/React.createElement(Popover, {
@@ -136,5 +122,4 @@ const ListOperation = ({
     onClick: handleCancel
   }, settings.cancelButtonText))));
 };
-
 export default ListOperation;

package/esm/components/List/ListOperationContext.js

@@ -1,4 +1,5 @@
 // Copyright 1999-2019. Plesk International GmbH. All rights reserved.
+
 import { createContext } from 'react';
 const ListOperationContext = /*#__PURE__*/createContext({
   selectedRows: 0

package/esm/components/List/example-data/domains.js

@@ -1,37 +1,27 @@
 // Copyright 1999-2019. Plesk International GmbH. All rights reserved.
+
 const vowels = ['a', 'e', 'i', 'o', 'u'];
 const consonants = ['b', 'c', 'd', 'f', 'g', 'h', 'j', 'k', 'l', 'm', 'n', 'p', 'q', 'r', 's', 't', 'v', 'w', 'x', 'y', 'z'];
-
 const getRandomValue = array => {
   const index = Math.floor(Math.random() * array.length);
   return array[index];
 };
-
 const getRandomLetter = letters => getRandomValue(letters);
-
 const getRandomNumber = (min, max) => min + Math.floor(Math.random() * (max - min + 1));
-
 const getRandomWord = () => {
   let result = '';
   const length = getRandomNumber(5, 8);
   let consonant = Math.random() > 0.2;
-
   while (result.length < length) {
     result += getRandomLetter(consonant ? consonants : vowels);
     consonant = !consonant;
   }
-
   return result;
 };
-
 const getRandomSuffix = () => getRandomValue(['.com', '.net', '.org', '.edu']);
-
 const getRandomDomain = () => getRandomWord() + getRandomSuffix();
-
 const getRandomMarks = () => ['Debug', 'Maintenance mode', 'Have issues', 'Broken', 'Quarantined', 'Update available', 'Have security issues'].filter(() => Math.random() > 0.95);
-
 const data = [];
-
 for (let i = 0; i < 120; i++) {
   data.push({
     key: String(i + 1),
@@ -39,5 +29,4 @@ for (let i = 0; i < 120; i++) {
     marks: getRandomMarks()
   });
 }
-
 module.exports = data;

package/esm/components/List/index.js

@@ -1,4 +1,5 @@
 // Copyright 1999-2017. Plesk International GmbH. All rights reserved.
+
 export { default } from './List';
 export { default as ListOperation } from './ListOperation';
 export { default as ListEmptyView } from './ListEmptyView';

package/esm/components/LocaleProvider/LocaleProvider.js

@@ -1,24 +1,21 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
-import React, { PureComponent, isValidElement, cloneElement, createContext, useContext } from 'react';
-import PropTypes from 'prop-types';
 
-const applyParams = (message, params = {}) => {
+import React, { PureComponent, isValidElement, cloneElement, createContext, useContext, useCallback } from 'react';
+import PropTypes from 'prop-types';
+const applyParams = function (message) {
+  let params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   const result = [];
   let hasElements = false;
   let m;
-
   while (m = message.match(/%%(\w+)%%/)) {
     const {
       index = 0
     } = m;
-
     if (index > 0) {
       result.push(message.substr(0, index));
     }
-
     const param = params[m[1]];
-
     if (param === undefined) {
       result.push(m[0]);
     } else if (typeof param === 'object' && /*#__PURE__*/isValidElement(param)) {
@@ -29,47 +26,39 @@ const applyParams = (message, params = {}) => {
     } else {
       result.push(param);
     }
-
     message = message.substr(index + m[0].length);
   }
-
   if (message !== '') {
     result.push(message);
   }
-
   return hasElements ? result : result.join('');
 };
-
 const getMessage = (fullKey, messages) => {
   const [key, ...rest] = fullKey.split('.');
   const message = messages[key];
-
   if (typeof message === 'object' && rest.length) {
     return getMessage(rest.join('.'), message);
   }
-
   return messages[fullKey];
 };
-
-const createTranslate = messages => // eslint-disable-next-line default-param-last
-(key, params = {}, fallback) => {
+const createTranslate = messages =>
+// eslint-disable-next-line default-param-last
+function (key) {
+  let params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  let fallback = arguments.length > 2 ? arguments[2] : undefined;
   if (typeof key !== 'string') {
     return '';
   }
-
   let message = getMessage(key, messages);
-
   if (typeof message !== 'string') {
     message = typeof fallback === 'string' ? fallback : `[${key}]`;
   }
-
   return applyParams(message, params);
 };
-
 const LocaleContext = /*#__PURE__*/createContext(undefined);
 export const useTranslate = namespace => {
   const context = useContext(LocaleContext);
-  return (key, params, fallback) => {
+  return useCallback((key, params, fallback) => {
     if (context) {
       const {
         locale: {
@@ -78,11 +67,9 @@ export const useTranslate = namespace => {
       } = context;
       return lmsg(namespace ? `${namespace}.${key}` : key, params, fallback);
     }
-
     return typeof fallback === 'string' ? applyParams(fallback, params) : `[${key}]`;
-  };
+  }, [context, namespace]);
 };
-
 /**
  * LocaleProvider provides a uniform localization support for built-in text of components.
  * @since 0.0.42
@@ -98,7 +85,6 @@ class LocaleProvider extends PureComponent {
       }
     };
   }
-
   render() {
     const {
       children
@@ -107,11 +93,8 @@ class LocaleProvider extends PureComponent {
       value: this.getChildContext()
     }, children);
   }
-
 }
-
 _defineProperty(LocaleProvider, "childContextTypes", {
   locale: PropTypes.object
 });
-
 export default LocaleProvider;

package/esm/components/LocaleProvider/index.js

@@ -1,3 +1,4 @@
 // Copyright 1999-2017. Plesk International GmbH. All rights reserved.
+
 export { default } from './LocaleProvider';
 export * from './LocaleProvider';