@plesk/ui-library 3.31.2 → 3.32.0

package/esm/components/SwitchesPanel/SwitchesPanel.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 } from 'react';
@@ -6,6 +5,7 @@ import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
 import Section from '../Section';
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * `SwitchesPanel` component is used for grouping several [SwitchesPanelItems](#!/SwitchesPanelItem) into one set.
  * @since 0.3.0
@@ -17,13 +17,16 @@ const SwitchesPanel = _ref => {
     children,
     ...props
   } = _ref;
-  return /*#__PURE__*/React.createElement(Section, _extends({
-    className: classNames(baseClassName, className)
-  }, props), /*#__PURE__*/React.createElement("div", {
-    className: `${baseClassName}__items`
-  }, Children.map(children, child => /*#__PURE__*/cloneElement(child, {
-    className: classNames(child.props.className, `${baseClassName}__item`)
-  }))));
+  return /*#__PURE__*/_jsx(Section, {
+    className: classNames(baseClassName, className),
+    ...props,
+    children: /*#__PURE__*/_jsx("div", {
+      className: `${baseClassName}__items`,
+      children: Children.map(children, child => /*#__PURE__*/cloneElement(child, {
+        className: classNames(child.props.className, `${baseClassName}__item`)
+      }))
+    })
+  });
 };
 SwitchesPanel.propTypes = {
   /**

package/esm/components/SwitchesPanelItem/SwitchesPanelItem.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
@@ -9,6 +8,8 @@ import { CLS_PREFIX } from '../../constants';
 import Switch from '../Switch';
 import Action from '../Action';
 import Popover from '../Popover';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * `SwitchesPanelItem` component is used for combining [Switch](#!/Switch) component with text title and description.
  * Used in [SwitchesPanel](#!/SwitchesPanel).
@@ -44,33 +45,41 @@ class SwitchesPanelItem extends Component {
     const {
       checked
     } = this.state;
-    return /*#__PURE__*/React.createElement("div", _extends({
+    return /*#__PURE__*/_jsxs("div", {
       className: classNames(baseClassName, {
         [`${baseClassName}--${intent}`]: intent && checked
-      }, className)
-    }, props), /*#__PURE__*/React.createElement("h5", {
-      className: `${baseClassName}__title`
-    }, title), description && /*#__PURE__*/React.createElement("p", {
-      className: `${baseClassName}__description`
-    }, description), /*#__PURE__*/React.createElement("div", {
-      className: `${baseClassName}__actions`
-    }, /*#__PURE__*/React.createElement(Switch, _extends({
-      className: `${baseClassName}__switch`,
-      intent: intent,
-      onChange: this.handleChange,
-      defaultChecked: defaultChecked
-    }, switchProps)), (fullDescription || children) && /*#__PURE__*/React.createElement("div", {
-      className: `${baseClassName}__controls`
-    }, children, fullDescription && /*#__PURE__*/React.createElement(Popover, {
-      intent: "info",
-      target: /*#__PURE__*/React.createElement(Action, {
-        icon: "question-mark-circle",
-        outerProps: {
-          className: `${baseClassName}__full-description-toggle`
-        }
-      }),
-      placement: "bottom"
-    }, fullDescription))));
+      }, className),
+      ...props,
+      children: [/*#__PURE__*/_jsx("h5", {
+        className: `${baseClassName}__title`,
+        children: title
+      }), description && /*#__PURE__*/_jsx("p", {
+        className: `${baseClassName}__description`,
+        children: description
+      }), /*#__PURE__*/_jsxs("div", {
+        className: `${baseClassName}__actions`,
+        children: [/*#__PURE__*/_jsx(Switch, {
+          className: `${baseClassName}__switch`,
+          intent: intent,
+          onChange: this.handleChange,
+          defaultChecked: defaultChecked,
+          ...switchProps
+        }), (fullDescription || children) && /*#__PURE__*/_jsxs("div", {
+          className: `${baseClassName}__controls`,
+          children: [children, fullDescription && /*#__PURE__*/_jsx(Popover, {
+            intent: "info",
+            target: /*#__PURE__*/_jsx(Action, {
+              icon: "question-mark-circle",
+              outerProps: {
+                className: `${baseClassName}__full-description-toggle`
+              }
+            }),
+            placement: "bottom",
+            children: fullDescription
+          })]
+        })]
+      })]
+    });
   }
 }
 SwitchesPanelItem.propTypes = {

package/esm/components/Tabs/SearchBar.js

@@ -1,11 +1,8 @@
-import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
-/* eslint-disable react/no-deprecated */
-
 import { isRtl } from '../../utils';
-import React, { Component, cloneElement, Children, Fragment, useContext } from 'react';
+import React, { Component, cloneElement, Children, useContext } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { CLS_PREFIX } from '../../constants';
@@ -17,6 +14,9 @@ import Menu, { MenuItem, MenuSelectableItem } from '../Menu';
 import ResponsiveContext from '../ResponsiveContext';
 import DistractionFreeModeContext from '../DistractionFreeModeContext';
 import { safeInvoke } from '../utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * `SearchBar` component is used for providing type-as-you-go search.
  * @since 0.0.58
@@ -267,17 +267,18 @@ class SearchBar extends Component {
     if (!results || results.length === 0) {
       return null;
     }
-    return /*#__PURE__*/React.createElement(Menu, {
+    return /*#__PURE__*/_jsx(Menu, {
       className: classNames(`${baseClassName}__results`, {
         [`${baseClassName}__results--hidden`]: !focused && !overMenu
       }),
       onMouseOver: this.handleMenuMouseOver,
-      onMouseOut: this.handleMenuMouseOut
-    }, results.map(item => /*#__PURE__*/React.createElement(MenuItem, {
-      key: item.value,
-      active: item.value === highlightedValue,
-      onClick: this.handleSelect(item.value)
-    }, item.title)));
+      onMouseOut: this.handleMenuMouseOut,
+      children: results.map(item => /*#__PURE__*/_jsx(MenuItem, {
+        active: item.value === highlightedValue,
+        onClick: this.handleSelect(item.value),
+        children: item.title
+      }, item.value))
+    });
   }
   renderResultsMenu() {
     const {
@@ -338,51 +339,57 @@ class SearchBar extends Component {
     } = this.state;
     const isCollapsed = this.isResponsive();
     const distractionFreeModeEnabled = Boolean(distractionFreeMode && distractionFreeMode.enabled);
-    return /*#__PURE__*/React.createElement("div", _extends({
+    return /*#__PURE__*/_jsxs("div", {
       className: classNames(baseClassName, {
         [`${baseClassName}--focused`]: focused
       }, className),
       style: isCollapsed || distractionFreeModeEnabled ? null : {
         maxWidth,
         minWidth
-      }
-    }, props), /*#__PURE__*/React.createElement(ButtonGroup, {
-      className: `${baseClassName}__group`
-    }, isCollapsed && (collapsable || !distractionFreeModeEnabled) ? /*#__PURE__*/React.createElement(Badge, {
-      intent: "info",
-      hidden: !value
-    }, /*#__PURE__*/React.createElement(Button, {
-      icon: "search",
-      onClick: this.handleExpand
-    })) : /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(Input, _extends({
-      innerRef: ref => this.search = ref,
-      className: `${baseClassName}__input`,
-      size: "fill",
-      onChange: this.handleKeyDown,
-      onFocus: this.handleFocus,
-      onBlur: this.handleBlur,
-      onKeyDown: this.handleKeyDown
-    }, inputProps, {
-      value: value,
-      prefix: (collapsable && !isCollapsed || distractionFreeModeEnabled) && /*#__PURE__*/React.createElement(Button, {
-        icon: {
-          name: 'chevron-right',
-          flipHorizontal: isRtl()
-        },
-        ghost: true,
-        onClick: this.handleCollapse
-      }),
-      suffix: /*#__PURE__*/React.createElement(Fragment, null, value && /*#__PURE__*/React.createElement(Button, {
-        icon: "remove",
-        onClick: this.handleReset,
-        ghost: true
-      }), /*#__PURE__*/React.createElement(Button, {
-        icon: "search",
-        onClick: this.handleSearch,
-        state: loading ? 'loading' : null,
-        ghost: true
-      }))
-    })))), results && results.type === Menu ? this.renderResultsMenu() : this.renderResults());
+      },
+      ...props,
+      children: [/*#__PURE__*/_jsx(ButtonGroup, {
+        className: `${baseClassName}__group`,
+        children: isCollapsed && (collapsable || !distractionFreeModeEnabled) ? /*#__PURE__*/_jsx(Badge, {
+          intent: "info",
+          hidden: !value,
+          children: /*#__PURE__*/_jsx(Button, {
+            icon: "search",
+            onClick: this.handleExpand
+          })
+        }) : /*#__PURE__*/_jsx(Input, {
+          innerRef: ref => this.search = ref,
+          className: `${baseClassName}__input`,
+          size: "fill",
+          onChange: this.handleKeyDown,
+          onFocus: this.handleFocus,
+          onBlur: this.handleBlur,
+          onKeyDown: this.handleKeyDown,
+          ...inputProps,
+          value: value,
+          prefix: (collapsable && !isCollapsed || distractionFreeModeEnabled) && /*#__PURE__*/_jsx(Button, {
+            icon: {
+              name: 'chevron-right',
+              flipHorizontal: isRtl()
+            },
+            ghost: true,
+            onClick: this.handleCollapse
+          }),
+          suffix: /*#__PURE__*/_jsxs(_Fragment, {
+            children: [value && /*#__PURE__*/_jsx(Button, {
+              icon: "remove",
+              onClick: this.handleReset,
+              ghost: true
+            }), /*#__PURE__*/_jsx(Button, {
+              icon: "search",
+              onClick: this.handleSearch,
+              state: loading ? 'loading' : null,
+              ghost: true
+            })]
+          })
+        })
+      }), results && results.type === Menu ? this.renderResultsMenu() : this.renderResults()]
+    });
   }
 }
 const propTypes = {
@@ -502,10 +509,11 @@ const SearchBarWrapper = props => {
   const distractionFreeMode = useContext(DistractionFreeModeContext);
   let responsive = useContext(ResponsiveContext);
   responsive = props.responsive === undefined ? responsive || false : Boolean(props.responsive);
-  return /*#__PURE__*/React.createElement(SearchBar, _extends({}, props, {
+  return /*#__PURE__*/_jsx(SearchBar, {
+    ...props,
     responsive: responsive,
     distractionFreeMode: distractionFreeMode
-  }));
+  });
 };
 SearchBarWrapper.displayName = 'SearchBar';
 SearchBarWrapper.propTypes = propTypes;

package/esm/components/Tabs/Tab.js

@@ -12,11 +12,14 @@ import PropTypes from 'prop-types';
  * You can make `Tabs` closeable, for example, if you are using them for opening and displaying files.
  * @since 0.0.35
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 const Tab = _ref => {
   let {
     children
   } = _ref;
-  return /*#__PURE__*/React.createElement("div", null, children);
+  return /*#__PURE__*/_jsx("div", {
+    children: children
+  });
 };
 Tab.propTypes = {
   /**