@itcase/ui 1.4.13 → 1.5.1

package/dist/components/Pagination.js

@@ -1,16 +1,19 @@
+import { _ as __assign } from '../tslib.es6-Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useMemo, useState, useCallback } from 'react';
 import clsx from 'clsx';
 import ceil from 'lodash/ceil';
 import ReactPaginate from 'react-paginate';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { D as Dropdown, a as DropdownItem } from '../DropdownItem-B3E-_Cwp.js';
-import { I as Icon } from '../Icon-OJ_3E3eM.js';
-import { T as Text } from '../Text-C6NSmetx.js';
-import '../tslib.es6-5FtW-kfi.js';
+import { D as Dropdown, a as DropdownItem } from '../DropdownItem-C8CumsgX.js';
+import { I as Icon } from '../Icon-BOEOspTF.js';
+import { T as Text } from '../Text-CI2prtf6.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
+import '../context/Notifications.js';
+import 'uuid';
+import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
@@ -18,17 +21,17 @@ import '../utils/setViewportProperty.js';
 import '../hooks/useStyles/useStyles.js';
 import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
-import '../Divider-BQcBkzt1.js';
-import '../Link-DaKqf1pb.js';
+import '../Divider-DhXzYcNF.js';
 import 'react-inlinesvg';
-import '../Tooltip-5lQyt5-Y.js';
-import '../Title-Byi9vhDt.js';
+import '../Link-aBsZ1d0Q.js';
+import '../Tooltip-EOu0a93a.js';
+import '../Title-CaXw1KBQ.js';
 
 var paginationAppearance = {
     default: {
-        gap: '8',
         fill: 'surfacePrimary',
         fillHover: 'surfaceSecondary',
+        gap: '8',
         marginPagesDisplayed: 10,
         pageCountDesc: 'кол-во строк',
         pageCountDescTextColor: 'surfaceTextPrimary',
@@ -66,7 +69,7 @@ var paginationConfig = {
     },
 };
 function Pagination(props) {
-    var isPageCount = props.isPageCount, _a = props.isPageCountDropdownReversed, isPageCountDropdownReversed = _a === void 0 ? false : _a, _b = props.allItemsCount, allItemsCount = _b === void 0 ? 0 : _b, appearance = props.appearance, className = props.className, marginPagesDisplayed = props.marginPagesDisplayed, nextLabel = props.nextLabel, _c = props.pageCountArray, pageCountArray = _c === void 0 ? [10, 20, 50, 100] : _c, pageCountDesc = props.pageCountDesc, pageCountDescTextColor = props.pageCountDescTextColor, pageCountDescTextSize = props.pageCountDescTextSize, pageCountDropdownAlignment = props.pageCountDropdownAlignment, pageCountDropdownElevation = props.pageCountDropdownElevation, pageCountDropdownFill = props.pageCountDropdownFill, pageCountDropdownItemDividerDirection = props.pageCountDropdownItemDividerDirection, pageCountDropdownItemDividerFill = props.pageCountDropdownItemDividerFill, pageCountDropdownItemDividerSize = props.pageCountDropdownItemDividerSize, pageCountDropdownItemFill = props.pageCountDropdownItemFill, pageCountDropdownItemFillActive = props.pageCountDropdownItemFillActive, pageCountDropdownItemFillActiveHover = props.pageCountDropdownItemFillActiveHover, pageCountDropdownItemFillHover = props.pageCountDropdownItemFillHover, pageCountDropdownItemLabelAlign = props.pageCountDropdownItemLabelAlign, pageCountDropdownItemLabelColor = props.pageCountDropdownItemLabelColor, _d = props.pageCountDropdownItemLabelColorActive, pageCountDropdownItemLabelColorActive = _d === void 0 ? '' : _d, pageCountDropdownItemLabelSize = props.pageCountDropdownItemLabelSize, pageCountDropdownItemLabelWrap = props.pageCountDropdownItemLabelWrap, pageCountDropdownItemShowDivider = props.pageCountDropdownItemShowDivider, pageCountDropdownItemSize = props.pageCountDropdownItemSize, pageCountDropdownItemWidth = props.pageCountDropdownItemWidth, pageCountDropdownSet = props.pageCountDropdownSet, pageCountDropdownShape = props.pageCountDropdownShape, pageCountInputIcon = props.pageCountInputIcon, pageCountInputIconColor = props.pageCountInputIconColor, pageCountInputIconFillSize = props.pageCountInputIconFillSize, pageCountInputIconSrc = props.pageCountInputIconSrc, pageCountInputTextColor = props.pageCountInputTextColor, pageCountInputTextSize = props.pageCountInputTextSize, _e = props.pageNumber, pageNumber = _e === void 0 ? 0 : _e, pageRangeDisplayed = props.pageRangeDisplayed, _f = props.perPageCount, perPageCount = _f === void 0 ? 0 : _f, previousLabel = props.previousLabel, onChangePage = props.onChangePage, onChangePerPageCount = props.onChangePerPageCount, 
+    var className = props.className, appearance = props.appearance, _a = props.allItemsCount, allItemsCount = _a === void 0 ? 0 : _a, marginPagesDisplayed = props.marginPagesDisplayed, nextLabel = props.nextLabel, _b = props.pageCountArray, pageCountArray = _b === void 0 ? [10, 20, 50, 100] : _b, pageCountDesc = props.pageCountDesc, pageCountDescTextColor = props.pageCountDescTextColor, pageCountDescTextSize = props.pageCountDescTextSize, pageCountDropdownAlignment = props.pageCountDropdownAlignment, pageCountDropdownElevation = props.pageCountDropdownElevation, pageCountDropdownFill = props.pageCountDropdownFill, pageCountDropdownItemDividerDirection = props.pageCountDropdownItemDividerDirection, pageCountDropdownItemDividerFill = props.pageCountDropdownItemDividerFill, pageCountDropdownItemDividerSize = props.pageCountDropdownItemDividerSize, pageCountDropdownItemFill = props.pageCountDropdownItemFill, pageCountDropdownItemFillActive = props.pageCountDropdownItemFillActive, pageCountDropdownItemFillActiveHover = props.pageCountDropdownItemFillActiveHover, pageCountDropdownItemFillHover = props.pageCountDropdownItemFillHover, pageCountDropdownItemLabelAlign = props.pageCountDropdownItemLabelAlign, pageCountDropdownItemLabelColor = props.pageCountDropdownItemLabelColor, _c = props.pageCountDropdownItemLabelColorActive, pageCountDropdownItemLabelColorActive = _c === void 0 ? '' : _c, pageCountDropdownItemLabelSize = props.pageCountDropdownItemLabelSize, pageCountDropdownItemLabelWrap = props.pageCountDropdownItemLabelWrap, pageCountDropdownItemShowDivider = props.pageCountDropdownItemShowDivider, pageCountDropdownItemSize = props.pageCountDropdownItemSize, pageCountDropdownItemWidth = props.pageCountDropdownItemWidth, pageCountDropdownSet = props.pageCountDropdownSet, pageCountDropdownShape = props.pageCountDropdownShape, pageCountInputIcon = props.pageCountInputIcon, pageCountInputIconColor = props.pageCountInputIconColor, pageCountInputIconFillSize = props.pageCountInputIconFillSize, pageCountInputIconSrc = props.pageCountInputIconSrc, pageCountInputTextColor = props.pageCountInputTextColor, pageCountInputTextSize = props.pageCountInputTextSize, _d = props.pageNumber, pageNumber = _d === void 0 ? 0 : _d, pageRangeDisplayed = props.pageRangeDisplayed, _e = props.perPageCount, perPageCount = _e === void 0 ? 0 : _e, previousLabel = props.previousLabel, isPageCount = props.isPageCount, _f = props.isPageCountDropdownReversed, isPageCountDropdownReversed = _f === void 0 ? false : _f, onChangePage = props.onChangePage, onChangePerPageCount = props.onChangePerPageCount, 
     /**
      * @deprecated The method should not be used
      */
@@ -92,7 +95,9 @@ function Pagination(props) {
     var _g = useState(false), isOpenDropdown = _g[0], setIsOpenDropdown = _g[1];
     var _h = useState(perPageCount), activeDropdownItem = _h[0], setActiveDropdownItem = _h[1];
     var pageCountDropdownArray = useMemo(function () {
-        return isPageCountDropdownReversed ? pageCountArray === null || pageCountArray === void 0 ? void 0 : pageCountArray.reverse() : pageCountArray;
+        return isPageCountDropdownReversed
+            ? pageCountArray === null || pageCountArray === void 0 ? void 0 : pageCountArray.reverse()
+            : pageCountArray;
     }, [isPageCountDropdownReversed, pageCountArray]);
     // Toggle command menu
     var onClickCommandMenuButton = useCallback(function () {
@@ -121,13 +126,16 @@ function Pagination(props) {
         }
         return 0;
     }, [pageNumber]);
-    // @ts-expect-error
-    var appearanceConfig = paginationConfig.appearance && paginationConfig.appearance[appearance];
+    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultAppearance, appearance) {
+        var _a;
+        return (__assign(__assign({}, resultAppearance), (_a = paginationConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
+    }, {});
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, gapClass = propsGenerator.gapClass, justifyContentClass = propsGenerator.justifyContentClass;
-    return (jsxs("div", { className: "pagination", children: [jsx(ReactPaginate, { activeClassName: "pagination__item_state_active cursor_type_default", activeLinkClassName: "pagination__item-link_state_active", breakClassName: "pagination__item pagination__item_break", 
+    var justifyContentClass = propsGenerator.justifyContentClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, gapClass = propsGenerator.gapClass;
+    return (jsxs("div", { className: "pagination", children: [jsx(ReactPaginate, { disabledClassName: "pagination__item_state_disabled cursor_type_default", disabledLinkClassName: "pagination__item_state_disabled", activeClassName: "pagination__item_state_active cursor_type_default", activeLinkClassName: "pagination__item-link_state_active", breakClassName: "pagination__item pagination__item_break", 
                 // break element
-                breakLabel: "...", breakLinkClassName: "pagination__item-link", disabledClassName: "pagination__item_state_disabled cursor_type_default", disabledLinkClassName: "pagination__item_state_disabled", 
+                breakLabel: "...", breakLinkClassName: "pagination__item-link", containerClassName: clsx(className, 'pagination__container', justifyContentClass &&
+                    "pagination_justify-content_".concat(justifyContentClass)), 
                 // pages settings
                 forcePage: paginationPageIndex, marginPagesDisplayed: marginPagesDisplayed || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.marginPagesDisplayed), nextClassName: "pagination__item pagination__item_next", 
                 // next button
@@ -135,25 +143,38 @@ function Pagination(props) {
                 // page item
                 pageClassName: "pagination__item", pageCount: paginationPagesCount, pageLinkClassName: "pagination__item-link", pageRangeDisplayed: pageRangeDisplayed || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageRangeDisplayed), previousClassName: "pagination__item pagination__item_previous", 
                 // previous button
-                previousLabel: previousLabel, previousLinkClassName: "pagination__item-link", containerClassName: clsx(className, 'pagination__container', justifyContentClass && "pagination_justify-content_".concat(justifyContentClass)), onPageChange: _onChangePage }), isPageCount && (jsxs("div", { className: clsx(className, 'pagination__count', gapClass && "gap_".concat(gapClass)), children: [jsx(Text, { size: pageCountDescTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDescTextSize), textColor: pageCountDescTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDescTextColor), children: pageCountDesc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDesc) }), jsxs("div", { className: clsx('pagination__input', 'cursor_type_pointer', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass)), onClick: onClickCommandMenuButton, children: [jsx(Text, { size: pageCountInputTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountInputTextSize), textColor: pageCountInputTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountInputTextColor), children: activeDropdownItem }), jsx(Icon, { fillSize: pageCountInputIconFillSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountInputIconFillSize), iconFill: pageCountInputIconColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountInputIconColor), imageSrc: pageCountInputIconSrc, SvgImage: pageCountInputIcon }), jsx(Dropdown, { fill: pageCountDropdownFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownFill), alignment: pageCountDropdownAlignment || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownAlignment), elevation: pageCountDropdownElevation || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownElevation), shape: pageCountDropdownShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownShape), isOpen: isOpenDropdown, set: pageCountDropdownSet || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownSet), setIsOpen: setIsOpenDropdown, children: pageCountDropdownArray.map(function (item, index) {
-                                    return activeDropdownItem === item ? (jsx(DropdownItem, { width: pageCountDropdownItemWidth || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemWidth), labelTextColor: pageCountDropdownItemLabelColor ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelColor), labelTextSize: pageCountDropdownItemLabelSize ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelSize), fill: pageCountDropdownItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemFill), fillHover: pageCountDropdownItemFillHover ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemFillHover), dividerDirection: pageCountDropdownItemDividerDirection, label: item.toString(), labelTextWrap: pageCountDropdownItemLabelWrap, size: pageCountDropdownItemSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemSize), dividerFill: pageCountDropdownItemDividerFill ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemDividerFill), dividerSize: pageCountDropdownItemDividerSize ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemDividerSize), fillActive: pageCountDropdownItemFillActive ||
+                previousLabel: previousLabel, previousLinkClassName: "pagination__item-link", onPageChange: _onChangePage }), isPageCount && (jsxs("div", { className: clsx(className, 'pagination__count', gapClass && "gap_".concat(gapClass)), children: [jsx(Text, { size: pageCountDescTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDescTextSize), textColor: pageCountDescTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDescTextColor), children: pageCountDesc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDesc) }), jsxs("div", { className: clsx('pagination__input', 'cursor_type_pointer', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass)), onClick: onClickCommandMenuButton, children: [jsx(Text, { size: pageCountInputTextSize ||
+                                    (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountInputTextSize), textColor: pageCountInputTextColor ||
+                                    (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountInputTextColor), children: activeDropdownItem }), jsx(Icon, { fillSize: pageCountInputIconFillSize ||
+                                    (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountInputIconFillSize), iconFill: pageCountInputIconColor ||
+                                    (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountInputIconColor), imageSrc: pageCountInputIconSrc, SvgImage: pageCountInputIcon }), jsx(Dropdown, { alignment: pageCountDropdownAlignment ||
+                                    (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownAlignment), fill: pageCountDropdownFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownFill), elevation: pageCountDropdownElevation ||
+                                    (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownElevation), shape: pageCountDropdownShape ||
+                                    (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownShape), isOpen: isOpenDropdown, set: pageCountDropdownSet || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownSet), setIsOpen: setIsOpenDropdown, children: pageCountDropdownArray.map(function (item, index) {
+                                    return activeDropdownItem === item ? (jsx(DropdownItem, { width: pageCountDropdownItemWidth ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemWidth), size: pageCountDropdownItemSize ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemSize), fill: pageCountDropdownItemFill ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemFill), fillActive: pageCountDropdownItemFillActive ||
                                             (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemFillActive), fillActiveHover: pageCountDropdownItemFillActiveHover ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemFillActiveHover), labelTextAlign: pageCountDropdownItemLabelAlign ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelAlign), labelTextColorActive: pageCountDropdownItemLabelColorActive ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelColorActive), showDivider: index < pageCountArray.length - 1 &&
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemFillActiveHover), fillHover: pageCountDropdownItemFillHover ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemFillHover), label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelAlign), labelTextColor: pageCountDropdownItemLabelColor ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelColor), labelTextColorActive: pageCountDropdownItemLabelColorActive ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelColorActive), labelTextSize: pageCountDropdownItemLabelSize ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelSize), labelTextWrap: pageCountDropdownItemLabelWrap, dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemDividerFill), dividerSize: pageCountDropdownItemDividerSize ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemDividerSize), showDivider: index < pageCountArray.length - 1 &&
                                             (pageCountDropdownItemShowDivider ||
-                                                (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemShowDivider)), isActive: true, onClick: function (event) { return handleDropdownItemClick(event, item); } }, item)) : (jsx(DropdownItem, { width: pageCountDropdownItemWidth || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemWidth), labelTextColor: pageCountDropdownItemLabelColor ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelColor), labelTextSize: pageCountDropdownItemLabelSize ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelSize), fill: pageCountDropdownItemFill, fillHover: pageCountDropdownItemFillHover ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemFillHover), dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, label: item.toString(), labelTextWrap: pageCountDropdownItemLabelWrap, size: pageCountDropdownItemSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemSize), dividerSize: pageCountDropdownItemDividerSize ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemDividerSize), labelTextAlign: pageCountDropdownItemLabelAlign ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelAlign), labelTextColorActive: pageCountDropdownItemLabelColorActive ||
-                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelColorActive), showDivider: index < pageCountArray.length - 1 && pageCountDropdownItemShowDivider, isActive: false, onClick: function (event) { return handleDropdownItemClick(event, item); } }, item));
+                                                (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemShowDivider)), isActive: true, onClick: function (event) { return handleDropdownItemClick(event, item); } }, item)) : (jsx(DropdownItem, { width: pageCountDropdownItemWidth ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemWidth), size: pageCountDropdownItemSize ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemSize), fill: pageCountDropdownItemFill, fillHover: pageCountDropdownItemFillHover ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemFillHover), label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelAlign), labelTextColor: pageCountDropdownItemLabelColor ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelColor), labelTextColorActive: pageCountDropdownItemLabelColorActive ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelColorActive), labelTextSize: pageCountDropdownItemLabelSize ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemLabelSize), labelTextWrap: pageCountDropdownItemLabelWrap, dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, dividerSize: pageCountDropdownItemDividerSize ||
+                                            (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.pageCountDropdownItemDividerSize), showDivider: index < pageCountArray.length - 1 &&
+                                            pageCountDropdownItemShowDivider, isActive: false, onClick: function (event) { return handleDropdownItemClick(event, item); } }, item));
                                 }) })] })] }))] }));
 }
 

