"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.ITEMS_PER_PAGE_OPTIONS = void 0;
var _classnames = _interopRequireDefault(require("classnames"));
var _constants = require("../../constants");
var _InputNumber = _interopRequireDefault(require("../InputNumber"));
var _Translate = _interopRequireDefault(require("../Translate"));
var _Link = _interopRequireDefault(require("../Link"));
var _Text = _interopRequireDefault(require("../Text"));
var _Popover = _interopRequireDefault(require("../Popover"));
var _SegmentedControl = _interopRequireDefault(require("../SegmentedControl"));
var _ContentLoader = _interopRequireDefault(require("../ContentLoader"));
var _utils = require("../utils");
var _jsxRuntime = require("react/jsx-runtime");
// Copyright 1999-2023. Plesk International GmbH. All rights reserved.

const ITEMS_PER_PAGE_OPTIONS = exports.ITEMS_PER_PAGE_OPTIONS = [25, 100, 'all'];
const VIEW_DEFAULT = 'default';
const VIEW_POPOVER = 'popover';
/**
 * `Pagination` component is used for navigating objects in [List](#!/List) which content is displayed on multiple pages.
 * @since 0.0.54
 */
const Pagination = _ref => {
  let {
    baseClassName = `${_constants.CLS_PREFIX}pagination`,
    className,
    current = 1,
    total,
    onSelect,
    itemsPerPage,
    itemsPerPageOptions = ITEMS_PER_PAGE_OPTIONS,
    onItemsPerPageChange,
    isShowNavigationButtons,
    isShowPageButtons,
    maxPageButtons,
    view = VIEW_DEFAULT,
    loading = false,
    ...props
  } = _ref;
  const handleSelect = page => (0, _utils.safeInvoke)(onSelect, page);
  const handleItemsPerPageChange = option => (0, _utils.safeInvoke)(onItemsPerPageChange, option);
  const pagination = /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: (0, _classnames.default)(baseClassName, className),
    ...props,
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: `${baseClassName}__pages`,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ContentLoader.default, {
        loading: loading,
        overlay: true,
        spinner: {
          size: 'sm'
        },
        className: `${baseClassName}__loader`,
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputNumber.default, {
          value: loading ? undefined : current,
          onChange: handleSelect,
          min: 1,
          max: total,
          decrementIcon: "arrow-left",
          incrementIcon: "arrow-right",
          className: `${baseClassName}__input`
        })
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
        content: "Pagination.totalShort",
        fallback: "of %%total%%",
        params: {
          total
        },
        className: `${baseClassName}__text`
      })]
    }), onItemsPerPageChange ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: `${baseClassName}__options`,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
        content: "Pagination.itemsPerPage",
        fallback: "Items per page",
        className: `${baseClassName}__text`
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SegmentedControl.default, {
        ghost: true,
        buttons: itemsPerPageOptions.map(value => {
          let title = value;
          if (value === 'all') {
            title = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
              content: "Pagination.all",
              fallback: "All"
            });
          }
          return {
            value,
            title
          };
        }),
        selected: itemsPerPage,
        onChange: handleItemsPerPageChange,
        className: `${baseClassName}__control`
      })]
    }) : null]
  });
  if (view === VIEW_POPOVER) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popover.default, {
      target: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
        fontSize: "sm",
        component: _Link.default,
        nowrap: true,
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Translate.default, {
          content: "Pagination.total",
          fallback: "Page %%current%% of %%total%%",
          params: {
            current,
            total
          }
        })
      }),
      placement: "top",
      className: `${baseClassName}__popover`,
      children: pagination
    });
  }
  return pagination;
};
var _default = exports.default = Pagination;