@itcase/ui 1.3.11 → 1.3.13

package/dist/components/Modal.js

@@ -5,7 +5,7 @@ import ReactDOM from 'react-dom';
 import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
 import { useStyles } from '../hooks/useStyles.js';
 import { O as Overlay } from '../Overlay-DcGWchjp.js';
-import { L as Loader } from '../Loader-K_DJmah6.js';
+import { L as Loader } from '../Loader-Cm98w6lJ.js';
 import '../tslib.es6-5FtW-kfi.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -15,7 +15,7 @@ import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../Text-JayJa3hj.js';
+import '../Text-D9sEeRE4.js';
 
 var modalAppearance = {
     dev: {},
@@ -29,7 +29,7 @@ var modalConfig = {
 };
 var getOrCreateModalElement = function (modalQuerySelector, className) {
     var _a;
-    if (className === void 0) { className = ''; }
+    if (className === undefined) { className = ''; }
     // prettier-ignore
     var classList = className && typeof className === 'string'
         ? className.split(' ').filter(Boolean)
@@ -49,7 +49,7 @@ var getOrCreateModalElement = function (modalQuerySelector, className) {
 };
 // Modal component that is an abstraction around the portal API.
 var Modal = React.forwardRef(function Modal(props, ref) {
-    var id = props.id, children = props.children, _a = props.isCloseOnBlur, isCloseOnBlur = _a === void 0 ? true : _a, _b = props.isOpen, initialIsOpen = _b === void 0 ? false : _b, _c = props.isOverlay, isOverlay = _c === void 0 ? true : _c, _d = props.isScrollOnOpen, isScrollOnOpen = _d === void 0 ? true : _d, _e = props.isSetFocusOnOpen, isSetFocusOnOpen = _e === void 0 ? true : _e, appearance = props.appearance, className = props.className, closeButton = props.closeButton, contentClassName = props.contentClassName, _f = props.modalQuerySelector, modalQuerySelector = _f === void 0 ? '#modal-global' : _f, overlayClassName = props.overlayClassName, overlayFill = props.overlayFill, overlayFillGradient = props.overlayFillGradient, overlayOpacity = props.overlayOpacity, onClickOverlay = props.onClickOverlay, onCloseModal = props.onCloseModal, onOpenModal = props.onOpenModal;
+    var id = props.id, children = props.children, _a = props.isCloseOnBlur, isCloseOnBlur = _a === undefined ? true : _a, _b = props.isOpen, initialIsOpen = _b === undefined ? false : _b, _c = props.isOverlay, isOverlay = _c === undefined ? true : _c, _d = props.isScrollOnOpen, isScrollOnOpen = _d === undefined ? true : _d, _e = props.isSetFocusOnOpen, isSetFocusOnOpen = _e === undefined ? true : _e, appearance = props.appearance, className = props.className, closeButton = props.closeButton, contentClassName = props.contentClassName, _f = props.modalQuerySelector, modalQuerySelector = _f === undefined ? '#modal-global' : _f, overlayClassName = props.overlayClassName, overlayFill = props.overlayFill, overlayFillGradient = props.overlayFillGradient, overlayOpacity = props.overlayOpacity, onClickOverlay = props.onClickOverlay, onCloseModal = props.onCloseModal, onOpenModal = props.onOpenModal;
     // Query DOM element
     var _g = useState(null), modalElement = _g[0], setModalElement = _g[1];
     var _h = useState(initialIsOpen), isOpen = _h[0], setIsOpen = _h[1];
@@ -148,7 +148,7 @@ var Modal = React.forwardRef(function Modal(props, ref) {
         // Any valid React child: JSX, strings, arrays, etc.
         isOpen ? (jsxs(React.Fragment, { children: [jsxs("div", { className: clsx('modal-content', contentClassName, fillClass && "fill_".concat(fillClass), shapeClass && "modal-shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), elevationClass && "elevation_".concat(elevationClass)), ref: modalContentRef, id: id, style: modalStyles, tabIndex: 0, onBlur: isCloseOnBlur ? closeModal : undefined, children: [closeButton && (jsx("div", { className: "modal-content__close", onClick: closeModal, children: closeButton })), jsx("div", { className: "modal-content__wrapper", children: children })] }), jsx(Overlay, { className: clsx('modal__overlay', 'overlay_type_modal', overlayClassName), 
                     // ref={modalOverlayRef}
-                    fill: overlayFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.overlayFill), opacity: overlayOpacity || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.overlayOpacity), fillGradient: overlayFillGradient || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.overlayFillGradient), isOverlay: isOverlay || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.isOverlay), onClick: onClickOverlay })] })) : null, 
+                    fill: overlayFill || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.overlayFill), opacity: overlayOpacity || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.overlayOpacity), fillGradient: overlayFillGradient || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.overlayFillGradient), isOverlay: isOverlay || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.isOverlay), onClick: onClickOverlay })] })) : null, 
         // A DOM element
         modalElement));
 });

package/dist/components/Notification.js

@@ -2,8 +2,8 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { T as Text } from '../Text-JayJa3hj.js';
-import { T as Title } from '../Title-CHgrIarR.js';
+import { T as Text } from '../Text-D9sEeRE4.js';
+import { T as Title } from '../Title-Cl95USIn.js';
 import { useNotifications, useNotificationsAPI } from '../context/Notifications.js';
 import '../tslib.es6-5FtW-kfi.js';
 import 'react';
