@plesk/ui-library 3.31.0 → 3.31.2

package/cjs/components/CardList/CardList.js

@@ -1,49 +1,31 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.VIEW_TILE = exports.VIEW_ROW = exports.VIEW_RESPONSIVE = exports.VIEW_EXTENDED = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _utils = require("../utils");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _reactMeasure = _interopRequireDefault(require("react-measure"));
-
 var _constants = require("../../constants");
-
 var _Pagination = _interopRequireDefault(require("../Pagination"));
-
 var _Grid = _interopRequireDefault(require("../Grid"));
-
 var _GridCol = _interopRequireDefault(require("../GridCol"));
-
 var _Button = _interopRequireDefault(require("../Button"));
-
 var _Spinner = _interopRequireDefault(require("../Spinner"));
-
 var _Translate = _interopRequireDefault(require("../Translate"));
-
 var _CardListToolbar = _interopRequireDefault(require("./CardListToolbar"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 // Copyright 1999-2020. Plesk International GmbH. All rights reserved.
 
 /* eslint-disable react/no-deprecated */
+
 const VIEW_TILE = 'tile';
 exports.VIEW_TILE = VIEW_TILE;
 const VIEW_RESPONSIVE = 'responsive';
@@ -51,18 +33,17 @@ exports.VIEW_RESPONSIVE = VIEW_RESPONSIVE;
 const VIEW_EXTENDED = 'extended';
 exports.VIEW_EXTENDED = VIEW_EXTENDED;
 const VIEW_ROW = 'row';
+
 /**
  * @deprecated `CardList` was used for displaying list of objects presented in various data formats
  * including images and other interface components.
  * Now it is deprecated and [List should be used](#!/List) instead.
  * @since 0.0.54
  */
-
 exports.VIEW_ROW = VIEW_ROW;
-
 class CardList extends _react.Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
     (0, _defineProperty2.default)(this, "state", {
       page: this.props.defaultPage,
       totalItems: this.props.totalItems || this.props.items.length,
@@ -102,25 +83,23 @@ class CardList extends _react.Component {
       });
     });
     (0, _defineProperty2.default)(this, "previousView", null);
-    (0, _defineProperty2.default)(this, "handleResize", ({
-      bounds: {
-        width
-      }
-    }) => {
+    (0, _defineProperty2.default)(this, "handleResize", _ref => {
+      let {
+        bounds: {
+          width
+        }
+      } = _ref;
       const view = width > 584 ? this.previousView : VIEW_RESPONSIVE;
-
       if (view === VIEW_RESPONSIVE && !this.previousView) {
         this.previousView = this.state.view;
       } else if (view !== VIEW_RESPONSIVE) {
         this.previousView = null;
       }
-
       if (view && view !== this.state.view) {
         this.changeView(view);
       }
     });
   }
-
   static getDerivedStateFromProps(props, state) {
     const {
       items,
@@ -131,29 +110,23 @@ class CardList extends _react.Component {
       prevTotalItems
     } = state;
     const nextState = {};
-
     if (items !== prevItems) {
       nextState.items = items;
     }
-
     if (totalItems !== prevTotalItems) {
       nextState.totalItems = totalItems || items.length;
     }
-
     nextState.prevItems = items;
     nextState.prevTotalItems = totalItems || items.length;
     return nextState;
   }
-
   componentDidMount() {
     this.fetchItems();
   }
-
   componentDidUpdate(prevProps) {
     const {
       view
     } = this.props;
-
     if (view !== prevProps.view && this.state.view !== VIEW_RESPONSIVE) {
       this.fetchItems({
         page: 1,
@@ -161,7 +134,6 @@ class CardList extends _react.Component {
       });
     }
   }
-
   totalPages() {
     const {
       totalItems,
@@ -169,11 +141,11 @@ class CardList extends _react.Component {
     } = this.state;
     return Math.ceil(totalItems / pageSize);
   }
-
-  fetchItems({
-    page = this.state.page,
-    view = this.state.view
-  } = {}) {
+  fetchItems() {
+    let {
+      page = this.state.page,
+      view = this.state.view
+    } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     const {
       onItemsFetch
     } = this.props;
@@ -188,7 +160,6 @@ class CardList extends _react.Component {
       pageSize
     });
   }
-
   loadMore() {
     const {
       onItemsFetch
@@ -206,14 +177,12 @@ class CardList extends _react.Component {
       pageSize: 10
     });
   }
-
   isTile() {
     const {
       view
     } = this.state;
     return view === VIEW_TILE || view === VIEW_RESPONSIVE;
   }
-
   renderPagination() {
     const {
       baseClassName
@@ -223,11 +192,9 @@ class CardList extends _react.Component {
       view
     } = this.state;
     const totalPages = this.totalPages();
-
     if (totalPages < 2) {
       return null;
     }
-
     if (view === VIEW_RESPONSIVE && page < totalPages) {
       return /*#__PURE__*/_react.default.createElement("div", {
         className: `${baseClassName}__pagination`
@@ -238,7 +205,6 @@ class CardList extends _react.Component {
         fallback: 'Load more'
       })));
     }
-
     return /*#__PURE__*/_react.default.createElement(_Pagination.default, {
       className: `${baseClassName}__pagination`,
       total: totalPages,
@@ -248,7 +214,6 @@ class CardList extends _react.Component {
       })
     });
   }
-
   changeView(view) {
     const {
       onViewChange
@@ -259,14 +224,12 @@ class CardList extends _react.Component {
     });
     (0, _utils.safeInvoke)(onViewChange, view);
   }
-
   select(keys) {
     const {
       onSelectionChange
     } = this.props;
     onSelectionChange(keys);
   }
-
   itemSelection(item) {
     const key = this.getItemKey(item);
     const {
@@ -274,25 +237,23 @@ class CardList extends _react.Component {
     } = this.props;
     return {
       isSelected: selection.indexOf(key) > -1,
-      onSelectionChange: ({
-        isSelected
-      }) => {
+      onSelectionChange: _ref2 => {
+        let {
+          isSelected
+        } = _ref2;
         const keys = isSelected ? [...selection, key] : selection.filter(k => k !== key);
         this.select(keys);
       }
     };
   }
-
   renderLoader() {
     const {
       baseClassName,
       loading
     } = this.props;
-
     if (!loading) {
       return null;
     }
-
     return /*#__PURE__*/_react.default.createElement("div", {
       className: `${baseClassName}__content-blocker`
     }, /*#__PURE__*/_react.default.createElement("div", {
@@ -301,7 +262,6 @@ class CardList extends _react.Component {
       className: `${baseClassName}__loader-spinner`
     })));
   }
-
   render() {
     const {
       baseClassName,
@@ -323,7 +283,6 @@ class CardList extends _react.Component {
       ...props
     } = this.props;
     let content = this.state.items.map(this.renderItem);
-
     if (this.isTile()) {
       content = /*#__PURE__*/_react.default.createElement(_Grid.default, {
         minColumnWidth: 400,
@@ -332,90 +291,82 @@ class CardList extends _react.Component {
         key: child.props.key
       }, child)));
     }
-
     return /*#__PURE__*/_react.default.createElement(_reactMeasure.default, {
       bounds: true,
       onResize: this.handleResize
-    }, ({
-      measureRef
-    }) => /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-      ref: measureRef,
-      className: (0, _classnames.default)(baseClassName, className)
-    }, props), /*#__PURE__*/_react.default.createElement(_CardListToolbar.default, {
-      selection: onSelectionChange && this.state.totalItems > 1 ? { ...selectionButton,
-        total: this.state.totalItems,
-        onSelectAll: this.selectAll,
-        onSelectNone: this.selectNone,
-        checked: this.state.items.length === selection.length
-      } : null,
-      onViewChange: viewSwitcher ? view => this.changeView(view) : null,
-      currentView: this.state.view,
-      groups: toolbarGroups
-    }), this.state.items.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
-      className: `${baseClassName}__list ${baseClassName}__list--${this.state.view}`
-    }, content), this.state.items.length === 0 && !loading && /*#__PURE__*/_react.default.createElement(_Translate.default, {
-      content: "CardList.notFound",
-      fallback: "No items found."
-    }), this.renderPagination(), this.renderLoader()));
+    }, _ref3 => {
+      let {
+        measureRef
+      } = _ref3;
+      return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+        ref: measureRef,
+        className: (0, _classnames.default)(baseClassName, className)
+      }, props), /*#__PURE__*/_react.default.createElement(_CardListToolbar.default, {
+        selection: onSelectionChange && this.state.totalItems > 1 ? {
+          ...selectionButton,
+          total: this.state.totalItems,
+          onSelectAll: this.selectAll,
+          onSelectNone: this.selectNone,
+          checked: this.state.items.length === selection.length
+        } : null,
+        onViewChange: viewSwitcher ? view => this.changeView(view) : null,
+        currentView: this.state.view,
+        groups: toolbarGroups
+      }), this.state.items.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
+        className: `${baseClassName}__list ${baseClassName}__list--${this.state.view}`
+      }, content), this.state.items.length === 0 && !loading && /*#__PURE__*/_react.default.createElement(_Translate.default, {
+        content: "CardList.notFound",
+        fallback: "No items found."
+      }), this.renderPagination(), this.renderLoader());
+    });
   }
