nishant-design-system/lib/components/Pagination/PaginationItem.js

Sense UI components library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.PaginationItem = exports.PaginationButton = void 0;
var React = _interopRequireWildcard(require("react"));
var _classify = _interopRequireDefault(require("../../utils/classify"));
var _Button = require("../Button");
var _Text = require("../Text");
var _PaginationModule = _interopRequireDefault(require("./Pagination.module.css"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
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; }

const PaginationButton = props => {
  const {
    disabled,
    onClick,
    page,
    selected,
    type
  } = props;
  const paginationBtnRef = React.useRef(null);
  React.useEffect(() => {
    if (selected) {
      paginationBtnRef.current?.blur();
    }
  }, [selected]);
  switch (type) {
    case 'first':
      return /*#__PURE__*/React.createElement(_Button.Button, {
        classNames: {
          icon: (0, _classify.default)(_PaginationModule.default.icon, {
            [_PaginationModule.default.disabled]: disabled
          }),
          wrapper: (0, _classify.default)(_PaginationModule.default.paginatorButton, {
            [_PaginationModule.default.disabled]: disabled
          })
        },
        type: selected ? 'secondary' : 'ghost',
        size: "small",
        onClick: onClick,
        disabled: disabled,
        ref: paginationBtnRef,
        iconLeftName: "chevrons-left"
      });
    case 'previous':
      return /*#__PURE__*/React.createElement(_Button.Button, {
        classNames: {
          icon: (0, _classify.default)(_PaginationModule.default.icon, {
            [_PaginationModule.default.disabled]: disabled
          }),
          wrapper: (0, _classify.default)(_PaginationModule.default.paginatorButton, {
            [_PaginationModule.default.disabled]: disabled
          })
        },
        type: selected ? 'secondary' : 'ghost',
        size: "small",
        onClick: onClick,
        disabled: disabled,
        ref: paginationBtnRef,
        iconLeftName: "chevron-left"
      });
    case 'page':
      return /*#__PURE__*/React.createElement(_Button.Button, {
        classNames: {
          wrapper: (0, _classify.default)(_PaginationModule.default.paginatorButton, {
            [_PaginationModule.default.selected]: selected
          })
        },
        type: selected ? 'secondary' : 'ghost',
        size: "small",
        onClick: onClick,
        disabled: disabled,
        ref: paginationBtnRef,
        tabIndex: selected ? -1 : 0
      }, page);
    case 'start-ellipsis':
    case 'end-ellipsis':
      return /*#__PURE__*/React.createElement("div", {
        className: (0, _classify.default)(_PaginationModule.default.separator)
      }, /*#__PURE__*/React.createElement(_Text.ButtonTextSmall, {
        color: "disabled"
      }, "..."));
    case 'next':
      return /*#__PURE__*/React.createElement(_Button.Button, {
        classNames: {
          icon: (0, _classify.default)(_PaginationModule.default.icon, {
            [_PaginationModule.default.disabled]: disabled
          }),
          wrapper: (0, _classify.default)(_PaginationModule.default.paginatorButton, {
            [_PaginationModule.default.disabled]: disabled
          })
        },
        type: selected ? 'secondary' : 'ghost',
        size: "small",
        onClick: onClick,
        disabled: disabled,
        ref: paginationBtnRef,
        iconLeftName: "chevron-right"
      });
    case 'last':
      return /*#__PURE__*/React.createElement(_Button.Button, {
        classNames: {
          icon: (0, _classify.default)(_PaginationModule.default.icon, {
            [_PaginationModule.default.disabled]: disabled
          }),
          wrapper: (0, _classify.default)(_PaginationModule.default.paginatorButton, {
            [_PaginationModule.default.disabled]: disabled
          })
        },
        type: selected ? 'secondary' : 'ghost',
        size: "small",
        onClick: onClick,
        disabled: disabled,
        ref: paginationBtnRef,
        iconLeftName: "chevrons-right"
      });
    default:
      break;
  }
};
exports.PaginationButton = PaginationButton;
const PaginationItem = props => /*#__PURE__*/React.createElement(PaginationButton, props);
exports.PaginationItem = PaginationItem;