@@ -57,14 +57,14 @@ var notificationItemConfig = {
     },
 };
 function NotificationItem(props) {
-    var id = props.id, after = props.after, appearance = props.appearance, before = props.before, className = props.className, closeButton = props.closeButton, dataTour = props.dataTour, set = props.set, size = props.size, status = props.status, text = props.text, textColor = props.textColor, _a = props.textSize, textSize = _a === void 0 ? 's' : _a, title = props.title, titleTextColor = props.titleTextColor, _b = props.titleTextSize, titleTextSize = _b === void 0 ? 'h5' : _b, onClickClose = props.onClickClose;
+    var id = props.id, after = props.after, appearance = props.appearance, before = props.before, className = props.className, closeButton = props.closeButton, dataTour = props.dataTour, set = props.set, size = props.size, status = props.status, text = props.text, textColor = props.textColor, _a = props.textSize, textSize = _a === undefined ? 's' : _a, title = props.title, titleTextColor = props.titleTextColor, _b = props.titleTextSize, titleTextSize = _b === undefined ? 'h5' : _b, onClickClose = props.onClickClose;
     // @ts-expect-error
     var appearanceConfig = notificationItemConfig.appearance && notificationItemConfig.appearance[appearance];
     var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
     var fillClass = classGenerator.fillClass, widthClass = classGenerator.widthClass;
     // @ts-expect-error
     var notificationStyles = useStyles(props).styles;
-    return (jsxs("div", { className: clsx('notification__item', status && "notification__item_status_".concat(status), set && "notification__item_set_".concat(set), size && "notification__item_set_".concat(size), closeButton && 'notification__item_type_close-button', widthClass && "width_".concat(widthClass), fillClass && "fill_".concat(fillClass)), "data-tour": dataTour, style: notificationStyles, children: [before, jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsx(Title, { className: "notification__item-title", size: titleTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextSize), textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), children: title })), text && (jsx(Text, { className: "notification__item-text", size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), closeButton && (jsx("div", { className: clsx('notification__item-close', onClickClose && 'cursor_type_pointer'), onClick: function () { return onClickClose && onClickClose(id); }, children: closeButton }))] }), after] }));
+    return (jsxs("div", { className: clsx('notification__item', status && "notification__item_status_".concat(status), set && "notification__item_set_".concat(set), size && "notification__item_set_".concat(size), closeButton && 'notification__item_type_close-button', widthClass && "width_".concat(widthClass), fillClass && "fill_".concat(fillClass)), "data-tour": dataTour, style: notificationStyles, children: [before, jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsx(Title, { className: "notification__item-title", size: titleTextSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.titleTextSize), textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.titleTextColor), children: title })), text && (jsx(Text, { className: "notification__item-text", size: textSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.textColor), children: text })), closeButton && (jsx("div", { className: clsx('notification__item-close', onClickClose && 'cursor_type_pointer'), onClick: function () { return onClickClose && onClickClose(id); }, children: closeButton }))] }), after] }));
 }
 
 function NotificationList(props) {

package/dist/components/Pagination.js

@@ -4,9 +4,9 @@ import clsx from 'clsx';
 import ceil from 'lodash/ceil';
 import ReactPaginate from 'react-paginate';
 import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
-import { D as Dropdown, a as DropdownItem } from '../DropdownItem-DxGxdjUr.js';
-import { I as Icon } from '../Icon-C9FlOMr9.js';
-import { T as Text } from '../Text-JayJa3hj.js';
+import { D as Dropdown, a as DropdownItem } from '../DropdownItem-BGsCHiqr.js';
+import { I as Icon } from '../Icon-Dz1q9WC2.js';
+import { T as Text } from '../Text-D9sEeRE4.js';
 import '../tslib.es6-5FtW-kfi.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -18,10 +18,10 @@ import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 import '../Divider-DBvDCUqP.js';
-import '../Link-CPzqprR1.js';
+import '../Link-U60OVrcS.js';
 import 'react-inlinesvg';
-import '../Tooltip-1Jbub0K6.js';
-import '../Title-CHgrIarR.js';
+import '../Tooltip-BsbXMzGd.js';
+import '../Title-Cl95USIn.js';
 
 var paginationAppearance = {
     default: {
@@ -65,7 +65,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 isPageCount = props.isPageCount, _a = props.isPageCountDropdownReversed, isPageCountDropdownReversed = _a === undefined ? false : _a, _b = props.allItemsCount, allItemsCount = _b === undefined ? 0 : _b, appearance = props.appearance, className = props.className, marginPagesDisplayed = props.marginPagesDisplayed, nextLabel = props.nextLabel, _c = props.pageCountArray, pageCountArray = _c === undefined ? [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 === undefined ? '' : _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 === undefined ? 0 : _e, pageRangeDisplayed = props.pageRangeDisplayed, _f = props.perPageCount, perPageCount = _f === undefined ? 0 : _f, previousLabel = props.previousLabel, onChangePage = props.onChangePage, onChangePerPageCount = props.onChangePerPageCount, 
     /**
      * @deprecated The method should not be used
      */
@@ -91,7 +91,7 @@ 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 === undefined ? undefined : pageCountArray.reverse() : pageCountArray;
     }, [isPageCountDropdownReversed, pageCountArray]);
     // Toggle command menu
     var onClickCommandMenuButton = useCallback(function () {
@@ -128,31 +128,31 @@ function Pagination(props) {
                 // break element
                 breakLabel: "...", breakLinkClassName: "pagination__item-link", disabledClassName: "pagination__item_state_disabled cursor_type_default", disabledLinkClassName: "pagination__item_state_disabled", 
                 // pages settings
-                forcePage: paginationPageIndex, marginPagesDisplayed: marginPagesDisplayed || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.marginPagesDisplayed), nextClassName: "pagination__item pagination__item_next", 
+                forcePage: paginationPageIndex, marginPagesDisplayed: marginPagesDisplayed || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.marginPagesDisplayed), nextClassName: "pagination__item pagination__item_next", 
                 // next button
                 nextLabel: nextLabel, nextLinkClassName: "pagination__item-link", 
                 // 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", 
+                pageClassName: "pagination__item", pageCount: paginationPagesCount, pageLinkClassName: "pagination__item-link", pageRangeDisplayed: pageRangeDisplayed || (appearanceConfig === null || appearanceConfig === undefined ? undefined : 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 ||
-                                            (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 &&
+                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 === undefined ? undefined : appearanceConfig.pageCountDescTextSize), textColor: pageCountDescTextColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDescTextColor), children: pageCountDesc || (appearanceConfig === null || appearanceConfig === undefined ? undefined : 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 === undefined ? undefined : appearanceConfig.pageCountInputTextSize), textColor: pageCountInputTextColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountInputTextColor), children: activeDropdownItem }), jsx(Icon, { fillSize: pageCountInputIconFillSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountInputIconFillSize), iconFill: pageCountInputIconColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountInputIconColor), imageSrc: pageCountInputIconSrc, SvgImage: pageCountInputIcon }), jsx(Dropdown, { fill: pageCountDropdownFill || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownFill), alignment: pageCountDropdownAlignment || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownAlignment), elevation: pageCountDropdownElevation || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownElevation), shape: pageCountDropdownShape || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownShape), isOpen: isOpenDropdown, set: pageCountDropdownSet || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownSet), setIsOpen: setIsOpenDropdown, children: pageCountDropdownArray.map(function (item, index) {
+                                    return activeDropdownItem === item ? (jsx(DropdownItem, { width: pageCountDropdownItemWidth || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemWidth), labelTextColor: pageCountDropdownItemLabelColor ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemLabelColor), labelTextSize: pageCountDropdownItemLabelSize ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemLabelSize), fill: pageCountDropdownItemFill || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemFill), fillHover: pageCountDropdownItemFillHover ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemFillHover), dividerDirection: pageCountDropdownItemDividerDirection, label: item.toString(), labelTextWrap: pageCountDropdownItemLabelWrap, size: pageCountDropdownItemSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemSize), dividerFill: pageCountDropdownItemDividerFill ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemDividerFill), dividerSize: pageCountDropdownItemDividerSize ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemDividerSize), fillActive: pageCountDropdownItemFillActive ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemFillActive), fillActiveHover: pageCountDropdownItemFillActiveHover ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemFillActiveHover), labelTextAlign: pageCountDropdownItemLabelAlign ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemLabelAlign), labelTextColorActive: pageCountDropdownItemLabelColorActive ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemLabelColorActive), 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 === undefined ? undefined : appearanceConfig.pageCountDropdownItemShowDivider)), isActive: true, onClick: function (event) { return handleDropdownItemClick(event, item); } }, item)) : (jsx(DropdownItem, { width: pageCountDropdownItemWidth || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemWidth), labelTextColor: pageCountDropdownItemLabelColor ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemLabelColor), labelTextSize: pageCountDropdownItemLabelSize ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemLabelSize), fill: pageCountDropdownItemFill, fillHover: pageCountDropdownItemFillHover ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemFillHover), dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, label: item.toString(), labelTextWrap: pageCountDropdownItemLabelWrap, size: pageCountDropdownItemSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemSize), dividerSize: pageCountDropdownItemDividerSize ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemDividerSize), labelTextAlign: pageCountDropdownItemLabelAlign ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemLabelAlign), labelTextColorActive: pageCountDropdownItemLabelColorActive ||
+                                            (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.pageCountDropdownItemLabelColorActive), showDivider: index < pageCountArray.length - 1 && pageCountDropdownItemShowDivider, isActive: false, onClick: function (event) { return handleDropdownItemClick(event, item); } }, item));
                                 }) })] })] }))] }));
 }
 