-
 }
-
 CardList.propTypes = {
   /**
    * Array of data items for rendering.
    * @since 0.0.68
    */
   items: _propTypes.default.array.isRequired,
-
   /**
    * Callback for fetching items.
    * @since 0.0.68
    */
   onItemsFetch: _propTypes.default.func,
-
   /**
    * Total items. Equal items.length by default.
    * @since 0.0.68
    */
   totalItems: _propTypes.default.number,
-
   /**
    * Default page number.
    * @since 1.0.1
    */
   defaultPage: _propTypes.default.number,
-
   /**
    * View mode.
    * @since 0.0.54
    */
   view: _propTypes.default.oneOf([VIEW_EXTENDED, VIEW_TILE, VIEW_ROW, VIEW_RESPONSIVE]),
-
   /**
    * View change callback.
    * @since 0.0.54
    */
   onViewChange: _propTypes.default.func,
-
   /**
    * View switcher config.
    * @since 0.0.59
    */
   viewSwitcher: _propTypes.default.bool,
-
   /**
    * Array of keys of selected cards.
    * @since 0.0.59
    */
   selection: _propTypes.default.array,
-
   /**
    * Selection change handler for list. Checkboxes will only be rendered if this prop is defined.
    * @since 0.0.59
    */
   onSelectionChange: _propTypes.default.func,
-
   /**
    * Config for selection button in the toolbar.
    * @since 0.0.59
@@ -425,42 +376,35 @@ CardList.propTypes = {
      * See [Badge](#!/Badge) for all props.
      */
     badge: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),
