@plesk/ui-library 3.36.0 → 3.37.0

package/cjs/components/List/ListAction.js

@@ -15,7 +15,6 @@ var _jsxRuntime = require("react/jsx-runtime");
  * It accepts the props of [Button](#!/Button) and [MenuItem](#!/MenuItem) components.
  * @since 3.3.0
  */
-
 const ListAction = _ref => {
   let {
     primary,

package/cjs/components/Panel/Panel.js

@@ -5,11 +5,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
+var _reactTransitionGroup = require("react-transition-group");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../constants");
-var _reactTransitionGroup = require("react-transition-group");
 var _Translate = require("../Translate");
 var _Heading = _interopRequireDefault(require("../Heading"));
 var _Button = _interopRequireDefault(require("../Button"));
@@ -21,103 +20,67 @@ var _jsxRuntime = require("react/jsx-runtime");
  * `Panel` component is used for visually grouping some content.
  * @since 0.0.35
  */
-class Panel extends _react.Component {
-  constructor(props) {
-    super(props);
-    (0, _defineProperty2.default)(this, "handleToggle", e => {
-      if ((0, _utils.isClickable)(e)) {
-        return;
-      }
-      this.setState(_ref => {
-        let {
-          collapsed
-        } = _ref;
-        return {
-          collapsed: !collapsed
-        };
-      }, () => {
-        if (this.props.onToggle) {
-          this.props.onToggle(this.state.collapsed);
-        }
-      });
-    });
-    const _collapsed2 = this.props.collapsible && this.props.collapsed || false;
-    // eslint-disable-next-line react/state-in-constructor
-    this.state = {
-      collapsed: _collapsed2,
-      prevPropsCollapsed: _collapsed2
-    };
-  }
-  static getDerivedStateFromProps(props, state) {
-    if (props.collapsed !== state.prevPropsCollapsed) {
-      return {
-        collapsed: props.collapsed,
-        prevPropsCollapsed: props.collapsed
-      };
+const Panel = _ref => {
+  let {
+    baseClassName = `${_constants.CLS_PREFIX}panel`,
+    className,
+    title,
+    collapsible = false,
+    collapsed: externalCollapsed,
+    onToggle,
+    children,
+    extra,
+    ...props
+  } = _ref;
+  const rootRef = (0, _react.useRef)(null);
+  const isControlled = externalCollapsed !== undefined;
+  const [internalCollapsed, setInternalCollapsed] = (0, _react.useState)(false);
+  const collapsed = isControlled ? externalCollapsed : internalCollapsed;
+  const handleToggle = e => {
+    if (!collapsible || (0, _utils.isClickable)(e)) return;
+    if (!isControlled) {
+      setInternalCollapsed(!collapsed);
     }
-    return null;
-  }
-  render() {
-    const {
-      baseClassName,
-      className,
-      title,
-      collapsible,
-      collapsed: _collapsed,
-      onToggle,
-      children,
-      extra,
-      ...props
-    } = this.props;
-    const {
-      collapsed
-    } = this.state;
-    const handleToggle = collapsible ? this.handleToggle : undefined;
-    const rootRef = /*#__PURE__*/(0, _react.createRef)();
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactTransitionGroup.CSSTransition, {
-      classNames: `${baseClassName}-`,
-      in: !collapsed,
-      timeout: 300,
-      nodeRef: rootRef,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: (0, _classnames.default)(baseClassName, {
-          [`${baseClassName}--collapsible`]: collapsible,
-          [`${baseClassName}--collapsed`]: collapsed,
-          [`${baseClassName}--expanded`]: !collapsed
-        }, className),
-        ...props,
-        ref: rootRef,
-        children: [title && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-          className: `${baseClassName}__header`,
-          onClick: handleToggle,
-          children: [(0, _Translate.isLikeText)(title) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Heading.default, {
-            component: "div",
-            level: 4,
-            className: `${baseClassName}__title`,
-            children: title
-          }) : title, (extra || collapsible) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-            className: `${baseClassName}__extra`,
-            children: [extra, collapsible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
-              ghost: true,
-              className: `${baseClassName}__control-button`,
-              icon: {
-                name: 'chevron-up',
-                flipVertical: collapsed
-              },
-              onClick: handleToggle
-            })]
+    onToggle?.(!collapsed);
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactTransitionGroup.CSSTransition, {
+    classNames: `${baseClassName}-`,
+    in: !collapsed,
+    timeout: 300,
+    nodeRef: rootRef,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: (0, _classnames.default)(baseClassName, {
+        [`${baseClassName}--collapsible`]: collapsible,
+        [`${baseClassName}--collapsed`]: collapsed,
+        [`${baseClassName}--expanded`]: !collapsed
+      }, className),
+      ...props,
+      ref: rootRef,
+      children: [title && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: `${baseClassName}__header`,
+        onClick: handleToggle,
+        children: [(0, _Translate.isLikeText)(title) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Heading.default, {
+          component: "div",
+          level: 4,
+          className: `${baseClassName}__title`,
+          children: title
+        }) : title, (extra || collapsible) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: `${baseClassName}__extra`,
+          children: [extra, collapsible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+            ghost: true,
+            className: `${baseClassName}__control-button`,
+            icon: {
+              name: 'chevron-up',
+              flipVertical: collapsed
+            },
+            onClick: handleToggle
           })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: `${baseClassName}__content`,
-          children: children
         })]
-      })
-    });
-  }
-}
-(0, _defineProperty2.default)(Panel, "defaultProps", {
-  collapsible: false,
-  collapsed: false,
-  baseClassName: `${_constants.CLS_PREFIX}panel`
-});
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${baseClassName}__content`,
+        children: children
+      })]
+    })
+  });
+};
 var _default = exports.default = Panel;

package/cjs/components/Select/SelectControl.js

@@ -188,6 +188,10 @@ const SelectControl = /*#__PURE__*/(0, _react.forwardRef)(function SelectControl
         onKeyDown: handleKeyDown,
         onFocus: handleFocus,
         onBlur: handleBlur,
+        onClick: e => {
+          // ignore click which was received by clicking on a label with "for" attribute
+          if (e.detail === 0) e.stopPropagation();
+        },
         readOnly: !searchable,
         disabled: disabled,
         ref: inputRef,

package/cjs/components/Select/SelectOption.js

@@ -10,7 +10,8 @@ var _jsxRuntime = require("react/jsx-runtime");
 /**
  * `SelectOption` is a part of [SelectOptionGroup](#!/SelectOptionGroup) component.
  * @since 2.3.0
- */ // eslint-disable-next-line @typescript-eslint/no-unused-vars
+ */
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const SelectOption = _props => {
   // styleguidist doesn't show Props & Methods if component renders nothing
   // eslint-disable-next-line no-constant-condition

package/cjs/components/Toaster/Toaster.js

@@ -14,7 +14,7 @@ var _constants = require("../../constants");
 var _Toast = _interopRequireDefault(require("../Toast"));
 var _Layer = _interopRequireDefault(require("../Layer"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _class; // Copyright 1999-2023. Plesk International GmbH. All rights reserved.
+var _Toaster; // Copyright 1999-2023. Plesk International GmbH. All rights reserved.
 let toastId = 0;
 /**
  * `Toaster` is used for notifying about events happened in the system. For example, about results of performed operations.
@@ -191,7 +191,7 @@ class Toaster extends _react.Component {
   }
 }
 exports.default = Toaster;
-_class = Toaster;
+_Toaster = Toaster;
 // eslint-disable-next-line react/sort-comp
 (0, _defineProperty2.default)(Toaster, "defaultProps", {
   position: 'top-end',
@@ -202,7 +202,7 @@ _class = Toaster;
   let container = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document.body;
   const containerElement = document.createElement('div');
   container.appendChild(containerElement);
-  return (0, _reactDom.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_class, {
+  return (0, _reactDom.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_Toaster, {
     ...props
   }), containerElement);
 });

package/cjs/components/Toolbar/ToolbarMenu.js

@@ -46,7 +46,6 @@ const toMenuItem = (child, isLast, onItemClick) => {
         });
         /* eslint-enable react/prop-types */
       }
-
     case _ToolbarGroup.default:
       {
         const {

package/cjs/components/index.js

@@ -22,6 +22,7 @@ var _exportNames = {
   Columns: true,
   Column: true,
   ComboBox: true,
+  ComboBoxOption: true,
   ConsoleOutput: true,
   ContentLoader: true,
   Cuttable: true,
@@ -54,6 +55,11 @@ var _exportNames = {
   Label: true,
   Layout: true,
   List: true,
+  ListActions: true,
+  ListAction: true,
+  ListOperation: true,
+  ListEmptyView: true,
+  ListActionsDivider: true,
   LocaleProvider: true,
   Markdown: true,
   Media: true,
@@ -202,6 +208,12 @@ Object.defineProperty(exports, "ComboBox", {
     return _ComboBox.default;
   }
 });
+Object.defineProperty(exports, "ComboBoxOption", {
+  enumerable: true,
+  get: function () {
+    return _ComboBox.ComboBoxOption;
+  }
+});
 Object.defineProperty(exports, "ConsoleOutput", {
   enumerable: true,
   get: function () {
@@ -388,6 +400,36 @@ Object.defineProperty(exports, "List", {
     return _List.default;
   }
 });
+Object.defineProperty(exports, "ListAction", {
+  enumerable: true,
+  get: function () {
+    return _List.ListAction;
+  }
+});
+Object.defineProperty(exports, "ListActions", {
+  enumerable: true,
+  get: function () {
+    return _List.ListActions;
+  }
+});
+Object.defineProperty(exports, "ListActionsDivider", {
+  enumerable: true,
+  get: function () {
+    return _List.ListActionsDivider;
+  }
+});
+Object.defineProperty(exports, "ListEmptyView", {
+  enumerable: true,
+  get: function () {
+    return _List.ListEmptyView;
+  }
+});
+Object.defineProperty(exports, "ListOperation", {
+  enumerable: true,
+  get: function () {
+    return _List.ListOperation;
+  }
+});
 Object.defineProperty(exports, "LocaleProvider", {
   enumerable: true,
   get: function () {
@@ -733,17 +775,6 @@ var _Radio = _interopRequireDefault(require("./Radio"));
 var _CodeEditor = _interopRequireDefault(require("./CodeEditor"));
 var _Columns = _interopRequireWildcard(require("./Columns"));
 var _ComboBox = _interopRequireWildcard(require("./ComboBox"));
-Object.keys(_ComboBox).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _ComboBox[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _ComboBox[key];
-    }
-  });
-});
 var _ConsoleOutput = _interopRequireDefault(require("./ConsoleOutput"));
 var _ContentLoader = _interopRequireDefault(require("./ContentLoader"));
 var _Cuttable = _interopRequireDefault(require("./Cuttable"));
@@ -820,17 +851,6 @@ var _ItemList = _interopRequireDefault(require("./ItemList"));
 var _Label = _interopRequireDefault(require("./Label"));
 var _Layout = _interopRequireDefault(require("./Layout"));
 var _List = _interopRequireWildcard(require("./List"));
-Object.keys(_List).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _List[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _List[key];
-    }
-  });
-});
 var _LocaleProvider = _interopRequireWildcard(require("./LocaleProvider"));
 Object.keys(_LocaleProvider).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/cjs/index.js

@@ -46,5 +46,5 @@ Object.keys(_components).forEach(function (key) {
   });
 });
 // Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-const version = exports.version = "3.36.0";
+const version = exports.version = "3.37.0";
 (0, _svg4everybody.default)();