package/dist/components/Panel.js

@@ -3,8 +3,8 @@ import React from 'react';
 import clsx from 'clsx';
 import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { G as Group } from '../Group-B9L2NTgM.js';
-import { T as Text } from '../Text-JayJa3hj.js';
+import { G as Group } from '../Group-CIIZoSm5.js';
+import { T as Text } from '../Text-D9sEeRE4.js';
 import '../tslib.es6-5FtW-kfi.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';

package/dist/components/Radio.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
-import { T as Text } from '../Text-JayJa3hj.js';
+import { T as Text } from '../Text-D9sEeRE4.js';
 import '../tslib.es6-5FtW-kfi.js';
 import 'react';
 import 'lodash/camelCase';
@@ -45,7 +45,7 @@ var radioConfig = {
     },
 };
 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;
+    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 === undefined ? 'label' : _a, onChange = props.onChange;
     // @ts-expect-error
     var appearanceConfig = radioConfig.appearance && radioConfig.appearance[appearance];
     var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
@@ -60,7 +60,7 @@ function Radio(props) {
                         // @ts-expect-error
                         id: id, type: "radio", 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", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textWeight: labelTextWeight, children: label })), desc && (jsx(Text, { className: "radio__desc", size: descTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextSize), textColor: descTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextColor), textWeight: descTextWeight, children: desc }))] }));
+                            : 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", size: labelTextSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.labelTextSize), textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.labelTextColor), textWeight: labelTextWeight, children: label })), desc && (jsx(Text, { className: "radio__desc", size: descTextSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.descTextSize), textColor: descTextColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.descTextColor), textWeight: descTextWeight, children: desc }))] }));
 }
 Radio.defaultProps = {
     shape: 'circular',

package/dist/components/Response.js

@@ -5,10 +5,10 @@ import clsx from 'clsx';
 import SVG from 'react-inlinesvg';
 import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { B as Button } from '../Button-BVQet4JC.js';
-import { G as Group } from '../Group-B9L2NTgM.js';
-import { T as Text } from '../Text-JayJa3hj.js';
-import { T as Title } from '../Title-CHgrIarR.js';
+import { B as Button } from '../Button-C4oPIe_E.js';
+import { G as Group } from '../Group-CIIZoSm5.js';
+import { T as Text } from '../Text-D9sEeRE4.js';
+import { T as Title } from '../Title-Cl95USIn.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
 import '../context/UIContext.js';
@@ -17,10 +17,10 @@ import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../Icon-C9FlOMr9.js';
-import '../Link-CPzqprR1.js';
-import '../Tooltip-1Jbub0K6.js';
-import '../Loader-K_DJmah6.js';
+import '../Icon-Dz1q9WC2.js';
+import '../Link-U60OVrcS.js';
+import '../Tooltip-BsbXMzGd.js';
+import '../Loader-Cm98w6lJ.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 fill-rule='evenodd' clip-rule='evenodd' d='M85.7155 56.9042L54.1865 115.911C53.0219 118.09 54.5678 121.43 58.4708 121.43H121.529C125.432 121.43 126.978 118.09 125.814 115.911L94.2845 56.9043C93.5012 55.4392 91.8762 54.57 89.9998 54.57C88.1237 54.57 86.4986 55.439 85.7155 56.9042ZM89.9998 48C93.9317 48 98.1142 49.8644 100.253 53.8659L131.782 112.873C135.732 120.266 129.482 128 121.529 128H58.4708C50.5181 128 44.2675 120.266 48.2181 112.873L79.7471 53.866C81.8855 49.8645 86.0683 48 89.9998 48ZM90.0002 74.0886C91.8588 74.0886 93.3658 75.5593 93.3658 77.3736V92.8756C93.3658 94.6897 91.8588 96.1606 90.0002 96.1606C88.1411 96.1606 86.6345 94.6897 86.6345 92.8756V77.3736C86.6345 75.5593 88.1411 74.0886 90.0002 74.0886ZM93.3658 108.377C93.3658 106.563 91.8588 105.092 90.0002 105.092C88.1411 105.092 86.6345 106.563 86.6345 108.377V108.457C86.6345 110.271 88.1411 111.742 90.0002 111.742C91.8588 111.742 93.3658 110.271 93.3658 108.457V108.377Z' fill='%23747474'/%3e%3c/svg%3e";
 
@@ -219,9 +219,13 @@ var responseConfig = {
 };
 function Response(props) {
     var width = props.width, height = props.height, after = props.after, appearance = props.appearance, before = props.before, className = props.className, imageSrc = props.imageSrc, message = props.message, messageTextColor = props.messageTextColor, messageTextSize = props.messageTextSize, messageTextWeight = props.messageTextWeight, primaryButton = props.primaryButton, primaryButtonAfter = props.primaryButtonAfter, primaryButtonAppearance = props.primaryButtonAppearance, primaryButtonBefore = props.primaryButtonBefore, primaryButtonFill = props.primaryButtonFill, primaryButtonFillHover = props.primaryButtonFillHover, primaryButtonLabel = props.primaryButtonLabel, primaryButtonLabelTextColor = props.primaryButtonLabelTextColor, primaryButtonLabelTextSize = props.primaryButtonLabelTextSize, primaryButtonShape = props.primaryButtonShape, primaryButtonSize = props.primaryButtonSize, primaryButtonWidth = props.primaryButtonWidth, secondaryButton = props.secondaryButton, secondaryButtonAfter = props.secondaryButtonAfter, secondaryButtonAppearance = props.secondaryButtonAppearance, secondaryButtonBefore = props.secondaryButtonBefore, secondaryButtonFill = props.secondaryButtonFill, secondaryButtonFillHover = props.secondaryButtonFillHover, secondaryButtonLabel = props.secondaryButtonLabel, secondaryButtonLabelTextColor = props.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = props.secondaryButtonLabelTextSize, secondaryButtonShape = props.secondaryButtonShape, secondaryButtonSize = props.secondaryButtonSize, secondaryButtonWidth = props.secondaryButtonWidth, set = props.set, SvgImage = props.SvgImage, svgSrc = props.svgSrc, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, onClickPrimaryButton = props.onClickPrimaryButton, onClickSecondaryButton = props.onClickSecondaryButton;
+    // @ts-expect-error
+    var appearanceConfig = responseConfig.appearance && responseConfig.appearance[appearance];
+    var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
+    var borderColorClass = classGenerator.borderColorClass, borderColorHoverClass = classGenerator.borderColorHoverClass, borderTypeClass = classGenerator.borderTypeClass, borderWidthClass = classGenerator.borderWidthClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, shapeClass = classGenerator.shapeClass, svgFillClass = classGenerator.svgFillClass, svgPathFillClass = classGenerator.svgPathFillClass;
     var ImageComponent = useMemo(function () {
-        var src = imageSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.imageSrc) || svgSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.svgSrc);
-        var Image = SvgImage || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.SvgImage);
+        var src = imageSrc || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.imageSrc) || svgSrc || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.svgSrc);
+        var Image = SvgImage || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.SvgImage);
         if (Image) {
             var sizes = {};
             if (width) {
@@ -234,7 +238,7 @@ function Response(props) {
         }
         if (src) {
             if (src.endsWith('.svg') || src.startsWith('data:image/svg')) {
-                if (svgFillClass || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.svgFill)) {
+                if (svgFillClass || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.svgFill)) {
                     return jsx(SVG, { preProcessor: removeFillStroke, src: src });
                 }
                 else {
@@ -246,16 +250,12 @@ function Response(props) {
         return null;
     }, [imageSrc, appearanceConfig, SvgImage, width, height, svgFillClass]);
     // @ts-expect-error
-    var appearanceConfig = responseConfig.appearance && responseConfig.appearance[appearance];
-    var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
-    var borderColorClass = classGenerator.borderColorClass, borderColorHoverClass = classGenerator.borderColorHoverClass, borderTypeClass = classGenerator.borderTypeClass, borderWidthClass = classGenerator.borderWidthClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, shapeClass = classGenerator.shapeClass, svgFillClass = classGenerator.svgFillClass, svgPathFillClass = classGenerator.svgPathFillClass;
-    // @ts-expect-error
     var responseStyles = useStyles(props).styles;
-    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), set && "response_set_".concat(set)), style: responseStyles, children: [before, jsx("div", { className: clsx('response__image', svgFillClass && "svg_fill_".concat(svgFillClass), svgPathFillClass && "svg_path_fill_".concat(svgPathFillClass)), children: ImageComponent }), jsxs(Group, { className: "response__desc", width: "fill", children: [title && (jsx(Title, { className: "response__title", size: titleTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextSize) || 'h2', textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight) || '600', children: title })), message && (jsx(Text, { className: "response__message", size: messageTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.messageTextSize) || 'xxl', textColor: messageTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.messageTextColor), textWeight: messageTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.messageTextWeight), children: message }))] }), (primaryButtonLabel ||
+    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), set && "response_set_".concat(set)), style: responseStyles, children: [before, jsx("div", { className: clsx('response__image', svgFillClass && "svg_fill_".concat(svgFillClass), svgPathFillClass && "svg_path_fill_".concat(svgPathFillClass)), children: ImageComponent }), jsxs(Group, { className: "response__desc", width: "fill", children: [title && (jsx(Title, { className: "response__title", size: titleTextSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.titleTextSize) || 'h2', textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.titleTextWeight) || '600', children: title })), message && (jsx(Text, { className: "response__message", size: messageTextSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.messageTextSize) || 'xxl', textColor: messageTextColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.messageTextColor), textWeight: messageTextWeight || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.messageTextWeight), children: message }))] }), (primaryButtonLabel ||
                 primaryButton ||
                 secondaryButtonLabel ||
                 secondaryButton ||
-                appearanceConfig) && (jsxs(Group, { className: "response__button", width: "fill", children: [primaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonLabel) ? (jsx(Button, { className: "response__button-item", width: primaryButtonWidth || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonWidth) || 'fill', labelTextColor: primaryButtonLabelTextColor, labelTextSize: primaryButtonLabelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonLabelTextSize), fill: primaryButtonFill, fillHover: primaryButtonFillHover, after: primaryButtonAfter, before: primaryButtonBefore, label: primaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonLabel), shape: primaryButtonShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonShape), size: primaryButtonSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonSize), appearance: primaryButtonAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.primaryButtonAppearance) || 'dev', onClick: onClickPrimaryButton })) : (primaryButton), secondaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonLabel) ? (jsx(Button, { className: "response__button-item", width: secondaryButtonWidth || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonWidth) || 'fill', labelTextColor: secondaryButtonLabelTextColor, labelTextSize: secondaryButtonLabelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonLabelTextSize), fill: secondaryButtonFill, fillHover: secondaryButtonFillHover, after: secondaryButtonAfter, before: secondaryButtonBefore, label: secondaryButtonLabel || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonLabel), shape: secondaryButtonShape || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonShape), size: secondaryButtonSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonSize), appearance: secondaryButtonAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.secondaryButtonAppearance) || 'dev', onClick: onClickSecondaryButton })) : (secondaryButton)] })), after] }));
+                appearanceConfig) && (jsxs(Group, { className: "response__button", width: "fill", children: [primaryButtonLabel || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.primaryButtonLabel) ? (jsx(Button, { className: "response__button-item", width: primaryButtonWidth || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.primaryButtonWidth) || 'fill', labelTextColor: primaryButtonLabelTextColor, labelTextSize: primaryButtonLabelTextSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.primaryButtonLabelTextSize), fill: primaryButtonFill, fillHover: primaryButtonFillHover, after: primaryButtonAfter, before: primaryButtonBefore, label: primaryButtonLabel || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.primaryButtonLabel), shape: primaryButtonShape || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.primaryButtonShape), size: primaryButtonSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.primaryButtonSize), appearance: primaryButtonAppearance || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.primaryButtonAppearance) || 'dev', onClick: onClickPrimaryButton })) : (primaryButton), secondaryButtonLabel || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.secondaryButtonLabel) ? (jsx(Button, { className: "response__button-item", width: secondaryButtonWidth || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.secondaryButtonWidth) || 'fill', labelTextColor: secondaryButtonLabelTextColor, labelTextSize: secondaryButtonLabelTextSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.secondaryButtonLabelTextSize), fill: secondaryButtonFill, fillHover: secondaryButtonFillHover, after: secondaryButtonAfter, before: secondaryButtonBefore, label: secondaryButtonLabel || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.secondaryButtonLabel), shape: secondaryButtonShape || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.secondaryButtonShape), size: secondaryButtonSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.secondaryButtonSize), appearance: secondaryButtonAppearance || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.secondaryButtonAppearance) || 'dev', onClick: onClickSecondaryButton })) : (secondaryButton)] })), after] }));
 }
 var removeFillStroke = function (code) {
     return code

package/dist/components/ScrollToView.js

@@ -15,7 +15,7 @@ import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 
 var ScrollToView = ScrollLink(function ScrollToView(props) {
-    var id = props.id, children = props.children, className = props.className, _a = props.tag, Tag = _a === void 0 ? 'div' : _a;
+    var id = props.id, children = props.children, className = props.className, _a = props.tag, Tag = _a === undefined ? 'div' : _a;
     var classGenerator = useDeviceTargetClassGenerator(props);
     var alignClass = classGenerator.alignClass, alignDirectionClass = classGenerator.alignDirectionClass, alignItemsClass = classGenerator.alignItemsClass, alignSelfClass = classGenerator.alignSelfClass, directionClass = classGenerator.directionClass, heightClass = classGenerator.heightClass, justifyContentClass = classGenerator.justifyContentClass, textColorActiveClass = classGenerator.textColorActiveClass, textColorClass = classGenerator.textColorClass, textColorHoverClass = classGenerator.textColorHoverClass, widthClass = classGenerator.widthClass;
     var scrollToViewStyles = useStyles(props).styles;

package/dist/components/Scrollbar.js

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

package/dist/components/Search.js

@@ -3,9 +3,9 @@ import React, { useCallback } from 'react';
 import clsx from 'clsx';
 import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { I as Icon } from '../Icon-C9FlOMr9.js';
-import { T as Text } from '../Text-JayJa3hj.js';
-import { S as Scrollbar } from '../Scrollbar-Bo7z7ELm.js';
+import { I as Icon } from '../Icon-Dz1q9WC2.js';
+import { T as Text } from '../Text-D9sEeRE4.js';
+import { S as Scrollbar } from '../Scrollbar-DkJr3S-w.js';
 import '../tslib.es6-5FtW-kfi.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -16,9 +16,9 @@ import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 import 'react-inlinesvg';
-import '../Link-CPzqprR1.js';
-import '../Tooltip-1Jbub0K6.js';
-import '../Title-CHgrIarR.js';
+import '../Link-U60OVrcS.js';
+import '../Tooltip-BsbXMzGd.js';
+import '../Title-Cl95USIn.js';
 import 'react-scrollbars-custom';
 
 var searchAppearance = {
@@ -38,7 +38,7 @@ var searchInputConfig = {
     },
 };
 var SearchInput = React.forwardRef(function SearchInput(props, ref) {
-    var after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTour = props.dataTour, iconAfter = props.iconAfter, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeFill = props.iconBeforeFill, iconBeforeSize = props.iconBeforeSize, iconBeforeSrc = props.iconBeforeSrc, iconClear = props.iconClear, iconClearFill = props.iconClearFill, iconClearSize = props.iconClearSize, iconClearSrc = props.iconClearSrc, placeholder = props.placeholder, placeholderTextColor = props.placeholderTextColor, _a = props.placeholderTextSize, placeholderTextSize = _a === void 0 ? 'm' : _a, placeholderTextStyle = props.placeholderTextStyle, placeholderTextWeight = props.placeholderTextWeight, _b = props.size, size = _b === void 0 ? 'normal' : _b, type = props.type, value = props.value, onChange = props.onChange, onClickClean = props.onClickClean, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
+    var after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTour = props.dataTour, iconAfter = props.iconAfter, iconAfterFill = props.iconAfterFill, iconAfterSize = props.iconAfterSize, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeFill = props.iconBeforeFill, iconBeforeSize = props.iconBeforeSize, iconBeforeSrc = props.iconBeforeSrc, iconClear = props.iconClear, iconClearFill = props.iconClearFill, iconClearSize = props.iconClearSize, iconClearSrc = props.iconClearSrc, placeholder = props.placeholder, placeholderTextColor = props.placeholderTextColor, _a = props.placeholderTextSize, placeholderTextSize = _a === undefined ? 'm' : _a, placeholderTextStyle = props.placeholderTextStyle, placeholderTextWeight = props.placeholderTextWeight, _b = props.size, size = _b === undefined ? 'normal' : _b, type = props.type, value = props.value, onChange = props.onChange, onClickClean = props.onClickClean, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
     var onChangeSearchInput = useCallback(function (event) {
         onChange && onChange(event.target.value);
     }, [onChange]);
@@ -55,11 +55,11 @@ var SearchInput = React.forwardRef(function SearchInput(props, ref) {
     var borderColorClass = classGenerator.borderColorClass, borderHoverClass = classGenerator.borderHoverClass, borderTypeClass = classGenerator.borderTypeClass, borderWidthClass = classGenerator.borderWidthClass, fillClass = classGenerator.fillClass, inputFillClass = classGenerator.inputFillClass, inputShapeClass = classGenerator.inputShapeClass, inputTextColorClass = classGenerator.inputTextColorClass, inputTextSizeClass = classGenerator.inputTextSizeClass, inputTextStyleClass = classGenerator.inputTextStyleClass, inputTextWeightClass = classGenerator.inputTextWeightClass, shapeClass = classGenerator.shapeClass, widthClass = classGenerator.widthClass;
     // @ts-expect-error
     var searchInputStyles = useStyles(props).styles;
-    return (jsxs("label", { className: clsx(className, 'search-input', shapeClass && "search_shape_".concat(shapeClass), fillClass && "fill_".concat(fillClass), widthClass && "width_".concat(widthClass), borderColorClass && "border-color_".concat(borderColorClass), borderHoverClass && "border-color_hover_".concat(borderHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), size && "search-input_size_".concat(size), type && "search-input_type_".concat(type)), "data-tour": dataTour, style: searchInputStyles, children: [before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: "search-input__icon search-input__icon-before", iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeSrc), size: iconBeforeSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeSize), SvgImage: iconBefore || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBefore) })), jsxs("div", { className: clsx('search-input__wrapper', inputFillClass && "fill_".concat(inputFillClass), inputShapeClass && "search-input_shape_".concat(inputShapeClass)), children: [jsx("input", { className: clsx('search-input__value', (inputTextSizeClass ||
+    return (jsxs("label", { className: clsx(className, 'search-input', shapeClass && "search_shape_".concat(shapeClass), fillClass && "fill_".concat(fillClass), widthClass && "width_".concat(widthClass), borderColorClass && "border-color_".concat(borderColorClass), borderHoverClass && "border-color_hover_".concat(borderHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), size && "search-input_size_".concat(size), type && "search-input_type_".concat(type)), "data-tour": dataTour, style: searchInputStyles, children: [before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: "search-input__icon search-input__icon-before", iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconBeforeSrc), size: iconBeforeSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconBeforeSize), SvgImage: iconBefore || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconBefore) })), jsxs("div", { className: clsx('search-input__wrapper', inputFillClass && "fill_".concat(inputFillClass), inputShapeClass && "search-input_shape_".concat(inputShapeClass)), children: [jsx("input", { className: clsx('search-input__value', (inputTextSizeClass ||
                             inputTextWeightClass ||
                             inputTextColorClass ||
                             inputTextStyleClass) &&
-                            'text', inputTextSizeClass && "text_size_".concat(inputTextSizeClass), inputTextWeightClass && "text-weight_".concat(inputTextWeightClass), inputTextColorClass && "text-color_".concat(inputTextColorClass), inputTextStyleClass && "text-style_".concat(inputTextStyleClass)), ref: ref, required: true, type: "text", value: value, onChange: onChangeSearchInput, onFocus: onFocus, onKeyDown: onKeyDown }), jsx("div", { className: "search-input__placeholder", children: jsx(Text, { className: clsx('search-input__placeholder-value'), size: placeholderTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.placeholderTextSize), textColor: placeholderTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.placeholderTextColor), textStyle: placeholderTextStyle, textWeight: placeholderTextWeight, children: placeholder || 'Search' }) }), value && (jsx(Icon, { className: clsx('search-input__clear', 'cursor_type_pointer'), iconFill: iconClearFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconClearFill), imageSrc: iconClearSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconClearSrc), size: iconClearSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconClearSize), SvgImage: iconClear || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconClear), onClick: onClickClearIcon }))] }), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: "search-input__icon search-input__icon-after", iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterSrc), size: iconAfterSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterSize), SvgImage: iconAfter || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfter) })), after] }));
+                            'text', inputTextSizeClass && "text_size_".concat(inputTextSizeClass), inputTextWeightClass && "text-weight_".concat(inputTextWeightClass), inputTextColorClass && "text-color_".concat(inputTextColorClass), inputTextStyleClass && "text-style_".concat(inputTextStyleClass)), ref: ref, required: true, type: "text", value: value, onChange: onChangeSearchInput, onFocus: onFocus, onKeyDown: onKeyDown }), jsx("div", { className: "search-input__placeholder", children: jsx(Text, { className: clsx('search-input__placeholder-value'), size: placeholderTextSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.placeholderTextSize), textColor: placeholderTextColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.placeholderTextColor), textStyle: placeholderTextStyle, textWeight: placeholderTextWeight, children: placeholder || 'Search' }) }), value && (jsx(Icon, { className: clsx('search-input__clear', 'cursor_type_pointer'), iconFill: iconClearFill || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconClearFill), imageSrc: iconClearSrc || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconClearSrc), size: iconClearSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconClearSize), SvgImage: iconClear || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconClear), onClick: onClickClearIcon }))] }), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: "search-input__icon search-input__icon-after", iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconAfterSrc), size: iconAfterSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconAfterSize), SvgImage: iconAfter || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.iconAfter) })), after] }));
 });
 // @ts-expect-error
 SearchInput.DEFAULT_REF_STATE = {

package/dist/components/Segmented.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import React, { useRef, useMemo, createRef, useCallback, useEffect } from 'react';
 import clsx from 'clsx';
 import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
-import { T as Text } from '../Text-JayJa3hj.js';
+import { T as Text } from '../Text-D9sEeRE4.js';
 import '../tslib.es6-5FtW-kfi.js';
 import 'lodash/camelCase';
 import 'lodash/castArray';
@@ -34,7 +34,7 @@ var segmentedConfig = {
     },
 };
 var Segmented = React.forwardRef(function (props, ref) {
-    var isDisabled = props.isDisabled, _a = props.activeSegment, activeSegment = _a === void 0 ? {} : _a, appearance = props.appearance, className = props.className, labelTextActiveColor = props.labelTextActiveColor, labelTextActiveHoverColor = props.labelTextActiveHoverColor, labelTextColor = props.labelTextColor, labelTextHoverColor = props.labelTextHoverColor, labelTextSize = props.labelTextSize, labelTextWrap = props.labelTextWrap, name = props.name, segments = props.segments, setActiveSegment = props.setActiveSegment, size = props.size, type = props.type, onChange = props.onChange;
+    var isDisabled = props.isDisabled, _a = props.activeSegment, activeSegment = _a === undefined ? {} : _a, appearance = props.appearance, className = props.className, labelTextActiveColor = props.labelTextActiveColor, labelTextActiveHoverColor = props.labelTextActiveHoverColor, labelTextColor = props.labelTextColor, labelTextHoverColor = props.labelTextHoverColor, labelTextSize = props.labelTextSize, labelTextWrap = props.labelTextWrap, name = props.name, segments = props.segments, setActiveSegment = props.setActiveSegment, size = props.size, type = props.type, onChange = props.onChange;
     var controlRef = useRef(null);
     var segmentsRefs = useMemo(function () { return new Map(segments.map(function (item) { return [item.value, createRef()]; })); }, [segments]);
     var onChangeValue = useCallback(function (item) {
@@ -45,14 +45,14 @@ var Segmented = React.forwardRef(function (props, ref) {
         var _a, _b;
         var offsetWidth = 0;
         var offsetLeft = 0;
-        var activeSegmentRef = segmentsRefs.get(activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value);
-        if (activeSegmentRef === null || activeSegmentRef === void 0 ? void 0 : activeSegmentRef.current) {
+        var activeSegmentRef = segmentsRefs.get(activeSegment === null || activeSegment === undefined ? undefined : activeSegment.value);
+        if (activeSegmentRef === null || activeSegmentRef === undefined ? undefined : activeSegmentRef.current) {
             offsetWidth = activeSegmentRef.current.offsetWidth;
             offsetLeft = activeSegmentRef.current.offsetLeft;
         }
-        (_a = controlRef.current) === null || _a === void 0 ? void 0 : _a.style.setProperty('--segmented-active-width', "".concat(offsetWidth, "px"));
+        (_a = controlRef.current) === null || _a === undefined ? undefined : _a.style.setProperty('--segmented-active-width', "".concat(offsetWidth, "px"));
         // controlRef.current.style.setProperty('--segmented-active-x-pos', `${offsetLeft - 2}px`)
-        (_b = controlRef.current) === null || _b === void 0 ? void 0 : _b.style.setProperty('--segmented-active-x-pos', "".concat(offsetLeft, "px"));
+        (_b = controlRef.current) === null || _b === undefined ? undefined : _b.style.setProperty('--segmented-active-x-pos', "".concat(offsetLeft, "px"));
     }, [activeSegment, segmentsRefs]);
     // @ts-expect-error
     var appearanceConfig = segmentedConfig.appearance && segmentedConfig.appearance[appearance];
@@ -60,15 +60,15 @@ var Segmented = React.forwardRef(function (props, ref) {
     var borderTypeClass = classGenerator.borderTypeClass, borderWidthClass = classGenerator.borderWidthClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, indicatorFillClass = classGenerator.indicatorFillClass, inputBorderColorClass = classGenerator.inputBorderColorClass, shapeClass = classGenerator.shapeClass, widthClass = classGenerator.widthClass;
     return (jsx("div", { className: clsx(className, 'segmented', shapeClass && "segmented_shape_".concat(shapeClass), fillClass && "fill_".concat(fillClass), widthClass && "segmented_width_".concat(widthClass), size
             ? "segmented_size_".concat(size)
-            : (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.size) &&
+            : (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.size) &&
                 "segmented_size_".concat(appearanceConfig.size).replace(/([A-Z])/g, '-$1').toLowerCase(), type
             ? "segmented_type_".concat(type)
-            : (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.type) &&
-                "segmented_type_".concat(appearanceConfig.type).replace(/([A-Z])/g, '-$1').toLowerCase(), inputBorderColorClass && "border-color_".concat(inputBorderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass)), ref: controlRef, children: jsx("div", { className: "segmented__wrapper", children: jsxs("div", { className: clsx('segmented__wrapper-inner'), children: [segments === null || segments === void 0 ? void 0 : segments.map(function (item, i) { return (jsxs("div", { className: clsx('segmented__item', fillHoverClass && "fill_hover_".concat(fillHoverClass), item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value) && 'segmented__item_active', onChange && 'cursor_type_pointer', isDisabled && 'cursor_type_default'), ref: segmentsRefs.get(item.value), children: [jsx("input", { className: "segmented__item-radio", name: name, checked: item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value), id: item.label, type: "radio", value: item.value, onChange: function () { return onChangeValue(item); } }), jsx("label", { className: clsx('segmented__item-label'), htmlFor: item.label, children: jsx(Text, { className: clsx('segmented__item-label-text', labelTextWrap && "word-wrap_".concat(labelTextWrap)), size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textColor: item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value)
-                                        ? labelTextActiveColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveColor)
-                                        : labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: item.value === (activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value)
-                                        ? labelTextActiveHoverColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveHoverColor)
-                                        : labelTextHoverColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextHoverColor), children: item.label }) })] }, item.value)); }), jsx("div", { className: clsx('segmented__indicator', indicatorFillClass && "fill_".concat(indicatorFillClass)), children: "\u00A0" })] }) }) }));
+            : (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.type) &&
+                "segmented_type_".concat(appearanceConfig.type).replace(/([A-Z])/g, '-$1').toLowerCase(), inputBorderColorClass && "border-color_".concat(inputBorderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass)), ref: controlRef, children: jsx("div", { className: "segmented__wrapper", children: jsxs("div", { className: clsx('segmented__wrapper-inner'), children: [segments === null || segments === undefined ? undefined : segments.map(function (item, i) { return (jsxs("div", { className: clsx('segmented__item', fillHoverClass && "fill_hover_".concat(fillHoverClass), item.value === (activeSegment === null || activeSegment === undefined ? undefined : activeSegment.value) && 'segmented__item_active', onChange && 'cursor_type_pointer', isDisabled && 'cursor_type_default'), ref: segmentsRefs.get(item.value), children: [jsx("input", { className: "segmented__item-radio", name: name, checked: item.value === (activeSegment === null || activeSegment === undefined ? undefined : activeSegment.value), id: item.label, type: "radio", value: item.value, onChange: function () { return onChangeValue(item); } }), jsx("label", { className: clsx('segmented__item-label'), htmlFor: item.label, children: jsx(Text, { className: clsx('segmented__item-label-text', labelTextWrap && "word-wrap_".concat(labelTextWrap)), size: labelTextSize || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.labelTextSize), textColor: item.value === (activeSegment === null || activeSegment === undefined ? undefined : activeSegment.value)
+                                        ? labelTextActiveColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.labelTextActiveColor)
+                                        : labelTextColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.labelTextColor), textColorHover: item.value === (activeSegment === null || activeSegment === undefined ? undefined : activeSegment.value)
+                                        ? labelTextActiveHoverColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.labelTextActiveHoverColor)
+                                        : labelTextHoverColor || (appearanceConfig === null || appearanceConfig === undefined ? undefined : appearanceConfig.labelTextHoverColor), children: item.label }) })] }, item.value)); }), jsx("div", { className: clsx('segmented__indicator', indicatorFillClass && "fill_".concat(indicatorFillClass)), children: "\u00A0" })] }) }) }));
 });
 Segmented.displayName = 'Segmented';