@hitachivantara/uikit-react-core 3.52.5

package/dist/modern/Pagination/Pagination.js

@@ -0,0 +1,405 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["classes", "className", "id", "pages", "page", "showPageSizeOptions", "pageSizeOptions", "pageSize", "showPageJump", "canPrevious", "canNext", "onPageChange", "onPageSizeChange", "labels", "showPageProps", "navigationProps", "currentPageInputProps"];
+import "core-js/modules/web.dom-collections.iterator.js";
+import React, { useCallback, useEffect } from "react";
+import PropTypes from "prop-types";
+import clsx from "clsx";
+import { withStyles, Hidden } from "@material-ui/core";
+import { Start, End, Backwards, Forwards } from "@hitachivantara/uikit-react-icons";
+import { isKeypress, KeyboardCodes } from "../utils/KeyboardUtils";
+import { HvInput, HvTypography } from "..";
+import { setId, useLabels } from "../utils";
+import ButtonIconTooltip from "./ButtonIconTooltip";
+import Select, { Option } from "./Select";
+import { usePageInput, getSafePage, setColor } from "./utils";
+import styles from "./styles";
+const DEFAULT_LABELS = {
+  pageSizePrev: "Show",
+  pageSizeEntryName: "rows",
+  pageSizeSelectorDescription: "Select how many to display",
+  pagesSeparator: "/",
+  paginationFirstPageTitle: "First page",
+  paginationPreviousPageTitle: "Previous page",
+  paginationNextPageTitle: "Next page",
+  paginationLastPageTitle: "Last page",
+  paginationInputLabel: "Current page",
+  firstPage: "First Page",
+  previousPage: "Previous Page",
+  nextPage: "Next Page",
+  lastPage: "Last Page"
+};
+const {
+  Enter
+} = KeyboardCodes;
+/**
+ * Pagination is the process of dividing a document into discrete pages. It relates to how users interact
+ * with structured content on a website or application.
+ */
+
+const Pagination = _ref => {
+  let {
+    classes,
+    className,
+    id,
+    pages = 1,
+    page = 0,
+    showPageSizeOptions = true,
+    pageSizeOptions = [5, 10, 20, 25, 50, 100],
+    pageSize = 1,
+    showPageJump = true,
+    canPrevious = false,
+    canNext = false,
+    onPageChange,
+    onPageSizeChange,
+    labels: labelsProp,
+    showPageProps,
+    navigationProps,
+    currentPageInputProps
+  } = _ref,
+      others = _objectWithoutProperties(_ref, _excluded);
+
+  const labels = useLabels(DEFAULT_LABELS, labelsProp);
+  const [pageInput, handleInputChange] = usePageInput(page);
+  const changePage = useCallback(newPage => {
+    const safePage = getSafePage(newPage, page, pages);
+    onPageChange === null || onPageChange === void 0 ? void 0 : onPageChange(safePage);
+    handleInputChange(null, safePage + 1);
+  }, [page, pages, onPageChange, handleInputChange]);
+  useEffect(() => {
+    if (page >= pages && pages > 0) {
+      changePage(page);
+    }
+  }, [changePage, page, pages]);
+  useEffect(() => {
+    if (pageInput !== page + 1) {
+      handleInputChange(null, page + 1);
+    } // we only want to "fix" the input's display value when `page` property changed
+    // (either externaly or when internally commited - onBlur or Enter),
+    // not while editing the input.
+    // breaking a rule of hooks isn't ideal and it's just a hack for fixing
+    // a bug preventing properly controling of the `page` property.
+    // fixing it some other way would potentialy introduce a breaking change.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+
+  }, [handleInputChange, page]);
+
+  const renderPageJump = () => /*#__PURE__*/React.createElement("div", {
+    className: classes.pageJump
+  }, /*#__PURE__*/React.createElement(HvInput, _extends({
+    id: setId(id, "currentPage"),
+    labels: labels,
+    inputProps: {
+      "aria-label": labels.paginationInputLabel,
+      // we really want the native number input
+      type: "number"
+    },
+    classes: {
+      root: classes.pageSizeInputContainer,
+      input: classes.pageSizeInput,
+      inputRoot: classes.pageSizeInputRoot
+    },
+    onChange: handleInputChange,
+    value: String(pageInput),
+    onBlur: (evt, value) => changePage(value - 1),
+    onKeyDown: (evt, value) => isKeypress(evt, Enter) && changePage(value - 1),
+    disabled: pageSize === 0,
+    disableClear: true
+  }, currentPageInputProps)));
+
+  return /*#__PURE__*/React.createElement("div", _extends({
+    id: id,
+    className: clsx(className, classes.root)
+  }, others), /*#__PURE__*/React.createElement("div", _extends({
+    className: classes.pageSizeOptions
+  }, showPageProps), showPageSizeOptions && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Hidden, {
+    xsDown: true
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classes.pageSizeTextContainer
+  }, /*#__PURE__*/React.createElement(HvTypography, {
+    component: "span"
+  }, labels.pageSizePrev))), /*#__PURE__*/React.createElement(Select, {
+    id: setId(id, "pageSize"),
+    disabled: pageSize === 0,
+    className: classes.pageSizeOptionsSelect,
+    "aria-label": labels.pageSizeSelectorDescription,
+    onChange: (evt, val) => onPageSizeChange === null || onPageSizeChange === void 0 ? void 0 : onPageSizeChange(val),
+    value: pageSize
+  }, pageSizeOptions.map(option => /*#__PURE__*/React.createElement(Option, {
+    key: option,
+    value: option
+  }, option))), /*#__PURE__*/React.createElement(Hidden, {
+    xsDown: true
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classes.pageSizeTextContainer
+  }, /*#__PURE__*/React.createElement(HvTypography, {
+    component: "span"
+  }, labels.pageSizeEntryName))))), /*#__PURE__*/React.createElement("div", _extends({
+    className: classes.pageNavigator
+  }, navigationProps), /*#__PURE__*/React.createElement(ButtonIconTooltip, {
+    id: setId(id, "firstPage-button"),
+    "aria-label": labels.firstPage,
+    className: classes.iconContainer,
+    disabled: !canPrevious,
+    onClick: () => changePage(0),
+    tooltip: labels.paginationFirstPageTitle
+  }, /*#__PURE__*/React.createElement(Start, {
+    className: classes.icon,
+    color: setColor(!canPrevious)
+  })), /*#__PURE__*/React.createElement(ButtonIconTooltip, {
+    id: setId(id, "previousPage-button"),
+    "aria-label": labels.previousPage,
+    className: classes.iconContainer,
+    disabled: !canPrevious,
+    onClick: () => changePage(page - 1),
+    tooltip: labels.paginationPreviousPageTitle
+  }, /*#__PURE__*/React.createElement(Backwards, {
+    className: classes.icon,
+    color: setColor(!canPrevious)
+  })), /*#__PURE__*/React.createElement("div", {
+    className: classes.pageInfo
+  }, showPageJump ? renderPageJump() : /*#__PURE__*/React.createElement(HvTypography, {
+    component: "span"
+  }, `${page + 1}`), /*#__PURE__*/React.createElement(HvTypography, {
+    component: "span"
+  }, `${labels.pagesSeparator} `), /*#__PURE__*/React.createElement(HvTypography, {
+    id: setId(id, "totalPages"),
+    component: "span"
+  }, pages)), /*#__PURE__*/React.createElement(ButtonIconTooltip, {
+    id: setId(id, "nextPage-button"),
+    "aria-label": labels.nextPage,
+    className: classes.iconContainer,
+    disabled: !canNext,
+    onClick: () => changePage(page + 1),
+    tooltip: labels.paginationNextPageTitle
+  }, /*#__PURE__*/React.createElement(Forwards, {
+    className: classes.icon,
+    color: setColor(!canNext)
+  })), /*#__PURE__*/React.createElement(ButtonIconTooltip, {
+    id: setId(id, "lastPage-button"),
+    "aria-label": labels.lastPage,
+    className: classes.iconContainer,
+    disabled: !canNext,
+    onClick: () => changePage(pages - 1),
+    tooltip: labels.paginationLastPageTitle
+  }, /*#__PURE__*/React.createElement(End, {
+    className: classes.icon,
+    color: setColor(!canNext)
+  }))));
+};
+
+Pagination.propTypes = {
+  /**
+   * A JSS Object used to override or extend the styles applied.
+   */
+  classes: PropTypes.shape({
+    /**
+     * Styles applied to the component root class.
+     */
+    root: PropTypes.string,
+
+    /**
+     * Styles applied to the page size selector container.
+     */
+    pageSizeOptions: PropTypes.string,
+
+    /**
+     * Styles applied to the page size selector dropdown element.
+     */
+    pageSizeOptionsSelect: PropTypes.string,
+
+    /**
+     * Styles applied to the element that holds the labels for the page size selector
+     */
+    pageSizeTextContainer: PropTypes.string,
+
+    /**
+     * Styles applied to the page navigation container.
+     */
+    pageNavigator: PropTypes.string,
+
+    /**
+     * Styles applied to the central page information container.
+     */
+    pageInfo: PropTypes.string,
+
+    /**
+     * Styles applied to the page selector input container.
+     */
+    pageJump: PropTypes.string,
+
+    /**
+     * Styles passed down to the page selector Input component as `input`.
+     */
+    pageSizeInput: PropTypes.string,
+
+    /**
+     * Styles passed down to the page selector Input root.
+     */
+    pageSizeInputRoot: PropTypes.string,
+
+    /**
+     * Styles passed down to the page selector Input component as `container`.
+     */
+    pageSizeInputContainer: PropTypes.string,
+
+    /**
+     * Styles applied to each navigation `HvButton` icon container.
+     */
+    iconContainer: PropTypes.string,
+
+    /**
+     * Styles applied to each navigation icon.
+     */
+    icon: PropTypes.string
+  }).isRequired,
+
+  /**
+   * The number of pages the component has.
+   */
+  pages: PropTypes.number,
+
+  /**
+   * The currently selected page (0-indexed).
+   */
+  page: PropTypes.number,
+
+  /**
+   * Controls whether the left page size mechanism should be visible.
+   */
+  showPageSizeOptions: PropTypes.bool,
+
+  /**
+   * The array of possible page sizes for the dropdown.
+   */
+  pageSizeOptions: PropTypes.arrayOf(PropTypes.number),
+
+  /**
+   * The currently selected page size.
+   */
+  pageSize: PropTypes.number,
+
+  /**
+   * Controls whether the central page changing mechanism should be visible.
+   */
+  showPageJump: PropTypes.bool,
+
+  /**
+   * Controls whether the previous/first page buttons are enabled.
+   */
+  canPrevious: PropTypes.bool,
+
+  /**
+   * Controls whether the next/last page buttons are enabled.
+   */
+  canNext: PropTypes.bool,
+
+  /**
+   * Function called when the page changes.
+   */
+  onPageChange: PropTypes.func,
+
+  /**
+   * Function called when the page size changes.
+   */
+  onPageSizeChange: PropTypes.func,
+
+  /**
+   * Class names to be applied.
+   */
+  className: PropTypes.string,
+
+  /**
+   * Id to be applied to the root node.
+   */
+  id: PropTypes.string,
+
+  /**
+   * An object containing all the labels for the component.
+   */
+  labels: PropTypes.shape({
+    /**
+     * The show label.
+     */
+    pageSizePrev: PropTypes.string,
+
+    /**
+     * Indicate the units of the page size selection.
+     */
+    pageSizeEntryName: PropTypes.string,
+
+    /**
+     * Used for the aria-label of the selection of number of unit.s
+     */
+    pageSizeSelectorDescription: PropTypes.string,
+
+    /**
+     * Separator of current page and total pages.
+     */
+    pagesSeparator: PropTypes.string,
+
+    /**
+     * Title of button `firstPage`.
+     */
+    paginationFirstPageTitle: PropTypes.string,
+
+    /**
+     * Title of button `previousPage`.
+     */
+    paginationPreviousPageTitle: PropTypes.string,
+
+    /**
+     * Title of button `nextPage`.
+     */
+    paginationNextPageTitle: PropTypes.string,
+
+    /**
+     * Title of button `lastPage`.
+     */
+    paginationLastPageTitle: PropTypes.string,
+
+    /**
+     * Aria-label passed to the page input.
+     */
+    paginationInputLabel: PropTypes.string,
+
+    /**
+     * Aria-label of the first page button
+     */
+    firstPage: PropTypes.string,
+
+    /**
+     * Aria-label of the previous page button
+     */
+    previousPage: PropTypes.string,
+
+    /**
+     * Aria-label of the next page button
+     */
+    nextPage: PropTypes.string,
+
+    /**
+     * Aria-label of the last page button
+     */
+    lastPage: PropTypes.string
+  }),
+
+  /**
+   * Other props to show page component.
+   */
+  showPageProps: PropTypes.instanceOf(Object),
+
+  /**
+   * Other props to pagination component.
+   */
+  navigationProps: PropTypes.instanceOf(Object),
+
+  /**
+   * Extra properties passed to the input component representing the current pages.
+   */
+  currentPageInputProps: PropTypes.instanceOf(Object)
+};
+export default withStyles(styles, {
+  name: "HvPagination"
+})(Pagination);
+//# sourceMappingURL=Pagination.js.map

