npm - @hitachivantara/uikit-react-core - Versions diffs - 5.15.0 → 5.17.0 - Mend

@hitachivantara/uikit-react-core 5.15.0 → 5.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (136) hide show

package/dist/cjs/index.cjs CHANGED Viewed

@@ -41,7 +41,7 @@ const baseInputClasses = require("./components/BaseInput/baseInputClasses.cjs");
 const BaseInput = require("./components/BaseInput/BaseInput.cjs");
 const baseDropdownClasses = require("./components/BaseDropdown/baseDropdownClasses.cjs");
 const BaseDropdown = require("./components/BaseDropdown/BaseDropdown.cjs");
-const actionBarClasses = require("./components/ActionBar/actionBarClasses.cjs");
+const ActionBar_styles = require("./components/ActionBar/ActionBar.styles.cjs");
 const ActionBar = require("./components/ActionBar/ActionBar.cjs");
 const accordionClasses = require("./components/Accordion/accordionClasses.cjs");
 const Accordion = require("./components/Accordion/Accordion.cjs");
@@ -146,7 +146,7 @@ const File = require("./components/FileUploader/File/File.cjs");
 const FileUploader = require("./components/FileUploader/FileUploader.cjs");
 const dropDownMenuClasses = require("./components/DropDownMenu/dropDownMenuClasses.cjs");
 const DropDownMenu = require("./components/DropDownMenu/DropDownMenu.cjs");
-const paginationClasses = require("./components/Pagination/paginationClasses.cjs");
+const Pagination_styles = require("./components/Pagination/Pagination.styles.cjs");
 const Pagination = require("./components/Pagination/Pagination.cjs");
 const actionsGenericClasses = require("./components/ActionsGeneric/actionsGenericClasses.cjs");
 const ActionsGeneric = require("./components/ActionsGeneric/ActionsGeneric.cjs");