-
     /**
      * Array of additional [MenuItems](#!/MenuItem).
      */
     menuItems: _propTypes.default.arrayOf(_propTypes.default.element)
   }),
-
   /**
    * Toolbar groups for the toolbar.
    * @since 0.0.59
    */
   toolbarGroups: _propTypes.default.arrayOf(_propTypes.default.element),
-
   /**
    * Unique key.
    * @since 0.0.59
    */
   itemKey: _propTypes.default.string.isRequired,
-
   /**
    * Render function for item.
    * @since 0.0.59
    */
   itemRender: _propTypes.default.func.isRequired,
-
   /**
    * Indicate the loading state of the list.
    * @since 0.0.68
    */
   loading: _propTypes.default.bool,
-
   /**
    * @ignore
    */
   className: _propTypes.default.string,
-
   /**
    * @ignore
    */

package/cjs/components/CardList/CardListToolbar.js

@@ -1,66 +1,46 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _constants = require("../../constants");
-
 var _Translate = _interopRequireDefault(require("../Translate"));
-
 var _Button = _interopRequireDefault(require("../Button"));
-
 var _Toolbar = _interopRequireWildcard(require("../Toolbar"));
-
 var _Dropdown = _interopRequireDefault(require("../Dropdown"));
-
 var _SegmentedControl = _interopRequireDefault(require("../SegmentedControl"));
