@itcase/ui 1.9.41 → 1.9.43

package/dist/components/Grid.js

@@ -3,9 +3,9 @@ import clsx from 'clsx';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
 import 'react';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -15,7 +15,7 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 
 function Grid(props) {
     const { id, className, dataTestId, dataTour, type, horizontalResizing, horizontalScroll, print, tag: Tag = 'div', useGridSystem, verticalResizing, before, after, onClick, onDoubleClick, children, } = props;

package/dist/components/Group.js

@@ -4,9 +4,9 @@ import 'react';
 import 'clsx';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -17,4 +17,4 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';

package/dist/components/HTMLContent.js

@@ -3,9 +3,9 @@ import clsx from 'clsx';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
 import 'react';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -15,7 +15,7 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 
 function HTMLContent(props) {
     const { className, dataTestId, dataTour, content, style, onClick, children } = props;

package/dist/components/HeroTitle.js

@@ -4,10 +4,10 @@ import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { I as Icon } from '../Icon_es_DNVHNKFK.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import { I as Icon } from '../Icon_es_DoAtUvPe.js';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -17,11 +17,11 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_BwLH5S8y.js';
+import '../Link_es_DPZHTF38.js';
 import '../Text_es_B85LGfjW.js';
 
 const heroTitleAppearanceSize = {

package/dist/components/Icon.js

@@ -1,4 +1,4 @@
-export { I as Icon, e as iconAppearance, i as iconConfig } from '../Icon_es_DNVHNKFK.js';
+export { I as Icon, e as iconAppearance, i as iconConfig } from '../Icon_es_DoAtUvPe.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -8,9 +8,9 @@ import '@itcase/common';
 import '../context/UrlAssetPrefix.js';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '../context/UIContext.js';
@@ -20,6 +20,6 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
-import '../Link_es_BwLH5S8y.js';
+import 'lodash/maxBy.js';
+import '../Link_es_DPZHTF38.js';
 import '../Text_es_B85LGfjW.js';

package/dist/components/Image.js

@@ -1,4 +1,4 @@
-export { I as Image } from '../Image_es_DbD3JzLa.js';
+export { I as Image } from '../Image_es_Bx7l_UwQ.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -6,9 +6,9 @@ import '../hoc/urlWithAssetPrefix.js';
 import '@itcase/common';
 import '../context/UrlAssetPrefix.js';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '../context/UIContext.js';
@@ -18,4 +18,4 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';

package/dist/components/Input.js

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

package/dist/components/InputNumber.js

@@ -3,11 +3,11 @@ import { useState, useCallback } from 'react';
 import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { B as Button } from '../Button_es_ul2sDicM.js';
+import { B as Button } from '../Button_es_C2vKuxE7.js';
 import { icons24 } from '@itcase/icons/default';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -18,13 +18,14 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../utils/mergeAppearanceKeys.js';
+import '../hooks/useHoldProgress.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
-import '../Icon_es_DNVHNKFK.js';
+import 'lodash/maxBy.js';
+import '../Icon_es_DoAtUvPe.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_BwLH5S8y.js';
+import '../Link_es_DPZHTF38.js';
 import '../Text_es_B85LGfjW.js';
 import '../Loader_es_DFSNJsLL.js';
 

package/dist/components/InputPassword.js

@@ -4,10 +4,10 @@ import { useState, useMemo, useCallback } from 'react';
 import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { I as Icon } from '../Icon_es_DNVHNKFK.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import { I as Icon } from '../Icon_es_DoAtUvPe.js';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -21,8 +21,8 @@ import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
-import '../Link_es_BwLH5S8y.js';
+import 'lodash/maxBy.js';
+import '../Link_es_DPZHTF38.js';
 import '../Text_es_B85LGfjW.js';
 
 const inputPasswordAppearanceDefault = {

package/dist/components/Label.js

@@ -1,12 +1,12 @@
-export { L as Label, a as labelAppearance, l as labelConfig } from '../Label_es_CbXFs_ts.js';
+export { L as Label, a as labelAppearance, l as labelConfig } from '../Label_es_BHlo5f-u.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -17,10 +17,10 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
-import '../Icon_es_DNVHNKFK.js';
+import 'lodash/maxBy.js';
+import '../Icon_es_DoAtUvPe.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_BwLH5S8y.js';
+import '../Link_es_DPZHTF38.js';
 import '../Text_es_B85LGfjW.js';

package/dist/components/Link.js

@@ -1,12 +1,12 @@
-export { L as Link, a as LinkWrapper, b as linkAppearance, l as linkConfig } from '../Link_es_BwLH5S8y.js';
+export { L as Link, a as LinkWrapper, b as linkAppearance, l as linkConfig } from '../Link_es_DPZHTF38.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -17,4 +17,4 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';

package/dist/components/List.js

@@ -3,11 +3,11 @@ import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { L as Link } from '../Link_es_BwLH5S8y.js';
+import { L as Link } from '../Link_es_DPZHTF38.js';
 import 'react';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -17,7 +17,7 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 
 const listAppearanceAccent = {
     accentPrimary: {

package/dist/components/Loader.js

@@ -4,9 +4,9 @@ import 'clsx';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import 'react';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -17,5 +17,5 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 import '../Text_es_B85LGfjW.js';

package/dist/components/Logo.js

@@ -5,12 +5,12 @@ import { urlWithAssetPrefix } from '../hoc/urlWithAssetPrefix.js';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { a as LinkWrapper } from '../Link_es_BwLH5S8y.js';
+import { a as LinkWrapper } from '../Link_es_DPZHTF38.js';
 import '@itcase/common';
 import '../context/UrlAssetPrefix.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '../context/UIContext.js';
@@ -19,7 +19,7 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 
 const logoConfig = {
     appearance: undefined,

package/dist/components/MenuItem.js

@@ -4,12 +4,12 @@ import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { I as Icon, T as Tooltip } from '../Icon_es_DNVHNKFK.js';
-import { L as Link } from '../Link_es_BwLH5S8y.js';
+import { I as Icon, T as Tooltip } from '../Icon_es_DoAtUvPe.js';
+import { L as Link } from '../Link_es_DPZHTF38.js';
 import { T as Text } from '../Text_es_B85LGfjW.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -19,7 +19,7 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';

package/dist/components/Modal.js

@@ -7,12 +7,12 @@ import { mergeAppearanceKeys } from '../utils/mergeAppearanceKeys.js';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { b as Title, I as Icon } from '../Icon_es_DNVHNKFK.js';
+import { b as Title, I as Icon } from '../Icon_es_DoAtUvPe.js';
 import { O as Overlay } from '../Overlay_es_Dx6UIr2X.js';
 import { L as Loader } from '../Loader_es_DFSNJsLL.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -22,11 +22,11 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_BwLH5S8y.js';
+import '../Link_es_DPZHTF38.js';
 import '../Text_es_B85LGfjW.js';
 
 const modalAppearanceShape = {

package/dist/components/ModalSheetBottom.js

@@ -5,10 +5,10 @@ import { Sheet } from 'react-modal-sheet';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { b as Title } from '../Icon_es_DNVHNKFK.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import { b as Title } from '../Icon_es_DoAtUvPe.js';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -18,11 +18,11 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_BwLH5S8y.js';
+import '../Link_es_DPZHTF38.js';
 import '../Text_es_B85LGfjW.js';
 
 const modalSheetBottomAppearanceSize = {

package/dist/components/Notification.js

@@ -4,17 +4,17 @@ import { mergeAppearanceKeys } from '../utils/mergeAppearanceKeys.js';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { B as Button } from '../Button_es_ul2sDicM.js';
-import { I as Icon } from '../Icon_es_DNVHNKFK.js';
+import { B as Button } from '../Button_es_C2vKuxE7.js';
+import { I as Icon } from '../Icon_es_DoAtUvPe.js';
 import { L as Loader } from '../Loader_es_DFSNJsLL.js';
 import { T as Text } from '../Text_es_B85LGfjW.js';
 import { icons24 } from '@itcase/icons/default';
 import { useNotifications, useNotificationsAPI } from '../context/Notifications.js';
 import '../context/UIContext.js';
 import 'react';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import 'uuid';
@@ -22,8 +22,9 @@ import '@itcase/common';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
 import '../utils/setViewportProperty.js';
-import 'lodash/maxBy';
-import '../Link_es_BwLH5S8y.js';
+import 'lodash/maxBy.js';
+import '../hooks/useHoldProgress.js';
+import '../Link_es_DPZHTF38.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';

package/dist/components/Overlay.js

@@ -4,9 +4,9 @@ import 'clsx';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import 'react';
 import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -17,4 +17,4 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';

package/dist/components/Pagination.js

@@ -1,18 +1,17 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { useMemo, useState, useCallback } from 'react';
+import { useMemo, useState, useCallback, useRef, useEffect } from 'react';
 import clsx from 'clsx';
-import ceil from 'lodash/ceil';
 import ReactPaginate from 'react-paginate';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { D as Dropdown, a as DropdownItem } from '../DropdownItem_es__mygSEH6.js';
-import { I as Icon } from '../Icon_es_DNVHNKFK.js';
+import { D as Dropdown, a as DropdownItem } from '../DropdownItem_es_QniQAKA2.js';
+import { I as Icon } from '../Icon_es_DoAtUvPe.js';
 import { T as Text } from '../Text_es_B85LGfjW.js';
 import { icons14, icons16, icons24 } from '@itcase/icons/default';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -22,12 +21,12 @@ import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 import '../Divider_es_BR7ZO8w0.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_BwLH5S8y.js';
+import '../Link_es_DPZHTF38.js';
 
 const paginationAppearanceAccent = {
     accentPrimary: {
@@ -236,11 +235,13 @@ function Pagination(props) {
         return onChangePage;
     }, [onChangePage, onPageChange]);
     const _onChangePerPageCount = 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] = useState(false);
     const [activeDropdownItem, setActiveDropdownItem] = useState(perPageCount);
@@ -254,13 +255,13 @@ function Pagination(props) {
     }, []);
     const handleDropdownItemClick = useCallback((event, item) => {
         event.stopPropagation();
-        _onChangePerPageCount && _onChangePerPageCount(item);
+        _onChangePerPageCount(item);
         setActiveDropdownItem(item);
         setIsOpenDropdown(false);
     }, [_onChangePerPageCount]);
     const paginationPagesCount = useMemo(() => {
         if (allItemsCount && allItemsCount > 0) {
-            return ceil(allItemsCount / perPageCount);
+            return Math.ceil(allItemsCount / perPageCount);
         }
         return 0;
     }, [allItemsCount, perPageCount]);
@@ -271,6 +272,42 @@ function Pagination(props) {
         }
         return 0;
     }, [pageNumber]);
+    // Keep track of previous perPageCount value
+    const prevPageCountRef = useRef(perPageCount);
+    // When perPageCount changes and current pageNumber is invalid (even if in range).
+    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
+    useEffect(() => {
+        if (pageNumber > paginationPagesCount && paginationPagesCount > 0) {
+            _onChangePage({ selected: paginationPagesCount - 1 });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [allItemsCount]);
     const appearanceConfig = useAppearanceConfig(appearance, paginationConfig, isDisabled);
     const propsGenerator = 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/components/Radio.js

@@ -4,9 +4,9 @@ import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceC
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { T as Text } from '../Text_es_B85LGfjW.js';
 import 'react';
-import 'lodash/camelCase';
-import 'lodash/castArray';
-import 'lodash/upperFirst';
+import 'lodash/camelCase.js';
+import 'lodash/castArray.js';
+import 'lodash/upperFirst.js';
 import '../context/Notifications.js';
 import 'uuid';
 import '@itcase/common';
@@ -17,7 +17,7 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import '../hooks/useStyles/useStyles.js';
-import 'lodash/maxBy';
+import 'lodash/maxBy.js';
 
 const radioAppearanceDefault = {
     defaultPrimary: {