package/dist/modern/Pagination/Pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Pagination/Pagination.js"],"names":["React","useCallback","useEffect","PropTypes","clsx","withStyles","Hidden","Start","End","Backwards","Forwards","isKeypress","KeyboardCodes","HvInput","HvTypography","setId","useLabels","ButtonIconTooltip","Select","Option","usePageInput","getSafePage","setColor","styles","DEFAULT_LABELS","pageSizePrev","pageSizeEntryName","pageSizeSelectorDescription","pagesSeparator","paginationFirstPageTitle","paginationPreviousPageTitle","paginationNextPageTitle","paginationLastPageTitle","paginationInputLabel","firstPage","previousPage","nextPage","lastPage","Enter","Pagination","classes","className","id","pages","page","showPageSizeOptions","pageSizeOptions","pageSize","showPageJump","canPrevious","canNext","onPageChange","onPageSizeChange","labels","labelsProp","showPageProps","navigationProps","currentPageInputProps","others","pageInput","handleInputChange","changePage","newPage","safePage","renderPageJump","pageJump","type","root","pageSizeInputContainer","input","pageSizeInput","inputRoot","pageSizeInputRoot","String","evt","value","pageSizeTextContainer","pageSizeOptionsSelect","val","map","option","pageNavigator","iconContainer","icon","pageInfo","propTypes","shape","string","isRequired","number","bool","arrayOf","func","instanceOf","Object","name"],"mappings":"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","sourcesContent":["import React, { useCallback, useEffect } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles, Hidden } from \"@material-ui/core\";\nimport { Start, End, Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\nimport { isKeypress, KeyboardCodes } from \"../utils/KeyboardUtils\";\nimport { HvInput, HvTypography } from \"..\";\nimport { setId, useLabels } from \"../utils\";\nimport ButtonIconTooltip from \"./ButtonIconTooltip\";\nimport Select, { Option } from \"./Select\";\nimport { usePageInput, getSafePage, setColor } from \"./utils\";\nimport styles from \"./styles\";\n\nconst DEFAULT_LABELS = {\n  pageSizePrev: \"Show\",\n  pageSizeEntryName: \"rows\",\n  pageSizeSelectorDescription: \"Select how many to display\",\n  pagesSeparator: \"/\",\n  paginationFirstPageTitle: \"First page\",\n  paginationPreviousPageTitle: \"Previous page\",\n  paginationNextPageTitle: \"Next page\",\n  paginationLastPageTitle: \"Last page\",\n  paginationInputLabel: \"Current page\",\n  firstPage: \"First Page\",\n  previousPage: \"Previous Page\",\n  nextPage: \"Next Page\",\n  lastPage: \"Last Page\",\n};\n\nconst { Enter } = KeyboardCodes;\n\n/**\n * Pagination is the process of dividing a document into discrete pages. It relates to how users interact\n * with structured content on a website or application.\n */\nconst Pagination = ({\n  classes,\n  className,\n  id,\n  pages = 1,\n  page = 0,\n  showPageSizeOptions = true,\n  pageSizeOptions = [5, 10, 20, 25, 50, 100],\n  pageSize = 1,\n  showPageJump = true,\n  canPrevious = false,\n  canNext = false,\n  onPageChange,\n  onPageSizeChange,\n  labels: labelsProp,\n  showPageProps,\n  navigationProps,\n  currentPageInputProps,\n  ...others\n}) => {\n  const labels = useLabels(DEFAULT_LABELS, labelsProp);\n  const [pageInput, handleInputChange] = usePageInput(page);\n\n  const changePage = useCallback(\n    (newPage) => {\n      const safePage = getSafePage(newPage, page, pages);\n\n      onPageChange?.(safePage);\n      handleInputChange(null, safePage + 1);\n    },\n    [page, pages, onPageChange, handleInputChange]\n  );\n\n  useEffect(() => {\n    if (page >= pages && pages > 0) {\n      changePage(page);\n    }\n  }, [changePage, page, pages]);\n\n  useEffect(() => {\n    if (pageInput !== page + 1) {\n      handleInputChange(null, page + 1);\n    }\n\n    // we only want to \"fix\" the input's display value when `page` property changed\n    // (either externaly or when internally commited - onBlur or Enter),\n    // not while editing the input.\n    // breaking a rule of hooks isn't ideal and it's just a hack for fixing\n    // a bug preventing properly controling of the `page` property.\n    // fixing it some other way would potentialy introduce a breaking change.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [handleInputChange, page]);\n\n  const renderPageJump = () => (\n    <div className={classes.pageJump}>\n      <HvInput\n        id={setId(id, \"currentPage\")}\n        labels={labels}\n        inputProps={{\n          \"aria-label\": labels.paginationInputLabel,\n          // we really want the native number input\n          type: \"number\",\n        }}\n        classes={{\n          root: classes.pageSizeInputContainer,\n          input: classes.pageSizeInput,\n          inputRoot: classes.pageSizeInputRoot,\n        }}\n        onChange={handleInputChange}\n        value={String(pageInput)}\n        onBlur={(evt, value) => changePage(value - 1)}\n        onKeyDown={(evt, value) => isKeypress(evt, Enter) && changePage(value - 1)}\n        disabled={pageSize === 0}\n        disableClear\n        {...currentPageInputProps}\n      />\n    </div>\n  );\n\n  return (\n    <div id={id} className={clsx(className, classes.root)} {...others}>\n      <div className={classes.pageSizeOptions} {...showPageProps}>\n        {showPageSizeOptions && (\n          <>\n            <Hidden xsDown>\n              <div className={classes.pageSizeTextContainer}>\n                <HvTypography component=\"span\">{labels.pageSizePrev}</HvTypography>\n              </div>\n            </Hidden>\n            <Select\n              id={setId(id, \"pageSize\")}\n              disabled={pageSize === 0}\n              className={classes.pageSizeOptionsSelect}\n              aria-label={labels.pageSizeSelectorDescription}\n              onChange={(evt, val) => onPageSizeChange?.(val)}\n              value={pageSize}\n            >\n              {pageSizeOptions.map((option) => (\n                <Option key={option} value={option}>\n                  {option}\n                </Option>\n              ))}\n            </Select>\n            <Hidden xsDown>\n              <div className={classes.pageSizeTextContainer}>\n                <HvTypography component=\"span\">{labels.pageSizeEntryName}</HvTypography>\n              </div>\n            </Hidden>\n          </>\n        )}\n      </div>\n      <div className={classes.pageNavigator} {...navigationProps}>\n        <ButtonIconTooltip\n          id={setId(id, \"firstPage-button\")}\n          aria-label={labels.firstPage}\n          className={classes.iconContainer}\n          disabled={!canPrevious}\n          onClick={() => changePage(0)}\n          tooltip={labels.paginationFirstPageTitle}\n        >\n          <Start className={classes.icon} color={setColor(!canPrevious)} />\n        </ButtonIconTooltip>\n        <ButtonIconTooltip\n          id={setId(id, \"previousPage-button\")}\n          aria-label={labels.previousPage}\n          className={classes.iconContainer}\n          disabled={!canPrevious}\n          onClick={() => changePage(page - 1)}\n          tooltip={labels.paginationPreviousPageTitle}\n        >\n          <Backwards className={classes.icon} color={setColor(!canPrevious)} />\n        </ButtonIconTooltip>\n        <div className={classes.pageInfo}>\n          {showPageJump ? (\n            renderPageJump()\n          ) : (\n            <HvTypography component=\"span\">{`${page + 1}`}</HvTypography>\n          )}\n          <HvTypography component=\"span\">{`${labels.pagesSeparator} `}</HvTypography>\n          <HvTypography id={setId(id, \"totalPages\")} component=\"span\">\n            {pages}\n          </HvTypography>\n        </div>\n        <ButtonIconTooltip\n          id={setId(id, \"nextPage-button\")}\n          aria-label={labels.nextPage}\n          className={classes.iconContainer}\n          disabled={!canNext}\n          onClick={() => changePage(page + 1)}\n          tooltip={labels.paginationNextPageTitle}\n        >\n          <Forwards className={classes.icon} color={setColor(!canNext)} />\n        </ButtonIconTooltip>\n        <ButtonIconTooltip\n          id={setId(id, \"lastPage-button\")}\n          aria-label={labels.lastPage}\n          className={classes.iconContainer}\n          disabled={!canNext}\n          onClick={() => changePage(pages - 1)}\n          tooltip={labels.paginationLastPageTitle}\n        >\n          <End className={classes.icon} color={setColor(!canNext)} />\n        </ButtonIconTooltip>\n      </div>\n    </div>\n  );\n};\n\nPagination.propTypes = {\n  /**\n   * A JSS Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the page size selector container.\n     */\n    pageSizeOptions: PropTypes.string,\n    /**\n     * Styles applied to the page size selector dropdown element.\n     */\n    pageSizeOptionsSelect: PropTypes.string,\n    /**\n     * Styles applied to the element that holds the labels for the page size selector\n     */\n    pageSizeTextContainer: PropTypes.string,\n    /**\n     * Styles applied to the page navigation container.\n     */\n    pageNavigator: PropTypes.string,\n    /**\n     * Styles applied to the central page information container.\n     */\n    pageInfo: PropTypes.string,\n    /**\n     * Styles applied to the page selector input container.\n     */\n    pageJump: PropTypes.string,\n    /**\n     * Styles passed down to the page selector Input component as `input`.\n     */\n    pageSizeInput: PropTypes.string,\n    /**\n     * Styles passed down to the page selector Input root.\n     */\n    pageSizeInputRoot: PropTypes.string,\n    /**\n     * Styles passed down to the page selector Input component as `container`.\n     */\n    pageSizeInputContainer: PropTypes.string,\n    /**\n     * Styles applied to each navigation `HvButton` icon container.\n     */\n    iconContainer: PropTypes.string,\n    /**\n     * Styles applied to each navigation icon.\n     */\n    icon: PropTypes.string,\n  }).isRequired,\n  /**\n   * The number of pages the component has.\n   */\n  pages: PropTypes.number,\n  /**\n   * The currently selected page (0-indexed).\n   */\n  page: PropTypes.number,\n  /**\n   * Controls whether the left page size mechanism should be visible.\n   */\n  showPageSizeOptions: PropTypes.bool,\n  /**\n   * The array of possible page sizes for the dropdown.\n   */\n  pageSizeOptions: PropTypes.arrayOf(PropTypes.number),\n  /**\n   * The currently selected page size.\n   */\n  pageSize: PropTypes.number,\n  /**\n   * Controls whether the central page changing mechanism should be visible.\n   */\n  showPageJump: PropTypes.bool,\n  /**\n   * Controls whether the previous/first page buttons are enabled.\n   */\n  canPrevious: PropTypes.bool,\n  /**\n   * Controls whether the next/last page buttons are enabled.\n   */\n  canNext: PropTypes.bool,\n  /**\n   * Function called when the page changes.\n   */\n  onPageChange: PropTypes.func,\n  /**\n   * Function called when the page size changes.\n   */\n  onPageSizeChange: PropTypes.func,\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * Id to be applied to the root node.\n   */\n  id: PropTypes.string,\n  /**\n   * An object containing all the labels for the component.\n   */\n  labels: PropTypes.shape({\n    /**\n     * The show label.\n     */\n    pageSizePrev: PropTypes.string,\n    /**\n     * Indicate the units of the page size selection.\n     */\n    pageSizeEntryName: PropTypes.string,\n    /**\n     * Used for the aria-label of the selection of number of unit.s\n     */\n    pageSizeSelectorDescription: PropTypes.string,\n    /**\n     * Separator of current page and total pages.\n     */\n    pagesSeparator: PropTypes.string,\n    /**\n     * Title of button `firstPage`.\n     */\n    paginationFirstPageTitle: PropTypes.string,\n    /**\n     * Title of button `previousPage`.\n     */\n    paginationPreviousPageTitle: PropTypes.string,\n    /**\n     * Title of button `nextPage`.\n     */\n    paginationNextPageTitle: PropTypes.string,\n    /**\n     * Title of button `lastPage`.\n     */\n    paginationLastPageTitle: PropTypes.string,\n    /**\n     * Aria-label passed to the page input.\n     */\n    paginationInputLabel: PropTypes.string,\n    /**\n     * Aria-label of the first page button\n     */\n    firstPage: PropTypes.string,\n    /**\n     * Aria-label of the previous page button\n     */\n    previousPage: PropTypes.string,\n    /**\n     * Aria-label of the next page button\n     */\n    nextPage: PropTypes.string,\n    /**\n     * Aria-label of the last page button\n     */\n    lastPage: PropTypes.string,\n  }),\n  /**\n   * Other props to show page component.\n   */\n  showPageProps: PropTypes.instanceOf(Object),\n  /**\n   * Other props to pagination component.\n   */\n  navigationProps: PropTypes.instanceOf(Object),\n  /**\n   * Extra properties passed to the input component representing the current pages.\n   */\n  currentPageInputProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvPagination\" })(Pagination);\n"],"file":"Pagination.js"}

