@plesk/ui-library 3.31.0 → 3.31.2

package/esm/components/CodeEditor/CodeEditor.js

@@ -3,21 +3,20 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2021. Plesk International GmbH. All rights reserved.
 
 /* eslint-disable react/no-deprecated */
+
 import React, { Component } from 'react';
 import { safeInvoke } from '../utils';
 import { isRtl } from '../../utils';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
-
 /**
  * `CodeEditor` component is used for editing text as code with proper color highlighting according to selected programming language.
  * @since 0.0.61
  */
 class CodeEditor extends Component {
-  constructor(...args) {
-    super(...args);
-
+  constructor() {
+    super(...arguments);
     _defineProperty(this, "state", {
       content: this.props.children,
       lineSeparator: this.getLineSeparator(this.props.children),
@@ -39,19 +38,16 @@ class CodeEditor extends Component {
         direction: isRtl() ? 'rtl' : 'ltr'
       }
     });
-
     _defineProperty(this, "handleScroll", () => {
       const {
         onScroll
       } = this.props;
       safeInvoke(onScroll, this.codeMirror.getScrollInfo());
     });
-
     _defineProperty(this, "handleChange", (doc, changes) => {
       if (this.props.readOnly || changes.origin === 'setValue') {
         return;
       }
-
       const {
         lineSeparator
       } = this.state;
@@ -66,31 +62,29 @@ class CodeEditor extends Component {
       });
     });
   }
-
-  static getDerivedStateFromProps({
-    readOnly,
-    autofocus,
-    options
-  }, state) {
+  static getDerivedStateFromProps(_ref, state) {
+    let {
+      readOnly,
+      autofocus,
+      options
+    } = _ref;
     return {
-      options: { ...state.options,
+      options: {
+        ...state.options,
         ...options,
         autofocus,
         readOnly
       }
     };
   }
-
   componentDidMount() {
-    import(
-    /* webpackChunkName: "codemirror" */
-    './CodeMirror').then(({
-      CodeMirror
-    }) => {
+    import( /* webpackChunkName: "codemirror" */'./CodeMirror').then(_ref2 => {
+      let {
+        CodeMirror
+      } = _ref2;
       if (!this.textareaNode) {
         return;
       }
-
       this.CodeMirror = CodeMirror;
       const {
         onInit,
@@ -101,11 +95,9 @@ class CodeEditor extends Component {
       } = this.state;
       this.codeMirror = CodeMirror.fromTextArea(this.textareaNode, options);
       this.codeMirror.on('scroll', this.handleScroll);
-
       if (scrollPosition) {
         this.codeMirror.scrollTo(scrollPosition.left, scrollPosition.top);
       }
-
       this.updateMode(this.props);
       CodeMirror.commands.save = this.props.onSave;
       CodeMirror.commands.find = CodeMirror.commands.findPersistent;
@@ -115,12 +107,10 @@ class CodeEditor extends Component {
       this.codeMirror.on('change', this.handleChange);
     });
   }
-
   componentDidUpdate(prevProps) {
     if (!this.codeMirror) {
       return;
     }
-
     Object.keys(this.state.options).forEach(name => {
       this.codeMirror.setOption(name, this.state.options[name]);
     });
@@ -136,12 +126,10 @@ class CodeEditor extends Component {
       fileName
     });
     const newContent = children || '';
-
     if (newContent !== prevProps.children && newContent !== this.codeMirror.getValue(this.state.lineSeparator)) {
       const prevScrollPosition = prevProps.scrollPosition || this.codeMirror.getScrollInfo();
       this.codeMirror.setValue(newContent);
       this.codeMirror.scrollTo(prevScrollPosition.left, prevScrollPosition.top);
-
       if (autofocus) {
         this.codeMirror.focus();
       }
@@ -149,44 +137,37 @@ class CodeEditor extends Component {
       this.codeMirror.scrollTo(scrollPosition.left, scrollPosition.top);
     }
   }
-
   componentWillUnmount() {
     if (this.codeMirror) {
       this.codeMirror.off('scroll', this.handleScroll);
       this.codeMirror.toTextArea();
     }
   }
-
   findModeByFileName(fileName) {
     const modeInfo = this.CodeMirror.findModeByFileName(fileName);
-
     if (modeInfo) {
       return modeInfo.mode;
     }
-
     return null;
   }
-
-  updateMode({
-    mode,
-    fileName
-  }) {
+  updateMode(_ref3) {
+    let {
+      mode,
+      fileName
+    } = _ref3;
     if (!mode && fileName) {
       mode = this.findModeByFileName(fileName);
     }
-
     if (!mode) {
       return;
     }
-
     this.CodeMirror.loadMode(this.codeMirror, mode);
   }
-
-  getLineSeparator(content = '') {
+  getLineSeparator() {
+    let content = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
     const sep = /^.*?(\r\n?|\n)/.exec(content);
     return sep && sep[1] ? sep[1] : '\n';
   }
-
   render() {
     const {
       baseClassName,
@@ -216,64 +197,53 @@ class CodeEditor extends Component {
       defaultValue: content
     }, props));
   }
-
 }
-
 CodeEditor.propTypes = {
   /**
    * The mode to use. When not given, this will default to the first mode that was loaded.
    * @since 0.0.61
    */
   mode: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
-
   /**
    * CodeEditor can detect mode by file name. Will be ignored if you set mode property.
    * @since 0.0.61
    */
   fileName: PropTypes.string,
-
   /**
    * Content of the `CodeEditor`.
    * @since 0.0.61
    */
   children: PropTypes.string,
-
   /**
    * Set read only.
    * @since 0.0.61
    */
   readOnly: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
-
   /**
    * Set auto focus.
    * @since 0.0.61
    */
   autofocus: PropTypes.bool,
-
   /**
    * onInit event handler.
    * @since 0.0.61
    */
   onInit: PropTypes.func,
-
   /**
    * onChange event handler.
    * @since 0.0.61
    */
   onChange: PropTypes.func,
-
   /**
    * onSave event handler.
    * @since 0.0.61
    */
   onSave: PropTypes.func,
-
   /**
    * See all supported options in [CodeMirror](https://codemirror.net/doc/manual.html#config) documentation.
    * @since 0.0.61
    */
   options: PropTypes.object,
-
   /**
    * Set scroll position.
    * @since 1.12.4
@@ -282,18 +252,15 @@ CodeEditor.propTypes = {
     left: PropTypes.number,
     top: PropTypes.number
   }),
-
   /**
    * onScroll event handler.
    * @since 1.12.4
    */
   onScroll: PropTypes.func,
-
   /**
    * @ignore
    */
   className: PropTypes.string,
-
   /**
    * @ignore
    */

package/esm/components/CodeEditor/CodeMirror.js

@@ -1,4 +1,5 @@
 // Copyright 1999-2017. Plesk International GmbH. All rights reserved.
+
 import CodeMirror from 'codemirror';
 import 'codemirror/addon/edit/matchbrackets';
 import 'codemirror/addon/edit/matchtags';
@@ -7,15 +8,11 @@ import 'codemirror/addon/dialog/dialog.js';
 import 'codemirror/addon/search/searchcursor.js';
 import 'codemirror/addon/search/search.js';
 import 'codemirror/addon/display/autorefresh';
-
 const importAll = r => {
   r.keys().forEach(r);
 };
-
 importAll(require.context('codemirror/mode/', true, /\.js$/));
-
 CodeMirror.loadMode = function (instance, mode) {
   instance.setOption('mode', mode);
 };
-
 export { CodeMirror };

package/esm/components/CodeEditor/index.js

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

package/esm/components/Columns/Column.js

@@ -1,29 +1,29 @@
 import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import React, { useContext } from 'react';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
 import VerticalContext from '../VerticalContext';
-
 const normalize = value => String(Number(value)) === String(value) ? `${value}px` : value;
+
 /**
  * `Column` component is a part of [Columns](#!/Columns).
  * @since 2.6.0
  */
-
-
-const Column = ({
-  baseClassName = `${CLS_PREFIX}columns__column`,
-  className,
-  children,
-  fill,
-  ratio,
-  style,
-  width,
-  minWidth,
-  maxWidth,
-  ...props
-}) => {
+const Column = _ref => {
+  let {
+    baseClassName = `${CLS_PREFIX}columns__column`,
+    className,
+    children,
+    fill,
+    ratio,
+    style,
+    width,
+    minWidth,
+    maxWidth,
+    ...props
+  } = _ref;
   const vertical = useContext(VerticalContext);
   return /*#__PURE__*/React.createElement("div", _extends({
     className: classNames(baseClassName, {
@@ -39,5 +39,4 @@ const Column = ({
     }
   }, props), children);
 };
-
 export default Column;

package/esm/components/Columns/Columns.js

@@ -1,41 +1,39 @@
 import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import React, { useState, useContext } from 'react';
 import classNames from 'classnames';
 import Measure from 'react-measure';
 import { CLS_PREFIX } from '../../constants';
 import VerticalContext, { VERTICAL_BREAKPOINT } from '../VerticalContext';
-
 /**
  * `Columns` component is used for creating of multi-column layouts.
  * @since 2.6.0
  */
-const Columns = ({
-  baseClassName = `${CLS_PREFIX}columns`,
-  className,
-  children,
-  vertical: verticalProp,
-  gap,
-  ...props
-}) => {
+const Columns = _ref => {
+  let {
+    baseClassName = `${CLS_PREFIX}columns`,
+    className,
+    children,
+    vertical: verticalProp,
+    gap,
+    ...props
+  } = _ref;
   // eslint-disable-next-line prefer-const
   let [vertical, setVertical] = useState(false);
   const verticalContext = useContext(VerticalContext);
-
   if (verticalProp === undefined) {
     verticalProp = typeof verticalContext === 'undefined' ? VERTICAL_BREAKPOINT : verticalContext;
   }
-
   if (typeof verticalProp === 'boolean') {
     vertical = verticalProp;
   }
-
-  const handleResize = ({
-    bounds
-  }) => {
+  const handleResize = _ref2 => {
+    let {
+      bounds
+    } = _ref2;
     setVertical(bounds.width < verticalProp);
   };
-
   const createRoot = measureRef => /*#__PURE__*/React.createElement("div", _extends({
     ref: measureRef,
     className: classNames(baseClassName, {
@@ -45,17 +43,17 @@ const Columns = ({
   }, props), /*#__PURE__*/React.createElement(VerticalContext.Provider, {
     value: vertical
   }, children));
-
   if (typeof verticalProp === 'number') {
     return /*#__PURE__*/React.createElement(Measure, {
       bounds: true,
       onResize: handleResize
-    }, ({
-      measureRef
-    }) => createRoot(measureRef));
+    }, _ref3 => {
+      let {
+        measureRef
+      } = _ref3;
+      return createRoot(measureRef);
+    });
   }
-
   return createRoot();
 };
-
 export default Columns;

package/esm/components/Columns/index.js

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

package/esm/components/ComboBox/ComboBox.js

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
+
 import React, { useState, useRef, Children, isValidElement } from 'react';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
@@ -8,8 +9,8 @@ import Input from '../Input';
 import Icon from '../Icon';
 import ComboBoxDropdown, { findNextSafeIndex } from '../ComboBoxDropdown';
 import ComboBoxOption from './ComboBoxOption';
-
-const collect = (children, options = []) => {
+const collect = function (children) {
+  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   Children.forEach(children, child => {
     if ( /*#__PURE__*/isValidElement(child) && child.type === ComboBoxOption) {
       // eslint-disable-next-line prefer-const
@@ -19,11 +20,9 @@ const collect = (children, options = []) => {
         children,
         ...props
       } = child.props;
-
       if (typeof value !== 'string') {
         throw new Error('The value can only be a number or a string.');
       }
-
       const option = {
         value: String(value),
         children,
@@ -37,24 +36,24 @@ const collect = (children, options = []) => {
     options
   };
 };
-
 /**
  * `ComboBox` component is a combination of [Select](#!/Select) and [Input](#!/Input)
  *  which allows to either enter a value directly into the field or choose from a list of existing options.
  * @since 2.6.0
  */
-const ComboBox = ({
-  baseClassName = `${CLS_PREFIX}combobox`,
-  className,
-  value = '',
-  onChange,
-  disabled = false,
-  size,
-  textAlign,
-  placeholder,
-  children,
-  ...props
-}) => {
+const ComboBox = _ref => {
+  let {
+    baseClassName = `${CLS_PREFIX}combobox`,
+    className,
+    value = '',
+    onChange,
+    disabled = false,
+    size,
+    textAlign,
+    placeholder,
+    children,
+    ...props
+  } = _ref;
   const [opened, setOpened] = useState(false);
   const [highlightedIndex, setHighlightedIndex] = useState(-1);
   const inputRef = useRef(null);
@@ -63,69 +62,53 @@ const ComboBox = ({
   const {
     options
   } = collect(children);
-
   const handleClose = () => {
     setOpened(false);
     setHighlightedIndex(-1);
   };
-
   const handleToggle = () => {
     if (opened) {
       handleClose();
     } else {
       setOpened(true);
-
       if (inputRef.current) {
         inputRef.current.focus();
       }
     }
   };
-
   const handleChange = nextValue => safeInvoke(onChange, nextValue);
-
   const handleInputChange = e => handleChange(e.target.value);
-
   const handleSelect = nextValue => {
     handleChange(nextValue);
     handleClose();
   };
-
   const moveHighlightedIndex = diff => {
     if (!opened) {
       setOpened(true);
     }
-
     const nextIndex = findNextSafeIndex(highlightedIndex, diff, options);
-
     if (nextIndex !== -1) {
       setHighlightedIndex(nextIndex);
       emitterRef.current.emit('focus', nextIndex);
     }
   };
-
   const confirmHighlightedIndex = index => {
     if (!opened && index === undefined) {
       return;
     }
-
     const option = options[index === undefined ? highlightedIndex : index];
-
     if (!option) {
       return;
     }
-
     if (option.disabled) {
       return;
     }
-
     const nextValue = option.value;
     safeInvoke(onChange, nextValue);
   };
-
   const handleHighlightedIndexChange = index => {
     setHighlightedIndex(index);
   };
-
   const handleKeyDown = e => {
     switch (e.key) {
       case 'ArrowUp':
@@ -133,29 +116,24 @@ const ComboBox = ({
         setOpened(true);
         moveHighlightedIndex(-1);
         break;
-
       case 'ArrowDown':
         e.preventDefault();
         setOpened(true);
         moveHighlightedIndex(1);
         break;
-
       case 'Enter':
         if (opened) {
           e.preventDefault();
           confirmHighlightedIndex(highlightedIndex);
           handleClose();
         }
-
         break;
-
       case 'Escape':
         e.preventDefault();
         handleClose();
         break;
     }
   };
-
   const button = /*#__PURE__*/React.createElement("button", {
     className: `${baseClassName}__dropdown-button`,
     onClick: handleToggle,
@@ -205,7 +183,6 @@ const ComboBox = ({
     emitter: emitterRef.current
   }, props));
 };
-
 const withDefaultValue = Component => {
   const Wrapper = props => {
     // eslint-disable-next-line react/prop-types
@@ -215,7 +192,6 @@ const withDefaultValue = Component => {
     } = props;
     const [value, setValue] = useState(defaultValue);
     let propOverrides;
-
     if (props.value === undefined) {
       propOverrides = {
         value,
@@ -225,12 +201,9 @@ const withDefaultValue = Component => {
         }
       };
     }
-
     return /*#__PURE__*/React.createElement(Component, _extends({}, props, propOverrides));
   };
-
   Wrapper.displayName = `withDefaultValue(${Component.name})`;
   return Wrapper;
 };
-
 export default withDefaultValue(ComboBox);

package/esm/components/ComboBox/ComboBoxOption.js

@@ -1,19 +1,16 @@
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
-import React from 'react';
 
+import React from 'react';
 /**
  * `ComboBoxOption` is a part of [ComboBox](#!/ComboBox) component.
  * @since 2.6.0
- */
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
+ */ // eslint-disable-next-line @typescript-eslint/no-unused-vars
 const ComboBoxOption = _props => {
   // styleguidist doesn't show Props & Methods if component renders nothing
   // eslint-disable-next-line no-constant-condition
   if (false) {
     return /*#__PURE__*/React.createElement("option", null);
   }
-
   return null;
 };
-
 export default ComboBoxOption;

package/esm/components/ComboBox/index.js

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