@@ -245,7 +245,7 @@ const inlineEditorClasses = require("./components/InlineEditor/inlineEditorClass
 const InlineEditor = require("./components/InlineEditor/InlineEditor.cjs");
 const timeAgoClasses = require("./components/TimeAgo/timeAgoClasses.cjs");
 const TimeAgo = require("./components/TimeAgo/TimeAgo.cjs");
-const queryBuilderClasses = require("./components/QueryBuilder/queryBuilderClasses.cjs");
+const QueryBuilder_styles = require("./components/QueryBuilder/QueryBuilder.styles.cjs");
 const QueryBuilder = require("./components/QueryBuilder/QueryBuilder.cjs");
 const colorPickerClasses = require("./components/ColorPicker/colorPickerClasses.cjs");
 const ColorPicker = require("./components/ColorPicker/ColorPicker.cjs");
@@ -253,6 +253,8 @@ const Carousel_styles = require("./components/Carousel/Carousel.styles.cjs");
 const Carousel = require("./components/Carousel/Carousel.cjs");
 const CarouselSlide_styles = require("./components/Carousel/CarouselSlide/CarouselSlide.styles.cjs");
 const CarouselSlide = require("./components/Carousel/CarouselSlide/CarouselSlide.cjs");
+const TimePicker_styles = require("./components/TimePicker/TimePicker.styles.cjs");
+const TimePicker = require("./components/TimePicker/TimePicker.cjs");
 const useUniqueId = require("./hooks/useUniqueId.cjs");
 const useIsMounted = require("./hooks/useIsMounted.cjs");
 const useClickOutside = require("./hooks/useClickOutside.cjs");
@@ -349,7 +351,7 @@ exports.baseInputClasses = baseInputClasses.default;
 exports.HvBaseInput = BaseInput.HvBaseInput;
 exports.baseDropdownClasses = baseDropdownClasses.default;
 exports.HvBaseDropdown = BaseDropdown.HvBaseDropdown;
-exports.actionBarClasses = actionBarClasses.default;
+exports.actionBarClasses = ActionBar_styles.staticClasses;
 exports.HvActionBar = ActionBar.HvActionBar;
 exports.accordionClasses = accordionClasses.default;
 exports.HvAccordion = Accordion.HvAccordion;
@@ -455,7 +457,7 @@ exports.HvFile = File.HvFile;
 exports.HvFileUploader = FileUploader.HvFileUploader;
 exports.dropDownMenuClasses = dropDownMenuClasses.default;
 exports.HvDropDownMenu = DropDownMenu.default;
-exports.paginationClasses = paginationClasses.default;
+exports.paginationClasses = Pagination_styles.staticClasses;
 exports.HvPagination = Pagination.HvPagination;
 exports.actionsGenericClasses = actionsGenericClasses.default;
 exports.HvActionsGeneric = ActionsGeneric.HvActionsGeneric;
@@ -589,7 +591,7 @@ exports.inlineEditorClasses = inlineEditorClasses.default;
 exports.HvInlineEditor = InlineEditor.HvInlineEditor;
 exports.timeAgoClasses = timeAgoClasses.default;
 exports.HvTimeAgo = TimeAgo.HvTimeAgo;
-exports.queryBuilderClasses = queryBuilderClasses.default;
+exports.queryBuilderClasses = QueryBuilder_styles.staticClasses;
 exports.HvQueryBuilder = QueryBuilder.HvQueryBuilder;
 exports.colorPickerClasses = colorPickerClasses.default;
 exports.HvColorPicker = ColorPicker.HvColorPicker;
@@ -597,6 +599,8 @@ exports.carouselClasses = Carousel_styles.carouselClasses;
 exports.HvCarousel = Carousel.HvCarousel;
 exports.cc = CarouselSlide_styles.cc;
 exports.HvCarouselSlide = CarouselSlide.HvCarouselSlide;
+exports.timePickerClasses = TimePicker_styles.staticClasses;
+exports.HvTimePicker = TimePicker.HvTimePicker;
 exports.useUniqueId = useUniqueId.default;
 exports.useIsMounted = useIsMounted.default;
 exports.useClickOutside = useClickOutside.useClickOutside;

package/dist/cjs/index.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/utils/classes.cjs CHANGED Viewed

@@ -31,7 +31,7 @@ const replace$ = (stylesObj, name) => {
 function createClasses(name, stylesObject) {
   const styles = replace$(stylesObject, name);
   const staticClasses = getClasses(Object.keys(styles), name);
-  function useClasses(classesProp) {
+  function useClasses(classesProp = {}) {
     const {
       cx,
       css
@@ -39,8 +39,9 @@ function createClasses(name, stylesObject) {
     const mergeClasses = (key) => cx(`${name}-${key}`, css(styles[key]), classesProp == null ? void 0 : classesProp[key]);
     const classes = Object.fromEntries(Object.keys(styles).map((key) => [key, mergeClasses(key)]));
     return {
-      cx,
-      classes
+      classes,
+      css,
+      cx
     };
   }
   return {

package/dist/cjs/utils/classes.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"classes.cjs","sources":["../../../src/utils/classes.ts"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/css\";\nimport { useCss } from \"@core/hooks/useCss\";\n\nexport type ExtractNames<\n T extends (...args: any) => { classes: Record<string, any>; cx: any }\n> = ReturnType<T>[\"classes\"];\n\nexport const getClasses = <T extends string, N extends string>(\n keys: T[],\n name: N\n) => {\n const classesObj: Record<string, string> = {};\n keys.forEach((key: string) => {\n classesObj[key] = `${name}-${key}`;\n });\n return classesObj as { [P in T]: `${N}-${P}` };\n};\n\nconst deepRenameKeys = <T extends object>(\n obj: T,\n mapFn: (key: string) => string\n): T => {\n const result: any = {};\n for (const key in obj) {\n if (Object.hasOwn(obj, key)) {\n const newKey = mapFn(key);\n const value = obj[key];\n result[newKey] =\n typeof value === \"object\" ? deepRenameKeys(value as any, mapFn) : value;\n }\n }\n return result;\n};\n\n/** Given a `stylesObj`, replaces its keys' `$myClass` with `.{name}-myClass`. /\nexport const replace$ = <T extends object>(stylesObj: T, name: string): T => {\n return deepRenameKeys(stylesObj, (key) => {\n const matches = key.match(/\\$\\w+/g);\n if (!matches?.length) return key;\n const newKey = matches.reduce(\n (acc, match) => acc.replace(match, `.${name}-${match.slice(1)}`),\n key\n );\n return newKey ?? key;\n });\n};\n\n/* Utility function to create classes for a component. /\nexport function createClasses<Name extends string, ClassName extends string>(\n /* Component name in PascalCase (ie. `HvTableCell`). */\n name: Name,\n stylesObject: Record<ClassName, CSSInterpolation>\n) {\n const styles = replace$(stylesObject, name);\n\n const staticClasses = getClasses(Object.keys(styles) as ClassName[], name);\n\n function useClasses(classesProp: Partial<Record<ClassName, string>>) {\n const { cx, css } = useCss();\n\n const mergeClasses = (key: string) =>\n cx(`${name}-${key}`, css(styles[key]), classesProp?.[key]);\n\n const classes = Object.fromEntries(\n Object.keys(styles).map((key) => [key, mergeClasses(key)])\n ) as { [P in ClassName]: string };\n\n return { cx, ~~classes~~ };\n }\n\n return { useClasses, staticClasses };\n}\n"],"names":["getClasses","keys","name","classesObj","forEach","key","deepRenameKeys","obj","mapFn","result","Object","hasOwn","newKey","value","replace$","stylesObj","matches","match","length","reduce","acc","replace","slice","createClasses","stylesObject","styles","staticClasses","useClasses","classesProp","cx","css","useCss","mergeClasses","classes","fromEntries","map"],"mappings":";;;AAOaA,MAAAA,aAAa,CACxBC,MACAC,SACG;AACH,QAAMC,aAAqC,CAAA;AACtCC,OAAAA,QAAQ,CAACC,QAAgB;AACjBA,eAAAA,GAAG,IAAK,GAAEH,QAAQG;AAAAA,EAAAA,CAC9B;AACMF,SAAAA;AACT;AAEA,MAAMG,iBAAiB,CACrBC,KACAC,UACM;AACN,QAAMC,SAAc,CAAA;AACpB,aAAWJ,OAAOE,KAAK;AACrB,QAAIG,OAAOC,OAAOJ,KAAKF,GAAG,GAAG;AACrBO,YAAAA,SAASJ,MAAMH,GAAG;AAClBQ,YAAAA,QAAQN,IAAIF,GAAG;AACdO,aAAAA,MAAM,IACX,OAAOC,UAAU,WAAWP,eAAeO,OAAcL,KAAK,IAAIK;AAAAA,IACtE;AAAA,EACF;AACOJ,SAAAA;AACT;AAGaK,MAAAA,WAAW,CAAmBC,WAAcb,SAAoB;AACpEI,SAAAA,eAAeS,WAAYV,CAAQ,QAAA;AAClCW,UAAAA,UAAUX,IAAIY,MAAM,QAAQ;AAClC,QAAI,EAACD,mCAASE;AAAeb,aAAAA;AAC7B,UAAMO,SAASI,QAAQG,OACrB,CAACC,KAAKH,UAAUG,IAAIC,QAAQJ,OAAQ,IAAGf,QAAQe,MAAMK,MAAM,CAAC,GAAG,GAC/DjB,GACF;AACA,WAAOO,UAAUP;AAAAA,EAAAA,CAClB;AACH;AAGgBkB,SAAAA,cAEdrB,MACAsB,cACA;AACMC,QAAAA,SAASX,SAASU,cAActB,IAAI;AAE1C,QAAMwB,gBAAgB1B,WAAWU,OAAOT,KAAKwB,MAAM,GAAkBvB,IAAI;~~AAEzE~~,~~WAASyB~~,WAAWC,~~aAAiD~~;~~AAC7D~~,UAAA;AAAA,MAAEC;AAAAA,MAAIC;AAAAA,QAAQC,OAAO,OAAA;AAE3B,UAAMC,eAAeA,CAAC3B,QACpBwB,GAAI,GAAE3B,QAAQG,OAAOyB,IAAIL,OAAOpB,GAAG,CAAC,GAAGuB,2CAAcvB,IAAI;AAE3D,UAAM4B,UAAUvB,OAAOwB,YACrBxB,OAAOT,KAAKwB,MAAM,EAAEU,IAAK9B,CAAAA,QAAQ,CAACA,KAAK2B,aAAa3B,GAAG,CAAC,CAAC,CAC3D;AAEO,WAAA;AAAA,~~MAAEwB~~;AAAAA,~~MAAII~~;AAAAA,IAAAA;AAAAA,~~EACf~~;AAEO,SAAA;AAAA,~~IAAEN~~;AAAAA,IAAYD;AAAAA,EAAAA;AACvB;;;;"}
1	+ {"version":3,"file":"classes.cjs","sources":["../../../src/utils/classes.ts"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/css\";\nimport { useCss } from \"@core/hooks/useCss\";\n\nexport type ExtractNames<\n T extends (...args: any) => { classes: Record<string, any>; cx: any }\n> = ReturnType<T>[\"classes\"];\n\nexport const getClasses = <T extends string, N extends string>(\n keys: T[],\n name: N\n) => {\n const classesObj: Record<string, string> = {};\n keys.forEach((key: string) => {\n classesObj[key] = `${name}-${key}`;\n });\n return classesObj as { [P in T]: `${N}-${P}` };\n};\n\nconst deepRenameKeys = <T extends object>(\n obj: T,\n mapFn: (key: string) => string\n): T => {\n const result: any = {};\n for (const key in obj) {\n if (Object.hasOwn(obj, key)) {\n const newKey = mapFn(key);\n const value = obj[key];\n result[newKey] =\n typeof value === \"object\" ? deepRenameKeys(value as any, mapFn) : value;\n }\n }\n return result;\n};\n\n/** Given a `stylesObj`, replaces its keys' `$myClass` with `.{name}-myClass`. /\nexport const replace$ = <T extends object>(stylesObj: T, name: string): T => {\n return deepRenameKeys(stylesObj, (key) => {\n const matches = key.match(/\\$\\w+/g);\n if (!matches?.length) return key;\n const newKey = matches.reduce(\n (acc, match) => acc.replace(match, `.${name}-${match.slice(1)}`),\n key\n );\n return newKey ?? key;\n });\n};\n\n/* Utility function to create classes for a component. /\nexport function createClasses<Name extends string, ClassName extends string>(\n /* Component name in PascalCase (ie. `HvTableCell`). */\n name: Name,\n stylesObject: Record<ClassName, CSSInterpolation>\n) {\n const styles = replace$(stylesObject, name);\n\n const staticClasses = getClasses(Object.keys(styles) as ClassName[], name);\n\n function useClasses(classesProp: Partial<Record<ClassName, string>> = {}) {\n const { cx, css } = useCss();\n\n const mergeClasses = (key: string) =>\n cx(`${name}-${key}`, css(styles[key]), classesProp?.[key]);\n\n const classes = Object.fromEntries(\n Object.keys(styles).map((key) => [key, mergeClasses(key)])\n ) as { [P in ClassName]: string };\n\n return { classes, css, cx };\n }\n\n return { useClasses, staticClasses };\n}\n"],"names":["getClasses","keys","name","classesObj","forEach","key","deepRenameKeys","obj","mapFn","result","Object","hasOwn","newKey","value","replace$","stylesObj","matches","match","length","reduce","acc","replace","slice","createClasses","stylesObject","styles","staticClasses","useClasses","classesProp","cx","css","useCss","mergeClasses","classes","fromEntries","map"],"mappings":";;;AAOaA,MAAAA,aAAa,CACxBC,MACAC,SACG;AACH,QAAMC,aAAqC,CAAA;AACtCC,OAAAA,QAAQ,CAACC,QAAgB;AACjBA,eAAAA,GAAG,IAAK,GAAEH,QAAQG;AAAAA,EAAAA,CAC9B;AACMF,SAAAA;AACT;AAEA,MAAMG,iBAAiB,CACrBC,KACAC,UACM;AACN,QAAMC,SAAc,CAAA;AACpB,aAAWJ,OAAOE,KAAK;AACrB,QAAIG,OAAOC,OAAOJ,KAAKF,GAAG,GAAG;AACrBO,YAAAA,SAASJ,MAAMH,GAAG;AAClBQ,YAAAA,QAAQN,IAAIF,GAAG;AACdO,aAAAA,MAAM,IACX,OAAOC,UAAU,WAAWP,eAAeO,OAAcL,KAAK,IAAIK;AAAAA,IACtE;AAAA,EACF;AACOJ,SAAAA;AACT;AAGaK,MAAAA,WAAW,CAAmBC,WAAcb,SAAoB;AACpEI,SAAAA,eAAeS,WAAYV,CAAQ,QAAA;AAClCW,UAAAA,UAAUX,IAAIY,MAAM,QAAQ;AAClC,QAAI,EAACD,mCAASE;AAAeb,aAAAA;AAC7B,UAAMO,SAASI,QAAQG,OACrB,CAACC,KAAKH,UAAUG,IAAIC,QAAQJ,OAAQ,IAAGf,QAAQe,MAAMK,MAAM,CAAC,GAAG,GAC/DjB,GACF;AACA,WAAOO,UAAUP;AAAAA,EAAAA,CAClB;AACH;AAGgBkB,SAAAA,cAEdrB,MACAsB,cACA;AACMC,QAAAA,SAASX,SAASU,cAActB,IAAI;AAE1C,QAAMwB,gBAAgB1B,WAAWU,OAAOT,KAAKwB,MAAM,GAAkBvB,IAAI;AAEhEyB,WAAAA,WAAWC,cAAkD,IAAI;AAClE,UAAA;AAAA,MAAEC;AAAAA,MAAIC;AAAAA,QAAQC,OAAO,OAAA;AAE3B,UAAMC,eAAeA,CAAC3B,QACpBwB,GAAI,GAAE3B,QAAQG,OAAOyB,IAAIL,OAAOpB,GAAG,CAAC,GAAGuB,2CAAcvB,IAAI;AAE3D,UAAM4B,UAAUvB,OAAOwB,YACrBxB,OAAOT,KAAKwB,MAAM,EAAEU,IAAK9B,CAAAA,QAAQ,CAACA,KAAK2B,aAAa3B,GAAG,CAAC,CAAC,CAC3D;AAEO,WAAA;AAAA,MAAE4B;AAAAA,MAASH;AAAAA,MAAKD;AAAAA,IAAAA;AAAAA,EACzB;AAEO,SAAA;AAAA,IAAEF;AAAAA,IAAYD;AAAAA,EAAAA;AACvB;;;;"}

package/dist/esm/components/ActionBar/ActionBar.js CHANGED Viewed

@@ -1,23 +1,25 @@
-import { clsx } from "clsx";
-import { StyledRoot } from "./ActionBar.styles.js";
-import actionBarClasses from "./actionBarClasses.js";
+import { useClasses } from "./ActionBar.styles.js";
+import { staticClasses } from "./ActionBar.styles.js";
 import { jsx } from "@emotion/react/jsx-runtime";
 const HvActionBar = (props) => {
   const {
-    classes,
+    classes: classesProp,
     className,
-    id,
     children,
     ...others
   } = props;
-  return /* @__PURE__ */ jsx(StyledRoot, {
-    id,
-    className: clsx(actionBarClasses.root, classes == null ? void 0 : classes.root, className),
+  const {
+    classes,
+    cx
+  } = useClasses(classesProp);
+  return /* @__PURE__ */ jsx("div", {
+    className: cx(classes.root, className),
     ...others,
     children
   });
 };
 export {
-  HvActionBar
+  HvActionBar,
+  staticClasses as actionBarClasses
 };
 //# sourceMappingURL=ActionBar.js.map

package/dist/esm/components/ActionBar/ActionBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionBar.js","sources":["../../../../src/components/ActionBar/ActionBar.tsx"],"sourcesContent":["import { ~~clsx~~ } from \"~~clsx~~\";\nimport { ~~HvBaseProps~~ } from \"@core/~~types~~\";\nimport { ~~StyledRoot~~ } from \"./ActionBar.styles\";\~~nimport~~ actionBarClasses, { HvActionBarClasses } ~~from~~ ~~\"./actionBarClasses\";\~~n\nexport interface HvActionBarProps extends HvBaseProps {\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvActionBarClasses;\n}\n\nexport const HvActionBar = (props: HvActionBarProps) => {\n const { classes, className, ~~id,~~ children, ...others } = props;\n\n return (\n <~~StyledRoot\n id={id}\n~~ className={~~clsx~~(~~actionBarClasses~~.root, ~~classes?.root,~~ className)}\n {...others}\n >\n {children}\n </~~StyledRoot~~>\n );\n};\n"],"names":["HvActionBar","props","classes","~~className~~","id","children","others","~~StyledRoot~~","~~clsx~~","~~actionBarClasses","~~root"],"mappings":"~~;;;;AAUaA~~,MAAAA,cAAcA,CAACC,UAA4B;AAChD,QAAA;AAAA,IAAEC;AAAAA,~~IAASC~~;AAAAA,IAAWC;AAAAA,~~IAAIC;AAAAA,~~IAAU,GAAGC;AAAAA,EAAWL,IAAAA;~~AAExD~~,~~6BACGM,YAAU~~;AAAA,~~IACTH~~;AAAAA,~~IACAD~~,~~WAAWK~~,~~KAAKC~~,~~iBAAiBC~~,~~MAAMR~~,~~mCAASQ~~,~~MAAMP~~,SAAS;AAAA,IAAE,~~GAC7DG~~;AAAAA,IAAMD;AAAAA,EAAAA,~~CAGA~~;~~AAEhB~~;"}
1	+ {"version":3,"file":"ActionBar.js","sources":["../../../../src/components/ActionBar/ActionBar.tsx"],"sourcesContent":["import { HvBaseProps } from \"@core/types\";\nimport { ExtractNames } from \"@core/utils\";\nimport { staticClasses, useClasses } from \"./ActionBar.styles\";\n\nexport { staticClasses as actionBarClasses };\n\nexport type HvActionBarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvActionBarProps extends HvBaseProps {\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: Partial<HvActionBarClasses>;\n}\n\nexport const HvActionBar = (props: HvActionBarProps) => {\n const { classes: classesProp, className, children, ...others } = props;\n const { classes, cx } = useClasses(classesProp);\n\n return (\n <div className={cx(classes.root, className)} {...others}>\n {children}\n </div>\n );\n};\n"],"names":["HvActionBar","props","classes","classesProp","className","children","others","cx","useClasses","root"],"mappings":";;;AAaaA,MAAAA,cAAcA,CAACC,UAA4B;AAChD,QAAA;AAAA,IAAEC,SAASC;AAAAA,IAAaC;AAAAA,IAAWC;AAAAA,IAAU,GAAGC;AAAAA,EAAWL,IAAAA;AAC3D,QAAA;AAAA,IAAEC;AAAAA,IAASK;AAAAA,EAAAA,IAAOC,WAAWL,WAAW;AAE9C,6BACE,OAAA;AAAA,IAAKC,WAAWG,GAAGL,QAAQO,MAAML,SAAS;AAAA,IAAE,GAAKE;AAAAA,IAAMD;AAAAA,EAAAA,CAElD;AAET;"}

package/dist/esm/components/ActionBar/ActionBar.styles.js CHANGED Viewed

@@ -1,19 +1,20 @@
-import _styled from "@emotion/styled/base";
 import { theme } from "@hitachivantara/uikit-styles";
-const StyledRoot = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "eae5m590"
-} : {
-  target: "eae5m590",
-  label: "StyledRoot"
-})({
-  width: "100%",
-  height: "75px",
-  padding: theme.space.sm,
-  borderTop: `3px solid ${theme.colors.atmo2}`,
-  display: "flex",
-  justifyContent: "flex-end"
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQWN0aW9uQmFyL0FjdGlvbkJhci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUcwQiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0FjdGlvbkJhci9BY3Rpb25CYXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHdpZHRoOiBcIjEwMCVcIixcbiAgaGVpZ2h0OiBcIjc1cHhcIixcbiAgcGFkZGluZzogdGhlbWUuc3BhY2Uuc20sXG4gIGJvcmRlclRvcDogYDNweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5hdG1vMn1gLFxuICBkaXNwbGF5OiBcImZsZXhcIixcbiAganVzdGlmeUNvbnRlbnQ6IFwiZmxleC1lbmRcIixcbn0pO1xuIl19 */");
+import { createClasses } from "../../utils/classes.js";
+const {
+  staticClasses,
+  useClasses
+} = createClasses("HvActionBar", {
+  root: {
+    width: "100%",
+    padding: theme.space.sm,
+    borderTop: theme.actionBar.borderTop,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "flex-end"
+  }
+});
 export {
-  StyledRoot
+  staticClasses,
+  useClasses
 };
 //# sourceMappingURL=ActionBar.styles.js.map

package/dist/esm/components/ActionBar/ActionBar.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionBar.styles.js","sources":["../../../../src/components/ActionBar/ActionBar.styles.tsx"],"sourcesContent":["import ~~styled~~ from \"@~~emotion~~/~~styled~~\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const ~~StyledRoot~~ = ~~styled~~(\"~~div~~\")({\n ~~width~~: \~~"100%\",\~~n ~~height~~: \"~~75px\~~",\n padding: theme.space.sm,\n borderTop: ~~`3px solid ${~~theme.~~colors~~.~~atmo2}`,\~~n display: \"flex\",\n justifyContent: \"flex-end\",\n});\n"],"names":["~~StyledRoot~~","~~process~~","~~env~~","~~NODE_ENV~~","~~target","label","~~width","~~height","~~padding","theme","space","sm","borderTop","~~colors~~","~~atmo2~~","~~display~~","justifyContent"],"mappings":";;~~AAGO~~,~~MAAMA,aAAoB,wBAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA~~;AAAA,~~EAAAC,QAAA~~;~~AAAA~~,~~IAAA~~;~~AAAA~~,~~EAAAA~~,~~QAAA;AAAA~~,~~EAAAC,OAAA~~;AAAA,~~CAAA~~,~~EAAE~~;AAAA,~~EACtCC~~,OAAO;AAAA,~~EACPC~~,~~QAAQ;AAAA,EACRC,~~SAASC,MAAMC,MAAMC;AAAAA,~~EACrBC~~,~~WAAY~~,~~aAAYH,~~MAAMI,~~OAAOC~~;AAAAA,~~EACrCC~~,SAAS;AAAA,~~EACTC~~,~~gBAAgB~~;~~AAClB~~,~~GAACf~~,~~QAAAC~~,~~IAAAC~~,~~aAAC,eAAA,KAAA,y4BAAA~~;"}
1	+ {"version":3,"file":"ActionBar.styles.js","sources":["../../../../src/components/ActionBar/ActionBar.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvActionBar\", {\n root: {\n width: \"100%\",\n padding: theme.space.sm,\n borderTop: theme.actionBar.borderTop,\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"flex-end\",\n },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","width","padding","theme","space","sm","borderTop","actionBar","display","alignItems","justifyContent"],"mappings":";;AAGa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,eAAe;AAAA,EACxEC,MAAM;AAAA,IACJC,OAAO;AAAA,IACPC,SAASC,MAAMC,MAAMC;AAAAA,IACrBC,WAAWH,MAAMI,UAAUD;AAAAA,IAC3BE,SAAS;AAAA,IACTC,YAAY;AAAA,IACZC,gBAAgB;AAAA,EAClB;AACF,CAAC;"}

package/dist/esm/components/Pagination/Pagination.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import { useCallback, useEffect } from "react";
-import { clsx } from "clsx";
 import { Hidden } from "@mui/material";
 import { Start, Backwards, Forwards, End } from "@hitachivantara/uikit-react-icons";
-import { Option } from "./Select.js";
-import { StyledRoot, StyledPageSizeOptions, StyledPageSizePrev, StyledSelect, StyledPageSizeTextContainer, StyledPageNavigator, StyledButtonIconTooltip, StyledPageInfo, StyledPageJump } from "./Pagination.styles.js";
-import paginationClasses from "./paginationClasses.js";
+import HvSelect, { Option } from "./Select.js";
+import { useClasses } from "./Pagination.styles.js";
+import { staticClasses } from "./Pagination.styles.js";
 import { usePageInput, setColor, getSafePage } from "./utils.js";
+import ButtonIconTooltip from "./ButtonIconTooltip.js";
 import { jsxs, jsx, Fragment } from "@emotion/react/jsx-runtime";
 import { useLabels } from "../../hooks/useLabels.js";
 import { HvTypography } from "../Typography/Typography.js";
@@ -31,15 +31,16 @@ const DEFAULT_LABELS = {
 const {
   Enter
 } = keyboardCodes;
+const defaultPageSizeOptions = [5, 10, 20, 25, 50, 100];
 const HvPagination = ({
-  classes,
+  classes: classesProp = {},
   className,
   id,
   pages = 1,
   page = 0,
   showPageSizeOptions = true,
-  pageSizeOptions = [5, 10, 20, 25, 50, 100],
-  pageSize = 1,
+  pageSizeOptions = defaultPageSizeOptions,
+  pageSize = defaultPageSizeOptions[1],
   showPageJump = true,
   canPrevious = false,
   canNext = false,
@@ -53,6 +54,10 @@ const HvPagination = ({
 }) => {
   const labels = useLabels(DEFAULT_LABELS, labelsProp);
   const [pageInput, handleInputChange] = usePageInput(page);
+  const {
+    classes,
+    cx
+  } = useClasses(classesProp);
   const changePage = useCallback((newPage) => {
     const safePage = getSafePage(newPage, page, pages);
     onPageChange == null ? void 0 : onPageChange(safePage);
@@ -68,8 +73,8 @@ const HvPagination = ({
       handleInputChange(null, page + 1);
     }
   }, [handleInputChange, page]);
-  const renderPageJump = () => /* @__PURE__ */ jsx(StyledPageJump, {
-    className: clsx(paginationClasses.pageJump, classes == null ? void 0 : classes.pageJump),
+  const renderPageJump = () => /* @__PURE__ */ jsx("div", {
+    className: classes.pageJump,
     children: /* @__PURE__ */ jsx(HvInput, {
       id: setId(id, "currentPage"),
       labels,
@@ -79,9 +84,9 @@ const HvPagination = ({
         type: "number"
       },
       classes: {
-        root: clsx(paginationClasses.pageSizeInputContainer, classes == null ? void 0 : classes.pageSizeInputContainer),
-        input: clsx(paginationClasses.pageSizeInput, classes == null ? void 0 : classes.pageSizeInput),
-        inputRoot: clsx(paginationClasses.pageSizeInputRoot, classes == null ? void 0 : classes.pageSizeInputRoot)
+        root: classes == null ? void 0 : classes.pageSizeInputContainer,
+        input: classes == null ? void 0 : classes.pageSizeInput,
+        inputRoot: classes == null ? void 0 : classes.pageSizeInputRoot
       },
       onChange: (event, value) => handleInputChange(event, Number(value)),
       value: String(pageInput),
@@ -92,27 +97,25 @@ const HvPagination = ({
       ...currentPageInputProps
     })
   });
-  return /* @__PURE__ */ jsxs(StyledRoot, {
+  return /* @__PURE__ */ jsxs("div", {
     id,
-    className: clsx(className, paginationClasses.root, classes == null ? void 0 : classes.root),
+    className: cx(classes.root, className),
     ...others,
-    children: [/* @__PURE__ */ jsx(StyledPageSizeOptions, {
-      className: clsx(paginationClasses.pageSizeOptions, classes == null ? void 0 : classes.pageSizeOptions),
+    children: [/* @__PURE__ */ jsx("div", {
+      className: classes.pageSizeOptions,
       ...showPageProps,
       children: showPageSizeOptions && /* @__PURE__ */ jsxs(Fragment, {
         children: [/* @__PURE__ */ jsx(Hidden, {
           xsDown: true,
-          children: /* @__PURE__ */ jsx(StyledPageSizePrev, {
-            className: clsx(paginationClasses.pageSizeTextContainer, classes == null ? void 0 : classes.pageSizeTextContainer),
-            children: /* @__PURE__ */ jsx(HvTypography, {
-              component: "span",
-              children: labels == null ? void 0 : labels.pageSizePrev
-            })
+          children: /* @__PURE__ */ jsx(HvTypography, {
+            component: "span",
+            className: classes == null ? void 0 : classes.pageSizeTextContainer,
+            children: labels == null ? void 0 : labels.pageSizePrev
           })
-        }), /* @__PURE__ */ jsx(StyledSelect, {
+        }), /* @__PURE__ */ jsx(HvSelect, {
           id: setId(id, "pageSize"),
           disabled: pageSize === 0,
-          className: clsx(paginationClasses.pageSizeOptionsSelect, classes == null ? void 0 : classes.pageSizeOptionsSelect),
+          className: classes.pageSizeOptionsSelect,
           "aria-label": labels == null ? void 0 : labels.pageSizeSelectorDescription,
           onChange: (_, val) => onPageSizeChange == null ? void 0 : onPageSizeChange(val),
           value: pageSize,
@@ -122,42 +125,40 @@ const HvPagination = ({
           }, option))
         }), /* @__PURE__ */ jsx(Hidden, {
           xsDown: true,
-          children: /* @__PURE__ */ jsx(StyledPageSizeTextContainer, {
-            className: clsx(paginationClasses.pageSizeTextContainer, classes == null ? void 0 : classes.pageSizeTextContainer),
-            children: /* @__PURE__ */ jsx(HvTypography, {
-              component: "span",
-              children: labels == null ? void 0 : labels.pageSizeEntryName
-            })
+          children: /* @__PURE__ */ jsx(HvTypography, {
+            component: "span",
+            className: classes.pageSizeTextContainer,
+            children: labels == null ? void 0 : labels.pageSizeEntryName
           })
         })]
       })
-    }), /* @__PURE__ */ jsxs(StyledPageNavigator, {
-      className: clsx(paginationClasses.pageNavigator, classes == null ? void 0 : classes.pageNavigator),
+    }), /* @__PURE__ */ jsxs("div", {
+      className: classes.pageNavigator,
       ...navigationProps,
-      children: [/* @__PURE__ */ jsx(StyledButtonIconTooltip, {
+      children: [/* @__PURE__ */ jsx(ButtonIconTooltip, {
         id: setId(id, "firstPage-button"),
         "aria-label": labels == null ? void 0 : labels.firstPage,
-        className: clsx(paginationClasses.iconContainer, classes == null ? void 0 : classes.iconContainer),
+        className: classes.iconContainer,
         disabled: !canPrevious,
         onClick: () => changePage(0),
         tooltip: labels == null ? void 0 : labels.paginationFirstPageTitle,
         children: /* @__PURE__ */ jsx(Start, {
-          className: clsx(paginationClasses.icon, classes == null ? void 0 : classes.icon),
+          className: classes.icon,
           color: setColor(!canPrevious)
         })
-      }), /* @__PURE__ */ jsx(StyledButtonIconTooltip, {
+      }), /* @__PURE__ */ jsx(ButtonIconTooltip, {
         id: setId(id, "previousPage-button"),
         "aria-label": labels == null ? void 0 : labels.previousPage,
-        className: clsx(paginationClasses.iconContainer, classes == null ? void 0 : classes.iconContainer),
+        className: classes.iconContainer,
         disabled: !canPrevious,
         onClick: () => changePage(page - 1),
         tooltip: labels == null ? void 0 : labels.paginationPreviousPageTitle,
         children: /* @__PURE__ */ jsx(Backwards, {
-          className: clsx(paginationClasses.icon, classes == null ? void 0 : classes.icon),
+          className: classes.icon,
           color: setColor(!canPrevious)
         })
-      }), /* @__PURE__ */ jsxs(StyledPageInfo, {
-        className: clsx(paginationClasses.pageInfo, classes == null ? void 0 : classes.pageInfo),
+      }), /* @__PURE__ */ jsxs("div", {
+        className: classes.pageInfo,
         children: [showPageJump ? renderPageJump() : /* @__PURE__ */ jsx(HvTypography, {
           component: "span",
           children: `${page + 1}`
@@ -165,30 +166,30 @@ const HvPagination = ({
           component: "span",
           children: `${labels == null ? void 0 : labels.pagesSeparator} `
         }), /* @__PURE__ */ jsx(HvTypography, {
-          id: setId(id, "totalPages"),
           component: "span",
+          id: setId(id, "totalPages"),
           children: pages
         })]
-      }), /* @__PURE__ */ jsx(StyledButtonIconTooltip, {
+      }), /* @__PURE__ */ jsx(ButtonIconTooltip, {
         id: setId(id, "nextPage-button"),
         "aria-label": labels == null ? void 0 : labels.nextPage,
-        className: clsx(paginationClasses.iconContainer, classes == null ? void 0 : classes.iconContainer),
+        className: classes.iconContainer,
         disabled: !canNext,
         onClick: () => changePage(page + 1),
         tooltip: labels == null ? void 0 : labels.paginationNextPageTitle,
         children: /* @__PURE__ */ jsx(Forwards, {
-          className: clsx(paginationClasses.icon, classes == null ? void 0 : classes.icon),
+          className: classes.icon,
           color: setColor(!canNext)
         })
-      }), /* @__PURE__ */ jsx(StyledButtonIconTooltip, {
+      }), /* @__PURE__ */ jsx(ButtonIconTooltip, {
         id: setId(id, "lastPage-button"),
         "aria-label": labels == null ? void 0 : labels.lastPage,
-        className: clsx(paginationClasses.iconContainer, classes == null ? void 0 : classes.iconContainer),
+        className: classes.iconContainer,
         disabled: !canNext,
         onClick: () => changePage(pages - 1),
         tooltip: labels == null ? void 0 : labels.paginationLastPageTitle,
         children: /* @__PURE__ */ jsx(End, {
-          className: clsx(paginationClasses.icon, classes == null ? void 0 : classes.icon),
+          className: classes.icon,
           color: setColor(!canNext)
         })
       })]
@@ -196,6 +197,7 @@ const HvPagination = ({
   });
 };
 export {
-  HvPagination
+  HvPagination,
+  staticClasses as paginationClasses
 };
 //# sourceMappingURL=Pagination.js.map

package/dist/esm/components/Pagination/Pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Pagination.js","sources":["../../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import { HTMLAttributes, useCallback, useEffect } from \"react\";\nimport { clsx } from \"clsx\";\nimport { Hidden } from \"@mui/material\";\nimport { HvInput, HvInputProps, HvTypography } from \"@core/components\";\nimport {\n Start,\n End,\n Backwards,\n Forwards,\n} from \"@hitachivantara/uikit-react-icons\";\nimport { HvBaseProps } from \"@core/types\";\nimport { isKeypress, keyboardCodes, setId } from \"@core/utils\";\nimport { useLabels } from \"@core/hooks\";\nimport { Option } from \"./Select\";\nimport {\n StyledRoot,\n StyledPageSizeOptions,\n StyledPageSizePrev,\n StyledSelect,\n StyledPageSizeTextContainer,\n StyledPageNavigator,\n StyledButtonIconTooltip,\n StyledPageJump,\n StyledPageInfo,\n} from \"./Pagination.styles\";\nimport paginationClasses, { HvPaginationClasses } from \"./paginationClasses\";\nimport { usePageInput, getSafePage, setColor } from \"./utils\";\n\nexport interface HvPaginationLabels {\n /** The show label. /\n pageSizePrev?: string;\n /* Indicate the units of the page size selection. /\n pageSizeEntryName?: string;\n /* Used for the aria-label of the selection of number of unit.s /\n pageSizeSelectorDescription?: string;\n /* Separator of current page and total pages. /\n pagesSeparator?: string;\n /* Title of button `firstPage`. /\n paginationFirstPageTitle?: string;\n /* Title of button `previousPage`. /\n paginationPreviousPageTitle?: string;\n /* Title of button `nextPage`. /\n paginationNextPageTitle?: string;\n /* Title of button `lastPage`. /\n paginationLastPageTitle?: string;\n /* Aria-label passed to the page input. /\n paginationInputLabel?: string;\n /* Aria-label of the first page button /\n firstPage?: string;\n /* Aria-label of the previous page button /\n previousPage?: string;\n /* Aria-label of the next page button /\n nextPage?: string;\n /* Aria-label of the last page button /\n lastPage?: string;\n}\n\nexport interface HvPaginationProps extends HvBaseProps {\n /* The number of pages the component has. /\n pages?: number;\n /* The currently selected page (0-indexed). /\n page?: number;\n /* Controls whether the left page size mechanism should be visible. /\n showPageSizeOptions?: boolean;\n /* The array of possible page sizes for the dropdown. /\n pageSizeOptions?: number[];\n /* The currently selected page size. /\n pageSize?: number;\n /* Controls whether the central page changing mechanism should be visible. /\n showPageJump?: boolean;\n /* Controls whether the previous/first page buttons are enabled. /\n canPrevious?: boolean;\n /* Controls whether the next/last page buttons are enabled. /\n canNext?: boolean;\n /* Function called when the page changes. /\n onPageChange?: (page: number) => void;\n /* Function called when the page size changes. /\n onPageSizeChange?: (pageSize: number) => void;\n /* An object containing all the labels for the component. /\n labels?: HvPaginationLabels;\n /* Other props to show page component. /\n showPageProps?: HTMLAttributes<HTMLDivElement>;\n /* Other props to pagination component. /\n navigationProps?: HTMLAttributes<HTMLDivElement>;\n /* Extra properties passed to the input component representing the current pages. /\n currentPageInputProps?: HvInputProps;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvPaginationClasses;\n}\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 */\nexport const HvPagination = ({\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}: HvPaginationProps) => {\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n const [pageInput, handleInputChange] = usePageInput(page);\n\n const changePage = useCallback(\n (newPage) => {\n const safePage: number = 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 externally or when internally committed - 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 controlling of the `page` property.\n // fixing it some other way would potentially introduce a breaking change.\n }, [handleInputChange, page]);\n\n const renderPageJump = () => (\n <StyledPageJump\n className={clsx(paginationClasses.pageJump, classes?.pageJump)}\n >\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: clsx(\n paginationClasses.pageSizeInputContainer,\n classes?.pageSizeInputContainer\n ),\n input: clsx(paginationClasses.pageSizeInput, classes?.pageSizeInput),\n inputRoot: clsx(\n paginationClasses.pageSizeInputRoot,\n classes?.pageSizeInputRoot\n ),\n }}\n onChange={(event, value) => handleInputChange(event, Number(value))}\n value={String(pageInput)}\n onBlur={(evt, value) => changePage(Number(value) - 1)}\n onKeyDown={(evt, value) =>\n isKeypress(evt, Enter) && changePage(Number(value) - 1)\n }\n disabled={pageSize === 0}\n disableClear\n {...currentPageInputProps}\n />\n </StyledPageJump>\n );\n\n return (\n <StyledRoot\n id={id}\n className={clsx(className, paginationClasses.root, classes?.root)}\n {...others}\n >\n <StyledPageSizeOptions\n className={clsx(\n paginationClasses.pageSizeOptions,\n classes?.pageSizeOptions\n )}\n {...showPageProps}\n >\n {showPageSizeOptions && (\n <>\n <Hidden xsDown>\n <StyledPageSizePrev\n className={clsx(\n paginationClasses.pageSizeTextContainer,\n classes?.pageSizeTextContainer\n )}\n >\n <HvTypography component=\"span\">\n {labels?.pageSizePrev}\n </HvTypography>\n </StyledPageSizePrev>\n </Hidden>\n <StyledSelect\n id={setId(id, \"pageSize\")}\n disabled={pageSize === 0}\n className={clsx(\n paginationClasses.pageSizeOptionsSelect,\n classes?.pageSizeOptionsSelect\n )}\n aria-label={labels?.pageSizeSelectorDescription}\n onChange={(_, val: number) => onPageSizeChange?.(val)}\n value={pageSize}\n >\n {pageSizeOptions.map((option) => (\n <Option key={option} value={option}>\n {option}\n </Option>\n ))}\n </StyledSelect>\n <Hidden xsDown>\n <StyledPageSizeTextContainer\n className={clsx(\n paginationClasses.pageSizeTextContainer,\n classes?.pageSizeTextContainer\n )}\n >\n <HvTypography component=\"span\">\n {labels?.pageSizeEntryName}\n </HvTypography>\n </StyledPageSizeTextContainer>\n </Hidden>\n </>\n )}\n </StyledPageSizeOptions>\n <StyledPageNavigator\n className={clsx(\n paginationClasses.pageNavigator,\n classes?.pageNavigator\n )}\n {...navigationProps}\n >\n <StyledButtonIconTooltip\n id={setId(id, \"firstPage-button\")}\n aria-label={labels?.firstPage}\n className={clsx(\n paginationClasses.iconContainer,\n classes?.iconContainer\n )}\n disabled={!canPrevious}\n onClick={() => changePage(0)}\n tooltip={labels?.paginationFirstPageTitle}\n >\n <Start\n className={clsx(paginationClasses.icon, classes?.icon)}\n color={setColor(!canPrevious)}\n />\n </StyledButtonIconTooltip>\n <StyledButtonIconTooltip\n id={setId(id, \"previousPage-button\")}\n aria-label={labels?.previousPage}\n className={clsx(\n paginationClasses.iconContainer,\n classes?.iconContainer\n )}\n disabled={!canPrevious}\n onClick={() => changePage(page - 1)}\n tooltip={labels?.paginationPreviousPageTitle}\n >\n <Backwards\n className={clsx(paginationClasses.icon, classes?.icon)}\n color={setColor(!canPrevious)}\n />\n </StyledButtonIconTooltip>\n <StyledPageInfo\n className={clsx(paginationClasses.pageInfo, classes?.pageInfo)}\n >\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 </StyledPageInfo>\n <StyledButtonIconTooltip\n id={setId(id, \"nextPage-button\")}\n aria-label={labels?.nextPage}\n className={clsx(\n paginationClasses.iconContainer,\n classes?.iconContainer\n )}\n disabled={!canNext}\n onClick={() => changePage(page + 1)}\n tooltip={labels?.paginationNextPageTitle}\n >\n <Forwards\n className={clsx(paginationClasses.icon, classes?.icon)}\n color={setColor(!canNext)}\n />\n </StyledButtonIconTooltip>\n <StyledButtonIconTooltip\n id={setId(id, \"lastPage-button\")}\n aria-label={labels?.lastPage}\n className={clsx(\n paginationClasses.iconContainer,\n classes?.iconContainer\n )}\n disabled={!canNext}\n onClick={() => changePage(pages - 1)}\n tooltip={labels?.paginationLastPageTitle}\n >\n <End\n className={clsx(paginationClasses.icon, classes?.icon)}\n color={setColor(!canNext)}\n />\n </StyledButtonIconTooltip>\n </StyledPageNavigator>\n </StyledRoot>\n );\n};\n"],"names":["DEFAULT_LABELS","pageSizePrev","pageSizeEntryName","pageSizeSelectorDescription","pagesSeparator","paginationFirstPageTitle","paginationPreviousPageTitle","paginationNextPageTitle","paginationLastPageTitle","paginationInputLabel","firstPage","previousPage","nextPage","lastPage","Enter","keyboardCodes","HvPagination","classes","className","id","pages","page","showPageSizeOptions","pageSizeOptions","pageSize","showPageJump","canPrevious","canNext","onPageChange","onPageSizeChange","labels","labelsProp","showPageProps","navigationProps","currentPageInputProps","others","useLabels","pageInput","handleInputChange","usePageInput","changePage","useCallback","newPage","safePage","getSafePage","useEffect","renderPageJump","_jsx","StyledPageJump","clsx","paginationClasses","pageJump","children","HvInput","setId","inputProps","type","root","pageSizeInputContainer","input","pageSizeInput","inputRoot","pageSizeInputRoot","onChange","event","value","Number","String","onBlur","evt","onKeyDown","isKeypress","disabled","disableClear","StyledRoot","StyledPageSizeOptions","_jsxs","_Fragment","Hidden","xsDown","StyledPageSizePrev","pageSizeTextContainer","HvTypography","component","StyledSelect","pageSizeOptionsSelect","_","val","map","option","Option","StyledPageSizeTextContainer","StyledPageNavigator","pageNavigator","StyledButtonIconTooltip","iconContainer","onClick","tooltip","Start","icon","color","setColor","Backwards","StyledPageInfo","pageInfo","Forwards","End"],"mappings":";;;;;;;;;;;;;;;AA0FA,MAAMA,iBAAiB;AAAA,EACrBC,cAAc;AAAA,EACdC,mBAAmB;AAAA,EACnBC,6BAA6B;AAAA,EAC7BC,gBAAgB;AAAA,EAChBC,0BAA0B;AAAA,EAC1BC,6BAA6B;AAAA,EAC7BC,yBAAyB;AAAA,EACzBC,yBAAyB;AAAA,EACzBC,sBAAsB;AAAA,EACtBC,WAAW;AAAA,EACXC,cAAc;AAAA,EACdC,UAAU;AAAA,EACVC,UAAU;AACZ;AAEA,MAAM;AAAA,EAAEC;AAAM,IAAIC;AAMX,MAAMC,eAAeA,CAAC;AAAA,EAC3BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,QAAQ;AAAA,EACRC,OAAO;AAAA,EACPC,sBAAsB;AAAA,EACtBC,kBAAkB,CAAC,GAAG,IAAI,IAAI,IAAI,IAAI,GAAG;AAAA,EACzCC,WAAW;AAAA,EACXC,eAAe;AAAA,EACfC,cAAc;AAAA,EACdC,UAAU;AAAA,EACVC;AAAAA,EACAC;AAAAA,EACAC,QAAQC;AAAAA,EACRC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACc,MAAM;AACjBL,QAAAA,SAASM,UAAUpC,gBAAgB+B,UAAU;AACnD,QAAM,CAACM,WAAWC,iBAAiB,IAAIC,aAAalB,IAAI;AAElDmB,QAAAA,aAAaC,YAChBC,CAAY,YAAA;AACX,UAAMC,WAAmBC,YAAYF,SAASrB,MAAMD,KAAK;AAEzDQ,iDAAee;AACG,sBAAA,MAAMA,WAAW,CAAC;AAAA,KAEtC,CAACtB,MAAMD,OAAOQ,cAAcU,iBAAiB,CAC/C;AAEAO,YAAU,MAAM;AACVxB,QAAAA,QAAQD,SAASA,QAAQ,GAAG;AAC9BoB,iBAAWnB,IAAI;AAAA,IACjB;AAAA,EACC,GAAA,CAACmB,YAAYnB,MAAMD,KAAK,CAAC;AAE5ByB,YAAU,MAAM;AACVR,QAAAA,cAAchB,OAAO,GAAG;AACR,wBAAA,MAAMA,OAAO,CAAC;AAAA,IAClC;AAAA,EAAA,GAQC,CAACiB,mBAAmBjB,IAAI,CAAC;AAEtByB,QAAAA,iBAAiBA,MACrBC,oBAACC,gBAAc;AAAA,IACb9B,WAAW+B,KAAKC,kBAAkBC,UAAUlC,mCAASkC,QAAQ;AAAA,IAAEC,8BAE9DC,SAAO;AAAA,MACNlC,IAAImC,MAAMnC,IAAI,aAAa;AAAA,MAC3BW;AAAAA,MACAyB,YAAY;AAAA,QACV,cAAczB,iCAAQrB;AAAAA;AAAAA,QAEtB+C,MAAM;AAAA,MACR;AAAA,MACAvC,SAAS;AAAA,QACPwC,MAAMR,KACJC,kBAAkBQ,wBAClBzC,mCAASyC,sBACX;AAAA,QACAC,OAAOV,KAAKC,kBAAkBU,eAAe3C,mCAAS2C,aAAa;AAAA,QACnEC,WAAWZ,KACTC,kBAAkBY,mBAClB7C,mCAAS6C,iBACX;AAAA,MACF;AAAA,MACAC,UAAUA,CAACC,OAAOC,UAAU3B,kBAAkB0B,OAAOE,OAAOD,KAAK,CAAC;AAAA,MAClEA,OAAOE,OAAO9B,SAAS;AAAA,MACvB+B,QAAQA,CAACC,KAAKJ,UAAUzB,WAAW0B,OAAOD,KAAK,IAAI,CAAC;AAAA,MACpDK,WAAWA,CAACD,KAAKJ,UACfM,WAAWF,KAAKvD,KAAK,KAAK0B,WAAW0B,OAAOD,KAAK,IAAI,CAAC;AAAA,MAExDO,UAAUhD,aAAa;AAAA,MACvBiD,cAAY;AAAA,MAAA,GACRvC;AAAAA,IAAAA,CACL;AAAA,EAAA,CACa;AAGlB,8BACGwC,YAAU;AAAA,IACTvD;AAAAA,IACAD,WAAW+B,KAAK/B,WAAWgC,kBAAkBO,MAAMxC,mCAASwC,IAAI;AAAA,IAAE,GAC9DtB;AAAAA,IAAMiB,UAAA,CAEVL,oBAAC4B,uBAAqB;AAAA,MACpBzD,WAAW+B,KACTC,kBAAkB3B,iBAClBN,mCAASM,eACX;AAAA,MAAE,GACES;AAAAA,MAAaoB,UAEhB9B,uBACCsD,qBAAAC,UAAA;AAAA,QAAAzB,UAAA,CACEL,oBAAC+B,QAAM;AAAA,UAACC,QAAM;AAAA,UAAA3B,8BACX4B,oBAAkB;AAAA,YACjB9D,WAAW+B,KACTC,kBAAkB+B,uBAClBhE,mCAASgE,qBACX;AAAA,YAAE7B,8BAED8B,cAAY;AAAA,cAACC,WAAU;AAAA,cAAM/B,UAC3BtB,iCAAQ7B;AAAAA,YAAAA,CACG;AAAA,UAAA,CACI;AAAA,QAAA,CACd,GACR8C,oBAACqC,cAAY;AAAA,UACXjE,IAAImC,MAAMnC,IAAI,UAAU;AAAA,UACxBqD,UAAUhD,aAAa;AAAA,UACvBN,WAAW+B,KACTC,kBAAkBmC,uBAClBpE,mCAASoE,qBACX;AAAA,UACA,cAAYvD,iCAAQ3B;AAAAA,UACpB4D,UAAUA,CAACuB,GAAGC,QAAgB1D,qDAAmB0D;AAAAA,UACjDtB,OAAOzC;AAAAA,UAAS4B,UAEf7B,gBAAgBiE,IAAKC,CAAAA,+BACnBC,QAAM;AAAA,YAAczB,OAAOwB;AAAAA,YAAOrC,UAChCqC;AAAAA,UAAM,GADIA,MAEL,CACT;AAAA,QAAA,CACW,GACd1C,oBAAC+B,QAAM;AAAA,UAACC,QAAM;AAAA,UAAA3B,8BACXuC,6BAA2B;AAAA,YAC1BzE,WAAW+B,KACTC,kBAAkB+B,uBAClBhE,mCAASgE,qBACX;AAAA,YAAE7B,8BAED8B,cAAY;AAAA,cAACC,WAAU;AAAA,cAAM/B,UAC3BtB,iCAAQ5B;AAAAA,YAAAA,CACG;AAAA,UAAA,CACa;AAAA,QAAA,CACvB,CAAC;AAAA,MAAA,CACT;AAAA,IAAA,CAEiB,GACvB0E,qBAACgB,qBAAmB;AAAA,MAClB1E,WAAW+B,KACTC,kBAAkB2C,eAClB5E,mCAAS4E,aACX;AAAA,MAAE,GACE5D;AAAAA,MAAemB,UAAA,CAEnBL,oBAAC+C,yBAAuB;AAAA,QACtB3E,IAAImC,MAAMnC,IAAI,kBAAkB;AAAA,QAChC,cAAYW,iCAAQpB;AAAAA,QACpBQ,WAAW+B,KACTC,kBAAkB6C,eAClB9E,mCAAS8E,aACX;AAAA,QACAvB,UAAU,CAAC9C;AAAAA,QACXsE,SAASA,MAAMxD,WAAW,CAAC;AAAA,QAC3ByD,SAASnE,iCAAQzB;AAAAA,QAAyB+C,8BAEzC8C,OAAK;AAAA,UACJhF,WAAW+B,KAAKC,kBAAkBiD,MAAMlF,mCAASkF,IAAI;AAAA,UACrDC,OAAOC,SAAS,CAAC3E,WAAW;AAAA,QAAA,CAC7B;AAAA,MAAA,CACsB,GACzBqB,oBAAC+C,yBAAuB;AAAA,QACtB3E,IAAImC,MAAMnC,IAAI,qBAAqB;AAAA,QACnC,cAAYW,iCAAQnB;AAAAA,QACpBO,WAAW+B,KACTC,kBAAkB6C,eAClB9E,mCAAS8E,aACX;AAAA,QACAvB,UAAU,CAAC9C;AAAAA,QACXsE,SAASA,MAAMxD,WAAWnB,OAAO,CAAC;AAAA,QAClC4E,SAASnE,iCAAQxB;AAAAA,QAA4B8C,8BAE5CkD,WAAS;AAAA,UACRpF,WAAW+B,KAAKC,kBAAkBiD,MAAMlF,mCAASkF,IAAI;AAAA,UACrDC,OAAOC,SAAS,CAAC3E,WAAW;AAAA,QAAA,CAC7B;AAAA,MAAA,CACsB,GACzBkD,qBAAC2B,gBAAc;AAAA,QACbrF,WAAW+B,KAAKC,kBAAkBsD,UAAUvF,mCAASuF,QAAQ;AAAA,QAAEpD,UAAA,CAE9D3B,eACCqB,eAAe,wBAEdoC,cAAY;AAAA,UAACC,WAAU;AAAA,UAAM/B,UAAG,GAAE/B,OAAO;AAAA,QAAA,CAAkB,GAE9D0B,oBAACmC,cAAY;AAAA,UAACC,WAAU;AAAA,UAAM/B,UAAG,GAAEtB,iCAAQ1B;AAAAA,QAAAA,CAAgC,GAC3E2C,oBAACmC,cAAY;AAAA,UAAC/D,IAAImC,MAAMnC,IAAI,YAAY;AAAA,UAAGgE,WAAU;AAAA,UAAM/B,UACxDhC;AAAAA,QAAAA,CACW,CAAC;AAAA,MAAA,CACD,GAChB2B,oBAAC+C,yBAAuB;AAAA,QACtB3E,IAAImC,MAAMnC,IAAI,iBAAiB;AAAA,QAC/B,cAAYW,iCAAQlB;AAAAA,QACpBM,WAAW+B,KACTC,kBAAkB6C,eAClB9E,mCAAS8E,aACX;AAAA,QACAvB,UAAU,CAAC7C;AAAAA,QACXqE,SAASA,MAAMxD,WAAWnB,OAAO,CAAC;AAAA,QAClC4E,SAASnE,iCAAQvB;AAAAA,QAAwB6C,8BAExCqD,UAAQ;AAAA,UACPvF,WAAW+B,KAAKC,kBAAkBiD,MAAMlF,mCAASkF,IAAI;AAAA,UACrDC,OAAOC,SAAS,CAAC1E,OAAO;AAAA,QAAA,CACzB;AAAA,MAAA,CACsB,GACzBoB,oBAAC+C,yBAAuB;AAAA,QACtB3E,IAAImC,MAAMnC,IAAI,iBAAiB;AAAA,QAC/B,cAAYW,iCAAQjB;AAAAA,QACpBK,WAAW+B,KACTC,kBAAkB6C,eAClB9E,mCAAS8E,aACX;AAAA,QACAvB,UAAU,CAAC7C;AAAAA,QACXqE,SAASA,MAAMxD,WAAWpB,QAAQ,CAAC;AAAA,QACnC6E,SAASnE,iCAAQtB;AAAAA,QAAwB4C,8BAExCsD,KAAG;AAAA,UACFxF,WAAW+B,KAAKC,kBAAkBiD,MAAMlF,mCAASkF,IAAI;AAAA,UACrDC,OAAOC,SAAS,CAAC1E,OAAO;AAAA,QAAA,CACzB;AAAA,MAAA,CACsB,CAAC;AAAA,IAAA,CACP,CAAC;AAAA,EAAA,CACZ;AAEhB;"}
1	+ {"version":3,"file":"Pagination.js","sources":["../../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import { HTMLAttributes, useCallback, useEffect } from \"react\";\nimport { Hidden } from \"@mui/material\";\nimport { HvInput, HvInputProps, HvTypography } from \"@core/components\";\nimport {\n Start,\n End,\n Backwards,\n Forwards,\n} from \"@hitachivantara/uikit-react-icons\";\nimport { HvBaseProps } from \"@core/types\";\nimport { ExtractNames, isKeypress, keyboardCodes, setId } from \"@core/utils\";\nimport { useLabels } from \"@core/hooks\";\nimport HvSelect, { Option } from \"./Select\";\nimport { staticClasses, useClasses } from \"./Pagination.styles\";\nimport { usePageInput, getSafePage, setColor } from \"./utils\";\nimport ButtonIconTooltip from \"./ButtonIconTooltip\";\n\nexport { staticClasses as paginationClasses };\n\nexport type HvPaginationClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvPaginationLabels {\n /** The show label. /\n pageSizePrev?: string;\n /* Indicate the units of the page size selection. /\n pageSizeEntryName?: string;\n /* Used for the aria-label of the selection of number of unit.s /\n pageSizeSelectorDescription?: string;\n /* Separator of current page and total pages. /\n pagesSeparator?: string;\n /* Title of button `firstPage`. /\n paginationFirstPageTitle?: string;\n /* Title of button `previousPage`. /\n paginationPreviousPageTitle?: string;\n /* Title of button `nextPage`. /\n paginationNextPageTitle?: string;\n /* Title of button `lastPage`. /\n paginationLastPageTitle?: string;\n /* Aria-label passed to the page input. /\n paginationInputLabel?: string;\n /* Aria-label of the first page button /\n firstPage?: string;\n /* Aria-label of the previous page button /\n previousPage?: string;\n /* Aria-label of the next page button /\n nextPage?: string;\n /* Aria-label of the last page button /\n lastPage?: string;\n}\n\nexport interface HvPaginationProps extends HvBaseProps {\n /* The number of pages the component has. /\n pages?: number;\n /* The currently selected page (0-indexed). /\n page?: number;\n /* Controls whether the left page size mechanism should be visible. /\n showPageSizeOptions?: boolean;\n /* The array of possible page sizes for the dropdown. /\n pageSizeOptions?: number[];\n /* The currently selected page size. /\n pageSize?: number;\n /* Controls whether the central page changing mechanism should be visible. /\n showPageJump?: boolean;\n /* Controls whether the previous/first page buttons are enabled. /\n canPrevious?: boolean;\n /* Controls whether the next/last page buttons are enabled. /\n canNext?: boolean;\n /* Function called when the page changes. /\n onPageChange?: (page: number) => void;\n /* Function called when the page size changes. /\n onPageSizeChange?: (pageSize: number) => void;\n /* An object containing all the labels for the component. /\n labels?: HvPaginationLabels;\n /* Other props to show page component. /\n showPageProps?: HTMLAttributes<HTMLDivElement>;\n /* Other props to pagination component. /\n navigationProps?: HTMLAttributes<HTMLDivElement>;\n /* Extra properties passed to the input component representing the current pages. /\n currentPageInputProps?: HvInputProps;\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: Partial<HvPaginationClasses>;\n}\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\nconst defaultPageSizeOptions = [5, 10, 20, 25, 50, 100];\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 */\nexport const HvPagination = ({\n classes: classesProp = {},\n className,\n id,\n pages = 1,\n page = 0,\n showPageSizeOptions = true,\n pageSizeOptions = defaultPageSizeOptions,\n pageSize = defaultPageSizeOptions[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}: HvPaginationProps) => {\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n const [pageInput, handleInputChange] = usePageInput(page);\n const { classes, cx } = useClasses(classesProp);\n\n const changePage = useCallback(\n (newPage: number) => {\n const safePage: number = 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 externally or when internally committed - 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 controlling of the `page` property.\n // fixing it some other way would potentially introduce a breaking change.\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={(event, value) => handleInputChange(event, Number(value))}\n value={String(pageInput)}\n onBlur={(evt, value) => changePage(Number(value) - 1)}\n onKeyDown={(evt, value) =>\n isKeypress(evt, Enter) && changePage(Number(value) - 1)\n }\n disabled={pageSize === 0}\n disableClear\n {...currentPageInputProps}\n />\n </div>\n );\n\n return (\n <div id={id} className={cx(classes.root, className)} {...others}>\n <div className={classes.pageSizeOptions} {...showPageProps}>\n {showPageSizeOptions && (\n <>\n <Hidden xsDown>\n <HvTypography\n component=\"span\"\n className={classes?.pageSizeTextContainer}\n >\n {labels?.pageSizePrev}\n </HvTypography>\n </Hidden>\n <HvSelect\n id={setId(id, \"pageSize\")}\n disabled={pageSize === 0}\n className={classes.pageSizeOptionsSelect}\n aria-label={labels?.pageSizeSelectorDescription}\n onChange={(_, val: number) => onPageSizeChange?.(val)}\n value={pageSize}\n >\n {pageSizeOptions.map((option) => (\n <Option key={option} value={option}>\n {option}\n </Option>\n ))}\n </HvSelect>\n <Hidden xsDown>\n <HvTypography\n component=\"span\"\n className={classes.pageSizeTextContainer}\n >\n {labels?.pageSizeEntryName}\n </HvTypography>\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 component=\"span\" id={setId(id, \"totalPages\")}>\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"],"names":["DEFAULT_LABELS","pageSizePrev","pageSizeEntryName","pageSizeSelectorDescription","pagesSeparator","paginationFirstPageTitle","paginationPreviousPageTitle","paginationNextPageTitle","paginationLastPageTitle","paginationInputLabel","firstPage","previousPage","nextPage","lastPage","Enter","keyboardCodes","defaultPageSizeOptions","HvPagination","classes","classesProp","className","id","pages","page","showPageSizeOptions","pageSizeOptions","pageSize","showPageJump","canPrevious","canNext","onPageChange","onPageSizeChange","labels","labelsProp","showPageProps","navigationProps","currentPageInputProps","others","useLabels","pageInput","handleInputChange","usePageInput","cx","useClasses","changePage","useCallback","newPage","safePage","getSafePage","useEffect","renderPageJump","_jsx","pageJump","children","HvInput","setId","inputProps","type","root","pageSizeInputContainer","input","pageSizeInput","inputRoot","pageSizeInputRoot","onChange","event","value","Number","String","onBlur","evt","onKeyDown","isKeypress","disabled","disableClear","_jsxs","_Fragment","Hidden","xsDown","HvTypography","component","pageSizeTextContainer","HvSelect","pageSizeOptionsSelect","_","val","map","option","Option","pageNavigator","ButtonIconTooltip","iconContainer","onClick","tooltip","Start","icon","color","setColor","Backwards","pageInfo","Forwards","End"],"mappings":"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"}