@itcase/ui 1.9.36 → 1.9.38

package/dist/components/Modal.js

@@ -3,12 +3,13 @@ import React, { useState, useRef, useCallback, startTransition, useEffect, useLa
 import clsx from 'clsx';
 import ReactDOM from 'react-dom';
 import { icons24, icons32, icons40 } from '@itcase/icons/default';
+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_Banbw98_.js';
-import { O as Overlay } from '../Overlay_es_dNz3djDB.js';
-import { L as Loader } from '../Loader_es_Csp5tr40.js';
+import { b as Title, I as Icon } from '../Icon_es_DNVHNKFK.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';
@@ -25,8 +26,8 @@ import 'lodash/maxBy';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_Bt-Bhy3t.js';
-import '../Text_es_DaYcLe4H.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';
 
 const modalAppearanceShape = {
     circular: {
@@ -135,7 +136,7 @@ const getOrCreateModalElement = (modalIdQuerySelector, className = '') => {
 };
 // Modal component that is an abstraction around the portal API.
 const Modal = React.forwardRef(function Modal(props, ref) {
-    const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, closeIcon = true, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
+    const { id, appearance, className, dataTestId, dataTour, title, absoluteHeader = false, modalIdQuerySelector = 'modal-global', print, scroll = false, stickyHeader = false, before, after, closeIcon = true, isDisabled, isSkeleton, isCloseOnBlur = true, isOpen: initialIsOpen = false, isOverlay = true, isScrollOnOpen = true, isSetFocusOnOpen = true, onClickOverlay, onCloseModal, onOpenModal, children, } = props;
     // Query DOM element
     const [modalElement, setModalElement] = useState(null);
     const [isOpen, setIsOpen] = useState(initialIsOpen);
@@ -178,11 +179,11 @@ const Modal = React.forwardRef(function Modal(props, ref) {
         setIsOpen(false);
         onCloseModal && onCloseModal();
     }, [modalElement, onCloseModal]);
-    const handleClickOverlay = useCallback(() => {
+    const handleClickOverlay = useCallback((event) => {
         if (isCloseOnBlur) {
             closeModal();
         }
-        onClickOverlay && onClickOverlay();
+        onClickOverlay && onClickOverlay(event);
     }, [closeModal, isCloseOnBlur, onClickOverlay]);
     useEffect(() => {
         if (!modalElement) {
@@ -192,7 +193,7 @@ const Modal = React.forwardRef(function Modal(props, ref) {
     }, [isOpen]); // eslint-disable-line
     useLayoutEffect(() => {
         let classNameModal = className;
-        if (print === false) {
+        if (!print) {
             classNameModal = clsx(className, 'no-print');
         }
         const element = getOrCreateModalElement(modalIdQuerySelector, classNameModal);
@@ -201,7 +202,7 @@ const Modal = React.forwardRef(function Modal(props, ref) {
         if (element) {
             addModalProps(element);
         }
-    }, [addModalProps, className, modalIdQuerySelector]);
+    }, [addModalProps, className, modalIdQuerySelector, print]);
     useEffect(() => {
         if (!isCloseOnBlur || !isOpen) {
             return;
@@ -226,10 +227,9 @@ const Modal = React.forwardRef(function Modal(props, ref) {
     const appearanceConfig = useAppearanceConfig(appearance, modalConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, titleTextColor, titleTextColorHover, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWidth, titleTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, overlayFill, overlayOpacity, shapeClass, shapeStrengthClass, sizeClass, closeIconAppearance, closeIconAppearanceSize, closeIconFillSize, closeIconImage, closeIconShape, closeIconSize, } = propsGenerator;
-    // @ts-expect-error
     const { styles: modalStyles } = useStyles(props);
     return (modalElement &&
-        ReactDOM.createPortal(isOpen ? (jsxs(React.Fragment, { children: [jsxs("div", { id: id, className: clsx('modal__content', absoluteHeader && 'modal__content-absolute-header', !title && !closeIcon && 'modal__content-no-header', fillClass && `fill_${fillClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `shape_${shapeClass}`, sizeClass && `modal_size_${sizeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, scroll && `modal-scroll_${scroll}`, stickyHeader && 'modal-scroll_header_sticky', isSkeleton && 'modal_skeleton'), ref: modalContentRef, "data-testid": dataTestId, "data-tour": dataTour, style: modalStyles, tabIndex: 0, children: [(title || closeIcon) && (jsxs("div", { className: clsx('modal__header', fillClass && `fill_${fillClass}`), children: [title && (jsx(Title, { width: titleTextWidth, flex: "1", size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIcon && (jsx("div", { className: "modal__close", onClick: closeModal, children: jsx(Icon, { appearance: `${closeIconAppearance} ${closeIconAppearanceSize}`, fillSize: closeIconFillSize, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage ?? icons24.Action.Close }) }))] })), jsx("div", { className: "modal__content-wrapper", children: children })] }), jsx(Overlay, { className: "modal__overlay", 
+        ReactDOM.createPortal(isOpen ? (jsxs(React.Fragment, { children: [jsxs("div", { id: id, className: clsx('modal__content', absoluteHeader && 'modal__content-absolute-header', !title && !closeIcon && 'modal__content-no-header', fillClass && `fill_${fillClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `shape_${shapeClass}`, sizeClass && `modal_size_${sizeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, scroll && `modal-scroll_${scroll}`, stickyHeader && 'modal-scroll_header_sticky', isSkeleton && 'modal_skeleton'), ref: modalContentRef, "data-testid": dataTestId, "data-tour": dataTour, style: modalStyles, tabIndex: 0, children: [before, (title || closeIcon) && (jsxs("div", { className: clsx('modal__header', fillClass && `fill_${fillClass}`), children: [title && (jsx(Title, { width: titleTextWidth, flex: "1", size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIcon && (jsx("div", { className: "modal__close", onClick: closeModal, children: jsx(Icon, { appearance: mergeAppearanceKeys(closeIconAppearance, closeIconAppearanceSize), fillSize: closeIconFillSize, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage ?? icons24.Action.Close }) }))] })), jsx("div", { className: "modal__content-wrapper", children: children }), after] }), jsx(Overlay, { className: "modal__overlay", 
                     // ref={modalOverlayRef}
                     fill: overlayFill, opacity: overlayOpacity, isOverlay: isOverlay, onClick: handleClickOverlay })] })) : null, 
         // A DOM element

package/dist/components/ModalSheetBottom.js

@@ -5,7 +5,7 @@ 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_Banbw98_.js';
+import { b as Title } from '../Icon_es_DNVHNKFK.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
@@ -22,16 +22,14 @@ import 'lodash/maxBy';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_Bt-Bhy3t.js';
-import '../Text_es_DaYcLe4H.js';
+import '../Link_es_BwLH5S8y.js';
+import '../Text_es_B85LGfjW.js';
 
 const modalSheetBottomAppearanceSize = {
     sizeL: {
-        size: 'l',
         titleTextSize: 'h4',
     },
     sizeM: {
-        size: 'm',
         titleTextSize: 'h5',
     },
 };
@@ -53,7 +51,6 @@ const ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
         setIsOpen(false);
         onCloseModalSheetBottom && onCloseModalSheetBottom();
     }, [onCloseModalSheetBottom]);
-    // Save ref things
     useImperativeHandle(ref, () => ({
         openModal: openModalSheetBottom,
         closeModal: closeModalSheetBottom,
@@ -62,9 +59,8 @@ const ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
     const appearanceConfig = useAppearanceConfig(appearance, modalSheetBottomConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { titleTextColor, titleTextColorHover, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWidth, titleTextWrap, zeroPadding, } = propsGenerator;
-    // @ts-expect-error
     const { styles } = useStyles(props);
-    return (jsxs(Sheet, { className: "modal-sheet-bottom", "data-testid": dataTestId, "data-tour": dataTour, isOpen: isOpen, onClose: closeModalSheetBottom, ...props, children: [jsxs(Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [jsx(Sheet.Header, { className: "modal-sheet-bottom__header", children: closeButton && (jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton })) }), jsx(Sheet.Content, { className: "modal-sheet-bottom__content", children: jsxs("div", { className: clsx('modal-sheet-bottom__content-wrapper', zeroPadding && 'modal-sheet-bottom__content-reset-padding'), children: [title && (jsx(Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), children] }) })] }), jsx(Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] }));
+    return (jsxs(Sheet, { ...props, className: "modal-sheet-bottom", "data-testid": dataTestId, "data-tour": dataTour, isOpen: isOpen, onClose: closeModalSheetBottom, children: [jsxs(Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [jsx(Sheet.Header, { className: "modal-sheet-bottom__header", children: closeButton && (jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton })) }), jsx(Sheet.Content, { className: "modal-sheet-bottom__content", children: jsxs("div", { className: clsx('modal-sheet-bottom__content-wrapper', zeroPadding && 'modal-sheet-bottom__content-reset-padding'), children: [title && (jsx(Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), children] }) })] }), jsx(Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] }));
 });
 
 export { ModalSheetBottom, modalSheetBottomAppearance };

package/dist/components/Notification.js

@@ -1,12 +1,13 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
-import { L as Loader } from '../Loader_es_Csp5tr40.js';
+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_DH8hqqdN.js';
-import { I as Icon } from '../Icon_es_Banbw98_.js';
-import { T as Text } from '../Text_es_DaYcLe4H.js';
+import { B as Button } from '../Button_es_ul2sDicM.js';
+import { I as Icon } from '../Icon_es_DNVHNKFK.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';
@@ -22,7 +23,7 @@ import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import 'lodash/maxBy';
-import '../Link_es_Bt-Bhy3t.js';
+import '../Link_es_BwLH5S8y.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
@@ -30,7 +31,7 @@ import '../context/UrlAssetPrefix.js';
 const notificationAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfacePrimary',
-        fillHover: 'surfacePrimaryHover',
+        fillHover: 'surfacePrimary',
         titleTextColor: 'surfaceTextPrimary',
         descTextColor: 'surfaceTextPrimary',
         borderColor: 'surfaceBorderPrimary',
@@ -45,7 +46,7 @@ const notificationAppearanceDefault = {
 const notificationAppearanceError = {
     errorPrimary: {
         fill: 'errorPrimary',
-        fillHover: 'errorPrimaryHover',
+        fillHover: 'errorPrimary',
         titleTextColor: 'errorTextPrimary',
         descTextColor: 'errorTextPrimary',
         borderColor: 'errorBorderPrimary',
@@ -60,7 +61,7 @@ const notificationAppearanceError = {
 const notificationAppearanceInfo = {
     infoPrimary: {
         fill: 'infoPrimary',
-        fillHover: 'infoPrimaryHover',
+        fillHover: 'infoPrimary',
         titleTextColor: 'infoTextPrimary',
         descTextColor: 'infoTextPrimary',
         borderColor: 'infoBorderPrimary',
@@ -102,17 +103,15 @@ const notificationAppearanceSize = {
         size: 'm',
         titleTextSize: 'xxl',
         descTextSize: 'm',
-        iconSize: 24,
         loaderAppearanceSize: 'sizeS',
-        closeIconAppearanceSize: 'size_24_24',
+        closeIconAppearanceSize: 'size24_24',
     },
     sizeS: {
         size: 'm',
         titleTextSize: 'xl',
         descTextSize: 'm',
-        iconSize: 24,
         loaderAppearanceSize: 'sizeS',
-        closeIconAppearanceSize: 'size_24_24',
+        closeIconAppearanceSize: 'size24_24',
     },
 };
 
@@ -133,7 +132,7 @@ const notificationAppearanceStyle = {
 const notificationAppearanceSuccess = {
     successPrimary: {
         fill: 'successPrimary',
-        fillHover: 'successPrimaryHover',
+        fillHover: 'successPrimary',
         titleTextColor: 'successTextPrimary',
         descTextColor: 'successTextPrimary',
         borderColor: 'successBorderPrimary',
@@ -148,7 +147,7 @@ const notificationAppearanceSuccess = {
 const notificationAppearanceWarning = {
     warningPrimary: {
         fill: 'warningPrimary',
-        fillHover: 'warningPrimaryHover',
+        fillHover: 'warningPrimary',
         titleTextColor: 'warningTextPrimary',
         descTextColor: 'warningTextPrimary',
         borderColor: 'surfaceBorderPrimary',
@@ -181,10 +180,9 @@ function Notification(props) {
     const { id, appearance, className, dataTestId, dataTour, type = 'float', title, text, before, after, isSkeleton, isLoading, onClickButton, onClickClose, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, notificationConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'hug', shapeClass, shapeStrengthClass, sizeClass, widthClass, closeIcon, closeIconAppearance, closeIconAppearanceSize, closeIconSrc, } = propsGenerator;
-    // @ts-expect-error
+    const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'dot', shapeClass, shapeStrengthClass, sizeClass, widthClass, closeIcon, closeIconAppearance, closeIconAppearanceSize, closeIconSrc, } = propsGenerator;
     const { styles: notificationStyles } = useStyles(props);
-    return (jsxs("div", { className: clsx('notification__item', `notification__item_${type}`, widthClass && `width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, sizeClass && `notification__item_size_${sizeClass}`, type && `notification__item_type_${type}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && `notification__item_skeleton`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: notificationStyles, children: [before, jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsx(Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (jsx(Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), isLoading && (jsx(Loader, { appearance: `${loaderAppearance} ${loaderAppearanceSize}`, className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (jsx(Icon, { appearance: `${closeIconAppearance} ${closeIconAppearanceSize}`, className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), (onClickButton || buttonLabel) && (jsx(Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
+    return (jsxs("div", { className: clsx('notification__item', `notification__item_${type}`, widthClass && `width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, sizeClass && `notification__item_size_${sizeClass}`, type && `notification__item_type_${type}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && `notification__item_skeleton`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: notificationStyles, children: [before, jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsx(Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (jsx(Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), isLoading && (jsx(Loader, { appearance: mergeAppearanceKeys(loaderAppearance, loaderAppearanceSize), className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (jsx(Icon, { appearance: mergeAppearanceKeys(closeIconAppearance, closeIconAppearanceSize), className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), (onClickButton || buttonLabel) && (jsx(Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
 }
 
 function NotificationWrapper(props) {

package/dist/components/Overlay.js

@@ -1,4 +1,4 @@
-export { O as Overlay, a as overlayAppearance, o as overlayConfig } from '../Overlay_es_dNz3djDB.js';
+export { O as Overlay, a as overlayAppearance, o as overlayConfig } from '../Overlay_es_Dx6UIr2X.js';
 import 'react/jsx-runtime';
 import 'clsx';
 import '../hooks/useAppearanceConfig/useAppearanceConfig.js';

package/dist/components/Pagination.js

@@ -6,10 +6,10 @@ 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_DgaoM2SE.js';
-import { I as Icon } from '../Icon_es_Banbw98_.js';
-import { T as Text } from '../Text_es_DaYcLe4H.js';
-import { icons14, icons24, icons16 } from '@itcase/icons/default';
+import { D as Dropdown, a as DropdownItem } from '../DropdownItem_es__mygSEH6.js';
+import { I as Icon } from '../Icon_es_DNVHNKFK.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';
@@ -23,20 +23,16 @@ import '../utils/setViewportProperty.js';
 import '../hooks.js';
 import '../hooks/useStyles/styleAttributes.js';
 import 'lodash/maxBy';
-import '../Divider_es_BlOJ77zx.js';
+import '../Divider_es_BR7ZO8w0.js';
 import 'react-inlinesvg';
 import '../hoc/urlWithAssetPrefix.js';
 import '../context/UrlAssetPrefix.js';
-import '../Link_es_Bt-Bhy3t.js';
+import '../Link_es_BwLH5S8y.js';
 
 const paginationAppearanceAccent = {
-    accent: {
-        fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
-    },
     accentPrimary: {
         fill: 'accentPrimary',
-        fillActive: 'accentQuaternary',
+        fillActive: 'accentActiveQuaternary',
         fillInput: 'surfacePrimary',
         borderColor: 'accentBorderPrimary',
         textColor: 'accentTextPrimary',
@@ -44,13 +40,13 @@ const paginationAppearanceAccent = {
         nextIconFillIcon: 'accentItemPrimary',
         pageCountDescTextColor: 'surfaceTextPrimary',
         pageCountDropdownAlignment: 'topCenter',
-        pageCountDropdownElevation: 8,
+        pageCountDropdownElevation: '8',
         pageCountDropdownFill: 'surfacePrimary',
         pageCountDropdownItemDividerFill: 'surfaceSecondary',
         pageCountDropdownItemFill: 'surfacePrimary',
         pageCountDropdownItemFillActive: 'accentPrimary',
-        pageCountDropdownItemFillActiveHover: 'accentActiveHover',
-        pageCountDropdownItemFillHover: 'surfaceSecondary',
+        pageCountDropdownItemFillActiveHover: 'accentActiveHoverPrimary',
+        pageCountDropdownItemFillHover: 'surfaceHoverSecondary',
         pageCountDropdownItemLabelAlign: 'center',
         pageCountDropdownItemLabelColor: 'surfaceTextPrimary',
         pageCountDropdownItemLabelColorActive: 'accentTextPrimary',
@@ -62,7 +58,7 @@ const paginationAppearanceAccent = {
     },
     accentSecondary: {
         fill: 'accentPrimary',
-        fillHover: 'accentPrimaryHover',
+        fillHover: 'accentHoverPrimary',
         labelTextColor: 'accentTextSecondary',
         labelTextColorHover: 'accentTextSecondary',
         borderColor: 'accentBorderPrimary',
@@ -110,17 +106,13 @@ const paginationAppearanceSize = {
         size: 'l',
         labelTextSize: 'l',
         textSize: 'l',
-        builderIcon: icons24.General.Dot,
-        iconAfterFillSize: '24',
-        iconAfterSize: '24',
-        iconBeforeFillSize: '24',
-        iconBeforeSize: '24',
+        builderIcon: icons24.General.DotMedium,
         nextIcon: icons24.Arrow.ChevronRightSmall,
         pageCountDescTextSize: 'l',
         pageCountDropdownItemDividerSize: 'xxs',
         pageCountDropdownItemLabelSize: 'm',
         pageCountDropdownItemSize: 'l',
-        pageCountDropdownItemWidth: '64',
+        pageCountDropdownItemWidth: '64px',
         pageCountInputIcon: icons14.Arrow.ChevronDownSmall,
         pageCountInputIconFillSize: '24',
         pageCountInputTextSize: 'l',
@@ -130,11 +122,7 @@ const paginationAppearanceSize = {
         size: 'm',
         labelTextSize: 'm',
         textSize: 'm',
-        builderIcon: icons24.General.Dot,
-        iconAfterFillSize: '24',
-        iconAfterSize: '24',
-        iconBeforeFillSize: '24',
-        iconBeforeSize: '24',
+        builderIcon: icons24.General.DotMedium,
         nextIcon: icons24.Arrow.ChevronRightSmall,
         pageCountDescTextSize: 'm',
         pageCountDropdownItemDividerSize: 'xxs',
@@ -149,11 +137,7 @@ const paginationAppearanceSize = {
         size: 's',
         labelTextSize: 's',
         textSize: 's',
-        builderIcon: icons24.General.Dot,
-        iconAfterFillSize: '20',
-        iconAfterSize: '20',
-        iconBeforeFillSize: '20',
-        iconBeforeSize: '20',
+        builderIcon: icons24.General.DotMedium,
         nextIcon: icons16.Arrow.ChevronRightSmall,
         pageCountDescTextSize: 's',
         pageCountDropdownItemDividerSize: 'xxs',
@@ -167,10 +151,7 @@ const paginationAppearanceSize = {
         size: 'xs',
         labelTextSize: 'xs',
         textSize: 'xs',
-        beforeSize: '16',
-        // TODO: replace builderIcon: icons24.General.Dot with an builderIcon: icons14.General.Dot,
-        builderIcon: icons24.General.Dot,
-        iconAfterFillSize: '16',
+        builderIcon: icons14.General.DotMedium,
         nextIcon: icons14.Arrow.ChevronRightSmall,
         pageCountDescTextSize: 'xs',
         pageCountDropdownItemDividerSize: 'xxs',
@@ -199,27 +180,27 @@ const paginationAppearanceStyle = {
 const paginationAppearanceSurface = {
     surfacePrimary: {
         fill: 'surfacePrimary',
-        fillHover: 'surfaceTertiary',
         fillActive: 'accentPrimary',
-        fillActiveHover: 'accentHoverPrimary',
+        fillActiveHover: 'accentPrimary',
+        fillHover: 'surfaceHoverTertiary',
         fillInput: 'surfacePrimary',
-        fillInputHover: 'surfaceTertiary',
+        fillInputHover: 'surfaceHoverTertiary',
         textColor: 'surfaceTextPrimary',
-        textColorHover: 'surfaceTextPrimary',
         textColorActive: 'accentTextPrimary',
         textColorActiveHover: 'accentTextPrimary',
+        textColorHover: 'surfaceTextPrimary',
         builderIconFillIcon: 'surfaceItemPrimary',
         nextIconFillIcon: 'surfaceItemPrimary',
         pageCountDescTextColor: 'surfaceTextPrimary',
         pageCountDropdownAlignment: 'topCenter',
-        pageCountDropdownElevation: 8,
+        pageCountDropdownElevation: '8',
         pageCountDropdownFill: 'surfacePrimary',
-        pageCountDropdownFillHover: 'surfaceTertiary',
+        pageCountDropdownFillHover: 'surfaceHoverTertiary',
         pageCountDropdownItemDividerFill: 'surfaceSecondary',
         pageCountDropdownItemFill: 'surfacePrimary',
         pageCountDropdownItemFillActive: 'accentPrimary',
-        pageCountDropdownItemFillActiveHover: 'accentActiveHover',
-        pageCountDropdownItemFillHover: 'surfaceSecondary',
+        pageCountDropdownItemFillActiveHover: 'accentPrimary',
+        pageCountDropdownItemFillHover: 'surfaceHoverSecondary',
         pageCountDropdownItemLabelAlign: 'center',
         pageCountDropdownItemLabelColor: 'surfaceTextPrimary',
         pageCountDropdownItemLabelColorActive: 'accentTextPrimary',
@@ -246,15 +227,7 @@ const paginationConfig = {
     },
 };
 function Pagination(props) {
-    const { appearance, className, dataTestId, dataTour, allItemsCount = 0, pageCountDesc = 'кол-во строк', pageCountDropdownItemDividerDirection, pageCountList = [10, 20, 50, 100], pageNumber = 0, perPageCount = 0, isDisabled, isSkeleton, isPageCount, isPageCountDropdownReversed = false, isPageLabelBuilder, onChangePage, onChangePerPageCount, 
-    /**
-     * @deprecated The method should not be used
-     */
-    onPageChange, 
-    /**
-     * @deprecated The method should not be used
-     */
-    onPerPageCountChange, } = props;
+    const { appearance, className, dataTestId, dataTour, allItemsCount = 0, pageCountDesc = 'кол-во строк', pageCountDropdownItemDividerDirection, pageCountList = [10, 20, 50, 100], pageNumber = 0, perPageCount = 0, isDisabled, isSkeleton, isPageCount, isPageCountDropdownReversed = false, isPageLabelBuilder, onChangePage, onChangePerPageCount, onPageChange, onPerPageCountChange, } = props;
     const _onChangePage = useMemo(() => {
         if (onPageChange) {
             console.warn('@itcase/ui Pagination warning: "onPageChange" is deprecated, use "onChangePage" instead.');
@@ -276,7 +249,6 @@ function Pagination(props) {
             ? pageCountList?.reverse()
             : pageCountList;
     }, [isPageCountDropdownReversed, pageCountList]);
-    // Toggle command menu
     const onClickCommandMenuButton = useCallback(() => {
         setIsOpenDropdown((state) => !state);
     }, []);
@@ -286,18 +258,14 @@ function Pagination(props) {
         setActiveDropdownItem(item);
         setIsOpenDropdown(false);
     }, [_onChangePerPageCount]);
-    // Calculate count of pages for all items
     const paginationPagesCount = useMemo(() => {
         if (allItemsCount && allItemsCount > 0) {
-            // Round up. "perPageCount" may be is a query params "limit"
             return ceil(allItemsCount / perPageCount);
         }
         return 0;
     }, [allItemsCount, perPageCount]);
-    // Index for pagination state
     const paginationPageIndex = useMemo(() => {
-        const intPageNumber = parseInt(pageNumber);
-        // For pagination need index of page, not number
+        const intPageNumber = pageNumber;
         if (!isNaN(intPageNumber) && intPageNumber > 1) {
             return intPageNumber - 1;
         }
@@ -308,17 +276,12 @@ function Pagination(props) {
     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;
     const { styles: paginationStyles } = useStyles(props);
     const minPageSize = Math.min(perPageCount, ...pageCountList);
-    // If there are fewer items than the minimum page size - pagination wont work.
     const isPaginationDisplayed = allItemsCount > minPageSize;
     return (isPaginationDisplayed && (jsxs("div", { className: clsx('pagination', sizeClass && `pagination_size_${sizeClass}`, isSkeleton && `pagination_skeleton`), "data-testid": dataTestId, "data-tour": dataTour, style: paginationStyles, children: [jsx(ReactPaginate, { activeClassName: clsx('pagination__item_state_active cursor_type_default', fillActiveClass && `fill fill_active_${fillActiveClass}`, fillActiveHoverClass &&
                     `fill fill_active_hover_${fillActiveHoverClass}`), activeLinkClassName: clsx('pagination__item-link_state_active', textColorActiveClass &&
                     `text text-color_active_${textColorActiveClass}`, textColorActiveHoverClass &&
                     `text text-color_active_hover_${textColorActiveHoverClass}`), breakClassName: "pagination__item pagination__item_break", breakLabel: "...", breakLinkClassName: "pagination__item-link", containerClassName: clsx(className, 'pagination__container', justifyContentClass &&
-                    `pagination_justify-content_${justifyContentClass}`), disabledClassName: "pagination__item_state_disabled cursor_type_default", disabledLinkClassName: "pagination__item_state_disabled", 
-                // pages settings
-                forcePage: paginationPageIndex, marginPagesDisplayed: marginPagesDisplayed, nextClassName: clsx('pagination__item pagination__item_next', sizeClass && `pagination__item_size_${sizeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), 
-                // next button
-                nextLabel: jsx(Icon, { fill: nextIconFill, fillSize: nextIconFillSize, iconFill: nextIconFillIcon, iconSize: nextIconSize, shape: "circular", SvgImage: nextIcon }), nextLinkClassName: "pagination__item-link", pageClassName: clsx('pagination__item', sizeClass && `pagination__item_size_${sizeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), pageCount: paginationPagesCount, pageLabelBuilder: isPageLabelBuilder &&
+                    `pagination_justify-content_${justifyContentClass}`), disabledClassName: "pagination__item_state_disabled cursor_type_default", disabledLinkClassName: "pagination__item_state_disabled", forcePage: paginationPageIndex, marginPagesDisplayed: marginPagesDisplayed, nextClassName: clsx('pagination__item pagination__item_next', sizeClass && `pagination__item_size_${sizeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), nextLabel: jsx(Icon, { fill: nextIconFill, fillSize: nextIconFillSize, iconFill: nextIconFillIcon, iconSize: nextIconSize, shape: "circular", SvgImage: nextIcon }), nextLinkClassName: "pagination__item-link", pageClassName: clsx('pagination__item', sizeClass && `pagination__item_size_${sizeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), pageCount: paginationPagesCount, pageLabelBuilder: isPageLabelBuilder &&
                     (() => (jsx(Icon, { fill: builderIconFill, fillSize: builderIconFillSize, iconFill: builderIconFillIcon, iconSize: builderIconSize, shape: "circular", SvgImage: builderIcon }))), pageLinkClassName: clsx('pagination__item-link', textSizeClass && `pagination__item-link_size_${textSizeClass}`, textColorClass && `text text-color_${textColorClass}`, textColorHoverClass && `text-color_hover_${textColorHoverClass}`), pageRangeDisplayed: pageRangeDisplayed ?? 8, previousClassName: clsx('pagination__item pagination__item_previous', sizeClass && `pagination__item_size_${sizeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), previousLabel: jsx(Icon, { fill: previousIconFill, fillSize: previousIconFillSize, iconFill: previousIconFillIcon, iconSize: previousIconSize, shape: "circular", SvgImage: previousIcon }), previousLinkClassName: "pagination__item-link", onPageChange: _onChangePage }), isPageCount && (jsxs("div", { className: clsx(className, 'pagination__count'), children: [jsx(Text, { className: "pagination__count-text", size: pageCountDescTextSize, textColor: pageCountDescTextColor, children: pageCountDesc }), jsxs("div", { className: clsx('pagination__input', 'cursor_type_pointer', fillInputClass && `fill_${fillInputClass}`, fillInputHoverClass && `fill_hover_${fillInputHoverClass}`, fillInputShapeClass && `shape_${fillInputShapeClass}`, fillInputShapeStrengthClass &&
                             `shape-strength_${fillInputShapeStrengthClass}`), onClick: onClickCommandMenuButton, children: [jsx(Text, { size: pageCountInputTextSize, textColor: pageCountInputTextColor, children: activeDropdownItem }), jsx(Icon, { fillSize: pageCountInputIconFillSize, iconFill: pageCountInputIconColor, imageSrc: pageCountInputIconSrc, SvgImage: pageCountInputIcon }), jsx(Dropdown, { className: "pagination__dropdown", alignment: pageCountDropdownAlignment, fill: pageCountDropdownFill, fillHover: pageCountDropdownFillHover, elevation: pageCountDropdownElevation, shape: pageCountDropdownShape, shapeStrength: pageCountDropdownShapeStrength, isOpen: isOpenDropdown, setIsOpen: setIsOpenDropdown, children: pageCountDropdownArray.map((item, index) => activeDropdownItem === item ? (jsx(DropdownItem, { width: pageCountDropdownItemWidth, size: pageCountDropdownItemSize, fill: pageCountDropdownItemFill, fillActive: pageCountDropdownItemFillActive, fillActiveHover: pageCountDropdownItemFillActiveHover, fillHover: pageCountDropdownItemFillHover, label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign, labelTextColor: pageCountDropdownItemLabelColor, labelTextColorActive: pageCountDropdownItemLabelColorActive, labelTextColorActiveHover: pageCountDropdownItemLabelColorActiveHover, labelTextColorHover: pageCountDropdownItemLabelColorHover, labelTextSize: pageCountDropdownItemLabelSize, labelTextWrap: pageCountDropdownItemLabelWrap, dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, dividerSize: pageCountDropdownItemDividerSize, showDivider: index < pageCountList.length - 1 &&
                                         pageCountDropdownItemShowDivider, isActive: true, onClick: (event) => handleDropdownItemClick(event, item) }, item)) : (jsx(DropdownItem, { width: pageCountDropdownItemWidth, size: pageCountDropdownItemSize, fill: pageCountDropdownItemFill, fillHover: pageCountDropdownItemFillHover, label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign, labelTextColor: pageCountDropdownItemLabelColor, labelTextColorHover: pageCountDropdownItemLabelColorHover, labelTextSize: pageCountDropdownItemLabelSize, labelTextWrap: pageCountDropdownItemLabelWrap, dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, dividerSize: pageCountDropdownItemDividerSize, showDivider: index < pageCountList.length - 1 &&

package/dist/components/Radio.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { T as Text } from '../Text_es_DaYcLe4H.js';
+import { T as Text } from '../Text_es_B85LGfjW.js';
 import 'react';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -23,7 +23,6 @@ const radioAppearanceDefault = {
     defaultPrimary: {
         fill: 'surfaceSecondary',
         fillCheckmark: 'surfaceQuaternary',
-        fillDisabled: 'errorPrimary',
         fillRadio: 'surfaceSecondary',
         fillRadioHover: 'surfaceTertiary',
         labelTextColor: 'surfaceTextPrimary',
@@ -41,13 +40,13 @@ const radioAppearanceDisabled = {
     disabledPrimary: {
         fill: 'surfaceDisabled',
         fillCheckmark: 'surfaceQuaternary',
-        labelTextColor: 'surfaceTextDisabled',
-        descTextColor: 'surfaceTextDisabled',
-        borderColor: 'surfaceBorderDisabled',
+        labelTextColor: 'surfaceTextPrimary',
+        descTextColor: 'surfaceTextPrimary',
+        borderColor: 'surfaceBorderPrimary',
         borderRadioColor: 'surfaceBorderQuaternary',
-        borderRadioColorHover: 'surfaceBorderQuaternary',
-        borderRadioColorActive: 'surfaceBorderQuaternary',
-        borderRadioColorActiveHover: 'surfaceBorderQuaternary',
+        borderRadioColorActive: 'surfaceBorderActiveQuaternary',
+        borderRadioColorActiveHover: 'surfaceBorderHoverQuaternary',
+        borderRadioColorHover: 'surfaceBorderHoverQuaternary',
     },
 };
 
@@ -59,9 +58,9 @@ const radioAppearanceError = {
         descTextColor: 'surfaceTextPrimary',
         borderColor: 'errorBorderQuaternary',
         borderRadioColor: 'surfaceBorderQuaternary',
-        borderRadioColorHover: 'surfaceBorderQuaternary',
-        borderRadioColorActive: 'surfaceBorderQuaternary',
-        borderRadioColorActiveHover: 'surfaceBorderQuaternary',
+        borderRadioColorActive: 'surfaceBorderActiveQuaternary',
+        borderRadioColorActiveHover: 'surfaceBorderHoverQuaternary',
+        borderRadioColorHover: 'surfaceBorderHoverQuaternary',
     },
 };
 
@@ -73,9 +72,9 @@ const radioAppearanceRequire = {
         descTextColor: 'surfaceTextPrimary',
         borderColor: 'warningBorderSecondary',
         borderRadioColor: 'surfaceBorderQuaternary',
-        borderRadioColorHover: 'surfaceBorderQuaternary',
         borderRadioColorActive: 'surfaceBorderQuaternary',
         borderRadioColorActiveHover: 'surfaceBorderQuaternary',
+        borderRadioColorHover: 'surfaceBorderQuaternary',
     },
 };
 
@@ -149,14 +148,14 @@ const radioAppearanceStyle = {
 const radioAppearanceSuccess = {
     successPrimary: {
         fill: 'successTertiary',
-        fillCheckmark: 'accentItemSecondary',
+        fillCheckmark: 'accentSecondary',
         labelTextColor: 'surfaceTextPrimary',
         descTextColor: 'surfaceTextPrimary',
         borderColor: 'accentBorderSecondary',
         borderRadioColor: 'surfaceBorderQuaternary',
-        borderRadioColorHover: 'surfaceBorderQuaternary',
-        borderRadioColorActive: 'surfaceBorderQuaternary',
-        borderRadioColorActiveHover: 'surfaceBorderQuaternary',
+        borderRadioColorActive: 'surfaceBorderActiveQuaternary',
+        borderRadioColorActiveHover: 'surfaceBorderHoverQuaternary',
+        borderRadioColorHover: 'surfaceBorderHoverQuaternary',
     },
 };
 
@@ -195,7 +194,7 @@ function Radio(props) {
             ? borderRadioColorHoverClass &&
                 `radio_border-color_hover_${borderRadioColorHoverClass}`
             : borderRadioColorActiveHoverClass &&
-                `radio_border-color_active_hover_${borderRadioColorActiveHoverClass}`), "data-testid": dataTestId, "data-tour": dataTour, htmlFor: id, children: [jsxs("div", { className: clsx('radio__item'), children: [jsx("input", { id: String(id), className: "radio__input", type: "radio", checked: checked, disabled: isDisabled && 'disabled', value: value, onChange: onChange }), jsx("div", { className: clsx('radio__state', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), children: "\u00A0" }), jsx("div", { className: clsx('radio__state-checkmark', checked && fillCheckmarkClass && `fill_${fillCheckmarkClass}`), children: "\u00A0" })] }), label && (jsx(Text, { className: "radio__label", size: labelTextSize, textColor: labelTextColor, textWeight: labelTextWeight, children: label })), desc && (jsx(Text, { className: "radio__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] }));
+                `radio_border-color_active_hover_${borderRadioColorActiveHoverClass}`), "data-testid": dataTestId, "data-tour": dataTour, htmlFor: id, children: [jsxs("div", { className: clsx('radio__item'), children: [jsx("input", { id: String(id), className: "radio__input", type: "radio", checked: checked, disabled: isDisabled, value: value, onChange: onChange }), jsx("div", { className: clsx('radio__state', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), children: "\u00A0" }), jsx("div", { className: clsx('radio__state-checkmark', checked && fillCheckmarkClass && `fill_${fillCheckmarkClass}`), children: "\u00A0" })] }), label && (jsx(Text, { className: "radio__label", size: labelTextSize, textColor: labelTextColor, textWeight: labelTextWeight, children: label })), desc && (jsx(Text, { className: "radio__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] }));
 }
 
 export { Radio, radioAppearance, radioConfig };

package/dist/components/RangeSlider.js

@@ -22,7 +22,6 @@ function RangeSlider(props) {
     const { className, dataTestId, dataTour, min, max, disabled, pushable, range, step, value, vertical, before, after, set, onChangeSlider, children, } = props;
     const propsGenerator = useDevicePropsGenerator(props);
     const { fillClass, fillHandleClass, fillHandleDraggingClass, fillHandleDraggingHoverClass, fillHandleHoverClass, fillRailClass, fillTrackClass, shapeClass, widthClass, } = propsGenerator;
-    // @ts-expect-error
     const { styles: rangeSliderStyles } = useStyles(props);
     return (jsxs("div", { className: clsx(className, 'range-slider', set && `range-slider_set_${set}`, fillClass && `fill_${fillClass}`, fillTrackClass && `range-slider-track-fill_${fillTrackClass}`, fillRailClass && `range-slider-rail-fill_${fillRailClass}`, fillHandleClass && `range-slider-handle-fill_${fillHandleClass}`, fillHandleHoverClass &&
             `range-slider-handle-fill-hover_${fillHandleHoverClass}`, fillHandleDraggingClass &&

package/dist/components/Response/img.js

@@ -21,17 +21,17 @@ var img$1 = "data:image/svg+xml,%3csvg width='180' height='180' viewBox='0 0 180
 var img = "data:image/svg+xml,%3csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='180' height='180' rx='90' fill='%23DE8806'/%3e%3cpath d='M90.5029 123.721C93.8166 123.721 96.5029 126.407 96.5029 129.721V134.749C96.5027 138.063 93.8165 140.749 90.5029 140.749C87.1894 140.749 84.5031 138.063 84.5029 134.749V129.721C84.5029 126.407 87.1892 123.721 90.5029 123.721ZM90.5029 39.251C93.8166 39.251 96.5029 41.9383 96.5029 45.252V104.582C96.5024 107.895 93.8163 110.582 90.5029 110.582C87.1895 110.582 84.5034 107.895 84.5029 104.582V45.252C84.5029 41.9382 87.1892 39.251 90.5029 39.251Z' fill='white'/%3e%3c/svg%3e";
 
 const responseIcon = {
-    Error: img$7,
-    Warning: img,
-    Success: img$2,
-    Danger: img$9,
     Confirm: img$a,
+    Danger: img$9,
     Empty: img$8,
+    Error: img$7,
     Fail: img$6,
     NothingFound: img$5,
     Refresh: img$4,
     Search: img$3,
+    Success: img$2,
     UnableLoadData: img$1,
+    Warning: img,
 };
 
 export { responseIcon };