package/dist/modern/Pagination/Select.js

@@ -0,0 +1,103 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["children"],
+      _excluded2 = ["className", "classes", "onChange", "disabled", "value", "children"];
+import "core-js/modules/web.dom-collections.iterator.js";
+
+/* eslint-disable react/prop-types */
+import React, { useState } from "react";
+import clsx from "clsx";
+import { withStyles } from "@material-ui/core";
+import { HvBaseDropdown, HvSelectionList, HvListItem, HvPanel, HvTypography } from "..";
+
+const styles = theme => ({
+  base: {
+    "&$root": {
+      borderRadius: 2,
+      width: "auto",
+      "& > div$anchor": {
+        width: "auto"
+      },
+      "& $header": {
+        backgroundColor: "transparent",
+        borderColor: "transparent"
+      },
+      "& $headerOpen": {
+        backgroundColor: theme.palette.atmo1,
+        borderColor: theme.palette.atmo1
+      }
+    }
+  },
+  root: {},
+  anchor: {},
+  header: {},
+  headerOpen: {}
+});
+
+export const Option = _ref => {
+  let {
+    children
+  } = _ref,
+      others = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React.createElement(HvListItem, others, children);
+};
+
+const HvSelect = _ref2 => {
+  let {
+    className,
+    classes,
+    onChange,
+    disabled,
+    value,
+    children
+  } = _ref2,
+      others = _objectWithoutProperties(_ref2, _excluded2);
+
+  const [open, setOpen] = useState(false);
+
+  const handleSelect = (evt, val) => {
+    onChange === null || onChange === void 0 ? void 0 : onChange(evt, val);
+    setOpen(false);
+  };
+
+  const handleToggle = (_evt, s) => {
+    setOpen(s);
+  };
+
+  const setFocusToContent = containerRef => {
+    const listItems = containerRef != null ? [...containerRef.getElementsByTagName("li")] : [];
+    listItems.every(listItem => {
+      if (listItem.tabIndex >= 0) {
+        listItem.focus();
+        return false;
+      }
+
+      return true;
+    });
+  };
+
+  return /*#__PURE__*/React.createElement(HvBaseDropdown, _extends({
+    className: className,
+    classes: {
+      root: clsx(classes.base, classes.root),
+      anchor: classes.anchor,
+      header: classes.header,
+      headerOpen: classes.headerOpen
+    },
+    expanded: open,
+    onToggle: handleToggle,
+    onContainerCreation: setFocusToContent,
+    placeholder: /*#__PURE__*/React.createElement(HvTypography, null, value),
+    disabled: disabled,
+    variableWidth: true
+  }, others), /*#__PURE__*/React.createElement(HvPanel, null, /*#__PURE__*/React.createElement(HvSelectionList, {
+    value: value,
+    onChange: handleSelect
+  }, children)));
+};
+
+export default withStyles(styles, {
+  name: "HvSelect"
+})(HvSelect);
+//# sourceMappingURL=Select.js.map

