npm - @itcase/ui - Versions diffs - 1.9.41 → 1.9.43 - Mend

@itcase/ui 1.9.41 → 1.9.43

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 (323) hide show

package/dist/cjs/components/HeroTitle.js CHANGED Viewed

@@ -6,10 +6,10 @@ var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_D20B2YBo.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+var Icon = require('../../Icon_cjs_CuqEv1jm.js');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -19,11 +19,11 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DXBqPjwm.js');
+require('../../Link_cjs_Dn7UhCYe.js');
 require('../../Text_cjs_erTy2pUN.js');
 const heroTitleAppearanceSize = {

package/dist/cjs/components/Icon.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Icon = require('../../Icon_cjs_CuqEv1jm.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -10,9 +10,9 @@ require('@itcase/common');
 require('../context/UrlAssetPrefix.js');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('../context/UIContext.js');
@@ -22,8 +22,8 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
-require('lodash/maxBy');
-require('../../Link_cjs_DXBqPjwm.js');
+require('lodash/maxBy.js');
+require('../../Link_cjs_Dn7UhCYe.js');
 require('../../Text_cjs_erTy2pUN.js');

package/dist/cjs/components/Image.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var Image = require('../../Image_cjs_JfkEyfgx.js');
+var Image = require('../../Image_cjs_BxZFowhi.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -8,9 +8,9 @@ require('../hoc/urlWithAssetPrefix.js');
 require('@itcase/common');
 require('../context/UrlAssetPrefix.js');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('../context/UIContext.js');
@@ -20,7 +20,7 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');

package/dist/cjs/components/Input.js CHANGED Viewed

@@ -6,9 +6,9 @@ require('react');
 require('clsx');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');

package/dist/cjs/components/InputNumber.js CHANGED Viewed

@@ -5,11 +5,11 @@ var React = require('react');
 var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Button = require('../../Button_cjs_Ivarkwy6.js');
+var Button = require('../../Button_cjs_BSfL-20W.js');
 var _default = require('@itcase/icons/default');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -20,13 +20,14 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../utils/mergeAppearanceKeys.js');
+require('../hooks/useHoldProgress.js');
 require('../hooks/useStyles/useStyles.js');
-require('lodash/maxBy');
-require('../../Icon_cjs_D20B2YBo.js');
+require('lodash/maxBy.js');
+require('../../Icon_cjs_CuqEv1jm.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DXBqPjwm.js');
+require('../../Link_cjs_Dn7UhCYe.js');
 require('../../Text_cjs_erTy2pUN.js');
 require('../../Loader_cjs_DMIUN6_q.js');

package/dist/cjs/components/InputPassword.js CHANGED Viewed

@@ -6,10 +6,10 @@ var React = require('react');
 var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Icon = require('../../Icon_cjs_D20B2YBo.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+var Icon = require('../../Icon_cjs_CuqEv1jm.js');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -23,8 +23,8 @@ require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
 require('../hooks/useStyles/useStyles.js');
-require('lodash/maxBy');
-require('../../Link_cjs_DXBqPjwm.js');
+require('lodash/maxBy.js');
+require('../../Link_cjs_Dn7UhCYe.js');
 require('../../Text_cjs_erTy2pUN.js');
 const inputPasswordAppearanceDefault = {

package/dist/cjs/components/Label.js CHANGED Viewed

@@ -1,14 +1,14 @@
 'use strict';
-var Label = require('../../Label_cjs_DlbcXQX4.js');
+var Label = require('../../Label_cjs_DsuCRIyo.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -19,12 +19,12 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
-require('lodash/maxBy');
-require('../../Icon_cjs_D20B2YBo.js');
+require('lodash/maxBy.js');
+require('../../Icon_cjs_CuqEv1jm.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DXBqPjwm.js');
+require('../../Link_cjs_Dn7UhCYe.js');
 require('../../Text_cjs_erTy2pUN.js');

package/dist/cjs/components/Link.js CHANGED Viewed

@@ -1,14 +1,14 @@
 'use strict';
-var Link = require('../../Link_cjs_DXBqPjwm.js');
+var Link = require('../../Link_cjs_Dn7UhCYe.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -19,7 +19,7 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');

package/dist/cjs/components/List.js CHANGED Viewed

@@ -5,11 +5,11 @@ var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Link = require('../../Link_cjs_DXBqPjwm.js');
+var Link = require('../../Link_cjs_Dn7UhCYe.js');
 require('react');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -19,7 +19,7 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 const listAppearanceAccent = {
     accentPrimary: {

package/dist/cjs/components/Loader.js CHANGED Viewed

@@ -6,9 +6,9 @@ require('clsx');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('react');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -19,7 +19,7 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 require('../../Text_cjs_erTy2pUN.js');

package/dist/cjs/components/Logo.js CHANGED Viewed

@@ -7,12 +7,12 @@ var urlWithAssetPrefix = require('../hoc/urlWithAssetPrefix.js');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Link = require('../../Link_cjs_DXBqPjwm.js');
+var Link = require('../../Link_cjs_Dn7UhCYe.js');
 require('@itcase/common');
 require('../context/UrlAssetPrefix.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('../context/UIContext.js');
@@ -21,7 +21,7 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 const logoConfig = {
     appearance: undefined,

package/dist/cjs/components/MenuItem.js CHANGED Viewed

@@ -6,12 +6,12 @@ var clsx = require('clsx');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_D20B2YBo.js');
-var Link = require('../../Link_cjs_DXBqPjwm.js');
+var Icon = require('../../Icon_cjs_CuqEv1jm.js');
+var Link = require('../../Link_cjs_Dn7UhCYe.js');
 var Text = require('../../Text_cjs_erTy2pUN.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -21,7 +21,7 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');

package/dist/cjs/components/Modal.js CHANGED Viewed

@@ -9,12 +9,12 @@ var mergeAppearanceKeys = require('../utils/mergeAppearanceKeys.js');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Icon = require('../../Icon_cjs_CuqEv1jm.js');
 var Overlay = require('../../Overlay_cjs_BK_0yTLw.js');
 var Loader = require('../../Loader_cjs_DMIUN6_q.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -24,11 +24,11 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DXBqPjwm.js');
+require('../../Link_cjs_Dn7UhCYe.js');
 require('../../Text_cjs_erTy2pUN.js');
 const modalAppearanceShape = {

package/dist/cjs/components/ModalSheetBottom.js CHANGED Viewed

@@ -7,10 +7,10 @@ var reactModalSheet = require('react-modal-sheet');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_D20B2YBo.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+var Icon = require('../../Icon_cjs_CuqEv1jm.js');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -20,11 +20,11 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DXBqPjwm.js');
+require('../../Link_cjs_Dn7UhCYe.js');
 require('../../Text_cjs_erTy2pUN.js');
 const modalSheetBottomAppearanceSize = {

package/dist/cjs/components/Notification.js CHANGED Viewed

@@ -6,17 +6,17 @@ var mergeAppearanceKeys = require('../utils/mergeAppearanceKeys.js');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var Button = require('../../Button_cjs_Ivarkwy6.js');
-var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var Button = require('../../Button_cjs_BSfL-20W.js');
+var Icon = require('../../Icon_cjs_CuqEv1jm.js');
 var Loader = require('../../Loader_cjs_DMIUN6_q.js');
 var Text = require('../../Text_cjs_erTy2pUN.js');
 var _default = require('@itcase/icons/default');
 var Notifications = require('../context/Notifications.js');
 require('../context/UIContext.js');
 require('react');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('uuid');
@@ -24,8 +24,9 @@ require('@itcase/common');
 require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
 require('../utils/setViewportProperty.js');
-require('lodash/maxBy');
-require('../../Link_cjs_DXBqPjwm.js');
+require('lodash/maxBy.js');
+require('../hooks/useHoldProgress.js');
+require('../../Link_cjs_Dn7UhCYe.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');

package/dist/cjs/components/Overlay.js CHANGED Viewed

@@ -6,9 +6,9 @@ require('clsx');
 require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('react');
 require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -19,7 +19,7 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');

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

@@ -3,18 +3,17 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
-var ceil = require('lodash/ceil');
 var ReactPaginate = require('react-paginate');
 var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
-var DropdownItem = require('../../DropdownItem_cjs_nZbgMgqg.js');
-var Icon = require('../../Icon_cjs_D20B2YBo.js');
+var DropdownItem = require('../../DropdownItem_cjs_pJblsTmA.js');
+var Icon = require('../../Icon_cjs_CuqEv1jm.js');
 var Text = require('../../Text_cjs_erTy2pUN.js');
 var _default = require('@itcase/icons/default');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -24,12 +23,12 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 require('../../Divider_cjs_C5Ou2Kqa.js');
 require('react-inlinesvg');
 require('../hoc/urlWithAssetPrefix.js');
 require('../context/UrlAssetPrefix.js');
-require('../../Link_cjs_DXBqPjwm.js');
+require('../../Link_cjs_Dn7UhCYe.js');
 const paginationAppearanceAccent = {
     accentPrimary: {
@@ -238,11 +237,13 @@ function Pagination(props) {
         return onChangePage;
     }, [onChangePage, onPageChange]);
     const _onChangePerPageCount = React.useMemo(() => {
-        if (onPerPageCountChange) {
-            console.warn('@itcase/ui Pagination warning: "onPerPageCountChange" is deprecated, use "onChangePerPageCount" instead.');
-            return onPerPageCountChange;
-        }
-        return onChangePerPageCount;
+        return (perPageCount) => {
+            if (onPerPageCountChange) {
+                console.warn('@itcase/ui Pagination warning: "onPerPageCountChange" is deprecated, use "onChangePerPageCount" instead.');
+                return onPerPageCountChange(perPageCount);
+            }
+            return onChangePerPageCount(perPageCount);
+        };
     }, [onChangePerPageCount, onPerPageCountChange]);
     const [isOpenDropdown, setIsOpenDropdown] = React.useState(false);
     const [activeDropdownItem, setActiveDropdownItem] = React.useState(perPageCount);
@@ -256,13 +257,13 @@ function Pagination(props) {
     }, []);
     const handleDropdownItemClick = React.useCallback((event, item) => {
         event.stopPropagation();
-        _onChangePerPageCount && _onChangePerPageCount(item);
+        _onChangePerPageCount(item);
         setActiveDropdownItem(item);
         setIsOpenDropdown(false);
     }, [_onChangePerPageCount]);
     const paginationPagesCount = React.useMemo(() => {
         if (allItemsCount && allItemsCount > 0) {
-            return ceil(allItemsCount / perPageCount);
+            return Math.ceil(allItemsCount / perPageCount);
         }
         return 0;
     }, [allItemsCount, perPageCount]);
@@ -273,6 +274,42 @@ function Pagination(props) {
         }
         return 0;
     }, [pageNumber]);
+    // Keep track of previous perPageCount value
+    const prevPageCountRef = React.useRef(perPageCount);
+    // When perPageCount changes and current pageNumber is invalid (even if in range).
+    React.useEffect(() => {
+        // If page number is 5 and perPageCount is 10 and there is 200 items in total,
+        // then user is seeing items from 41 to 50.
+        // Without this effect, when perPageCount changes to 20, pageNumber remains 5,
+        // which mean user will see items from 81 to 100, which is not expected.
+        // So we recalculate pageNumber to make sure user sees items from 41 to 60.
+        // pageNumber 1, perPageCount 10 -> items 1-10
+        // pageNumber 2, perPageCount 10 -> items 11-20
+        // pageNumber 3, perPageCount 10 -> items 21-30
+        // pageNumber 4, perPageCount 10 -> items 31-40
+        // pageNumber 5, perPageCount 10 -> items 41-50
+        // pageNumber 1, perPageCount 20 -> items 1-20
+        // pageNumber 2, perPageCount 20 -> items 21-40
+        // pageNumber 3, perPageCount 20 -> items 41-60
+        // pageNumber 4, perPageCount 20 -> items 61-80
+        // pageNumber 5, perPageCount 20 -> items 81-100
+        const prevPageCount = prevPageCountRef.current;
+        // Update previous perPageCount value
+        prevPageCountRef.current = perPageCount;
+        const firstItemIndex = (pageNumber - 1) * prevPageCount + 1;
+        const newPageNumber = Math.ceil(firstItemIndex / perPageCount);
+        if (newPageNumber !== pageNumber) {
+            _onChangePage({ selected: newPageNumber - 1 });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [perPageCount]);
+    // When allItemsCount changes and current pageNumber is out of range
+    React.useEffect(() => {
+        if (pageNumber > paginationPagesCount && paginationPagesCount > 0) {
+            _onChangePage({ selected: paginationPagesCount - 1 });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [allItemsCount]);
     const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, paginationConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
     const { justifyContentClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, fillInputClass, fillInputHoverClass, fillInputShapeClass, fillInputShapeStrengthClass, textColorActiveClass, textColorActiveHoverClass, textColorClass, textColorHoverClass, textSizeClass, builderIcon, builderIconFill, builderIconFillIcon, builderIconFillSize, builderIconSize, marginPagesDisplayed, nextIcon, nextIconFill, nextIconFillIcon, nextIconFillSize, nextIconSize, pageCountDescTextColor, pageCountDescTextSize, pageCountDropdownAlignment, pageCountDropdownElevation, pageCountDropdownFill, pageCountDropdownFillHover, pageCountDropdownItemDividerFill, pageCountDropdownItemDividerSize, pageCountDropdownItemFill, pageCountDropdownItemFillActive, pageCountDropdownItemFillActiveHover, pageCountDropdownItemFillHover, pageCountDropdownItemLabelAlign, pageCountDropdownItemLabelColor, pageCountDropdownItemLabelColorActive, pageCountDropdownItemLabelColorActiveHover, pageCountDropdownItemLabelColorHover, pageCountDropdownItemLabelSize, pageCountDropdownItemLabelWrap, pageCountDropdownItemShowDivider, pageCountDropdownItemSize, pageCountDropdownItemWidth, pageCountDropdownShape, pageCountDropdownShapeStrength, pageCountInputIcon, pageCountInputIconColor, pageCountInputIconFillSize, pageCountInputIconSrc, pageCountInputTextColor, pageCountInputTextSize, pageRangeDisplayed, previousIcon, previousIconFill, previousIconFillIcon, previousIconFillSize, previousIconSize, sizeClass, } = propsGenerator;

package/dist/cjs/components/Radio.js CHANGED Viewed

@@ -6,9 +6,9 @@ var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceCon
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var Text = require('../../Text_cjs_erTy2pUN.js');
 require('react');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -19,7 +19,7 @@ require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
 require('../hooks/useStyles/useStyles.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 const radioAppearanceDefault = {
     defaultPrimary: {

package/dist/cjs/components/RangeSlider.js CHANGED Viewed

@@ -6,9 +6,9 @@ var Slider = require('rc-slider');
 var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
 require('react');
-require('lodash/camelCase');
-require('lodash/castArray');
-require('lodash/upperFirst');
+require('lodash/camelCase.js');
+require('lodash/castArray.js');
+require('lodash/upperFirst.js');
 require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
@@ -18,7 +18,7 @@ require('react-responsive');
 require('../utils/setViewportProperty.js');
 require('../hooks.js');
 require('../hooks/useStyles/styleAttributes.js');
-require('lodash/maxBy');
+require('lodash/maxBy.js');
 function RangeSlider(props) {
     const { className, dataTestId, dataTour, min, max, disabled, pushable, range, step, value, vertical, before, after, set, onChangeSlider, children, } = props;