@plesk/ui-library 3.36.0 → 3.37.0

package/cjs/components/List/List.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _reactTransitionGroup = require("react-transition-group");
@@ -29,7 +29,8 @@ var _useFocusVisible = require("use-focus-visible");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } // Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-const getRowKey = (row, props) => {
+// eslint-disable-next-line func-style
+function getRowKey(row, props) {
   const {
     rowKey
   } = props;
@@ -37,7 +38,7 @@ const getRowKey = (row, props) => {
     return rowKey(row);
   }
   return row[rowKey];
-};
+}
 const Tbody = _ref => {
   let {
     baseClassName,
@@ -137,7 +138,6 @@ const getHumanTotalRows = _ref2 => {
       return null;
   }
 };
-
 /**
  * `List` component is used for displaying a collection of tabular data.
  * [More details about designing of lists.](#!/Sets%20of%20Objects)
@@ -149,26 +149,32 @@ class List extends _react.Component {
     (0, _defineProperty2.default)(this, "state", {
       sortInPlace: !this.props.pagination,
       vertical: false,
-      expandedRows: this.props.expandedRows,
-      prevExpandedRows: this.props.expandedRows,
-      selection: this.props.selection,
-      prevSelection: this.props.selection,
-      ReorderableList: () => null,
-      reorderableItemWidths: []
+      expandedRows: this.props.expandedRows ?? [],
+      ReorderableList: undefined,
+      reorderableItemWidths: [],
+      prevExpandedRows: this.props.expandedRows ?? [],
+      sortColumn: undefined,
+      prevSortColumn: undefined,
+      sortDirection: undefined,
+      prevSortDirection: undefined,
+      selection: this.props.selection ?? [],
+      prevSelection: this.props.selection ?? [],
+      prevData: [],
+      prevPagination: undefined
     });
+    (0, _defineProperty2.default)(this, "needScroll", false);
     (0, _defineProperty2.default)(this, "anchorRef", /*#__PURE__*/(0, _react.createRef)());
