@wix/design-system 1.0.0

package/dist/cjs/Pagination/PaginationCore/PaginationCore.js

@@ -0,0 +1,356 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
+var _PaginationCoreSt = require("./PaginationCore.st.css.js");
+var _constants = require("./constants");
+var _utils = require("./utils");
+var _PageStrip = require("./PageStrip");
+var _propsUtils = require("../../utils/propsUtils");
+var _jsxFileName = "/home/builduser/work/31dad9578a4e06bb/packages/wix-design-system/dist/cjs/Pagination/PaginationCore/PaginationCore.tsx";
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
+var upperCaseFirst = str => str[0].toUpperCase() + str.slice(1);
+var ButtonType;
+(function (ButtonType) {
+  ButtonType["Prev"] = "previous";
+  ButtonType["Next"] = "next";
+  ButtonType["First"] = "first";
+  ButtonType["Last"] = "last";
+})(ButtonType || (ButtonType = {}));
+class PaginationCore extends React.Component {
+  constructor() {
+    super(...arguments);
+    this.rootNode = void 0;
+    this.getMaxPagesToShow = () => {
+      if (this.props.maxPagesToShow) {
+        return this.props.maxPagesToShow;
+      }
+      if (this.props.responsive) {
+        return 20;
+      }
+      return 7;
+    };
+    this.state = {
+      pageInputValue: String(this.props.currentPage),
+      pageInputHasError: false
+    };
+    this.handlePageInputChange = e => {
+      this.setState({
+        pageInputValue: e.target.value,
+        pageInputHasError: false
+      });
+    };
+    this.handlePageInputKeyDown = event => {
+      // Enter
+      if (event.key === 'Enter') {
+        var page = Number(this.state.pageInputValue);
+        if (page !== this.props.currentPage) {
+          if (1 <= page && page <= this.props.totalPages) {
+            this.props.onChange && this.props.onChange({
+              event,
+              page
+            });
+          } else {
+            this.setState({
+              pageInputHasError: true
+            });
+          }
+        }
+      }
+    };
+    this.handlePageInputBlur = () => {
+      this.setState({
+        pageInputValue: String(this.props.currentPage),
+        pageInputHasError: false
+      });
+    };
+    this.handlePageClick = (event, page) => {
+      this.props.onChange && this.props.onChange({
+        event,
+        page
+      });
+    };
+    this.handlePageKeyDown = (event, page) => {
+      // Enter or Space
+      if (event.key === 'Enter' || event.key === 'Space') {
+        this.props.onChange && this.props.onChange({
+          event,
+          page
+        });
+      }
+    };
+  }
+  updateRootMinWidth() {
+    this.rootNode && this.props.paginationMode && (0, _utils.measureAndSetRootMinWidth)(this.rootNode, this.props.paginationMode, this.props.id);
+  }
+  componentDidMount() {
+    this.props.updateResponsiveLayout && this.updateRootMinWidth();
+  }
+  componentDidUpdate() {
+    this.props.updateResponsiveLayout && this.updateRootMinWidth();
+  }
+  getId() {
+    var elementName = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+    return (0, _utils.getId)(this.props.id, elementName);
+  }
+  renderPageStrip() {
+    return /*#__PURE__*/React.createElement(_PageStrip.PageStrip, {
+      id: this.props.id,
+      totalPages: this.props.totalPages || 0,
+      currentPage: this.props.currentPage || 0,
+      maxPagesToShow: this.getMaxPagesToShow() || 0,
+      showFirstPage: !!this.props.showFirstPage,
+      showLastPage: !!this.props.showLastPage,
+      responsive: !!this.props.responsive,
+      pageUrl: this.props.pageUrl,
+      gapLabel: this.props.gapLabel || '',
+      onPageClick: this.handlePageClick,
+      onPageKeyDown: this.handlePageKeyDown,
+      updateResponsiveLayout: this.props.updateResponsiveLayout,
+      disabled: !!this.props.disabled,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 128,
+        columnNumber: 7
+      }
+    });
+  }
+  renderPages() {
+    switch (this.props.paginationMode) {
+      case _constants.PaginationCoreMode.Input:
+        return this.renderPageForm();
+      case _constants.PaginationCoreMode.Compact:
+        return this.renderPageCompact();
+      case _constants.PaginationCoreMode.Pages:
+      default:
+        return this.renderPageStrip();
+    }
+  }
+  renderPageCompact() {
+    return /*#__PURE__*/React.createElement("div", {
+      "data-hook": _constants.DataHooks.pageCompact,
+      id: this.getId('pageCompact'),
+      className: _PaginationCoreSt.classes.compact,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 209,
+        columnNumber: 7
+      }
+    }, /*#__PURE__*/React.createElement("span", {
+      id: this.getId('currentPage'),
+      "data-hook": _constants.DataHooks.currentPage,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 214,
+        columnNumber: 9
+      }
+    }, this.props.currentPage), /*#__PURE__*/React.createElement("span", {
+      id: this.getId('slash'),
+      className: _PaginationCoreSt.classes.slash,
+      "data-hook": _constants.DataHooks.slashLabel,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 217,
+        columnNumber: 9
+      }
+    }, this.props.slashLabel), /*#__PURE__*/React.createElement("span", {
+      id: this.getId('totalPages'),
+      "data-hook": _constants.DataHooks.totalPages,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 224,
+        columnNumber: 9
+      }
+    }, this.props.totalPages));
+  }
+  renderPageForm() {
+    return /*#__PURE__*/React.createElement("div", {
+      "data-hook": _constants.DataHooks.pageForm,
+      id: this.getId('pageForm'),
+      className: _PaginationCoreSt.classes.pageForm,
+      dir: "ltr",
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 233,
+        columnNumber: 7
+      }
+    }, /*#__PURE__*/React.createElement("input", {
+      id: this.getId('pageInput'),
+      "data-hook": _constants.DataHooks.pageInput,
+      type: "number",
+      className: _PaginationCoreSt.classes.pageInput,
+      min: 1,
+      max: this.props.totalPages,
+      value: this.state.pageInputValue,
+      disabled: this.props.disabled,
+      onChange: this.handlePageInputChange,
+      onKeyDown: this.handlePageInputKeyDown,
+      "aria-label": 'Page number, select a number between 1 and ' + this.props.totalPages,
+      onBlur: this.handlePageInputBlur,
+      style: {
+        width: (0, _utils.calculateWidth)(this.props.totalPages)
+      },
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 239,
+        columnNumber: 9
+      }
+    }), this.props.showInputModeTotalPages && [/*#__PURE__*/React.createElement("span", {
+      key: "slash",
+      id: this.getId('slash'),
+      className: _PaginationCoreSt.classes.slash,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 258,
+        columnNumber: 11
+      }
+    }, this.props.slashLabel), /*#__PURE__*/React.createElement("span", {
+      key: "total-pages",
+      id: this.getId('totalPages'),
+      "data-hook": _constants.DataHooks.totalPages,
+      className: _PaginationCoreSt.classes.totalPages,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 261,
+        columnNumber: 11
+      }
+    }, this.props.totalPages)]);
+  }
+  renderEmptyButton(type) {
+    var btnClass = '';
+    switch (type) {
+      case ButtonType.Prev:
+        {
+          btnClass = _PaginationCoreSt.classes.emptyButtonPrevious;
+          break;
+        }
+      case ButtonType.Next:
+        {
+          btnClass = _PaginationCoreSt.classes.emptyButtonNext;
+          break;
+        }
+      default:
+    }
+    return /*#__PURE__*/React.createElement("div", {
+      "data-hook": _constants.DataHooks[type],
+      className: (0, _PaginationCoreSt.st)(_PaginationCoreSt.classes.emptyButton, btnClass),
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 289,
+        columnNumber: 7
+      }
+    });
+  }
+  renderNavButton(type) {
+    var {
+      currentPage,
+      totalPages,
+      pageUrl
+    } = this.props;
+    var disabled = this.props.disabled || (type === ButtonType.First || type === ButtonType.Prev) && (currentPage || 0) <= 1 || (type === ButtonType.Last || type === ButtonType.Next) && (currentPage || 0) >= totalPages;
+    var [btnClass, label, page] = {
+      [ButtonType.Prev]: [_PaginationCoreSt.classes.navButtonPrevious, this.props.previousLabel, (currentPage || 0) - 1],
+      [ButtonType.Next]: [_PaginationCoreSt.classes.navButtonNext, this.props.nextLabel, (currentPage || 0) + 1],
+      [ButtonType.First]: [_PaginationCoreSt.classes.navButtonFirst, this.props.firstLabel, 1],
+      [ButtonType.Last]: [_PaginationCoreSt.classes.navButtonLast, this.props.lastLabel, totalPages]
+    }[type];
+    return /*#__PURE__*/React.createElement("a", {
+      "data-hook": _constants.DataHooks[type],
+      id: this.getId('navButton' + upperCaseFirst(type)),
+      className: (0, _PaginationCoreSt.st)(_PaginationCoreSt.classes.navButton, {
+        disabled
+      }, btnClass),
+      "aria-label": upperCaseFirst(type) + ' Page',
+      "aria-disabled": disabled,
+      tabIndex: disabled || pageUrl ? undefined : 0,
+      onClick: disabled ? undefined : event => this.handlePageClick(event, page),
+      onKeyDown: disabled ? undefined : event => this.handlePageKeyDown(event, page),
+      href: !disabled && pageUrl ? pageUrl(page) : undefined,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 326,
+        columnNumber: 7
+      }
+    }, label);
+  }
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    this.setState({
+      pageInputValue: String(nextProps.currentPage),
+      pageInputHasError: false
+    });
+  }
+  render() {
+    var {
+      disabled,
+      showFirstLastNavButtons,
+      showNextLabel,
+      showPreviousLabel,
+      width,
+      style: inlineStyle
+    } = this.props;
+    var styleStates = {
+      disabled,
+      error: this.state.pageInputHasError
+    };
+    return /*#__PURE__*/React.createElement("nav", (0, _extends2.default)({
+      ref: el => this.rootNode = el,
+      id: this.getId(''),
+      "aria-label": "PaginationCore Navigation",
+      "aria-disabled": disabled,
+      dir: this.props.rtl ? 'rtl' : undefined,
+      onClick: this.props.onClick,
+      onDoubleClick: this.props.onDoubleClick,
+      onMouseEnter: this.props.onMouseEnter,
+      onMouseLeave: this.props.onMouseLeave,
+      style: inlineStyle || {
+        width
+      },
+      className: (0, _PaginationCoreSt.st)(_PaginationCoreSt.classes.root, styleStates, this.props.className)
+    }, (0, _propsUtils.filterDataProps)(this.props), {
+      __self: this,
+      __source: {
+        fileName: _jsxFileName,
+        lineNumber: 369,
+        columnNumber: 7
+      }
+    }), showFirstLastNavButtons && this.renderNavButton(ButtonType.First), showPreviousLabel ? this.renderNavButton(ButtonType.Prev) : this.renderEmptyButton(ButtonType.Prev), this.renderPages(), showNextLabel ? this.renderNavButton(ButtonType.Next) : this.renderEmptyButton(ButtonType.Next), showFirstLastNavButtons && this.renderNavButton(ButtonType.Last));
+  }
+}
+exports.default = PaginationCore;
+PaginationCore.displayName = 'PaginationCore';
+PaginationCore.defaultProps = {
+  currentPage: 1,
+  showFirstLastNavButtons: false,
+  showFirstPage: false,
+  showLastPage: false,
+  showNextLabel: true,
+  showPreviousLabel: true,
+  responsive: false,
+  paginationMode: 'pages',
+  showInputModeTotalPages: false,
+  disabled: false,
+  // dir="rtl" automatically flips the direction of less-than and more-than signs.
+  // If we decide to use different labels we need to add conditional logic.
+  firstLabel: '<<',
+  lastLabel: '>>',
+  previousLabel: '<',
+  nextLabel: '>',
+  gapLabel: '...',
+  slashLabel: '\u00A0/\u00A0'
+};
+//# sourceMappingURL=PaginationCore.js.map