-
 var _Menu = _interopRequireDefault(require("../Menu"));
-
 var _Checkbox = _interopRequireDefault(require("../Checkbox"));
-
 var _Badge = _interopRequireDefault(require("../Badge"));
-
 var _CardList = require("./CardList");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 // Copyright 1999-2017. Plesk International GmbH. All rights reserved.
-
 /* eslint-disable react/prop-types */
-const renderSelection = ({
-  onSelectAll,
-  onSelectNone,
-  checked,
-  badge,
-  menuItems = []
-}, baseClassName) => {
+
+const renderSelection = (_ref, baseClassName) => {
+  let {
+    onSelectAll,
+    onSelectNone,
+    checked,
+    badge,
+    menuItems = []
+  } = _ref;
   const hasDropdown = menuItems.length > 0;
   const buttonProps = {};
   const checkboxProps = {};
-
   if (hasDropdown) {
     buttonProps.caret = true;
-
     checkboxProps.onClick = e => e.stopPropagation();
-
     buttonProps.component = 'span';
   } else {
     buttonProps.component = 'label';
   }
-
   let button = /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({}, buttonProps, {
     className: `${baseClassName}--select-all-btn`
   }), /*#__PURE__*/_react.default.createElement(_Checkbox.default, (0, _extends2.default)({
@@ -73,23 +53,19 @@ const renderSelection = ({
       }
     }
   }, checkboxProps)));
-
   if (badge) {
     if (typeof badge === 'string') {
       badge = {
         label: badge
       };
     }
-
     button = /*#__PURE__*/_react.default.createElement(_Badge.default, badge, button);
   }
-
   if (hasDropdown) {
     button = /*#__PURE__*/_react.default.createElement(_Dropdown.default, {
       menu: /*#__PURE__*/_react.default.createElement(_Menu.default, null, menuItems)
     }, button);
   }
-
   return /*#__PURE__*/_react.default.createElement(_Toolbar.ToolbarGroup, {
     key: "selection",
     title: /*#__PURE__*/_react.default.createElement(_Translate.default, {
@@ -98,7 +74,6 @@ const renderSelection = ({
     })
   }, button);
 };
-
 const renderView = (onViewChange, currentView) => {
   const viewButtons = [{
     value: _CardList.VIEW_EXTENDED,
@@ -134,45 +109,36 @@ const renderView = (onViewChange, currentView) => {
     onChange: view => onViewChange(view)
   }));
 };
-
 const isToolbarExpander = element => /*#__PURE__*/(0, _react.isValidElement)(element) && element.type === _Toolbar.ToolbarExpander;
-
-const CardListToolbar = ({
-  baseClassName,
-  selection,
-  onViewChange,
-  currentView,
-  groups
-}) => {
+const CardListToolbar = _ref2 => {
+  let {
+    baseClassName,
+    selection,
+    onViewChange,
+    currentView,
+    groups
+  } = _ref2;
   let toolbar = [];
-
   if (selection) {
     toolbar.push(renderSelection(selection, baseClassName));
   }
-
   toolbar = toolbar.concat(groups);
-
   if (onViewChange && currentView !== _CardList.VIEW_RESPONSIVE) {
     const hasExpander = groups.filter(isToolbarExpander).length > 0;
-
     if (!hasExpander) {
       toolbar.push( /*#__PURE__*/_react.default.createElement(_Toolbar.ToolbarExpander, {
         key: "expander"
       }));
     }
-
     toolbar.push(renderView(onViewChange, currentView));
   }
-
   if (toolbar.length === 0) {
     return null;
   }
-
   return /*#__PURE__*/_react.default.createElement(_Toolbar.default, {
     className: baseClassName
   }, toolbar);
 };
-
 CardListToolbar.propTypes = {
   selection: _propTypes.default.object,
   groups: _propTypes.default.arrayOf(_propTypes.default.element).isRequired,

package/cjs/components/CardList/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,5 +10,4 @@ Object.defineProperty(exports, "default", {
     return _CardList.default;
   }
 });
-
 var _CardList = _interopRequireDefault(require("./CardList"));