package/dist/components/Panel.js

@@ -1,14 +1,17 @@
+import { _ as __assign } from '../tslib.es6-Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React from 'react';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { G as Group } from '../Group-BICb8bYQ.js';
-import { T as Text } from '../Text-C6NSmetx.js';
-import '../tslib.es6-5FtW-kfi.js';
+import { G as Group } from '../Group-OkygpKiJ.js';
+import { T as Text } from '../Text-CI2prtf6.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
+import '../context/Notifications.js';
+import 'uuid';
+import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
@@ -23,14 +26,16 @@ var panelConfig = {
     },
 };
 var Panel = React.forwardRef(function Panel(props, ref) {
-    var children = props.children, appearance = props.appearance, className = props.className, dataTour = props.dataTour, desc = props.desc, descTextColor = props.descTextColor, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, horizontalScroll = props.horizontalScroll, htmlFor = props.htmlFor, set = props.set, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, verticalScroll = props.verticalScroll;
-    // @ts-expect-error
-    var appearanceConfig = panelConfig.appearance && panelConfig.appearance[appearance];
+    var className = props.className, appearance = props.appearance, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, desc = props.desc, descTextColor = props.descTextColor, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, dataTour = props.dataTour, horizontalScroll = props.horizontalScroll, htmlFor = props.htmlFor, verticalScroll = props.verticalScroll, set = props.set, children = props.children;
+    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultAppearance, appearance) {
+        var _a;
+        return (__assign(__assign({}, resultAppearance), (_a = panelConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
+    }, {});
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var alignContentClass = propsGenerator.alignContentClass, alignItemsClass = propsGenerator.alignItemsClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, directionClass = propsGenerator.directionClass, elevationClass = propsGenerator.elevationClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, heightClass = propsGenerator.heightClass, justifyContentClass = propsGenerator.justifyContentClass, positionClass = propsGenerator.positionClass, shapeClass = propsGenerator.shapeClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
+    var directionClass = propsGenerator.directionClass, justifyContentClass = propsGenerator.justifyContentClass, alignContentClass = propsGenerator.alignContentClass, alignItemsClass = propsGenerator.alignItemsClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, elevationClass = propsGenerator.elevationClass, heightClass = propsGenerator.heightClass, positionClass = propsGenerator.positionClass, shapeClass = propsGenerator.shapeClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
     // @ts-expect-error
     var _a = useStyles(props), panelStyles = _a.styles, panelWrapperStyles = _a.wrapper;
-    return (jsxs(Group, { className: clsx(className, 'panel', widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), set && "panel_set_".concat(set), wrapClass && "flex_wrap_".concat(wrapClass), shapeClass && "panel_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), alignContentClass && "panel_align-content_".concat(alignContentClass), alignItemsClass && "panel_align-items_".concat(alignItemsClass), elevationClass && "elevation_".concat(elevationClass), justifyContentClass && "panel_justify-content_".concat(justifyContentClass), positionClass && "position_".concat(positionClass), horizontalScroll && 'panel_type_scroll_horizontal', verticalScroll && 'panel_type_scroll_vertical'), ref: ref, "data-tour": dataTour, htmlFor: htmlFor, style: panelStyles, children: [title && (jsx("div", { className: "panel__header", children: jsx(Text, { className: "panel__title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title }) })), jsx("div", { className: clsx('panel__wrapper', directionClass && "panel_direction_".concat(directionClass)), style: panelWrapperStyles, children: children }), desc && (jsx("div", { className: "panel__footer", children: jsx(Text, { className: "panel__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }) }))] }));
+    return (jsxs(Group, { className: clsx(className, 'panel', widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), set && "panel_set_".concat(set), wrapClass && "flex_wrap_".concat(wrapClass), shapeClass && "panel_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), alignContentClass && "panel_align-content_".concat(alignContentClass), alignItemsClass && "panel_align-items_".concat(alignItemsClass), elevationClass && "elevation_".concat(elevationClass), justifyContentClass && "panel_justify-content_".concat(justifyContentClass), positionClass && "position_".concat(positionClass), horizontalScroll && 'panel_type_scroll_horizontal', verticalScroll && 'panel_type_scroll_vertical'), "data-tour": dataTour, htmlFor: htmlFor, ref: ref, style: panelStyles, children: [title && (jsx("div", { className: "panel__header", children: jsx(Text, { className: "panel__title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title }) })), jsx("div", { className: clsx('panel__wrapper', directionClass && "panel_direction_".concat(directionClass)), style: panelWrapperStyles, children: children }), desc && (jsx("div", { className: "panel__footer", children: jsx(Text, { className: "panel__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }) }))] }));
 });
 
 export { Panel, panelConfig };

package/dist/components/Radio.js

@@ -1,12 +1,15 @@
+import { _ as __assign } from '../tslib.es6-Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { T as Text } from '../Text-C6NSmetx.js';
-import '../tslib.es6-5FtW-kfi.js';
+import { T as Text } from '../Text-CI2prtf6.js';
 import 'react';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
+import '../context/Notifications.js';
+import 'uuid';
+import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
@@ -17,10 +20,10 @@ import '../hooks/useStyles/styleAttributes.js';
 
 var radioAppearance = {
     dev: {
-        descTextColor: 'surfaceTextPrimary',
-        descTextSize: 's',
         labelTextColor: 'surfaceTextPrimary',
         labelTextSize: 'm',
+        descTextColor: 'surfaceTextPrimary',
+        descTextSize: 's',
         stateBorderColor: 'surfaceBorderTertiary',
         stateBorderWidth: 1,
         stateCheckmarkFill: 'surfaceItemAccent',
@@ -36,19 +39,20 @@ var radioState = {
 
 var radioConfig = {
     appearance: radioAppearance,
+    state: radioState,
     setAppearance: function (appearanceConfig) {
         radioConfig.appearance = appearanceConfig;
     },
-    state: radioState,
-    // eslint-disable-next-line perfectionist/sort-objects
     setState: function (newComponent) {
         radioConfig.state = newComponent;
     },
 };
 function Radio(props) {
-    var id = props.id, appearance = props.appearance, checked = props.checked, className = props.className, desc = props.desc, descTextColor = props.descTextColor, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, disabled = props.disabled, label = props.label, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, _a = props.tag, Tag = _a === void 0 ? 'label' : _a, onChange = props.onChange;
-    // @ts-expect-error
-    var appearanceConfig = radioConfig.appearance && radioConfig.appearance[appearance];
+    var id = props.id, className = props.className, appearance = props.appearance, label = props.label, labelTextColor = props.labelTextColor, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, desc = props.desc, descTextColor = props.descTextColor, descTextSize = props.descTextSize, descTextWeight = props.descTextWeight, disabled = props.disabled, isDisabled = props.isDisabled, checked = props.checked, _a = props.tag, Tag = _a === void 0 ? 'label' : _a, onChange = props.onChange;
+    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultAppearance, appearance) {
+        var _a;
+        return (__assign(__assign({}, resultAppearance), (_a = radioConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
+    }, {});
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     var fillClass = propsGenerator.fillClass, _b = propsGenerator.shapeClass, shapeClass = _b === void 0 ? 'circular' : _b, stateBorderColorClass = propsGenerator.stateBorderColorClass, stateBorderWidthClass = propsGenerator.stateBorderWidthClass, stateCheckmarkFillClass = propsGenerator.stateCheckmarkFillClass, stateShapeClass = propsGenerator.stateShapeClass;
     var stateFillClass = propsGenerator.getClassName(checked ? 'stateFillChecked' : 'stateFill', {
@@ -58,10 +62,10 @@ function Radio(props) {
     var stateBorderColorHoverClass = propsGenerator.getClassName(checked ? 'stateBorderColorHoverChecked' : 'stateBorderColorHover', { prefix: 'border-color_hover_' });
     var stateBorderColorDisabledClass = propsGenerator.getClassName(checked ? 'stateBorderColorDisabledChecked' : 'stateBorderColorDisabled', { prefix: 'border-color_' });
     return (jsxs(Tag, { className: clsx(className, 'radio', fillClass && "fill_".concat(fillClass), shapeClass && "radio_shape_".concat(shapeClass)), htmlFor: id, children: [jsxs("div", { className: clsx('radio__item', stateCheckmarkFillClass &&
-                    "radio_checkmark_fill_".concat(stateCheckmarkFillClass)), children: [jsx("input", { id: id, className: "radio__input", type: "radio", disabled: disabled, checked: checked, onChange: onChange }), jsx("div", { className: clsx('radio__state', disabled ? stateFillDisabledClass : stateFillClass, disabled
+                    "radio_checkmark_fill_".concat(stateCheckmarkFillClass)), children: [jsx("input", { id: id, className: "radio__input", type: "radio", disabled: isDisabled && 'disabled', checked: checked, onChange: onChange }), jsx("div", { className: clsx('radio__state', disabled ? stateFillDisabledClass : stateFillClass, disabled
                             ? stateBorderColorDisabledClass
                             : stateBorderColorClass &&
-                                "border-color_".concat(stateBorderColorClass), stateBorderColorHoverClass, stateShapeClass && "radio__state_shape_".concat(stateShapeClass), stateBorderWidthClass && "border-width_".concat(stateBorderWidthClass)), children: "\u00A0" }), jsx("div", { className: "radio__state-checkmark", children: "\u00A0" })] }), label && (jsx(Text, { className: "radio__label", textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textWeight: labelTextWeight, size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), children: label })), desc && (jsx(Text, { className: "radio__desc", textColor: descTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextColor), textWeight: descTextWeight, size: descTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextSize), children: desc }))] }));
+                                "border-color_".concat(stateBorderColorClass), stateBorderColorHoverClass, stateShapeClass && "radio__state_shape_".concat(stateShapeClass), stateBorderWidthClass && "border-width_".concat(stateBorderWidthClass)), children: "\u00A0" }), jsx("div", { className: "radio__state-checkmark", 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, radioState };

package/dist/components/RangeSlider.js

@@ -3,11 +3,14 @@ import clsx from 'clsx';
 import Slider from 'rc-slider';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import '../tslib.es6-5FtW-kfi.js';
+import '../tslib.es6-Bwu1Cn-t.js';
 import 'react';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
+import '../context/Notifications.js';
+import 'uuid';
+import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
@@ -16,13 +19,15 @@ import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
 
 function RangeSlider(props) {
-    var children = props.children, after = props.after, before = props.before, className = props.className, disabled = props.disabled, max = props.max, min = props.min, pushable = props.pushable, range = props.range, set = props.set, value = props.value, vertical = props.vertical, onChangeSlider = props.onChangeSlider;
+    var className = props.className, min = props.min, max = props.max, disabled = props.disabled, pushable = props.pushable, range = props.range, value = props.value, vertical = props.vertical, before = props.before, after = props.after, set = props.set, onChangeSlider = props.onChangeSlider, children = props.children;
     var propsGenerator = useDevicePropsGenerator(props);
     var fillClass = propsGenerator.fillClass, fillHandleClass = propsGenerator.fillHandleClass, fillHandleDraggingClass = propsGenerator.fillHandleDraggingClass, fillHandleDraggingHoverClass = propsGenerator.fillHandleDraggingHoverClass, fillHandleHoverClass = propsGenerator.fillHandleHoverClass, fillRailClass = propsGenerator.fillRailClass, fillTrackClass = propsGenerator.fillTrackClass, shapeClass = propsGenerator.shapeClass, widthClass = propsGenerator.widthClass;
     // @ts-expect-error
     var rangeSliderStyles = useStyles(props).styles;
-    return (jsxs("div", { className: clsx(className, 'range-slider', set && "range-slider_set_".concat(set), fillClass && "fill_".concat(fillClass), fillTrackClass && "range-slider-track-fill_".concat(fillTrackClass), fillRailClass && "range-slider-rail-fill_".concat(fillRailClass), fillHandleClass && "range-slider-handle-fill_".concat(fillHandleClass), fillHandleHoverClass && "range-slider-handle-fill-hover_".concat(fillHandleHoverClass), fillHandleDraggingClass && "range-slider-handle-dragging-fill_".concat(fillHandleDraggingClass), fillHandleDraggingHoverClass &&
-            "range-slider-handle-dragging-fill-hover_".concat(fillHandleDraggingHoverClass), shapeClass && "range-slider_shape_".concat(shapeClass), widthClass && "width_".concat(widthClass)), style: rangeSliderStyles, children: [before && jsx("div", { className: "range-slider__before", children: before }), jsx(Slider, { className: "range-slider__wrapper", disabled: disabled, max: max, min: min, pushable: pushable, range: range, value: value, vertical: vertical, onChange: onChangeSlider }), children, after && jsx("div", { className: "range-slider__after", children: after })] }));
+    return (jsxs("div", { className: clsx(className, 'range-slider', set && "range-slider_set_".concat(set), fillClass && "fill_".concat(fillClass), fillTrackClass && "range-slider-track-fill_".concat(fillTrackClass), fillRailClass && "range-slider-rail-fill_".concat(fillRailClass), fillHandleClass && "range-slider-handle-fill_".concat(fillHandleClass), fillHandleHoverClass &&
+            "range-slider-handle-fill-hover_".concat(fillHandleHoverClass), fillHandleDraggingClass &&
+            "range-slider-handle-dragging-fill_".concat(fillHandleDraggingClass), fillHandleDraggingHoverClass &&
+            "range-slider-handle-dragging-fill-hover_".concat(fillHandleDraggingHoverClass), shapeClass && "range-slider_shape_".concat(shapeClass), widthClass && "width_".concat(widthClass)), style: rangeSliderStyles, children: [before && jsx("div", { className: "range-slider__before", children: before }), jsx(Slider, { className: "range-slider__wrapper", min: min, max: max, disabled: disabled, pushable: pushable, range: range, value: value, vertical: vertical, onChange: onChangeSlider }), children, after && jsx("div", { className: "range-slider__after", children: after })] }));
 }
 
 export { RangeSlider };

package/dist/components/Response.js

@@ -1,27 +1,30 @@
-import { _ as __assign } from '../tslib.es6-5FtW-kfi.js';
+import { _ as __assign } from '../tslib.es6-Bwu1Cn-t.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import clsx from 'clsx';
 import SVG from 'react-inlinesvg';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import { B as Button } from '../Button-xYLCmT3D.js';
-import { G as Group } from '../Group-BICb8bYQ.js';
-import { T as Text } from '../Text-C6NSmetx.js';
+import { B as Button } from '../Button-DCtRrkgc.js';
+import { G as Group } from '../Group-OkygpKiJ.js';
+import { T as Text } from '../Text-CI2prtf6.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
+import '../context/Notifications.js';
+import 'uuid';
+import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
 import '../utils/setViewportProperty.js';
 import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
-import '../Icon-OJ_3E3eM.js';
-import '../Link-DaKqf1pb.js';
-import '../Tooltip-5lQyt5-Y.js';
-import '../Title-Byi9vhDt.js';
-import '../Loader-VK3q7PBN.js';
+import '../Icon-BOEOspTF.js';
+import '../Link-aBsZ1d0Q.js';
+import '../Tooltip-EOu0a93a.js';
+import '../Title-CaXw1KBQ.js';
+import '../Loader-CRN4MAbm.js';
 
 var img$6 = "data:image/svg+xml,%3csvg width='180' height='180' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='90' cy='90' r='90' fill='%23D9D9D9'/%3e%3cpath d='M93.2275 101.842H84.0659C83.8263 99.1898 83.976 96.839 84.515 94.7895C85.1138 92.74 86.2216 90.8111 87.8383 89.0027C89.515 87.1341 91.7904 85.2051 94.6647 83.2159C96.5808 81.8898 97.9581 80.5637 98.7964 79.2375C99.6946 77.9114 100.144 76.4345 100.144 74.807C100.144 72.2753 99.2156 70.1957 97.3593 68.5682C95.503 66.9406 93.0778 66.1269 90.0838 66.1269C87.3892 66.1269 84.7246 66.9105 82.0898 68.4777C79.4551 69.9847 77.0299 72.3959 74.8144 75.7112L67 67.9352C70.0539 64.0774 73.5868 61.1237 77.5988 59.0742C81.6707 57.0247 85.9521 56 90.4431 56C94.5749 56 98.2575 56.8439 101.491 58.5317C104.725 60.1592 107.269 62.3896 109.126 65.2227C111.042 67.9955 112 71.1601 112 74.7166C112 78.0922 111.042 81.1062 109.126 83.7584C107.269 86.4107 104.455 88.8821 100.683 91.1727C97.7485 92.8605 95.7725 94.4881 94.7545 96.0553C93.7365 97.6226 93.2275 99.5515 93.2275 101.842ZM96.1916 115.767C96.1916 117.756 95.4731 119.474 94.0359 120.92C92.5988 122.307 90.8323 123 88.7365 123C86.6407 123 84.8743 122.307 83.4371 120.92C82 119.474 81.2814 117.756 81.2814 115.767C81.2814 113.717 82 111.999 83.4371 110.613C84.8743 109.166 86.6407 108.443 88.7365 108.443C90.8323 108.443 92.5988 109.166 94.0359 110.613C95.4731 111.999 96.1916 113.717 96.1916 115.767Z' fill='%23747474'/%3e%3c/svg%3e";
 
@@ -225,13 +228,13 @@ var responseConfig = {
     },
 };
 function Response(props) {
-    var className = props.className, appearance = props.appearance, width = props.width, height = props.height, title = props.title, desc = props.desc, primaryButton = props.primaryButton, secondaryButton = props.secondaryButton, before = props.before, after = props.after, onClickSecondaryButton = props.onClickSecondaryButton;
+    var className = props.className, appearance = props.appearance, width = props.width, height = props.height, title = props.title, desc = props.desc, primaryButton = props.primaryButton, secondaryButton = props.secondaryButton, onClickSecondaryButton = props.onClickSecondaryButton, before = props.before, after = props.after;
     var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultAppearance, appearance) {
         var _a;
         return (__assign(__assign({}, resultAppearance), (_a = responseConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance]));
     }, {});
     var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextWeight = propsGenerator.titleTextWeight, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize, descTextWeight = propsGenerator.descTextWeight, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, textAlignClass = propsGenerator.textAlignClass, primaryButtonAfter = propsGenerator.primaryButtonAfter, primaryButtonAppearance = propsGenerator.primaryButtonAppearance, primaryButtonBefore = propsGenerator.primaryButtonBefore, primaryButtonFill = propsGenerator.primaryButtonFill, primaryButtonFillHover = propsGenerator.primaryButtonFillHover, primaryButtonLabel = propsGenerator.primaryButtonLabel, primaryButtonLabelTextColor = propsGenerator.primaryButtonLabelTextColor, primaryButtonLabelTextSize = propsGenerator.primaryButtonLabelTextSize, primaryButtonShape = propsGenerator.primaryButtonShape, primaryButtonSize = propsGenerator.primaryButtonSize, primaryButtonWidth = propsGenerator.primaryButtonWidth, secondaryButtonAfter = propsGenerator.secondaryButtonAfter, secondaryButtonAppearance = propsGenerator.secondaryButtonAppearance, secondaryButtonBefore = propsGenerator.secondaryButtonBefore, secondaryButtonFill = propsGenerator.secondaryButtonFill, secondaryButtonFillHover = propsGenerator.secondaryButtonFillHover, secondaryButtonLabel = propsGenerator.secondaryButtonLabel, secondaryButtonLabelTextColor = propsGenerator.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = propsGenerator.secondaryButtonLabelTextSize, secondaryButtonShape = propsGenerator.secondaryButtonShape, secondaryButtonSize = propsGenerator.secondaryButtonSize, secondaryButtonWidth = propsGenerator.secondaryButtonWidth, dataTestId = propsGenerator.dataTestId, dataTour = propsGenerator.dataTour, imageSrc = propsGenerator.imageSrc, shapeClass = propsGenerator.shapeClass, svgFillClass = propsGenerator.svgFillClass, SvgImage = propsGenerator.SvgImage, svgPathFillClass = propsGenerator.svgPathFillClass, svgSrc = propsGenerator.svgSrc, onClickPrimaryButton = propsGenerator.onClickPrimaryButton;
+    var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextWeight = propsGenerator.titleTextWeight, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize, descTextWeight = propsGenerator.descTextWeight, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, textAlignClass = propsGenerator.textAlignClass, primaryButtonAfter = propsGenerator.primaryButtonAfter, primaryButtonAppearance = propsGenerator.primaryButtonAppearance, primaryButtonBefore = propsGenerator.primaryButtonBefore, primaryButtonFill = propsGenerator.primaryButtonFill, primaryButtonFillHover = propsGenerator.primaryButtonFillHover, primaryButtonLabel = propsGenerator.primaryButtonLabel, primaryButtonLabelTextColor = propsGenerator.primaryButtonLabelTextColor, primaryButtonLabelTextSize = propsGenerator.primaryButtonLabelTextSize, primaryButtonShape = propsGenerator.primaryButtonShape, primaryButtonSize = propsGenerator.primaryButtonSize, primaryButtonWidth = propsGenerator.primaryButtonWidth, secondaryButtonAfter = propsGenerator.secondaryButtonAfter, secondaryButtonAppearance = propsGenerator.secondaryButtonAppearance, secondaryButtonBefore = propsGenerator.secondaryButtonBefore, secondaryButtonFill = propsGenerator.secondaryButtonFill, secondaryButtonFillHover = propsGenerator.secondaryButtonFillHover, secondaryButtonLabel = propsGenerator.secondaryButtonLabel, secondaryButtonLabelTextColor = propsGenerator.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = propsGenerator.secondaryButtonLabelTextSize, secondaryButtonShape = propsGenerator.secondaryButtonShape, secondaryButtonSize = propsGenerator.secondaryButtonSize, secondaryButtonWidth = propsGenerator.secondaryButtonWidth, onClickPrimaryButton = propsGenerator.onClickPrimaryButton, dataTestId = propsGenerator.dataTestId, dataTour = propsGenerator.dataTour, imageSrc = propsGenerator.imageSrc, shapeClass = propsGenerator.shapeClass, svgFillClass = propsGenerator.svgFillClass, SvgImage = propsGenerator.SvgImage, svgPathFillClass = propsGenerator.svgPathFillClass, svgSrc = propsGenerator.svgSrc;
     var ImageComponent = useMemo(function () {
         var src = imageSrc || svgSrc;
         var Image = SvgImage;
@@ -249,7 +252,7 @@ function Response(props) {
         if (src) {
             if (src.endsWith('.svg') || src.startsWith('data:image/svg')) {
                 if (svgFillClass) {
-                    return jsx(SVG, { preProcessor: removeFillStroke, src: src });
+                    return jsx(SVG, { src: src, preProcessor: removeFillStroke });
                 }
                 else {
                     return jsx(SVG, { src: src });
@@ -258,7 +261,7 @@ function Response(props) {
             return jsx("img", { src: src });
         }
         return null;
-    }, [imageSrc, appearanceConfig, SvgImage, width, height, svgFillClass]);
+    }, [imageSrc, svgSrc, SvgImage, width, height, svgFillClass]);
     // @ts-expect-error
     var _a = useStyles(props), responseStyles = _a.styles, wrapperStyles = _a.wrapper;
     return (jsxs("div", { className: clsx(className, 'response', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "response_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass)), "data-testid": dataTestId, "data-tour": dataTour, style: responseStyles, children: [before, jsxs("div", { className: "response__wrapper", style: wrapperStyles, children: [jsx("div", { className: clsx('response__image', svgFillClass && "svg_fill_".concat(svgFillClass), svgPathFillClass && "svg_path_fill_".concat(svgPathFillClass)), children: ImageComponent }), jsxs(Group, { className: clsx('response__desc', textAlignClass && "text-align_".concat(textAlignClass)), width: "fill", children: [title && (jsx(Text, { className: "response__title", size: titleTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextSize) || 'xxl', textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight) || '400', children: title })), desc && (jsx(Text, { className: "response__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] })] }), (primaryButtonLabel ||

package/dist/components/SVGContent.js

@@ -3,11 +3,14 @@ import clsx from 'clsx';
 import SVG from 'react-inlinesvg';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import '../tslib.es6-5FtW-kfi.js';
+import '../tslib.es6-Bwu1Cn-t.js';
 import 'react';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
+import '../context/Notifications.js';
+import 'uuid';
+import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';

package/dist/components/ScrollOnDrag.js

@@ -1,4 +1,4 @@
-import { _ as __assign } from '../tslib.es6-5FtW-kfi.js';
+import { _ as __assign } from '../tslib.es6-Bwu1Cn-t.js';
 import { jsx } from 'react/jsx-runtime';
 import { useRef } from 'react';
 import clsx from 'clsx';
@@ -8,6 +8,9 @@ import { useStyles } from '../hooks/useStyles/useStyles.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
+import '../context/Notifications.js';
+import 'uuid';
+import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
@@ -16,7 +19,7 @@ import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
 
 function ScrollOnDrag(props) {
-    var children = props.children, className = props.className, scrollContainerProps = props.scrollContainerProps;
+    var className = props.className, scrollContainerProps = props.scrollContainerProps, children = props.children;
     var ref = useRef(null);
     var propsGenerator = useDevicePropsGenerator(props);
     var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, elevationClass = propsGenerator.elevationClass, heightClass = propsGenerator.heightClass, _a = propsGenerator.widthClass, widthClass = _a === void 0 ? 'fill' : _a;

package/dist/components/ScrollToView.js

@@ -3,11 +3,14 @@ import clsx from 'clsx';
 import { ScrollLink } from 'react-scroll';
 import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
-import '../tslib.es6-5FtW-kfi.js';
+import '../tslib.es6-Bwu1Cn-t.js';
 import 'react';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import 'lodash/upperFirst';
+import '../context/Notifications.js';
+import 'uuid';
+import '@itcase/common';
 import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
@@ -16,11 +19,13 @@ import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
 
 var ScrollToView = ScrollLink(function ScrollToView(props) {
-    var id = props.id, className = props.className, children = props.children, _a = props.tag, Tag = _a === void 0 ? 'div' : _a;
+    var id = props.id, className = props.className, _a = props.tag, Tag = _a === void 0 ? 'div' : _a, children = props.children;
     var propsGenerator = useDevicePropsGenerator(props);
     var directionClass = propsGenerator.directionClass, justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, alignItemsClass = propsGenerator.alignItemsClass, alignSelfClass = propsGenerator.alignSelfClass, textColorActiveClass = propsGenerator.textColorActiveClass, textColorClass = propsGenerator.textColorClass, textColorHoverClass = propsGenerator.textColorHoverClass, heightClass = propsGenerator.heightClass, widthClass = propsGenerator.widthClass;
     var scrollToViewStyles = useStyles(props).styles;
-    return (jsx(Tag, { id: id, className: clsx(className, 'scroll-to-view', alignItemsClass && "align-items_".concat(alignItemsClass), widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), textColorClass && "scroll-to-view_text-color_".concat(textColorClass), textColorActiveClass && "scroll-to-view_text-color_active_".concat(textColorActiveClass), textColorHoverClass && "scroll-to-view_text-color_hover_".concat(textColorHoverClass), justifyContentClass && "justify-content_".concat(justifyContentClass), directionClass && "direction_".concat(directionClass), alignSelfClass && "align-self_".concat(alignSelfClass)), style: Object.assign({}, scrollToViewStyles, props.style), onClick: props.onClick, children: children }));
+    return (jsx(Tag, { id: id, className: clsx(className, 'scroll-to-view', alignItemsClass && "align-items_".concat(alignItemsClass), widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), textColorClass && "scroll-to-view_text-color_".concat(textColorClass), textColorActiveClass &&
+            "scroll-to-view_text-color_active_".concat(textColorActiveClass), textColorHoverClass &&
+            "scroll-to-view_text-color_hover_".concat(textColorHoverClass), justifyContentClass && "justify-content_".concat(justifyContentClass), directionClass && "direction_".concat(directionClass), alignSelfClass && "align-self_".concat(alignSelfClass)), style: Object.assign({}, scrollToViewStyles, props.style), onClick: props.onClick, children: children }));
 });
 
 export { ScrollToView };

package/dist/components/Scrollbar.js

@@ -1,4 +1,4 @@
-export { S as Scrollbar } from '../Scrollbar-Bo7z7ELm.js';
+export { S as Scrollbar } from '../Scrollbar-CThJeCLF.js';
 import 'react/jsx-runtime';
 import 'clsx';
 import 'react-scrollbars-custom';