package/dist/cjs/Pagination/PaginationCore/PaginationCore.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["upperCaseFirst","str","toUpperCase","slice","ButtonType","PaginationCore","React","Component","rootNode","getMaxPagesToShow","props","maxPagesToShow","responsive","state","pageInputValue","String","currentPage","pageInputHasError","handlePageInputChange","e","setState","target","value","handlePageInputKeyDown","event","key","page","Number","totalPages","onChange","handlePageInputBlur","handlePageClick","handlePageKeyDown","updateRootMinWidth","paginationMode","measureAndSetRootMinWidth","id","componentDidMount","updateResponsiveLayout","componentDidUpdate","getId","elementName","renderPageStrip","showFirstPage","showLastPage","pageUrl","gapLabel","disabled","renderPages","PaginationCoreMode","Input","renderPageForm","Compact","renderPageCompact","Pages","DataHooks","pageCompact","classes","compact","slash","slashLabel","pageForm","pageInput","width","calculateWidth","showInputModeTotalPages","renderEmptyButton","type","btnClass","Prev","emptyButtonPrevious","Next","emptyButtonNext","st","emptyButton","renderNavButton","First","Last","label","navButtonPrevious","previousLabel","navButtonNext","nextLabel","navButtonFirst","firstLabel","navButtonLast","lastLabel","navButton","undefined","UNSAFE_componentWillReceiveProps","nextProps","render","showFirstLastNavButtons","showNextLabel","showPreviousLabel","style","inlineStyle","styleStates","error","el","rtl","onClick","onDoubleClick","onMouseEnter","onMouseLeave","root","className","filterDataProps","displayName","defaultProps"],"sources":["../../../../src/Pagination/PaginationCore/PaginationCore.tsx"],"sourcesContent":["import * as React from 'react';\nimport { st, classes } from './PaginationCore.st.css';\nimport { DataHooks, PaginationCoreMode } from './constants';\nimport { calculateWidth, getId, measureAndSetRootMinWidth } from './utils';\nimport { PageStrip } from './PageStrip';\nimport { filterDataProps } from '../../utils/propsUtils';\n\nconst upperCaseFirst = (str: string): string =>\n  str[0].toUpperCase() + str.slice(1);\n\nconst enum ButtonType {\n  Prev = 'previous',\n  Next = 'next',\n  First = 'first',\n  Last = 'last',\n}\n\nexport interface PaginationCoreProps {\n  /** hook for testing purposes */\n  'data-hook'?: string;\n  // data\n  totalPages: number;\n  currentPage?: number;\n  // props\n  pageUrl?(pageNumber: number): string;\n  onChange?(event: { event: React.SyntheticEvent; page: number }): void;\n  onClick?(event: React.SyntheticEvent): void;\n  onDoubleClick?(event: React.SyntheticEvent): void;\n  onMouseEnter?(event: React.SyntheticEvent): void;\n  onMouseLeave?(event: React.SyntheticEvent): void;\n  paginationMode?: 'pages' | 'input' | 'compact' | PaginationCoreMode;\n  showFirstLastNavButtons?: boolean;\n  firstLabel?: React.ReactNode;\n  previousLabel?: React.ReactNode;\n  nextLabel?: React.ReactNode;\n  lastLabel?: React.ReactNode;\n  gapLabel?: React.ReactNode;\n  slashLabel?: React.ReactNode;\n  rtl?: boolean;\n  width?: number;\n  showFirstPage?: boolean;\n  showLastPage?: boolean;\n  showNextLabel?: boolean;\n  showPreviousLabel?: boolean;\n  showInputModeTotalPages?: boolean;\n  responsive?: boolean;\n  maxPagesToShow?: number;\n  className?: string;\n  id?: string;\n  updateResponsiveLayout?(callback: () => void): void;\n  style?: React.CSSProperties;\n  disabled?: boolean;\n}\n\nexport interface PaginationCoreState {\n  pageInputValue: string;\n  pageInputHasError: boolean;\n}\n\nexport default class PaginationCore extends React.Component<\n  PaginationCoreProps,\n  PaginationCoreState\n> {\n  static displayName = 'PaginationCore';\n  public static defaultProps: Partial<PaginationCoreProps> = {\n    currentPage: 1,\n    showFirstLastNavButtons: false,\n    showFirstPage: false,\n    showLastPage: false,\n    showNextLabel: true,\n    showPreviousLabel: true,\n    responsive: false,\n    paginationMode: 'pages',\n    showInputModeTotalPages: false,\n    disabled: false,\n\n    // dir=\"rtl\" automatically flips the direction of less-than and more-than signs.\n    // If we decide to use different labels we need to add conditional logic.\n    firstLabel: '<<',\n    lastLabel: '>>',\n    previousLabel: '<',\n    nextLabel: '>',\n    gapLabel: '...',\n    slashLabel: '\\u00A0/\\u00A0',\n  };\n\n  private rootNode: HTMLElement | null | undefined;\n\n  private updateRootMinWidth() {\n    this.rootNode &&\n      this.props.paginationMode &&\n      measureAndSetRootMinWidth(\n        this.rootNode,\n        this.props.paginationMode,\n        this.props.id,\n      );\n  }\n\n  public componentDidMount() {\n    this.props.updateResponsiveLayout && this.updateRootMinWidth();\n  }\n\n  public componentDidUpdate() {\n    this.props.updateResponsiveLayout && this.updateRootMinWidth();\n  }\n\n  private getId(elementName: string = ''): string | undefined {\n    return getId(this.props.id, elementName);\n  }\n\n  private readonly getMaxPagesToShow = (): number => {\n    if (this.props.maxPagesToShow) {\n      return this.props.maxPagesToShow;\n    }\n    if (this.props.responsive) {\n      return 20;\n    }\n    return 7;\n  };\n\n  public state = {\n    pageInputValue: String(this.props.currentPage),\n    pageInputHasError: false,\n  };\n\n  private renderPageStrip(): JSX.Element {\n    return (\n      <PageStrip\n        id={this.props.id}\n        totalPages={this.props.totalPages || 0}\n        currentPage={this.props.currentPage || 0}\n        maxPagesToShow={this.getMaxPagesToShow() || 0}\n        showFirstPage={!!this.props.showFirstPage}\n        showLastPage={!!this.props.showLastPage}\n        responsive={!!this.props.responsive}\n        pageUrl={this.props.pageUrl}\n        gapLabel={this.props.gapLabel || ''}\n        onPageClick={this.handlePageClick}\n        onPageKeyDown={this.handlePageKeyDown}\n        updateResponsiveLayout={this.props.updateResponsiveLayout}\n        disabled={!!this.props.disabled}\n      />\n    );\n  }\n\n  private readonly handlePageInputChange = (\n    e: React.ChangeEvent<HTMLInputElement>,\n  ): void => {\n    this.setState({\n      pageInputValue: e.target.value,\n      pageInputHasError: false,\n    });\n  };\n\n  private readonly handlePageInputKeyDown = (\n    event: React.KeyboardEvent<HTMLInputElement>,\n  ): void => {\n    // Enter\n    if (event.key === 'Enter') {\n      const page = Number(this.state.pageInputValue);\n      if (page !== this.props.currentPage) {\n        if (1 <= page && page <= this.props.totalPages) {\n          this.props.onChange && this.props.onChange({ event, page });\n        } else {\n          this.setState({ pageInputHasError: true });\n        }\n      }\n    }\n  };\n\n  private readonly handlePageInputBlur = (): void => {\n    this.setState({\n      pageInputValue: String(this.props.currentPage),\n      pageInputHasError: false,\n    });\n  };\n\n  private readonly handlePageClick = (\n    event: React.MouseEvent,\n    page: number,\n  ): void => {\n    this.props.onChange && this.props.onChange({ event, page });\n  };\n\n  private readonly handlePageKeyDown = (\n    event: React.KeyboardEvent,\n    page: number,\n  ): void => {\n    // Enter or Space\n    if (event.key === 'Enter' || event.key === 'Space') {\n      this.props.onChange && this.props.onChange({ event, page });\n    }\n  };\n\n  private renderPages(): JSX.Element {\n    switch (this.props.paginationMode) {\n      case PaginationCoreMode.Input:\n        return this.renderPageForm();\n      case PaginationCoreMode.Compact:\n        return this.renderPageCompact();\n      case PaginationCoreMode.Pages:\n      default:\n        return this.renderPageStrip();\n    }\n  }\n\n  private renderPageCompact(): JSX.Element {\n    return (\n      <div\n        data-hook={DataHooks.pageCompact}\n        id={this.getId('pageCompact')}\n        className={classes.compact}\n      >\n        <span id={this.getId('currentPage')} data-hook={DataHooks.currentPage}>\n          {this.props.currentPage}\n        </span>\n        <span\n          id={this.getId('slash')}\n          className={classes.slash}\n          data-hook={DataHooks.slashLabel}\n        >\n          {this.props.slashLabel}\n        </span>\n        <span id={this.getId('totalPages')} data-hook={DataHooks.totalPages}>\n          {this.props.totalPages}\n        </span>\n      </div>\n    );\n  }\n\n  private renderPageForm(): JSX.Element {\n    return (\n      <div\n        data-hook={DataHooks.pageForm}\n        id={this.getId('pageForm')}\n        className={classes.pageForm}\n        dir=\"ltr\"\n      >\n        <input\n          id={this.getId('pageInput')}\n          data-hook={DataHooks.pageInput}\n          type=\"number\"\n          className={classes.pageInput}\n          min={1}\n          max={this.props.totalPages}\n          value={this.state.pageInputValue}\n          disabled={this.props.disabled}\n          onChange={this.handlePageInputChange}\n          onKeyDown={this.handlePageInputKeyDown}\n          aria-label={\n            'Page number, select a number between 1 and ' +\n            this.props.totalPages\n          }\n          onBlur={this.handlePageInputBlur}\n          style={{ width: calculateWidth(this.props.totalPages) }}\n        />\n        {this.props.showInputModeTotalPages && [\n          <span key=\"slash\" id={this.getId('slash')} className={classes.slash}>\n            {this.props.slashLabel}\n          </span>,\n          <span\n            key=\"total-pages\"\n            id={this.getId('totalPages')}\n            data-hook={DataHooks.totalPages}\n            className={classes.totalPages}\n          >\n            {this.props.totalPages}\n          </span>,\n        ]}\n      </div>\n    );\n  }\n\n  private renderEmptyButton(type: ButtonType): JSX.Element {\n    let btnClass = '';\n    switch (type) {\n      case ButtonType.Prev: {\n        btnClass = classes.emptyButtonPrevious;\n        break;\n      }\n      case ButtonType.Next: {\n        btnClass = classes.emptyButtonNext;\n        break;\n      }\n      default:\n    }\n\n    return (\n      <div\n        data-hook={DataHooks[type]}\n        className={st(classes.emptyButton, btnClass)}\n      />\n    );\n  }\n\n  private renderNavButton(type: ButtonType): JSX.Element {\n    const { currentPage, totalPages, pageUrl } = this.props;\n\n    const disabled =\n      this.props.disabled ||\n      ((type === ButtonType.First || type === ButtonType.Prev) &&\n        (currentPage || 0) <= 1) ||\n      ((type === ButtonType.Last || type === ButtonType.Next) &&\n        (currentPage || 0) >= totalPages);\n\n    const [btnClass, label, page] = {\n      [ButtonType.Prev]: [\n        classes.navButtonPrevious,\n        this.props.previousLabel,\n        (currentPage || 0) - 1,\n      ],\n      [ButtonType.Next]: [\n        classes.navButtonNext,\n        this.props.nextLabel,\n        (currentPage || 0) + 1,\n      ],\n      [ButtonType.First]: [classes.navButtonFirst, this.props.firstLabel, 1],\n      [ButtonType.Last]: [\n        classes.navButtonLast,\n        this.props.lastLabel,\n        totalPages,\n      ],\n    }[type] as any;\n\n    return (\n      <a\n        data-hook={DataHooks[type]}\n        id={this.getId('navButton' + upperCaseFirst(type))}\n        className={st(classes.navButton, { disabled }, btnClass)}\n        aria-label={upperCaseFirst(type) + ' Page'}\n        aria-disabled={disabled}\n        tabIndex={disabled || pageUrl ? undefined : 0}\n        onClick={\n          disabled ? undefined : event => this.handlePageClick(event, page)\n        }\n        onKeyDown={\n          disabled ? undefined : event => this.handlePageKeyDown(event, page)\n        }\n        href={!disabled && pageUrl ? pageUrl(page) : undefined}\n      >\n        {label}\n      </a>\n    );\n  }\n\n  public UNSAFE_componentWillReceiveProps(nextProps: PaginationCoreProps) {\n    this.setState({\n      pageInputValue: String(nextProps.currentPage),\n      pageInputHasError: false,\n    });\n  }\n\n  render() {\n    const {\n      disabled,\n      showFirstLastNavButtons,\n      showNextLabel,\n      showPreviousLabel,\n      width,\n      style: inlineStyle,\n    } = this.props;\n\n    const styleStates = {\n      disabled,\n      error: this.state.pageInputHasError,\n    };\n\n    return (\n      <nav\n        ref={el => (this.rootNode = el)}\n        id={this.getId('')}\n        aria-label=\"PaginationCore Navigation\"\n        aria-disabled={disabled}\n        dir={this.props.rtl ? 'rtl' : undefined}\n        onClick={this.props.onClick}\n        onDoubleClick={this.props.onDoubleClick}\n        onMouseEnter={this.props.onMouseEnter}\n        onMouseLeave={this.props.onMouseLeave}\n        style={inlineStyle || { width }}\n        className={st(classes.root, styleStates, this.props.className)}\n        {...filterDataProps(this.props)}\n      >\n        {showFirstLastNavButtons && this.renderNavButton(ButtonType.First)}\n        {showPreviousLabel\n          ? this.renderNavButton(ButtonType.Prev)\n          : this.renderEmptyButton(ButtonType.Prev)}\n        {this.renderPages()}\n        {showNextLabel\n          ? this.renderNavButton(ButtonType.Next)\n          : this.renderEmptyButton(ButtonType.Next)}\n        {showFirstLastNavButtons && this.renderNavButton(ButtonType.Last)}\n      </nav>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/cjs/Pagination/PaginationCore/PaginationCore.st.css

@@ -0,0 +1,74 @@
+.button-common-mixin {
+  display: inline-flex;
+  flex-shrink: 0;
+}
+
+.root {
+  -st-states: disabled, error;
+  display: inline-flex;
+  user-select: none;
+}
+
+.navButton {
+  -st-mixin: button-common-mixin;
+  -st-states: disabled;
+}
+
+.navButton:not(:disabled) {
+  cursor: pointer;
+}
+
+.emptyButton {
+  -st-mixin: button-common-mixin;
+}
+
+.navButtonFirst {  order: 1;  }
+.navButtonPrevious,
+.emptyButtonPrevious{  order: 2;  }
+.navButtonNext,
+.emptyButtonNext{  order: 4;  }
+.navButtonLast {  order: 5;  }
+
+.pageStrip {
+  order: 3;
+  overflow-x: hidden;
+}
+
+.pageStripInner {
+  display: flex;
+}
+
+.pageStripTemplate {
+  height: 0;
+  overflow: hidden;
+}
+
+.pageButton {
+  -st-mixin: button-common-mixin;
+  -st-states: disabled;
+}
+
+.pageButton:not(:disabled) {
+  cursor: pointer;
+}
+
+.currentPage {
+  -st-mixin: button-common-mixin;
+}
+
+.gap {
+  -st-mixin: button-common-mixin;
+}
+
+.pageForm {
+  display: flex;
+  order: 3;
+}
+
+.compact {
+  -st-extends: pageForm;
+}
+
+.pageInput {}
+.totalPages {}
+.slash {}

package/dist/cjs/Pagination/PaginationCore/PaginationCore.st.css.js

@@ -0,0 +1,24 @@
+
+
+const { classesRuntime, statesRuntime } = require("./../../stylable-cjs-runtime.js");
+
+
+
+var _namespace_ = "wds_1_0_0_PaginationCore";
+var _style_ = /*#__PURE__*/ classesRuntime.bind(null, _namespace_);
+
+module.exports.cssStates = /*#__PURE__*/ statesRuntime.bind(null, _namespace_);
+module.exports.style = /*#__PURE__*/ _style_;
+module.exports.st = /*#__PURE__*/ _style_;
+
+module.exports.namespace = _namespace_;
+module.exports.classes = {"root":"wds_1_0_0_PaginationCore__root","button-common-mixin":"wds_1_0_0_PaginationCore__button-common-mixin","navButton":"wds_1_0_0_PaginationCore__navButton","emptyButton":"wds_1_0_0_PaginationCore__emptyButton","navButtonFirst":"wds_1_0_0_PaginationCore__navButtonFirst","navButtonPrevious":"wds_1_0_0_PaginationCore__navButtonPrevious","emptyButtonPrevious":"wds_1_0_0_PaginationCore__emptyButtonPrevious","navButtonNext":"wds_1_0_0_PaginationCore__navButtonNext","emptyButtonNext":"wds_1_0_0_PaginationCore__emptyButtonNext","navButtonLast":"wds_1_0_0_PaginationCore__navButtonLast","pageStrip":"wds_1_0_0_PaginationCore__pageStrip","pageStripInner":"wds_1_0_0_PaginationCore__pageStripInner","pageStripTemplate":"wds_1_0_0_PaginationCore__pageStripTemplate","pageButton":"wds_1_0_0_PaginationCore__pageButton","currentPage":"wds_1_0_0_PaginationCore__currentPage","gap":"wds_1_0_0_PaginationCore__gap","pageForm":"wds_1_0_0_PaginationCore__pageForm","compact":"wds_1_0_0_PaginationCore__compact wds_1_0_0_PaginationCore__pageForm","pageInput":"wds_1_0_0_PaginationCore__pageInput","totalPages":"wds_1_0_0_PaginationCore__totalPages","slash":"wds_1_0_0_PaginationCore__slash"};
+module.exports.keyframes = {}; 
+module.exports.layers = {};
+module.exports.containers = {};
+module.exports.stVars = {}; 
+module.exports.vars = {}; 
+
+
+
+

package/dist/cjs/Pagination/PaginationCore/PaginationCore.uni.driver.js

@@ -0,0 +1,78 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.paginationCoreUniDriverFactory = void 0;
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _baseDriver = require("wix-ui-test-utils/base-driver");
+var _constants = require("./constants");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var paginationCoreUniDriverFactory = base => {
+  var byDataHook = dataHook => base.$("[data-hook=\"".concat(dataHook, "\"]"));
+  return _objectSpread(_objectSpread({}, (0, _baseDriver.baseUniDriverFactory)(base)), {}, {
+    /** Check if element is rendered */
+    isVisible: function () {
+      var _isVisible = (0, _asyncToGenerator2.default)(function* () {
+        return byDataHook(_constants.DataHooks.pageStrip).exists();
+      });
+      function isVisible() {
+        return _isVisible.apply(this, arguments);
+      }
+      return isVisible;
+    }(),
+    /** Returns currently selected page */
+    getCurrentPage: function () {
+      var _getCurrentPage = (0, _asyncToGenerator2.default)(function* () {
+        return parseInt(yield base.$("[data-hook~=".concat(_constants.DataHooks.currentPage, "]")).text(), 10);
+      });
+      function getCurrentPage() {
+        return _getCurrentPage.apply(this, arguments);
+      }
+      return getCurrentPage;
+    }(),
+    /** Returns a total amount of pages available */
+    getTotalPages: function () {
+      var _getTotalPages = (0, _asyncToGenerator2.default)(function* () {
+        return parseInt(yield byDataHook(_constants.DataHooks.totalPages).text(), 10);
+      });
+      function getTotalPages() {
+        return _getTotalPages.apply(this, arguments);
+      }
+      return getTotalPages;
+    }(),
+    /** Clicks on gives page number */
+    clickOnPage: function () {
+      var _clickOnPage = (0, _asyncToGenerator2.default)(function* (n) {
+        return byDataHook("page-".concat(n)).click();
+      });
+      function clickOnPage(_x) {
+        return _clickOnPage.apply(this, arguments);
+      }
+      return clickOnPage;
+    }(),
+    /** Clicks on next button */
+    clickNextButton: function () {
+      var _clickNextButton = (0, _asyncToGenerator2.default)(function* () {
+        return byDataHook(_constants.DataHooks.next).click();
+      });
+      function clickNextButton() {
+        return _clickNextButton.apply(this, arguments);
+      }
+      return clickNextButton;
+    }(),
+    /** Clicks on previous button */
+    clickPreviousButton: function () {
+      var _clickPreviousButton = (0, _asyncToGenerator2.default)(function* () {
+        return byDataHook(_constants.DataHooks.previous).click();
+      });
+      function clickPreviousButton() {
+        return _clickPreviousButton.apply(this, arguments);
+      }
+      return clickPreviousButton;
+    }()
+  });
+};
+exports.paginationCoreUniDriverFactory = paginationCoreUniDriverFactory;
+//# sourceMappingURL=PaginationCore.uni.driver.js.map

package/dist/cjs/Pagination/PaginationCore/PaginationCore.uni.driver.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["paginationCoreUniDriverFactory","base","byDataHook","dataHook","$","baseUniDriverFactory","isVisible","DataHooks","pageStrip","exists","getCurrentPage","parseInt","currentPage","text","getTotalPages","totalPages","clickOnPage","n","click","clickNextButton","next","clickPreviousButton","previous"],"sources":["../../../../src/Pagination/PaginationCore/PaginationCore.uni.driver.ts"],"sourcesContent":["import {\n  BaseUniDriver,\n  baseUniDriverFactory,\n} from 'wix-ui-test-utils/base-driver';\nimport { UniDriver } from 'wix-ui-test-utils/unidriver';\nimport { DataHooks } from './constants';\n\nexport interface PaginationCoreUniDriver extends BaseUniDriver {\n  isVisible(): Promise<boolean>;\n  getCurrentPage(): Promise<number>;\n  getTotalPages(): Promise<number>;\n  clickOnPage(page: number): Promise<void>;\n  clickNextButton(): Promise<void>;\n  clickPreviousButton(): Promise<void>;\n}\n\nexport const paginationCoreUniDriverFactory = (\n  base: UniDriver,\n): PaginationCoreUniDriver => {\n  const byDataHook = (dataHook: string) => base.$(`[data-hook=\"${dataHook}\"]`);\n  return {\n    ...baseUniDriverFactory(base),\n\n    /** Check if element is rendered */\n    isVisible: async () => byDataHook(DataHooks.pageStrip).exists(),\n\n    /** Returns currently selected page */\n    getCurrentPage: async () =>\n      parseInt(\n        await base.$(`[data-hook~=${DataHooks.currentPage}]`).text(),\n        10,\n      ),\n\n    /** Returns a total amount of pages available */\n    getTotalPages: async () =>\n      parseInt(await byDataHook(DataHooks.totalPages).text(), 10),\n\n    /** Clicks on gives page number */\n    clickOnPage: async (n: number) => byDataHook(`page-${n}`).click(),\n\n    /** Clicks on next button */\n    clickNextButton: async () => byDataHook(DataHooks.next).click(),\n\n    /** Clicks on previous button */\n    clickPreviousButton: async () => byDataHook(DataHooks.previous).click(),\n  };\n};\n"],"mappings":";;;;;;;AAAA;AAKA;AAAwC;AAAA;AAWjC,IAAMA,8BAA8B,GACzCC,IAAe,IACa;EAC5B,IAAMC,UAAU,GAAIC,QAAgB,IAAKF,IAAI,CAACG,CAAC,wBAAgBD,QAAQ,SAAK;EAC5E,uCACK,IAAAE,gCAAoB,EAACJ,IAAI,CAAC;IAE7B;IACAK,SAAS;MAAA,iDAAE;QAAA,OAAYJ,UAAU,CAACK,oBAAS,CAACC,SAAS,CAAC,CAACC,MAAM,EAAE;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IAE/D;IACAC,cAAc;MAAA,sDAAE;QAAA,OACdC,QAAQ,OACAV,IAAI,CAACG,CAAC,uBAAgBG,oBAAS,CAACK,WAAW,OAAI,CAACC,IAAI,EAAE,EAC5D,EAAE,CACH;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IAEH;IACAC,aAAa;MAAA,qDAAE;QAAA,OACbH,QAAQ,OAAOT,UAAU,CAACK,oBAAS,CAACQ,UAAU,CAAC,CAACF,IAAI,EAAE,EAAE,EAAE,CAAC;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IAE7D;IACAG,WAAW;MAAA,mDAAE,WAAOC,CAAS;QAAA,OAAKf,UAAU,gBAASe,CAAC,EAAG,CAACC,KAAK,EAAE;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IAEjE;IACAC,eAAe;MAAA,uDAAE;QAAA,OAAYjB,UAAU,CAACK,oBAAS,CAACa,IAAI,CAAC,CAACF,KAAK,EAAE;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;IAE/D;IACAG,mBAAmB;MAAA,2DAAE;QAAA,OAAYnB,UAAU,CAACK,oBAAS,CAACe,QAAQ,CAAC,CAACJ,KAAK,EAAE;MAAA;MAAA;QAAA;MAAA;MAAA;IAAA;EAAA;AAE3E,CAAC;AAAC"}

