@plesk/ui-library 3.31.0 → 3.31.2

package/esm/components/TextArea/TextArea.js

@@ -1,11 +1,11 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import classNames from 'classnames';
 import React, { Component, createRef } from 'react';
 import { CLS_PREFIX } from '../../constants';
 import calculateNodeHeight from './calculateNodeHeight';
-
 const getMinMax = rows => {
   if (typeof rows === 'number') {
     return {
@@ -17,83 +17,69 @@ const getMinMax = rows => {
       maxRows: rows.max
     };
   }
-
   return null;
 };
-
 const AVAILABLE_SIZES = ['sm', 'md', 'lg', 'xl', 'fill'];
+
 /**
  * `TextArea` is used for entering long text (like email body, descriptions, comments).
  * @since 1.9.0
  */
 
 class TextArea extends Component {
-  constructor(...args) {
-    super(...args);
-
+  constructor() {
+    super(...arguments);
     _defineProperty(this, "state", {
       textareaStyles: null
     });
-
     _defineProperty(this, "rootRef", /*#__PURE__*/createRef());
-
     _defineProperty(this, "handleChange", e => {
       const {
         autoheight,
         onChange
       } = this.props;
-
       if (autoheight) {
         this.adjustHeight();
       }
-
       if (typeof onChange === 'function') {
         onChange(e);
       }
     });
   }
-
-  static getDerivedStateFromProps({
-    rows
-  }) {
+  static getDerivedStateFromProps(_ref) {
+    let {
+      rows
+    } = _ref;
     if (rows) {
       return getMinMax(rows);
     }
-
     return null;
   }
-
   componentDidMount() {
     this.adjustHeight();
   }
-
   componentDidUpdate(prevProps) {
     const {
       autoheight
     } = this.props;
-
     if (autoheight !== prevProps.autoheight) {
       this.adjustHeight();
     }
   }
-
   adjustHeight() {
     const {
       autoheight
     } = this.props;
-
     if (!autoheight) {
       this.setState({
         textareaStyles: null
       });
       return;
     }
-
     const {
       minRows,
       maxRows
     } = this.state;
-
     if (this.rootRef.current) {
       const textareaStyles = calculateNodeHeight(this.rootRef.current, false, minRows, maxRows);
       this.setState({
@@ -101,7 +87,6 @@ class TextArea extends Component {
       });
     }
   }
-
   render() {
     const {
       baseClassName,
@@ -127,9 +112,7 @@ class TextArea extends Component {
       rows: minRows
     }, other));
   }
-
 }
-
 _defineProperty(TextArea, "defaultProps", {
   baseClassName: `${CLS_PREFIX}textarea`,
   className: null,
@@ -138,5 +121,4 @@ _defineProperty(TextArea, "defaultProps", {
   autoheight: false,
   onChange: null
 });
-
 export default TextArea;

package/esm/components/TextArea/calculateNodeHeight.js

@@ -1,5 +1,7 @@
 // Copyright 1999-2019. Plesk International GmbH. All rights reserved.
+
 // Thanks to https://github.com/andreypopp/react-textarea-autosize/
+
 const HIDDEN_TEXTAREA_STYLE = `
   min-height:0 !important;
   max-height:none !important;
@@ -14,12 +16,11 @@ const HIDDEN_TEXTAREA_STYLE = `
 const SIZING_STYLE = ['letter-spacing', 'line-height', 'padding-top', 'padding-bottom', 'font-family', 'font-weight', 'font-size', 'font-variant', 'text-rendering', 'text-transform', 'width', 'text-indent', 'padding-left', 'padding-right', 'border-width', 'box-sizing'];
 const computedStyleCache = new Map();
 let hiddenTextarea;
-
-const calculateNodeStyling = (node, useCache = false) => {
+const calculateNodeStyling = function (node) {
+  let useCache = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   if (useCache && computedStyleCache.has(node)) {
     return computedStyleCache.get(node);
   }
-
   const style = window.getComputedStyle(node);
   const boxSizing = style.getPropertyValue('box-sizing') || style.getPropertyValue('-moz-box-sizing') || style.getPropertyValue('-webkit-box-sizing');
   const paddingSize = parseFloat(style.getPropertyValue('padding-bottom')) + parseFloat(style.getPropertyValue('padding-top'));
@@ -31,42 +32,42 @@ const calculateNodeStyling = (node, useCache = false) => {
     borderSize,
     boxSizing
   };
-
   if (useCache) {
     computedStyleCache.set(node, nodeInfo);
   }
-
   return nodeInfo;
-}; // eslint-disable-next-line max-params
-
+};
 
-export default function calculateNodeHeight(uiTextNode, useCache = false, minRows = null, maxRows = null) {
+// eslint-disable-next-line max-params
+export default function calculateNodeHeight(uiTextNode) {
+  let useCache = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  let minRows = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+  let maxRows = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
   if (!hiddenTextarea) {
     hiddenTextarea = document.createElement('textarea');
     document.body.appendChild(hiddenTextarea);
   }
-
   if (uiTextNode.getAttribute('wrap')) {
     hiddenTextarea.setAttribute('wrap', uiTextNode.getAttribute('wrap'));
   } else {
     hiddenTextarea.removeAttribute('wrap');
-  } // Copy all CSS properties that have an impact on the height of the content in the textbox
-
+  }
 
+  // Copy all CSS properties that have an impact on the height of the content in the textbox
   const {
     paddingSize,
     borderSize,
     boxSizing,
     sizingStyle
-  } = calculateNodeStyling(uiTextNode, useCache); // Need to have the overflow attribute to hide the scrollbar otherwise text-lines will not calculated properly as the shadow will technically be narrower for content
+  } = calculateNodeStyling(uiTextNode, useCache);
 
+  // Need to have the overflow attribute to hide the scrollbar otherwise text-lines will not calculated properly as the shadow will technically be narrower for content
   hiddenTextarea.setAttribute('style', `${sizingStyle};${HIDDEN_TEXTAREA_STYLE}`);
   hiddenTextarea.value = uiTextNode.value || uiTextNode.placeholder || '';
   let minHeight = null;
   let maxHeight = null;
   let height = hiddenTextarea.scrollHeight;
   let overflowY;
-
   if (boxSizing === 'border-box') {
     // border-box: add border, since height = content + padding + border
     height = height + borderSize;
@@ -74,34 +75,26 @@ export default function calculateNodeHeight(uiTextNode, useCache = false, minRow
     // remove padding, since height = content
     height = height - paddingSize;
   }
-
   if (minRows !== null || maxRows !== null) {
     // measure height of a textarea with a single row
     hiddenTextarea.value = ' ';
     const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize;
-
     if (minRows !== null) {
       minHeight = singleRowHeight * minRows;
-
       if (boxSizing === 'border-box') {
         minHeight = minHeight + paddingSize + borderSize;
       }
-
       height = Math.max(minHeight, height);
     }
-
     if (maxRows !== null) {
       maxHeight = singleRowHeight * maxRows;
-
       if (boxSizing === 'border-box') {
         maxHeight = maxHeight + paddingSize + borderSize;
       }
-
       overflowY = height > maxHeight ? '' : 'hidden';
       height = Math.min(maxHeight, height);
     }
   }
-
   return {
     height,
     minHeight,

package/esm/components/TextArea/index.js

@@ -1,2 +1,3 @@
 // Copyright 1999-2019. Plesk International GmbH. All rights reserved.
+
 export { default } from './TextArea';

package/esm/components/Toast/Toast.js

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2022. Plesk International GmbH. All rights reserved.
+
 import React, { Component } from 'react';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
@@ -10,12 +11,10 @@ import { intentIconMap } from '../intentIconMap';
 import OnDarkContext from '../OnDarkContext';
 const AUTOCLOSE_TIMEOUT = 6000;
 export default class Toast extends Component {
-  constructor(...args) {
-    super(...args);
-
+  constructor() {
+    super(...arguments);
     _defineProperty(this, "timer", void 0);
   }
-
   componentDidMount() {
     const {
       autoClosable,
@@ -24,28 +23,23 @@ export default class Toast extends Component {
     let {
       autoCloseTimeout
     } = this.props;
-
     switch (autoClosable) {
       case true:
         autoCloseTimeout = AUTOCLOSE_TIMEOUT;
         break;
-
       case false:
         autoCloseTimeout = undefined;
         break;
     }
-
     if (autoCloseTimeout && onClose) {
       this.timer = window.setTimeout(onClose, autoCloseTimeout);
     }
   }
-
   componentWillUnmount() {
     if (this.timer) {
       clearTimeout(this.timer);
     }
   }
-
   render() {
     const {
       baseClassName,
@@ -85,18 +79,14 @@ export default class Toast extends Component {
       className: `${baseClassName}__close`,
       onClick: onClose
     })) : null);
-
     if (accent) {
       return result;
     }
-
     return /*#__PURE__*/React.createElement(OnDarkContext.Provider, {
       value: true
     }, result);
   }
-
 }
-
 _defineProperty(Toast, "defaultProps", {
   baseClassName: `${CLS_PREFIX}toast`
 });

package/esm/components/Toast/index.js

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

package/esm/components/Toaster/Toaster.js

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import { render } from 'react-dom';
 import React, { Component, createRef } from 'react';
 import { TransitionGroup, CSSTransition } from 'react-transition-group';
@@ -9,36 +10,33 @@ import { CLS_PREFIX, Z_INDEX_TOASTER } from '../../constants';
 import Toast from '../Toast';
 import Layer from '../Layer';
 let toastId = 0;
-
 /**
  * `Toaster` is used for notifying about events happened in the system. For example, about results of performed operations.
  * @since 0.0.42
  */
 export default class Toaster extends Component {
-  constructor(...args) {
-    super(...args);
-
+  constructor() {
+    super(...arguments);
     _defineProperty(this, "state", {
       toasts: []
     });
   }
-
-  static getDerivedStateFromProps({
-    toasts,
-    maxToastsNumber
-  }) {
+  static getDerivedStateFromProps(_ref) {
+    let {
+      toasts,
+      maxToastsNumber
+    } = _ref;
     if (toasts) {
       return {
         toasts: toasts.slice(0, maxToastsNumber)
       };
     }
-
     return null;
   }
-
   isControlled() {
     return Boolean(this.props.toasts);
   }
+
   /**
    * Add a new toast
    *
@@ -55,20 +53,22 @@ export default class Toaster extends Component {
    * @returns {string} New toast key
    * @public
    */
-
-
   add(props) {
     const key = `toast-${toastId++}`;
-    this.setState(({
-      toasts
-    }) => ({
-      toasts: [{
-        key,
-        ...props
-      }, ...toasts].slice(0, this.props.maxToastsNumber)
-    }));
+    this.setState(_ref2 => {
+      let {
+        toasts
+      } = _ref2;
+      return {
+        toasts: [{
+          key,
+          ...props
+        }, ...toasts].slice(0, this.props.maxToastsNumber)
+      };
+    });
     return key;
   }
+
   /**
    * Update toast by key
    *
@@ -77,46 +77,48 @@ export default class Toaster extends Component {
    * @returns {string} Updated toast key
    * @public
    */
-
-
   update(key, props) {
-    this.setState(({
-      toasts
-    }) => ({
-      toasts: toasts.map(toast => toast.key === key ? { ...props,
-        key
-      } : toast)
-    }));
+    this.setState(_ref3 => {
+      let {
+        toasts
+      } = _ref3;
+      return {
+        toasts: toasts.map(toast => toast.key === key ? {
+          ...props,
+          key
+        } : toast)
+      };
+    });
     return key;
   }
+
   /**
    * Remove toast by key
    *
    * @param {string} key
    * @public
    */
-
-
   remove(key) {
-    this.setState(({
-      toasts
-    }) => ({
-      toasts: toasts.filter(toast => toast.key !== key)
-    }));
+    this.setState(_ref4 => {
+      let {
+        toasts
+      } = _ref4;
+      return {
+        toasts: toasts.filter(toast => toast.key !== key)
+      };
+    });
   }
+
   /**
    * Clear all toasts
    *
    * @public
    */
-
-
   clear() {
     this.setState({
       toasts: []
     });
   }
-
   render() {
     const {
       baseClassName,
@@ -128,12 +130,10 @@ export default class Toaster extends Component {
       ...props
     } = this.props;
     let stack = this.state.toasts;
-
     if (position === 'bottom-end') {
       stack = [...stack];
       stack.reverse();
     }
-
     return /*#__PURE__*/React.createElement(Layer, {
       level: Z_INDEX_TOASTER
     }, /*#__PURE__*/React.createElement("div", _extends({
@@ -149,11 +149,9 @@ export default class Toaster extends Component {
       let {
         autoClosable
       } = toastProps;
-
       if (autoClosable === undefined && intent === 'success' && position === 'top-end') {
         autoClosable = true;
       }
-
       const toastRef = /*#__PURE__*/createRef();
       return /*#__PURE__*/React.createElement(CSSTransition, {
         key: toastProps.key,
@@ -169,11 +167,9 @@ export default class Toaster extends Component {
           if (!this.isControlled()) {
             this.remove(toastProps.key);
           }
-
           if (toastProps.onClose) {
             toastProps.onClose();
           }
-
           if (onToastClose) {
             onToastClose(toastProps.key);
           }
@@ -182,15 +178,14 @@ export default class Toaster extends Component {
       })));
     }))));
   }
-
 }
-
 _defineProperty(Toaster, "defaultProps", {
   position: 'top-end',
   baseClassName: `${CLS_PREFIX}toaster`
 });
-
-_defineProperty(Toaster, "create", (props = {}, container = document.body) => {
+_defineProperty(Toaster, "create", function () {
+  let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  let container = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document.body;
   const containerElement = document.createElement('div');
   container.appendChild(containerElement);
   return render( /*#__PURE__*/React.createElement(Toaster, props), containerElement);

package/esm/components/Toaster/index.js

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

package/esm/components/Toolbar/RegistryContext.js

@@ -1,19 +1,17 @@
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import { createContext } from 'react';
 const RegistryContext = /*#__PURE__*/createContext(undefined);
 RegistryContext.displayName = 'RegistryContext';
 export default RegistryContext;
 export const createRegistry = () => ({
   stack: [],
-
   register(item) {
     this.stack.push(item);
   },
-
   unregister(item) {
     this.stack = this.stack.filter(i => i !== item);
   },
-
   uncompact() {
     let changed = false;
     this.stack.every(item => {
@@ -22,12 +20,10 @@ export const createRegistry = () => ({
         changed = true;
         return false;
       }
-
       return true;
     });
     return changed;
   },
-
   compact() {
     let changed = false;
     [...this.stack].reverse().every(item => {
@@ -36,18 +32,15 @@ export const createRegistry = () => ({
         changed = true;
         return false;
       }
-
       return true;
     });
     return changed;
   },
-
-  isCompact(one = false) {
+  isCompact() {
+    let one = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
     if (one) {
       return this.stack.some(item => item.isCompact(one));
     }
-
     return this.stack.every(item => item.isCompact(one));
   }
-
 });

package/esm/components/Toolbar/Toolbar.js

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -9,7 +10,6 @@ import RegistryContext, { createRegistry } from './RegistryContext';
 import DistractionFreeModeContext from '../DistractionFreeModeContext';
 import { toToolbarItems } from './ToolbarItem';
 import Squeezer from '../Squeezer';
-
 /**
  * `Toolbar` component is a panel containing various instruments used for managing the contents of a large content block.
  * Toolbar is located on top of the managed content block.
@@ -17,16 +17,17 @@ import Squeezer from '../Squeezer';
  * and controls for changing the way the content block looks.
  * @since 0.0.57
  */
+
 class Toolbar extends Component {
   constructor(props) {
     super(props);
-
     _defineProperty(this, "state", {
       distractionFreeMode: {
         enabled: false,
         toggle: () => {
           this.setState(prevState => ({
-            distractionFreeMode: { ...prevState.distractionFreeMode,
+            distractionFreeMode: {
+              ...prevState.distractionFreeMode,
               enabled: !prevState.distractionFreeMode.enabled
             }
           }), () => {
@@ -35,12 +36,9 @@ class Toolbar extends Component {
         }
       }
     });
-
     this.registry = createRegistry();
-
     this.measure = () => {};
   }
-
   render() {
     const {
       baseClassName,
@@ -55,32 +53,31 @@ class Toolbar extends Component {
       innerMeasure: measure => {
         this.measure = measure;
       }
-    }, ({
-      ref
-    }) => /*#__PURE__*/React.createElement("div", _extends({
-      ref: ref,
-      className: classNames(baseClassName, className)
-    }, props), /*#__PURE__*/React.createElement(RegistryContext.Provider, {
-      value: this.registry
-    }, /*#__PURE__*/React.createElement(DistractionFreeModeContext.Provider, {
-      value: this.state.distractionFreeMode
-    }, toolbarItems))));
+    }, _ref => {
+      let {
+        ref
+      } = _ref;
+      return /*#__PURE__*/React.createElement("div", _extends({
+        ref: ref,
+        className: classNames(baseClassName, className)
+      }, props), /*#__PURE__*/React.createElement(RegistryContext.Provider, {
+        value: this.registry
+      }, /*#__PURE__*/React.createElement(DistractionFreeModeContext.Provider, {
+        value: this.state.distractionFreeMode
+      }, toolbarItems)));
+    });
   }
-
 }
-
 Toolbar.propTypes = {
   /**
    * Content of the `Toolbar`.
    * @since 0.0.57
    */
   children: PropTypes.node,
-
   /**
    * @ignore
    */
   className: PropTypes.string,
-
   /**
    * @ignore
    */