@itcase/ui 1.2.30 → 1.2.31

package/dist/components/List.js

@@ -2,18 +2,17 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useStyles } from '../hooks/useStyles.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { L as Link } from '../Link-CzC1kU5C.js';
+import { L as Link } from '../Link-CeQuavin.js';
 import 'react';
 import 'lodash/camelCase';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/styleAttributes.js';
 import 'lodash/castArray';
-import '../tslib.es6-w7hdJ3oZ.js';
+import '../tslib.es6-5FtW-kfi.js';
 
 function List(props) {
     var children = props.children, className = props.className, style = props.style, type = props.type;

package/dist/components/Loader.js

@@ -1,4 +1,4 @@
-export { L as Loader, l as loaderConfig } from '../Loader-CU_5Ydmy.js';
+export { L as Loader, l as loaderConfig } from '../Loader-CqEocvjh.js';
 import 'react/jsx-runtime';
 import 'clsx';
 import '../appearance/Loader.js';
@@ -7,12 +7,11 @@ import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/useStyles.js';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../Text-kxGZButz.js';
+import '../Text-DlSG_p4u.js';
 import '../appearance/Text.js';

package/dist/components/Logo.js

@@ -2,18 +2,17 @@ import { jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { a as LinkWrapper } from '../Link-CzC1kU5C.js';
+import { a as LinkWrapper } from '../Link-CeQuavin.js';
 import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../tslib.es6-w7hdJ3oZ.js';
+import '../tslib.es6-5FtW-kfi.js';
 
 var logoConfig = {
     appearance: undefined,

package/dist/components/Menu.js

@@ -2,21 +2,20 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { M as MenuItem } from '../MenuItem-BEYVY0Vf.js';
+import { M as MenuItem } from '../MenuItem-zHzWXIvQ.js';
 import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 import '../appearance/MenuItem.js';
-import '../Link-CzC1kU5C.js';
-import '../tslib.es6-w7hdJ3oZ.js';
-import '../Text-kxGZButz.js';
+import '../Link-CeQuavin.js';
+import '../tslib.es6-5FtW-kfi.js';
+import '../Text-DlSG_p4u.js';
 import '../appearance/Text.js';
 
 function Menu(props) {

package/dist/components/MenuItem.js

@@ -1,4 +1,4 @@
-export { M as MenuItem, m as menuItemConfig } from '../MenuItem-BEYVY0Vf.js';
+export { M as MenuItem, m as menuItemConfig } from '../MenuItem-zHzWXIvQ.js';
 import 'react/jsx-runtime';
 import 'react';
 import 'clsx';
@@ -7,14 +7,13 @@ import '../hooks/useDeviceTargetClass.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/useStyles.js';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../Link-CzC1kU5C.js';
-import '../tslib.es6-w7hdJ3oZ.js';
-import '../Text-kxGZButz.js';
+import '../Link-CeQuavin.js';
+import '../tslib.es6-5FtW-kfi.js';
+import '../Text-DlSG_p4u.js';
 import '../appearance/Text.js';

package/dist/components/Modal.js

@@ -2,23 +2,29 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useState, useRef, useCallback, useEffect, useLayoutEffect, useImperativeHandle } from 'react';
 import clsx from 'clsx';
 import ReactDOM from 'react-dom';
+import { modalAppearance } from '../appearance/Modal.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
 import { O as Overlay } from '../Overlay-DO5dnSRE.js';
-import { L as Loader } from '../Loader-CU_5Ydmy.js';
+import { L as Loader } from '../Loader-CqEocvjh.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 import '../appearance/Loader.js';
-import '../Text-kxGZButz.js';
+import '../Text-DlSG_p4u.js';
 import '../appearance/Text.js';
 
+var modalConfig = {
+    appearance: modalAppearance,
+    setAppearance: function (newComponent) {
+        modalConfig.appearance = newComponent;
+    },
+};
 var getOrCreateModalElement = function (modalQuerySelector, className) {
     var _a;
     if (className === void 0) { className = ''; }
@@ -41,7 +47,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, 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 === 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;
     // Query DOM element
     var _g = useState(null), modalElement = _g[0], setModalElement = _g[1];
     var _h = useState(initialIsOpen), isOpen = _h[0], setIsOpen = _h[1];
@@ -55,7 +61,7 @@ var Modal = React.forwardRef(function Modal(props, ref) {
             // Scroll to opened modal
             if (isScrollOnOpen) {
                 // modalContentRef.current.style.top = `${window.visualViewport.pageTop}px`
-                element.scrollIntoView({ block: 'center', behavior: 'smooth' });
+                element.scrollIntoView({ behavior: 'smooth', block: 'center' });
             }
             // "setTimeout" in this implementation is needs for set focus on modal
             // after "onMouseDown" event on button
@@ -155,13 +161,26 @@ var Modal = React.forwardRef(function Modal(props, ref) {
     });
     // @ts-expect-error
     var modalStyles = useStyles(props).styles;
+    var appearanceConfig = appearance && modalConfig.appearance && modalConfig.appearance[appearance];
     // Use a portal to render the children into the element
     return (modalElement &&
         ReactDOM.createPortal(
         // Any valid React child: JSX, strings, arrays, etc.
-        isOpen ? (jsxs(React.Fragment, { children: [jsxs("div", { className: clsx('modal-content', contentClassName, fillClass, shapeClass, borderColorClass, borderWidthClass, borderTypeClass, 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), 
+        isOpen ? (jsxs(React.Fragment, { children: [jsxs("div", { className: clsx('modal-content', contentClassName, fillClass ||
+                        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
+                            "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass ||
+                        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
+                            "modal-shape_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), borderColorClass ||
+                        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
+                            "border-color_".concat(appearanceConfig.borderColor)
+                                .replace(/([A-Z])/g, '-$1')
+                                .toLowerCase()), borderWidthClass, borderTypeClass, elevationClass ||
+                        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.elevation) &&
+                            "elevation_".concat(appearanceConfig.elevation)
+                                .replace(/([A-Z])/g, '-$1')
+                                .toLowerCase())), 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, opacity: overlayOpacity, fillGradient: overlayFillGradient, isOverlay: isOverlay, onClick: onClickOverlay })] })) : null, 
+                    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, 
         // A DOM element
         modalElement));
 });
@@ -170,4 +189,4 @@ function ModalLoader(props) {
     return (jsx("div", { className: "modal-loading", children: jsx("div", { className: "modal-loading__inner", children: jsx(Loader, {}) }) }));
 }
 
-export { Modal, ModalLoader };
+export { Modal, ModalLoader, modalConfig };

package/dist/components/ModalSheetBottom.js

@@ -0,0 +1,32 @@
+import { _ as __assign } from '../tslib.es6-5FtW-kfi.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { Sheet } from 'react-modal-sheet';
+import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
+import { useStyles } from '../hooks/useStyles.js';
+import 'react';
+import 'lodash/castArray';
+import 'lodash/camelCase';
+import '../context/UIContext.js';
+import '../hooks/useMediaQueries.js';
+import 'react-responsive';
+import 'lodash/maxBy';
+import 'lodash/upperFirst';
+import '../hooks/styleAttributes.js';
+
+function ModalSheetBottom(props) {
+    var children = props.children, isOpenModal = props.isOpenModal, className = props.className, closeButton = props.closeButton, closeModal = props.closeModal;
+    var borderColorClass = useDeviceTargetClass(props, {
+        prefix: 'border-color_',
+        propsKey: 'borderColor',
+    });
+    var fillClass = useDeviceTargetClass(props, {
+        prefix: 'fill_',
+        propsKey: 'fill',
+    });
+    // @ts-expect-error
+    var styles = useStyles(props).styles;
+    return (jsxs(Sheet, __assign({ className: clsx(className, 'modal-sheet-bottom', borderColorClass, fillClass), isOpen: isOpenModal, onClose: closeModal }, props, { children: [jsxs(Sheet.Container, { className: clsx(className, 'modal-sheet-bottom__container', borderColorClass, fillClass), style: styles, children: [closeButton ? (jsx("div", { className: clsx('modal-sheet-bottom__close'), onClick: closeModal, children: closeButton })) : (jsx(Sheet.Header, { className: clsx('modal-sheet-bottom__header') })), jsx(Sheet.Content, { className: clsx('modal-sheet-bottom__content'), children: children })] }), jsx(Sheet.Backdrop, { className: clsx('modal-sheet-bottom__backdrop'), onClick: closeModal })] })));
+}
+
+export { ModalSheetBottom };

package/dist/components/Notification.js

@@ -3,14 +3,13 @@ import clsx from 'clsx';
 import { notificationItemAppearance } from '../appearance/Notification.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { T as Text } from '../Text-kxGZButz.js';
-import { T as Title } from '../Title-CQ_Fr1hO.js';
+import { T as Text } from '../Text-DlSG_p4u.js';
+import { T as Title } from '../Title-mkus84Rh.js';
 import { useNotifications, useNotificationsAPI } from '../context/Notifications.js';
 import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';
@@ -18,7 +17,7 @@ import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 import '../appearance/Text.js';
 import '../appearance/Title.js';
-import '../tslib.es6-w7hdJ3oZ.js';
+import '../tslib.es6-5FtW-kfi.js';
 import 'uuid';
 
 var notificationItemConfig = {
@@ -38,11 +37,13 @@ function NotificationItem(props) {
         propsKey: 'width',
     });
     var appearanceConfig = appearance && notificationItemConfig.appearance && notificationItemConfig.appearance[appearance];
+    // @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, fillClass ||
+    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 ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.width) &&
+                "width_".concat(appearanceConfig.width).replace(/([A-Z])/g, '-$1').toLowerCase()), fillClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
-                "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase())), "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, textColor: titleTextColor ||
-                            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor) && appearanceConfig.titleTextColor), children: title })), text && (jsx(Text, { className: "notification__item-text", size: textSize, textColor: textColor || ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor) && 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] }));
+                "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase())), "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] }));
 }
 
 function NotificationList(props) {

package/dist/components/Overlay.js

@@ -6,7 +6,6 @@ import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/useStyles.js';

package/dist/components/Page.js

@@ -1,12 +1,5 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import alignDirectionProps from '../constants/componentProps/alignDirection.js';
-import alignProps from '../constants/componentProps/align.js';
-import fillProps from '../constants/componentProps/fill.js';
-import horizontalResizeModeProps from '../constants/componentProps/horizontalResizeMode.js';
-import positionProps from '../constants/componentProps/position.js';
-import verticalResizeModeProps from '../constants/componentProps/verticalResizeMode.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
 import 'react';
@@ -20,7 +13,7 @@ import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 
 function Page(props) {
-    var after = props.after, before = props.before, children = props.children, className = props.className, id = props.id; props.tag; var type = props.type;
+    var id = props.id, children = props.children, after = props.after, before = props.before, className = props.className, type = props.type;
     var alignDirectionClass = useDeviceTargetClass(props, {
         prefix: 'align_',
         propsKey: 'alignDirection',
@@ -45,45 +38,9 @@ function Page(props) {
         prefix: 'position_',
         propsKey: 'position',
     });
+    // @ts-expect-error
     var _a = useStyles(props), styles = _a.styles, wrapperStyles = _a.wrapper;
-    return (jsx("div", { id: id, className: clsx('page', className, type && "".concat(className, "_type_").concat(type), fillClass, resizeHorizontalClass, resizeVerticalClass, positionClass), style: styles, children: jsxs("div", { className: clsx('page__wrapper', alignDirectionClass, alignClass, 'content'), style: wrapperStyles, children: [before, children, after] }) }));
+    return (jsx("div", { className: clsx('page', className, type && "".concat(className, "_type_").concat(type), fillClass, resizeHorizontalClass, resizeVerticalClass, positionClass), id: id, style: styles, children: jsxs("div", { className: clsx('page__wrapper', alignDirectionClass, alignClass, 'content'), style: wrapperStyles, children: [before, children, after] }) }));
 }
-Page.propTypes = {
-    children: PropTypes.any,
-    className: PropTypes.string,
-    before: PropTypes.string,
-    after: PropTypes.string,
-    id: PropTypes.string,
-    fill: PropTypes.oneOf(fillProps),
-    fillMobile: PropTypes.oneOf(fillProps),
-    fillTablet: PropTypes.oneOf(fillProps),
-    fillDesktop: PropTypes.oneOf(fillProps),
-    type: PropTypes.string,
-    tag: PropTypes.string,
-    position: PropTypes.oneOf(positionProps),
-    positionMobile: PropTypes.oneOf(positionProps),
-    positionTablet: PropTypes.oneOf(positionProps),
-    positionDesktop: PropTypes.oneOf(positionProps),
-    wrapperPosition: PropTypes.oneOf(positionProps),
-    wrapperPositionMobile: PropTypes.oneOf(positionProps),
-    wrapperPositionTablet: PropTypes.oneOf(positionProps),
-    wrapperPositionDesktop: PropTypes.oneOf(positionProps),
-    horizontalResizing: PropTypes.oneOf(horizontalResizeModeProps),
-    horizontalResizingMobile: PropTypes.oneOf(horizontalResizeModeProps),
-    horizontalResizingTablet: PropTypes.oneOf(horizontalResizeModeProps),
-    horizontalResizingDesktop: PropTypes.oneOf(horizontalResizeModeProps),
-    verticalResizing: PropTypes.oneOf(verticalResizeModeProps),
-    verticalResizingMobile: PropTypes.oneOf(verticalResizeModeProps),
-    verticalResizingTablet: PropTypes.oneOf(verticalResizeModeProps),
-    verticalResizingDesktop: PropTypes.oneOf(verticalResizeModeProps),
-    align: PropTypes.oneOf(alignProps),
-    alignMobile: PropTypes.oneOf(alignProps),
-    alignTablet: PropTypes.oneOf(alignProps),
-    alignDesktop: PropTypes.oneOf(alignProps),
-    alignDirection: PropTypes.oneOf(alignDirectionProps),
-    alignDirectionMobile: PropTypes.oneOf(alignDirectionProps),
-    alignDirectionTablet: PropTypes.oneOf(alignDirectionProps),
-    alignDirectionDesktop: PropTypes.oneOf(alignDirectionProps),
-};
 
 export { Page };

package/dist/components/Pagination.js

@@ -4,27 +4,28 @@ import clsx from 'clsx';
 import ceil from 'lodash/ceil';
 import ReactPaginate from 'react-paginate';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { D as Dropdown, a as DropdownItem } from '../DropdownItem-CFkRx8LX.js';
-import { I as Icon } from '../Icon-ClsRaxDk.js';
-import { T as Text } from '../Text-kxGZButz.js';
+import { D as Dropdown, a as DropdownItem } from '../DropdownItem-DzDP45iO.js';
+import { I as Icon } from '../Icon-B7BJo5kW.js';
+import { T as Text } from '../Text-DlSG_p4u.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../hooks/useStyles.js';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
-import '../Divider-U5UdY-ef.js';
-import '../Link-CzC1kU5C.js';
-import '../tslib.es6-w7hdJ3oZ.js';
+import '../appearance/DropdownItem.js';
+import '../Divider-DE2Q5J36.js';
+import '../appearance/Divider.js';
+import '../Link-CeQuavin.js';
+import '../tslib.es6-5FtW-kfi.js';
 import 'react-inlinesvg';
 import '../appearance/Icon.js';
-import '../Tooltip-ccRCMYQM.js';
+import '../Tooltip-f5EWhsGj.js';
 import '../appearance/Tooltip.js';
-import '../Title-CQ_Fr1hO.js';
+import '../Title-mkus84Rh.js';
 import '../appearance/Title.js';
 import '../appearance/Text.js';
 

package/dist/components/Panel.js

@@ -4,11 +4,10 @@ import clsx from 'clsx';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
 import { G as Group } from '../Group-Dc70Z4_7.js';
-import { T as Text } from '../Text-kxGZButz.js';
+import { T as Text } from '../Text-DlSG_p4u.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';

package/dist/components/Radio.js

@@ -2,12 +2,11 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { radioState, radioAppearance } from '../appearance/Radio.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
-import { T as Text } from '../Text-kxGZButz.js';
+import { T as Text } from '../Text-DlSG_p4u.js';
 import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import '../appearance/Text.js';
@@ -94,7 +93,6 @@ function Radio(props) {
 }
 Radio.defaultProps = {
     shape: 'circular',
-    tag: 'label',
 };
 
 export { Radio, radioConfig };

package/dist/components/RangeSlider.js

@@ -7,7 +7,6 @@ import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';

package/dist/components/Response.js

@@ -5,27 +5,26 @@ import SVG from 'react-inlinesvg';
 import { responseAppearance } from '../appearance/Response.js';
 import { useDeviceTargetClass } from '../hooks/useDeviceTargetClass.js';
 import { useStyles } from '../hooks/useStyles.js';
-import { B as Button } from '../Button-avhviao1.js';
+import { B as Button } from '../Button-DS2l65oq.js';
 import { G as Group } from '../Group-Dc70Z4_7.js';
-import { T as Text } from '../Text-kxGZButz.js';
-import { T as Title } from '../Title-CQ_Fr1hO.js';
+import { T as Text } from '../Text-DlSG_p4u.js';
+import { T as Title } from '../Title-mkus84Rh.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';
 import 'lodash/upperFirst';
 import '../hooks/styleAttributes.js';
 import '../appearance/Button.js';
-import '../Icon-ClsRaxDk.js';
+import '../Icon-B7BJo5kW.js';
+import '../tslib.es6-5FtW-kfi.js';
 import '../appearance/Icon.js';
-import '../Link-CzC1kU5C.js';
-import '../tslib.es6-w7hdJ3oZ.js';
-import '../Tooltip-ccRCMYQM.js';
+import '../Link-CeQuavin.js';
+import '../Tooltip-f5EWhsGj.js';
 import '../appearance/Tooltip.js';
-import '../Loader-CU_5Ydmy.js';
+import '../Loader-CqEocvjh.js';
 import '../appearance/Loader.js';
 import '../appearance/Group.js';
 import '../appearance/Text.js';
@@ -39,15 +38,18 @@ var responseConfig = {
 };
 function Response(props) {
     var 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, title = props.title, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextWeight = props.titleTextWeight, onClickPrimaryButton = props.onClickPrimaryButton, onClickSecondaryButton = props.onClickSecondaryButton;
+    // prettier-ignore
+    var appearanceConfig = (appearance && responseConfig.appearance && responseConfig.appearance[appearance]);
     var ImageComponent = useMemo(function () {
-        if (imageSrc) {
-            if (imageSrc.endsWith('.svg')) {
-                return jsx(SVG, { src: imageSrc });
+        var src = imageSrc || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.imageSrc);
+        if (src) {
+            if (src.endsWith('.svg')) {
+                return jsx(SVG, { src: src });
             }
-            return jsx("img", { src: imageSrc });
+            return jsx("img", { src: src });
         }
         return null;
-    }, [imageSrc]);
+    }, [imageSrc, appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.imageSrc]);
     var fillClass = useDeviceTargetClass(props, {
         prefix: 'fill_',
         propsKey: 'fill',
@@ -78,14 +80,17 @@ function Response(props) {
     });
     // @ts-expect-error
     var responseStyles = useStyles(props).styles;
-    var appearanceConfig = appearance && responseConfig.appearance && responseConfig.appearance[appearance];
     return (jsxs("div", { className: clsx(className, 'response', fillClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
                 "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), fillHoverClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
                 "fill_hover_".concat(appearanceConfig.fillHover).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass ||
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.shape) &&
-                "fill_hover_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, set && "response_set_".concat(set)), style: responseStyles, children: [before, ImageComponent || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.imageSrc), 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, children: message }))] }), (primaryButtonLabel ||
+                "fill_hover_".concat(appearanceConfig.shape).replace(/([A-Z])/g, '-$1').toLowerCase()), borderColorClass ||
+            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
+                "border-color_".concat(appearanceConfig.borderColor)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), borderColorHoverClass, borderWidthClass, borderTypeClass, set && "response_set_".concat(set)), style: responseStyles, children: [before, 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, children: message }))] }), (primaryButtonLabel ||
                 primaryButton ||
                 secondaryButtonLabel ||
                 secondaryButton ||

package/dist/components/SVGContent.js

@@ -6,7 +6,6 @@ import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';

package/dist/components/ScrollOnDrag.js

@@ -1,4 +1,4 @@
-import { a as __assign } from '../tslib.es6-w7hdJ3oZ.js';
+import { _ as __assign } from '../tslib.es6-5FtW-kfi.js';
 import { jsx } from 'react/jsx-runtime';
 import { useRef } from 'react';
 import clsx from 'clsx';
@@ -8,7 +8,6 @@ import { useStyles } from '../hooks/useStyles.js';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';

package/dist/components/ScrollToView.js

@@ -7,7 +7,6 @@ import 'react';
 import 'lodash/castArray';
 import 'lodash/camelCase';
 import '../context/UIContext.js';
-import 'prop-types';
 import '../hooks/useMediaQueries.js';
 import 'react-responsive';
 import 'lodash/maxBy';

package/dist/components/Scrollbar.js

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