-    (0, _defineProperty2.default)(this, "flatData", data => data.reduce((acc, _ref3) => {
-      let {
-        data,
-        ...row
-      } = _ref3;
+    (0, _defineProperty2.default)(this, "flatData", data => data.reduce((acc, item) => {
+      const {
+        data
+      } = item;
       const {
         virtual
-      } = this.getRowProps(row);
+      } = this.getRowProps(item);
       if (virtual) {
         return [...acc, ...(data ? this.flatData(data) : [])];
       }
-      return [...acc, row, ...(data ? this.flatData(data) : [])];
+      return [...acc, item, ...(data ? this.flatData(data) : [])];
     }, []));
     (0, _defineProperty2.default)(this, "handleRowSelectionChange", (checked, rowKey) => {
       const {
@@ -186,13 +192,14 @@ class List extends _react.Component {
     });
     (0, _defineProperty2.default)(this, "handleGlobalSelectionChange", headerChecked => {
       const {
-        onAllRowsSelectedChange
+        onAllRowsSelectedChange,
+        data
       } = this.props;
       const {
         selection
       } = this.state;
       const nextSelection = [];
-      this.flatData(this.props.data).forEach(row => {
+      this.flatData(data ?? []).forEach(row => {
         const key = getRowKey(row, this.props);
         if (row.disabled || this.isRowLoading(row)) {
           if (selection.indexOf(key) !== -1) {
@@ -209,15 +216,17 @@ class List extends _react.Component {
       }
       this.setSelection(nextSelection);
     });
-    (0, _defineProperty2.default)(this, "handleResize", _ref4 => {
+    (0, _defineProperty2.default)(this, "handleResize", _ref3 => {
       let {
         bounds
-      } = _ref4;
-      this.setState({
-        vertical: bounds.width < this.props.vertical
-      });
+      } = _ref3;
+      if (bounds && this.props.vertical) {
+        this.setState({
+          vertical: typeof this.props.vertical === 'boolean' ? this.props.vertical : bounds.width < this.props.vertical
+        });
+      }
     });
-    (0, _defineProperty2.default)(this, "isRowLoading", row => this.props.loadingRows.indexOf(getRowKey(row, this.props)) !== -1);
+    (0, _defineProperty2.default)(this, "isRowLoading", row => this.props.loadingRows?.indexOf(getRowKey(row, this.props)) !== -1);
     (0, _defineProperty2.default)(this, "getRowTitle", row => {
       const {
         columns
@@ -264,7 +273,7 @@ class List extends _react.Component {
       } = this.state;
       const headerExpanded = this.isAnyRowsExpanded(data, expandedRows);
       const nextExpandedRows = [];
-      this.flatData(this.props.data).forEach(row => {
+      this.flatData(data ?? []).forEach(row => {
         const key = getRowKey(row, this.props);
         if (!this.isRowExpandable(row)) {
           if (expandedRows.indexOf(key) !== -1) {
@@ -287,7 +296,7 @@ class List extends _react.Component {
       }
     });
   }
-  static getDerivedStateFromProps(_ref5, _ref6) {
+  static getDerivedStateFromProps(_ref4, _ref5) {
     let {
       sortColumn,
       sortDirection,
@@ -301,7 +310,7 @@ class List extends _react.Component {
       rowKey,
       totalRows,
       filtered
-    } = _ref5;
+    } = _ref4;
     let {
       prevSortColumn,
       prevSortDirection,
@@ -310,7 +319,7 @@ class List extends _react.Component {
       prevPagination,
       prevExpandedRows,
       ...state
-    } = _ref6;
+    } = _ref5;
     let nextState = {};
     if (prevSortColumn !== sortColumn || prevSortDirection !== sortDirection) {
       nextState = {
@@ -321,18 +330,18 @@ class List extends _react.Component {
     }
     const additionalExpanded = [];
     if (prevData !== data) {
-      const isSingleElementInCurrentExpanded = () => state.expandedRows.includes(getRowKey(data[0], {
+      const isSingleElementInCurrentExpanded = () => data && state.expandedRows.includes(getRowKey(data[0], {
         rowKey
       }));
       if (renderRowBody && data?.length === 1 && (!pagination || totalRows === 1) && (!prevData || prevData?.length === 0 || isSingleElementInCurrentExpanded()) && (!filtered || isSingleElementInCurrentExpanded())) {
         const key = getRowKey(data[0], {
           rowKey
         });
-        if (notExpandableRows.indexOf(key) === -1) {
+        if (notExpandableRows?.indexOf(key) === -1) {
           additionalExpanded.push(key);
         }
       }
-      const keys = data.map(row => getRowKey(row, {
+      const keys = (data ?? []).map(row => getRowKey(row, {
         rowKey
       }));
       const nextSelection = state.selection.filter(key => keys.indexOf(key) !== -1);
@@ -344,13 +353,13 @@ class List extends _react.Component {
     if (prevSelection !== selection) {
       nextState = {
         ...nextState,
-        selection
+        selection: selection ?? []
       };
     }
     if (prevExpandedRows !== expandedRows || additionalExpanded.length) {
       nextState = {
         ...nextState,
-        expandedRows: [...expandedRows, ...additionalExpanded]
+        expandedRows: [...(expandedRows ?? []), ...additionalExpanded]
       };
     }
     if (prevPagination !== pagination) {
@@ -393,10 +402,11 @@ class List extends _react.Component {
     }
   }
   applyReorderableList() {
-    Promise.resolve().then(() => _interopRequireWildcard(require( /* webpackChunkName: "react-movable" */'@plesk/react-movable'))).then(_ref7 => {
+    Promise.resolve().then(() => _interopRequireWildcard(require( /* webpackChunkName: "react-movable" */'@plesk/react-movable'))).then(_ref6 => {
       let {
         List: ReorderableList
-      } = _ref7;
+      } = _ref6;
+      // @ts-expect-error
       this.setState({
         ReorderableList
       });
@@ -412,13 +422,16 @@ class List extends _react.Component {
       data,
       columns
     } = this.props;
+    if (!data) {
+      return [];
+    }
     if (!sortInPlace) {
       return data;
     }
-    const [column] = columns.filter(_ref8 => {
+    const [column] = columns.filter(_ref7 => {
       let {
         key
-      } = _ref8;
+      } = _ref7;
       return key === sortColumn;
     });
     const defaultSort = (a, b) => {
@@ -430,7 +443,7 @@ class List extends _react.Component {
       }
       return 0;
     };
-    if (!column) {
+    if (!column || !sortColumn) {
       return data;
     }
     return data.sort((a, b) => (column.sort ? column.sort(a, b) : defaultSort(a[sortColumn], b[sortColumn])) * (sortDirection === 'ASC' ? 1 : -1));
@@ -439,22 +452,22 @@ class List extends _react.Component {
     const {
       sortInPlace
     } = this.state;
-    let {
+    const {
       sortColumn,
       sortDirection
     } = this.state;
-    sortDirection = sortColumn === columnKey && sortDirection === 'ASC' ? 'DESC' : 'ASC';
-    sortColumn = columnKey;
+    const nextSortDirection = sortColumn === columnKey && sortDirection === 'ASC' ? 'DESC' : 'ASC';
+    const nextSortColumn = columnKey;
     if (sortInPlace) {
       this.setState({
-        sortColumn,
-        sortDirection
+        sortColumn: nextSortColumn,
+        sortDirection: nextSortDirection
       });
     }
     if (this.props.onSortChange) {
       this.props.onSortChange({
-        sortColumn,
-        sortDirection
+        sortColumn: nextSortColumn,
+        sortDirection: nextSortDirection
       });
     }
   }
@@ -479,7 +492,7 @@ class List extends _react.Component {
     if (virtual) {
       return false;
     }
-    return this.props.notExpandableRows.indexOf(getRowKey(row, this.props)) === -1;
+    return this.props.notExpandableRows?.indexOf(getRowKey(row, this.props)) === -1;
   }
   handleRowExpandingChange(row) {
     let expandedRows;
@@ -498,7 +511,7 @@ class List extends _react.Component {
     });
     (0, _utils.safeInvoke)(this.props.onExpandedRowsChange, expandedRows.slice());
   }
-  renderRow(_ref9) {
+  renderRow(_ref8) {
     let {
       row,
       index,
@@ -507,7 +520,7 @@ class List extends _react.Component {
       parent,
       isDragged,
       reorderableProps
-    } = _ref9;
+    } = _ref8;
     const {
       baseClassName,
       renderRowBody,
@@ -517,10 +530,10 @@ class List extends _react.Component {
       vertical,
       reorderableItemWidths
     } = this.state;
-    const hasActions = realColumn.some(_ref10 => {
+    const hasActions = realColumn.some(_ref9 => {
       let {
         type
-      } = _ref10;
+      } = _ref9;
       return type === 'actions';
     });
     const {
@@ -546,7 +559,7 @@ class List extends _react.Component {
       }, className),
       ...rowProps,
       onClick: renderRowBody ? this.createRowClickHandler(row) : undefined,
-      children: realColumn.map((_ref11, index) => {
+      children: realColumn.map((_ref10, index) => {
         let {
           key,
           title,
@@ -555,7 +568,7 @@ class List extends _react.Component {
           cellProps,
           truncate,
           type
-        } = _ref11;
+        } = _ref10;
         if (skipCells > 0) {
           skipCells -= 1;
           return null;
@@ -566,7 +579,7 @@ class List extends _react.Component {
             width
           };
         }
-        if (isDragged) {
+        if (isDragged && reorderableItemWidths) {
           style = {
             width: reorderableItemWidths[index]
           };
@@ -663,13 +676,13 @@ class List extends _react.Component {
     }
     return element;
   }
-  renderRowBody(_ref12) {
+  renderRowBody(_ref11) {
     let {
       row,
       index,
       realColumn,
       parent
-    } = _ref12;
+    } = _ref11;
     const {
       baseClassName,
       renderRowBody
@@ -680,16 +693,16 @@ class List extends _react.Component {
     if (!renderRowBody) {
       return null;
     }
-    const reorderable = realColumn.find(_ref13 => {
+    const reorderable = realColumn.find(_ref12 => {
       let {
         key
-      } = _ref13;
+      } = _ref12;
       return key === 'reorderable';
     });
-    const expander = realColumn.find(_ref14 => {
+    const expander = realColumn.find(_ref13 => {
       let {
         key
-      } = _ref14;
+      } = _ref13;
       return key === 'expander';
     });
     const isRowExpanded = this.isRowExpanded(row);
@@ -834,7 +847,7 @@ class List extends _react.Component {
         itemsPerPageOptions = _Pagination.ITEMS_PER_PAGE_OPTIONS
       } = pagination.props;
       if (Array.isArray(itemsPerPageOptions)) {
-        const numericOptions = itemsPerPageOptions.filter(v => Number(v) === v);
+        const numericOptions = itemsPerPageOptions.filter(Number);
         if (numericOptions.length) {
           const min = Math.min(...numericOptions);
           if (totalRows <= min) {
@@ -897,6 +910,9 @@ class List extends _react.Component {
       pagination,
       loading
     } = this.props;
+    if (!pagination) {
+      return null;
+    }
     const paginationProps = {
       loading
     };
@@ -959,7 +975,7 @@ class List extends _react.Component {
     const {
       vertical
     } = this.state;
-    if (false === (data && data.length > 0) && !filtered && emptyViewMode === 'all') {
+    if (!(data && data.length > 0) && !filtered && emptyViewMode === 'all') {
       return this.renderEmptyView();
     }
     const realColumn = columns.map((column, i) => {
@@ -1111,14 +1127,14 @@ class List extends _react.Component {
     }
     const hasTitle = !vertical && columns.some(column => column.title);
     let content;
-    if (false === (data && data.length > 0) && (filtered || emptyViewMode === 'items')) {
+    if (!(data && data.length > 0) && (filtered || emptyViewMode === 'items')) {
       content = this.renderEmptyView();
     } else {
-      const renderList = _ref15 => {
+      const renderList = _ref14 => {
         let {
           children,
           props: reorderableProps
-        } = _ref15;
+        } = _ref14;
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_useFocusVisible.FocusVisibleManager, {
           children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("table", {
             className: (0, _classnames.default)(`${baseClassName}__table`, {
@@ -1132,7 +1148,7 @@ class List extends _react.Component {
                 className: (0, _classnames.default)(`${baseClassName}__table-thead`, {
                   [`${baseClassName}__row--expanded`]: this.isAnyRowsExpanded(data, this.state.expandedRows)
                 }),
-                children: realColumn.map(_ref16 => {
+                children: realColumn.map(_ref15 => {
                   let {
                     key,
                     title,
@@ -1144,7 +1160,7 @@ class List extends _react.Component {
                     type,
                     cellProps,
                     ...headerProps
-                  } = _ref16;
+                  } = _ref15;
                   if (sortable) {
                     title = /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                       className: "th__action",
@@ -1175,7 +1191,7 @@ class List extends _react.Component {
           })
         });
       };
-      const renderItem = _ref17 => {
+      const renderItem = _ref16 => {
         let {
           value: {
             row
@@ -1183,7 +1199,7 @@ class List extends _react.Component {
           index,
           props: reorderableProps,
           isDragged
-        } = _ref17;
+        } = _ref16;
         return this.renderRow({
           row,
           index,
@@ -1193,27 +1209,27 @@ class List extends _react.Component {
           isDragged
         });
       };
-      if (reorderable) {
+      if (reorderable && this.state.ReorderableList) {
         const {
           ReorderableList
         } = this.state;
         content = /*#__PURE__*/(0, _jsxRuntime.jsx)(ReorderableList, {
-          beforeDrag: _ref18 => {
+          beforeDrag: _ref17 => {
             let {
               elements,
               index
-            } = _ref18;
+            } = _ref17;
             const cells = Array.from(elements[index].firstElementChild.children);
             const reorderableItemWidths = cells.map(cell => window.getComputedStyle(cell).width);
             this.setState({
               reorderableItemWidths
             });
           },
-          onChange: _ref19 => {
+          onChange: _ref18 => {
             let {
               oldIndex,
               newIndex
-            } = _ref19;
+            } = _ref18;
             (0, _utils.safeInvoke)(onReorderEnd, {
               oldIndex,
               newIndex
@@ -1226,9 +1242,11 @@ class List extends _react.Component {
           renderItem: renderItem,
           lockVertically: true,
           hooks: {
-            getChildren: children => children.filter(node => node.nodeName !== 'THEAD')
+            getChildren: children =>
+            // @ts-expect-error
+            children.filter(node => node.nodeName !== 'THEAD')
           },
-          useDragHandle: true
+          useDragHandle: false
         });
       } else {
         content = renderList({
@@ -1278,10 +1296,10 @@ class List extends _react.Component {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactMeasure.default, {
         bounds: true,
         onResize: this.handleResize,
-        children: _ref20 => {
+        children: _ref19 => {
           let {
             measureRef
-          } = _ref20;
+          } = _ref19;
           return createRoot(measureRef);
         }
       });
@@ -1289,242 +1307,12 @@ class List extends _react.Component {
     return createRoot();
   }
 }
-List.propTypes = {
-  /**
-   * Columns definition.
-   *
-   * In addition to the properties described below, you can use any native properties
-   * supported by the `TH` element like `className`, `style`, etc.
-   * @since 0.0.42
-   */
-  columns: _propTypes.default.arrayOf(_propTypes.default.shape({
-    /**
-     * Unique column key.
-     */
-    key: _propTypes.default.string.isRequired,
-    /**
-     * Column title.
-     */
-    title: _propTypes.default.node,
-    /**
-     * Optional cell renderer function: `row => Component`. By default render value of cell.
-     * The renderer function can also returns a configuration object like: `{children: 'cell content', colSpan: 3}`
-     */
-    render: _propTypes.default.func,
-    /**
-     * Is column sortable.
-     * Default is `false`
-     */
-    sortable: _propTypes.default.bool,
-    /**
-     * Optional function for row comparison: `(row1, row2) => -1 | 0 | 1`
-     */
-    sort: _propTypes.default.func,
-    /**
-     * Column alignment.
-     */
-    align: _propTypes.default.oneOf(['left', 'center', 'right']),
-    /**
-     * Truncate the text in cell with an ellipsis.
-     */
-    truncate: _propTypes.default.bool,
-    /**
-     * Determine type of column content.
-     *
-     * * title - There should a title of the row.
-     * * controls - There should be some control: a button or a dropdown.
-     * * actions - There should be the ListAction component.
-     */
-    type: _propTypes.default.oneOf(['title', 'controls', 'actions'])
-  })).isRequired,
-  /**
-   * Array of row objects.
-   *
-   * Each row must contains `key` property, all columns keys, and can contain `disabled` property.
-   * @since 0.0.42
-   */
-  data: _propTypes.default.arrayOf(_propTypes.default.shape({
-    /**
-     * Unique column key. This property can by renamed using `rowKey` property of List.
-     */
-    key: _propTypes.default.string,
-    /**
-     * Optional property for disabling ability to select this row.
-     */
-    disabled: _propTypes.default.bool,
-    /**
-     * Optional array of children rows.
-     */
-    data: _propTypes.default.array,
-    /**
-     * An optional property to change the appearance of this row.<br />
-     *  `inactive, info, success, warning, danger`. (Since: 3.33.0)
-     */
-    intent: _propTypes.default.oneOf(['inactive', 'info', 'success', 'warning', 'danger'])
-  })),
-  /**
-   * Current sort column key
-   * @since 0.0.42
-   */
-  sortColumn: _propTypes.default.string,
-  /**
-   * Sort direction of the column being sorted.
-   * @since 0.0.42
-   */
-  sortDirection: _propTypes.default.oneOf(['ASC', 'DESC']),
-  /**
-   * Sort change handler
-   * @since 0.0.42
-   */
-  onSortChange: _propTypes.default.func,
-  /**
-   * Array of keys of selected rows
-   * @since 0.0.42
-   */
-  selection: _propTypes.default.array,
-  /**
-   * Selection change handler for list. Checkboxes will only be rendered if this prop is defined.
-   * @since 0.0.42
-   */
-  onSelectionChange: _propTypes.default.func,
-  /**
-   * Renderer for a selection checkbox. Allow to replace checkboxes in the List by a custom implementation.
-   * @since 3.19.0
-   */
-  renderSelectionCheckbox: _propTypes.default.func,
-  /**
-   * Row's key getter. Could be a string or function like: `row => <unique_string>`
-   * @since 0.0.45
-   */
-  rowKey: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func]),
-  /**
-   * Renderer for a row body. Should return ReactNode.
-   * @since 1.12.0
-   */
-  renderRowBody: _propTypes.default.func,
-  /**
-   * Array of keys of expanded rows
-   * @since 1.12.0
-   */
-  expandedRows: _propTypes.default.array,
-  /**
-   * Array of keys of rows which not have expand indicator
-   * @since 1.12.0
-   */
-  notExpandableRows: _propTypes.default.array,
-  /**
-   * Rows expanding change handler.
-   * @since 1.12.0
-   */
-  onExpandedRowsChange: _propTypes.default.func,
-  /**
-   * Array of keys of loading rows. They are displayed instead of checkboxes.
-   * @since 2.5.0
-   */
-  loadingRows: _propTypes.default.array,
-  /**
-   * A `Pagination` element. It displays at the top and the bottom of the list. When pagination is defined, the built-in sort is disabled.
-   * @since 2.4.0
-   */
-  pagination: _propTypes.default.node,
-  /**
-   * Total rows count, including nested rows. Usually, it uses together with pagination.
-   * @since 2.4.0
-   */
-  totalRows: _propTypes.default.number,
-  /**
-   * A `Toolbar` element.
-   * @since 2.4.0
-   */
-  toolbar: _propTypes.default.node,
-  /**
-   * A flag that all rows are selected.
-   * @since 2.4.0
-   */
-  allRowsSelected: _propTypes.default.bool,
-  /**
-   * A callback executed when the allRowsSelected prop is changed.
-   * @since 2.4.0
-   */
-  onAllRowsSelectedChange: _propTypes.default.func,
-  /**
-   * Filtered list. Manages toolbar visibility when data is absent and defines the defaults for empty view.
-   * @since 3.0.1
-   */
-  filtered: _propTypes.default.bool,
-  /**
-   * A custom view for the case when data is absent.
-   * @since 2.5.0
-   */
-  emptyView: _propTypes.default.node,
-  /**
-   * Which part of the List component should be replaced by the empty view.
-   * @since 2.6.0
-   * @deprecated Use `filtered` instead.
-   */
-  emptyViewMode: _propTypes.default.oneOf(['all', 'items']),
-  /**
-   * A slot on the right of the items.
-   * @since 2.6.0
-   */
-  sidebar: _propTypes.default.node,
-  /**
-   * Custom localization messages.
-   * @since 2.6.0
-   */
-  locale: _propTypes.default.shape({
-    selectAll: _propTypes.default.node,
-    deselectAll: _propTypes.default.node,
-    all: _propTypes.default.node,
-    totalRows: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.node]),
-    selectedRows: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.node])
-  }),
-  /**
-   * Render List row's content vertically.
-   * When some number is specified, it turns into vertical mode automatically if the List's width is less than the provided number.
-   * @since 3.3.0
-   */
-  vertical: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.number]),
-  /**
-   * Indicate the loading state of the list.
-   * @since 3.3.1
-   */
-  loading: _propTypes.default.bool,
-  /**
-   * Apply some props to each row.
-   *
-   * `virtual` - Virtual row does not have any controls.
-   *
-   * @since 3.11.0
-   */
-  rowProps: _propTypes.default.oneOfType([_propTypes.default.shape({
-    virtual: _propTypes.default.bool
-  }), _propTypes.default.func]),
-  /**
-   * Enable reorderable view.
-   * @since 3.18.0
-   */
-  reorderable: _propTypes.default.bool,
-  /**
-   * Reorder end handler.
-   * @since 3.18.0
-   */
-  onReorderEnd: _propTypes.default.func,
-  /**
-   * @ignore
-   */
-  className: _propTypes.default.string,
-  /**
-   * @ignore
-   */
-  baseClassName: _propTypes.default.string
-};
-List.defaultProps = {
+(0, _defineProperty2.default)(List, "defaultProps", {
   data: [],
-  sortColumn: null,
+  sortColumn: undefined,
   sortDirection: 'ASC',
-  onSortChange: null,
-  onSelectionChange: null,
+  onSortChange: undefined,
+  onSelectionChange: undefined,
   selection: [],
   renderSelectionCheckbox: undefined,
   rowKey: 'key',
@@ -1533,7 +1321,7 @@ List.defaultProps = {
   notExpandableRows: [],
   onExpandedRowsChange: undefined,
   loadingRows: [],
-  className: null,
+  className: '',
   baseClassName: `${_constants.CLS_PREFIX}list`,
   pagination: undefined,
   totalRows: undefined,
@@ -1550,5 +1338,5 @@ List.defaultProps = {
   rowProps: undefined,
   reorderable: false,
   onReorderEnd: undefined
-};
+});
 var _default = exports.default = List;