package/dist/modern/Pagination/Select.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Pagination/Select.js"],"names":["React","useState","clsx","withStyles","HvBaseDropdown","HvSelectionList","HvListItem","HvPanel","HvTypography","styles","theme","base","borderRadius","width","backgroundColor","borderColor","palette","atmo1","root","anchor","header","headerOpen","Option","children","others","HvSelect","className","classes","onChange","disabled","value","open","setOpen","handleSelect","evt","val","handleToggle","_evt","s","setFocusToContent","containerRef","listItems","getElementsByTagName","every","listItem","tabIndex","focus","name"],"mappings":"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","sourcesContent":["/* eslint-disable react/prop-types */\n\nimport React, { useState } from \"react\";\nimport clsx from \"clsx\";\nimport { withStyles } from \"@material-ui/core\";\nimport { HvBaseDropdown, HvSelectionList, HvListItem, HvPanel, HvTypography } from \"..\";\n\nconst styles = (theme) => ({\n  base: {\n    \"&$root\": {\n      borderRadius: 2,\n      width: \"auto\",\n\n      \"& > div$anchor\": {\n        width: \"auto\",\n      },\n      \"& $header\": {\n        backgroundColor: \"transparent\",\n        borderColor: \"transparent\",\n      },\n      \"& $headerOpen\": {\n        backgroundColor: theme.palette.atmo1,\n        borderColor: theme.palette.atmo1,\n      },\n    },\n  },\n\n  root: {},\n  anchor: {},\n  header: {},\n  headerOpen: {},\n});\n\nexport const Option = ({ children, ...others }) => <HvListItem {...others}>{children}</HvListItem>;\n\nconst HvSelect = ({ className, classes, onChange, disabled, value, children, ...others }) => {\n  const [open, setOpen] = useState(false);\n\n  const handleSelect = (evt, val) => {\n    onChange?.(evt, val);\n    setOpen(false);\n  };\n\n  const handleToggle = (_evt, s) => {\n    setOpen(s);\n  };\n\n  const setFocusToContent = (containerRef) => {\n    const listItems = containerRef != null ? [...containerRef.getElementsByTagName(\"li\")] : [];\n    listItems.every((listItem) => {\n      if (listItem.tabIndex >= 0) {\n        listItem.focus();\n        return false;\n      }\n      return true;\n    });\n  };\n\n  return (\n    <HvBaseDropdown\n      className={className}\n      classes={{\n        root: clsx(classes.base, classes.root),\n        anchor: classes.anchor,\n        header: classes.header,\n        headerOpen: classes.headerOpen,\n      }}\n      expanded={open}\n      onToggle={handleToggle}\n      onContainerCreation={setFocusToContent}\n      placeholder={<HvTypography>{value}</HvTypography>}\n      disabled={disabled}\n      variableWidth\n      {...others}\n    >\n      <HvPanel>\n        <HvSelectionList value={value} onChange={handleSelect}>\n          {children}\n        </HvSelectionList>\n      </HvPanel>\n    </HvBaseDropdown>\n  );\n};\n\nexport default withStyles(styles, { name: \"HvSelect\" })(HvSelect);\n"],"file":"Select.js"}

package/dist/modern/Pagination/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./Pagination";
+export * from "./Pagination";

package/dist/modern/Pagination/index.js

@@ -0,0 +1,2 @@
+export { default } from "./Pagination";
+//# sourceMappingURL=index.js.map

package/dist/modern/Pagination/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Pagination/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,cAAxB","sourcesContent":["export { default } from \"./Pagination\";\n"],"file":"index.js"}