package/dist/cjs/Pagination/PaginationCore/PaginationCoreTest.st.css

@@ -0,0 +1,75 @@
+:import {
+  -st-from: './PaginationCore.st.css';
+  -st-default: Pagination;
+}
+
+:vars {
+  materialBlueGray100: #CFD8DC;
+  materialBlueGray200: #B0BEC5;
+  materialBlueGray700: #455A64;
+  materialRed500: #f44336;
+}
+
+.button-common-mixin {
+  align-items: center;
+  justify-content: center;
+  margin: 5px;
+  padding: 5px;
+  min-width: 20px;
+  min-height: 20px;
+  font: 12px/1 Arial, sans-serif;
+  text-decoration: none;
+}
+
+.root {
+  -st-extends: Pagination;
+  color: value(materialBlueGray700);
+  background-color: #ECEFF1;
+}
+
+.root::navButton {
+  -st-mixin: button-common-mixin;
+  background-color: value(materialBlueGray100);
+}
+
+.root::navButton.disabled {
+  color: value(materialBlueGray200);
+  background-color: transparent;
+}
+
+.root::pageStripInner {
+  justify-content: center;
+}
+
+.root::pageButton {
+  -st-mixin: button-common-mixin;
+  background-color: value(materialBlueGray200);
+}
+
+.root::currentPage {
+  -st-mixin: button-common-mixin;
+  background-color: value(materialBlueGray700);
+  color: value(materialBlueGray100);
+}
+
+.root::gap {
+  -st-mixin: button-common-mixin;
+  background-color: value(materialBlueGray100);
+}
+
+.root::pageForm {
+  margin: 5px;
+  align-items: center;
+}
+
+.root::pageInput {
+  box-sizing: border-box;
+  height: 30px;
+  text-align: center;
+  font: 12px/1 Arial, sans-serif;
+  color: inherit;
+}
+
+.root:error::pageInput {
+  border-color: value(materialRed500);
+}