@expressms/smartapp-ui 2.8.0 → 2.8.2-alpha.1

package/build/main//321/201omponents/Loader/Loader.js

@@ -10,13 +10,14 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cloneElement } from 'react';
 import classNames from 'classnames';
 import { COLORS, FONT_SIZE, LINE_HEIGHT, THEME } from '../../constants';
 import { generateColor, isDarkTheme } from '../../helpers';
 import { ReactComponent as LoaderIcon } from '../../assets/icons/loader.svg';
 import '../../styles/styles.scss';
 var Loader = function (_a) {
-    var isLoader = _a.isLoader, _b = _a.isFullScreen, isFullScreen = _b === void 0 ? true : _b, _c = _a.isTextItalic, isTextItalic = _c === void 0 ? false : _c, title = _a.title, _d = _a.textSize, textSize = _d === void 0 ? 'small' : _d, _e = _a.width, width = _e === void 0 ? 150 : _e, _f = _a.iconSize, iconSize = _f === void 0 ? 25 : _f, containerClassName = _a.containerClassName, className = _a.className, containerStyles = _a.containerStyles, styles = _a.styles, color = _a.color, backgroundColor = _a.backgroundColor, _g = _a.theme, theme = _g === void 0 ? THEME.default : _g;
+    var isLoader = _a.isLoader, _b = _a.isFullScreen, isFullScreen = _b === void 0 ? true : _b, _c = _a.isTextItalic, isTextItalic = _c === void 0 ? false : _c, title = _a.title, _d = _a.textSize, textSize = _d === void 0 ? 'small' : _d, _e = _a.width, width = _e === void 0 ? 150 : _e, _f = _a.iconSize, iconSize = _f === void 0 ? 25 : _f, containerClassName = _a.containerClassName, className = _a.className, containerStyles = _a.containerStyles, styles = _a.styles, color = _a.color, backgroundColor = _a.backgroundColor, _g = _a.theme, theme = _g === void 0 ? THEME.default : _g, _h = _a.icon, icon = _h === void 0 ? _jsx(LoaderIcon, {}) : _h;
     var loaderColor = generateColor(color, COLORS.blue);
     var generateTextStyles = function () { return ({
         fontSize: FONT_SIZE[textSize],
@@ -31,7 +32,13 @@ var Loader = function (_a) {
     if (!isLoader) {
         return null;
     }
-    return (_jsx("div", __assign({ className: classNames('smartapp-loader-wrapper', { 'smartapp-loader-wrapper__full-screen': isFullScreen }, containerClassName), style: __assign({ background: generateBackgroundColor() }, containerStyles) }, { children: _jsxs("div", __assign({ className: classNames('smartapp-loader', className), style: __assign({ width: "".concat(width, "px") }, styles) }, { children: [_jsx(LoaderIcon, { className: "smartapp-loader__icon", width: iconSize, height: iconSize, style: { color: loaderColor } }), title && (_jsx("p", __assign({ className: "smartapp-loader__title", style: generateTextStyles() }, { children: title })))] })) })));
+    var iconProps = {
+        className: 'smartapp-loader__icon',
+        width: iconSize,
+        height: iconSize,
+        style: { color: loaderColor },
+    };
+    return (_jsx("div", __assign({ className: classNames('smartapp-loader-wrapper', { 'smartapp-loader-wrapper__full-screen': isFullScreen }, containerClassName), style: __assign({ background: generateBackgroundColor() }, containerStyles) }, { children: _jsxs("div", __assign({ className: classNames('smartapp-loader', className), style: __assign({ width: "".concat(width, "px") }, styles) }, { children: [cloneElement(icon, iconProps), title && (_jsx("p", __assign({ className: "smartapp-loader__title", style: generateTextStyles() }, { children: title })))] })) })));
 };
 export default Loader;
 //# sourceMappingURL=Loader.js.map

package/build/main//321/201omponents/Loader/Loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.js","sourceRoot":"","sources":["../../../../src/сomponents/Loader/Loader.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,UAAU,MAAM,YAAY,CAAA;AAEnC,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAA;AACvE,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC1D,OAAO,EAAE,cAAc,IAAI,UAAU,EAAE,MAAM,+BAA+B,CAAA;AAC5E,OAAO,0BAA0B,CAAA;AAEjC,IAAM,MAAM,GAAG,UAAC,EAeD;QAdb,QAAQ,cAAA,EACR,oBAAmB,EAAnB,YAAY,mBAAG,IAAI,KAAA,EACnB,oBAAoB,EAApB,YAAY,mBAAG,KAAK,KAAA,EACpB,KAAK,WAAA,EACL,gBAAkB,EAAlB,QAAQ,mBAAG,OAAO,KAAA,EAClB,aAAW,EAAX,KAAK,mBAAG,GAAG,KAAA,EACX,gBAAa,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,kBAAkB,wBAAA,EAClB,SAAS,eAAA,EACT,eAAe,qBAAA,EACf,MAAM,YAAA,EACN,KAAK,WAAA,EACL,eAAe,qBAAA,EACf,aAAqB,EAArB,KAAK,mBAAG,KAAK,CAAC,OAAO,KAAA;IAErB,IAAM,WAAW,GAAG,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,CAAA;IAErD,IAAM,kBAAkB,GAAG,cAAM,OAAA,CAAC;QAChC,QAAQ,EAAE,SAAS,CAAC,QAAQ,CAAC;QAC7B,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ;QAC7C,UAAU,EAAE,WAAW,CAAC,QAAQ,CAAC;KAClC,CAAC,EAJ+B,CAI/B,CAAA;IAEF,IAAM,uBAAuB,GAAG;QAC9B,IAAM,oBAAoB,GAAG,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAA;QAC7E,IAAM,YAAY,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAA;QAE9E,OAAO,aAAa,CAAC,eAAe,EAAE,YAAY,CAAC,CAAA;IACrD,CAAC,CAAA;IAED,IAAI,CAAC,QAAQ,EAAE;QACb,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,uBACE,SAAS,EAAE,UAAU,CAAC,yBAAyB,EAAE,EAAE,sCAAsC,EAAE,YAAY,EAAE,EAAE,kBAAkB,CAAC,EAC9H,KAAK,aAAI,UAAU,EAAE,uBAAuB,EAAE,IAAK,eAAe,iBAElE,wBAAK,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAE,SAAS,CAAC,EAAE,KAAK,aAAI,KAAK,EAAE,UAAG,KAAK,OAAI,IAAK,MAAM,kBAC/F,KAAC,UAAU,IAAC,SAAS,EAAC,uBAAuB,EAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,GAAI,EACjH,KAAK,IAAI,CACR,qBAAG,SAAS,EAAC,wBAAwB,EAAC,KAAK,EAAE,kBAAkB,EAAE,gBAC9D,KAAK,IACJ,CACL,KACG,IACF,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,MAAM,CAAA"}
+{"version":3,"file":"Loader.js","sourceRoot":"","sources":["../../../../src/сomponents/Loader/Loader.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,UAAU,MAAM,YAAY,CAAA;AAEnC,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAA;AACvE,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC1D,OAAO,EAAE,cAAc,IAAI,UAAU,EAAE,MAAM,+BAA+B,CAAA;AAC5E,OAAO,0BAA0B,CAAA;AAEjC,IAAM,MAAM,GAAG,UAAC,EAgBD;QAfb,QAAQ,cAAA,EACR,oBAAmB,EAAnB,YAAY,mBAAG,IAAI,KAAA,EACnB,oBAAoB,EAApB,YAAY,mBAAG,KAAK,KAAA,EACpB,KAAK,WAAA,EACL,gBAAkB,EAAlB,QAAQ,mBAAG,OAAO,KAAA,EAClB,aAAW,EAAX,KAAK,mBAAG,GAAG,KAAA,EACX,gBAAa,EAAb,QAAQ,mBAAG,EAAE,KAAA,EACb,kBAAkB,wBAAA,EAClB,SAAS,eAAA,EACT,eAAe,qBAAA,EACf,MAAM,YAAA,EACN,KAAK,WAAA,EACL,eAAe,qBAAA,EACf,aAAqB,EAArB,KAAK,mBAAG,KAAK,CAAC,OAAO,KAAA,EACrB,YAAqB,EAArB,IAAI,mBAAG,KAAC,UAAU,KAAG,KAAA;IAErB,IAAM,WAAW,GAAG,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,CAAA;IAErD,IAAM,kBAAkB,GAAG,cAAM,OAAA,CAAC;QAChC,QAAQ,EAAE,SAAS,CAAC,QAAQ,CAAC;QAC7B,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ;QAC7C,UAAU,EAAE,WAAW,CAAC,QAAQ,CAAC;KAClC,CAAC,EAJ+B,CAI/B,CAAA;IAEF,IAAM,uBAAuB,GAAG;QAC9B,IAAM,oBAAoB,GAAG,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAA;QAC7E,IAAM,YAAY,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAA;QAE9E,OAAO,aAAa,CAAC,eAAe,EAAE,YAAY,CAAC,CAAA;IACrD,CAAC,CAAA;IAED,IAAI,CAAC,QAAQ,EAAE;QACb,OAAO,IAAI,CAAA;KACZ;IAED,IAAM,SAAS,GAAG;QAChB,SAAS,EAAE,uBAAuB;QAClC,KAAK,EAAE,QAAQ;QACf,MAAM,EAAE,QAAQ;QAChB,KAAK,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE;KAC9B,CAAA;IAED,OAAO,CACL,uBACE,SAAS,EAAE,UAAU,CAAC,yBAAyB,EAAE,EAAE,sCAAsC,EAAE,YAAY,EAAE,EAAE,kBAAkB,CAAC,EAC9H,KAAK,aAAI,UAAU,EAAE,uBAAuB,EAAE,IAAK,eAAe,iBAElE,wBAAK,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAE,SAAS,CAAC,EAAE,KAAK,aAAI,KAAK,EAAE,UAAG,KAAK,OAAI,IAAK,MAAM,kBAC9F,YAAY,CAAC,IAAI,EAAE,SAAS,CAAC,EAC7B,KAAK,IAAI,CACR,qBAAG,SAAS,EAAC,wBAAwB,EAAC,KAAK,EAAE,kBAAkB,EAAE,gBAC9D,KAAK,IACJ,CACL,KACG,IACF,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,MAAM,CAAA"}

package/build/main//321/201omponents/Loader/types.d.ts

@@ -1,3 +1,4 @@
+import { ReactElement } from 'react';
 import { IThemeProps, TStyles } from '../../constants';
 export interface ILoaderProps extends IThemeProps {
     isLoader: boolean;
@@ -13,4 +14,5 @@ export interface ILoaderProps extends IThemeProps {
     styles?: TStyles;
     color?: string;
     backgroundColor?: string;
+    icon?: ReactElement;
 }

package/build/main//321/201omponents/Modal/Modal.d.ts

@@ -1,4 +1,4 @@
 import { IModalProps } from './types';
 import '../../styles/styles.scss';
-declare const Modal: ({ isModalOpen, isClosableOutside, isCloseIconHidden, modalId, content, bottomContent, handleCloseModal, title, platform, popupClassName, className, popupStyles, styles, titleStyles, contentStyles, iconColor, backgroundColor, isBottomSheet, isDisabledBottomSheet, bottomSheetProps, isCloseButtonDisabled, externalBottomSheetScrollContainer, }: IModalProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const Modal: ({ isModalOpen, isClosableOutside, isCloseIconHidden, isPopup, isBottomSheet, isDisabledBottomSheet, isCloseButtonDisabled, modalId, content, bottomContent, title, platform, popupClassName, className, popupStyles, styles, titleStyles, contentStyles, iconColor, backgroundColor, modalMaxHeight, bottomSheetProps, externalBottomSheetScrollContainer, contextMenuProps, handleCloseModal, }: IModalProps) => import("react/jsx-runtime").JSX.Element | null;
 export default Modal;

package/build/main//321/201omponents/Modal/Modal.js

@@ -9,13 +9,26 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from 'react';
 import classNames from 'classnames';
 import ScrollBar from '../ScrollBar';
+import ContextMenu from '../ContextMenu';
 import { DEFAULT_SCROLL_BAR_HEIGHT } from '../ScrollBar/ScrollBar';
 import { ReactComponent as CloseIcon } from '../../assets/icons/cancel-cross.svg';
-import { PLATFORM } from '../../constants';
+import { ReactComponent as MoreIcon } from '../../assets/icons/more.svg';
+import { EVENT_LISTENER_TYPES, PLATFORM } from '../../constants';
 import { checkIfContentIsCentered, generateClassNames, generateColor, generateIsCloseIconHidden, generateBottomSheetClassName, isMobilePlatform, } from '../../helpers';
 import { useModal } from '../../hooks/useModal';
 import '../../styles/styles.scss';
@@ -25,7 +38,7 @@ var CONTENT_PADDING_TOP = 20;
 var MODAL_TITLE_MARGIN_BOTTOM = 16;
 var MODAL_MARGIN_SIZE_MOBILE = 136;
 var Modal = function (_a) {
-    var isModalOpen = _a.isModalOpen, _b = _a.isClosableOutside, isClosableOutside = _b === void 0 ? true : _b, isCloseIconHidden = _a.isCloseIconHidden, modalId = _a.modalId, content = _a.content, bottomContent = _a.bottomContent, handleCloseModal = _a.handleCloseModal, title = _a.title, _c = _a.platform, platform = _c === void 0 ? PLATFORM.web : _c, popupClassName = _a.popupClassName, className = _a.className, popupStyles = _a.popupStyles, styles = _a.styles, titleStyles = _a.titleStyles, contentStyles = _a.contentStyles, iconColor = _a.iconColor, backgroundColor = _a.backgroundColor, _d = _a.isBottomSheet, isBottomSheet = _d === void 0 ? false : _d, _e = _a.isDisabledBottomSheet, isDisabledBottomSheet = _e === void 0 ? false : _e, bottomSheetProps = _a.bottomSheetProps, _f = _a.isCloseButtonDisabled, isCloseButtonDisabled = _f === void 0 ? false : _f, externalBottomSheetScrollContainer = _a.externalBottomSheetScrollContainer;
+    var isModalOpen = _a.isModalOpen, _b = _a.isClosableOutside, isClosableOutside = _b === void 0 ? true : _b, isCloseIconHidden = _a.isCloseIconHidden, isPopup = _a.isPopup, _c = _a.isBottomSheet, isBottomSheet = _c === void 0 ? false : _c, _d = _a.isDisabledBottomSheet, isDisabledBottomSheet = _d === void 0 ? false : _d, _e = _a.isCloseButtonDisabled, isCloseButtonDisabled = _e === void 0 ? false : _e, modalId = _a.modalId, content = _a.content, bottomContent = _a.bottomContent, title = _a.title, _f = _a.platform, platform = _f === void 0 ? PLATFORM.web : _f, popupClassName = _a.popupClassName, className = _a.className, popupStyles = _a.popupStyles, styles = _a.styles, titleStyles = _a.titleStyles, contentStyles = _a.contentStyles, iconColor = _a.iconColor, backgroundColor = _a.backgroundColor, modalMaxHeight = _a.modalMaxHeight, bottomSheetProps = _a.bottomSheetProps, externalBottomSheetScrollContainer = _a.externalBottomSheetScrollContainer, contextMenuProps = _a.contextMenuProps, handleCloseModal = _a.handleCloseModal;
     var ref = useRef(null);
     var titleRef = useRef(null);
     var scrollableContentRef = useRef(null);
@@ -47,8 +60,9 @@ var Modal = function (_a) {
     }), shouldUseBottomSheet = _h.shouldUseBottomSheet, renderModal = _h.renderModal;
     var additionalClassName = generateBottomSheetClassName(platform, shouldUseBottomSheet);
     var isCloseIconInvisible = generateIsCloseIconHidden(platform, isCloseIconHidden);
-    var MAX_MODAL_HEIGHT = window.innerHeight - (isMobilePlatform(platform) ? MODAL_MARGIN_SIZE_MOBILE : 2 * MODAL_MARGIN_SIZE_WEB);
-    var handleMouseDown = function (event) { return event.stopPropagation(); };
+    var modalMargins = isMobilePlatform(platform) ? MODAL_MARGIN_SIZE_MOBILE : 2 * MODAL_MARGIN_SIZE_WEB;
+    var MAX_MODAL_HEIGHT = modalMaxHeight || window.innerHeight - modalMargins;
+    var handleMouseDown = function (event) { return !isPopup && event.stopPropagation(); };
     var handleSetContainerHeight = function (contentRef) {
         var _a, _b;
         if (!contentRef)
@@ -70,23 +84,42 @@ var Modal = function (_a) {
                 handleCloseModal();
             }
         };
-        document === null || document === void 0 ? void 0 : document.addEventListener('click', checkIfClickedOutside, true);
+        !isPopup && (document === null || document === void 0 ? void 0 : document.addEventListener(EVENT_LISTENER_TYPES.click, checkIfClickedOutside, true));
         return function () {
-            document === null || document === void 0 ? void 0 : document.removeEventListener('click', checkIfClickedOutside, true);
+            document === null || document === void 0 ? void 0 : document.removeEventListener(EVENT_LISTENER_TYPES.click, checkIfClickedOutside, true);
         };
-    }, [isModalOpen, isClosableOutside, handleCloseModal]);
+    }, [isModalOpen, isClosableOutside, handleCloseModal, isPopup]);
+    var renderTitle = function () {
+        return title && (_jsxs("div", { children: [!isCloseIconInvisible && renderCloseIconSpace({ elementRef: titleRef, isLarge: true }), _jsx("p", __assign({ ref: titleRef, className: "smartapp-modal__content--title", style: titleStyles }, { children: title }))] }));
+    };
+    var renderCloseIcon = function () {
+        return !isCloseIconInvisible && (_jsx("div", __assign({ onClick: !isCloseButtonDisabled ? handleCloseModal : function () { }, className: classNames('smartapp-modal__content--close-icon', {
+                'smartapp-modal__content--close-icon__disabled': isCloseButtonDisabled,
+            }) }, { children: _jsx(CloseIcon, { style: { color: generateColor(iconColor) } }) })));
+    };
     var renderCloseIconSpace = function (_a) {
         var elementRef = _a.elementRef, _b = _a.isLarge, isLarge = _b === void 0 ? false : _b, _c = _a.isContent, isContent = _c === void 0 ? false : _c;
+        var isContentCentered = checkIfContentIsCentered(elementRef);
         return (_jsx("div", { className: classNames('close-icon-space', {
                 'close-icon-space__large': isLarge,
+                'close-icon-space__large--with-context-menu': isLarge && contextMenuProps,
                 'close-icon-space__content': isContent,
-                'close-icon-space__centered': checkIfContentIsCentered(elementRef),
+                'close-icon-space__content--with-context-menu': isContent && contextMenuProps,
+                'close-icon-space__centered': isContentCentered,
+                'close-icon-space__centered--with-context-menu': isContentCentered && contextMenuProps,
             }) }));
     };
-    var modalContent = (_jsx("div", __assign({ ref: ref, className: classNames('smartapp-modal', { 'smartapp-modal__bottom-sheet': shouldUseBottomSheet }, className), style: styles, onMouseDown: handleMouseDown }, { children: _jsxs("div", __assign({ className: generateClassNames({ className: 'smartapp-modal__content', delimiter: '--', additionalClassName: additionalClassName }), style: contentStyles }, { children: [title && (_jsxs("div", { children: [!isCloseIconInvisible && renderCloseIconSpace({ elementRef: titleRef, isLarge: true }), _jsx("p", __assign({ ref: titleRef, className: "smartapp-modal__content--title", style: titleStyles }, { children: title }))] })), !isCloseIconInvisible && (_jsx("div", __assign({ onClick: !isCloseButtonDisabled ? handleCloseModal : function () { }, className: classNames('smartapp-modal__content--close-icon', {
-                        'smartapp-modal__content--close-icon__disabled': isCloseButtonDisabled,
-                    }) }, { children: _jsx(CloseIcon, { style: { color: generateColor(iconColor) } }) }))), _jsx(ScrollBar, { contentId: modalId, scrollerProps: { elementRef: function (el) { return (scrollerRef.current = el); } }, content: _jsxs("div", __assign({ ref: handleSetContainerHeight, className: classNames('smartapp-modal__content--pr', { 'smartapp-modal__content--pb': !bottomContent }) }, { children: [!title && !isCloseIconInvisible && renderCloseIconSpace({ elementRef: scrollableContentRef, isContent: true }), _jsx("div", __assign({ ref: scrollableContentRef }, { children: content }))] })), containerHeight: containerHeight, trackHeight: bottomContent ? DEFAULT_SCROLL_BAR_HEIGHT : SCROLL_BAR_HEIGHT_WITH_PADDING }), bottomContent && (_jsx("div", __assign({ ref: bottomContentRef, className: classNames('smartapp-modal__content--bottom', 'smartapp-modal__content--pr', 'smartapp-modal__content--pb') }, { children: bottomContent })))] })) })));
-    return renderModal(modalContent);
+    var renderContextMenuIcon = function () {
+        if (contextMenuProps) {
+            var openMenu = contextMenuProps.openMenu, isMenuOpen = contextMenuProps.isMenuOpen, remainingProps = __rest(contextMenuProps, ["openMenu", "isMenuOpen"]);
+            return (_jsxs("div", __assign({ className: classNames('smartapp-modal__content--context-menu-icon', { 'smartapp-modal__content--context-menu-icon__active': isMenuOpen }), onClick: openMenu }, { children: [_jsx(MoreIcon, {}), _jsx(ContextMenu, __assign({ isMenuOpen: isMenuOpen }, remainingProps))] })));
+        }
+    };
+    var renderBottomContent = function () {
+        return bottomContent && (_jsx("div", __assign({ ref: bottomContentRef, className: classNames('smartapp-modal__content--bottom', 'smartapp-modal__content--pr', 'smartapp-modal__content--pb') }, { children: bottomContent })));
+    };
+    var modalContent = (_jsx("div", __assign({ ref: ref, className: classNames('smartapp-modal', { 'smartapp-modal__bottom-sheet': shouldUseBottomSheet }, className), style: styles, onMouseDown: handleMouseDown }, { children: _jsxs("div", __assign({ className: generateClassNames({ className: 'smartapp-modal__content', delimiter: '--', additionalClassName: additionalClassName }), style: contentStyles }, { children: [renderTitle(), _jsxs("div", __assign({ className: "smartapp-modal__content--icons" }, { children: [renderContextMenuIcon(), renderCloseIcon()] })), _jsx(ScrollBar, { contentId: modalId, scrollerProps: { elementRef: function (el) { return (scrollerRef.current = el); } }, content: _jsxs("div", __assign({ ref: handleSetContainerHeight, className: classNames('smartapp-modal__content--pr', { 'smartapp-modal__content--pb': !bottomContent }) }, { children: [!title && !isCloseIconInvisible && renderCloseIconSpace({ elementRef: scrollableContentRef, isContent: true }), _jsx("div", __assign({ ref: scrollableContentRef }, { children: content }))] })), containerHeight: containerHeight, trackHeight: bottomContent ? DEFAULT_SCROLL_BAR_HEIGHT : SCROLL_BAR_HEIGHT_WITH_PADDING }), renderBottomContent()] })) })));
+    return isPopup ? modalContent : renderModal(modalContent);
 };
 export default Modal;
 //# sourceMappingURL=Modal.js.map

package/build/main//321/201omponents/Modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../../src/сomponents/Modal/Modal.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../../src/сomponents/Modal/Modal.tsx"],"names":[],"mappings":"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"}

package/build/main//321/201omponents/Modal/types.d.ts

@@ -1,14 +1,18 @@
-import { ReactElement, RefObject } from 'react';
+import React, { ReactElement, RefObject } from 'react';
 import { BottomSheetProps } from 'alex.chus-react-spring-bottom-sheet';
 import { ICommonProps, TStyles } from '../../constants';
+import { IContextMenuProps } from '../ContextMenu/types';
 export interface IModalProps extends ICommonProps {
     isModalOpen: boolean;
     isClosableOutside?: boolean;
     isCloseIconHidden?: boolean;
+    isCloseButtonDisabled?: boolean;
+    isPopup?: boolean;
+    isBottomSheet?: boolean;
+    isDisabledBottomSheet?: boolean;
     modalId?: string;
     content: ReactElement;
     bottomContent?: ReactElement;
-    handleCloseModal: () => void;
     title?: string;
     popupClassName?: string;
     className?: string;
@@ -18,9 +22,11 @@ export interface IModalProps extends ICommonProps {
     contentStyles?: TStyles;
     iconColor?: string;
     backgroundColor?: string;
-    isBottomSheet?: boolean;
-    isDisabledBottomSheet?: boolean;
+    modalMaxHeight?: number;
     bottomSheetProps?: Partial<BottomSheetProps>;
-    isCloseButtonDisabled?: boolean;
     externalBottomSheetScrollContainer?: RefObject<HTMLDivElement | null>;
+    contextMenuProps?: IContextMenuProps & {
+        openMenu: (event?: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    };
+    handleCloseModal: () => void;
 }

package/build/main//321/201omponents/ScrollBar/ScrollBar.d.ts

@@ -1,5 +1,5 @@
 import { IScrollBarProps } from './types';
 import '../../styles/styles.scss';
 export declare const DEFAULT_SCROLL_BAR_HEIGHT = "100%";
-declare const ScrollBar: ({ platform, contentId, content, handleScroll, hideDuration, containerHeight, trackHeight, containerClassName, containerStyles, scrollbarRef, ...restProps }: IScrollBarProps) => import("react/jsx-runtime").JSX.Element;
+declare const ScrollBar: ({ platform, contentId, content, handleScroll, hideDuration, containerHeight, trackHeight, containerClassName, containerStyles, scrollbarRef, containerScrollRef, ...restProps }: IScrollBarProps) => import("react/jsx-runtime").JSX.Element;
 export default ScrollBar;

package/build/main//321/201omponents/ScrollBar/ScrollBar.js

@@ -31,7 +31,7 @@ export var DEFAULT_SCROLL_BAR_HEIGHT = '100%';
 var HIDE_THUMB_CLASSNAME = 'smartapp-scroll__thumb';
 var SHOW_THUMB_CLASSNAME = "".concat(HIDE_THUMB_CLASSNAME, "--show ").concat(HIDE_THUMB_CLASSNAME);
 var ScrollBar = function (_a) {
-    var _b = _a.platform, platform = _b === void 0 ? PLATFORM.web : _b, contentId = _a.contentId, content = _a.content, handleScroll = _a.handleScroll, _c = _a.hideDuration, hideDuration = _c === void 0 ? DEFAULT_SCROLL_BAR_HIDE_DURATION : _c, _d = _a.containerHeight, containerHeight = _d === void 0 ? DEFAULT_SCROLL_BAR_HEIGHT : _d, _e = _a.trackHeight, trackHeight = _e === void 0 ? DEFAULT_SCROLL_BAR_HEIGHT : _e, containerClassName = _a.containerClassName, containerStyles = _a.containerStyles, scrollbarRef = _a.scrollbarRef, restProps = __rest(_a, ["platform", "contentId", "content", "handleScroll", "hideDuration", "containerHeight", "trackHeight", "containerClassName", "containerStyles", "scrollbarRef"]);
+    var _b = _a.platform, platform = _b === void 0 ? PLATFORM.web : _b, contentId = _a.contentId, content = _a.content, handleScroll = _a.handleScroll, _c = _a.hideDuration, hideDuration = _c === void 0 ? DEFAULT_SCROLL_BAR_HIDE_DURATION : _c, _d = _a.containerHeight, containerHeight = _d === void 0 ? DEFAULT_SCROLL_BAR_HEIGHT : _d, _e = _a.trackHeight, trackHeight = _e === void 0 ? DEFAULT_SCROLL_BAR_HEIGHT : _e, containerClassName = _a.containerClassName, containerStyles = _a.containerStyles, scrollbarRef = _a.scrollbarRef, containerScrollRef = _a.containerScrollRef, restProps = __rest(_a, ["platform", "contentId", "content", "handleScroll", "hideDuration", "containerHeight", "trackHeight", "containerClassName", "containerStyles", "scrollbarRef", "containerScrollRef"]);
     var _f = useState(generateId()), scrollbarKey = _f[0], setScrollbarKey = _f[1];
     var _g = useState(false), scrolling = _g[0], setScrolling = _g[1];
     useEffect(function () {
@@ -57,7 +57,7 @@ var ScrollBar = function (_a) {
         }),
         style: generateScrollerStyles(),
     }); };
-    return (_jsx("div", __assign({ style: __assign({ height: containerHeight }, containerStyles), className: classNames('smartapp-scroll', containerClassName) }, { children: _jsx(Scrollbar, __assign({ ref: scrollbarRef, native: false, mobileNative: false, removeTracksWhenNotUsed: true, onScroll: onScroll, wrapperProps: { className: 'smartapp-scroll__wrapper' }, thumbYProps: { className: generateThumbClassName() }, trackYProps: generateTrackYProps() }, restProps, { children: content }), scrollbarKey) })));
+    return (_jsx("div", __assign({ ref: containerScrollRef, style: __assign({ height: containerHeight }, containerStyles), className: classNames('smartapp-scroll', containerClassName) }, { children: _jsx(Scrollbar, __assign({ ref: scrollbarRef, native: false, mobileNative: false, removeTracksWhenNotUsed: true, onScroll: onScroll, wrapperProps: { className: 'smartapp-scroll__wrapper' }, thumbYProps: { className: generateThumbClassName() }, trackYProps: generateTrackYProps() }, restProps, { children: content }), scrollbarKey) })));
 };
 export default ScrollBar;
 //# sourceMappingURL=ScrollBar.js.map

package/build/main//321/201omponents/ScrollBar/ScrollBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollBar.js","sourceRoot":"","sources":["../../../../src/сomponents/ScrollBar/ScrollBar.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ScrollBar.js","sourceRoot":"","sources":["../../../../src/сomponents/ScrollBar/ScrollBar.tsx"],"names":[],"mappings":"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"}

package/build/main//321/201omponents/ScrollBar/types.d.ts

@@ -15,5 +15,6 @@ export interface IScrollBarProps extends Omit<ScrollbarProps, 'content' | 'ref'>
     content: ReactNode;
     contentId?: string;
     scrollbarRef?: TScrollbarRef;
+    containerScrollRef?: React.Ref<HTMLDivElement>;
 }
 export {};

package/build/main//321/201omponents/Skeleton/Skeleton.d.ts

@@ -1,3 +1,3 @@
 import { ISkeletonProps } from './types';
 import '../../styles/styles.scss';
-export declare const Skeleton: ({ className, styles, baseColor, width, height, borderRadius, circle, theme, containerRef, animationDuration, initialOffset, }: ISkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Skeleton: ({ className, styles, baseColor, width, height, borderRadius, circle, containerRef, animationDuration, initialOffset, }: ISkeletonProps) => import("react/jsx-runtime").JSX.Element;

package/build/main//321/201omponents/Skeleton/Skeleton.js

@@ -5,31 +5,22 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from 'react';
 import styled, { css, keyframes } from 'styled-components';
-import { COLORS, THEME } from '../../constants';
-import { generateColor, isDarkTheme as checkIsDarkTheme } from '../../helpers';
+import { generateColor } from '../../helpers';
 import '../../styles/styles.scss';
-// animation gradient size
-var startEdgeGradientSizeDefault = '8.26%';
-var startEdgeGradientSizeDark = '0%';
-var centerGradientSizeDefault = '39.24%';
-var centerGradientSizeDark = '46.36%';
-var endEdgeGradientSizeDefault = '70.22%';
-var endEdgeGradientSizeDark = '100%';
 export var Skeleton = function (_a) {
-    var className = _a.className, styles = _a.styles, baseColor = _a.baseColor, width = _a.width, height = _a.height, _b = _a.borderRadius, borderRadius = _b === void 0 ? 8 : _b, circle = _a.circle, _c = _a.theme, theme = _c === void 0 ? THEME.default : _c, 
+    var className = _a.className, styles = _a.styles, baseColor = _a.baseColor, width = _a.width, height = _a.height, _b = _a.borderRadius, borderRadius = _b === void 0 ? 8 : _b, circle = _a.circle, 
     // needed to determine the offset, the left border must coincide with the left border of the skeletons (without padding in container)
     containerRef = _a.containerRef, 
     // if not default, then it must be specified for all skeletons
-    _d = _a.animationDuration, 
+    _c = _a.animationDuration, 
     // if not default, then it must be specified for all skeletons
-    animationDuration = _d === void 0 ? 2 : _d, 
+    animationDuration = _c === void 0 ? 2 : _c, 
     // equal to gradient width
-    _e = _a.initialOffset, 
+    _d = _a.initialOffset, 
     // equal to gradient width
-    initialOffset = _e === void 0 ? -230 : _e;
+    initialOffset = _d === void 0 ? -230 : _d;
     var skeletonRef = useRef(null);
-    var _f = useState({ container: { left: 0, width: 0 }, item: { left: 0, width: 0 } }), position = _f[0], setPosition = _f[1];
-    var isDarkTheme = checkIsDarkTheme(theme);
+    var _e = useState({ container: { left: 0, width: 0 }, item: { left: 0, width: 0 } }), position = _e[0], setPosition = _e[1];
     //after mount set offset sizes
     useEffect(function () {
         var containerRefCurrent = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current;
@@ -49,22 +40,16 @@ export var Skeleton = function (_a) {
         return { startOffset: startOffset, finalOffset: finalOffset };
     };
     var skeletonBackgroundColor = generateColor(baseColor, 'var(--color-input-primary)');
-    var skeletonGradientCenter = isDarkTheme ? COLORS.skeletonDarkGradientCenter : COLORS.skeletonGradientCenter;
-    var skeletonGradientEdge = COLORS.skeletonGradientEdge;
-    var startEdgeGradientSize = isDarkTheme ? startEdgeGradientSizeDark : startEdgeGradientSizeDefault;
-    var centerGradientSize = isDarkTheme ? centerGradientSizeDark : centerGradientSizeDefault;
-    var endEdgeGradientSize = isDarkTheme ? endEdgeGradientSizeDark : endEdgeGradientSizeDefault;
     var skeletonCSS = {
         width: width,
         height: circle ? width : height,
         minWidth: circle ? width : 0,
         borderRadius: circle ? '50%' : borderRadius,
         backgroundColor: skeletonBackgroundColor,
-        backgroundImage: "linear-gradient(\n      90deg,\n      ".concat(skeletonGradientEdge, " ").concat(startEdgeGradientSize, ",\n      ").concat(skeletonGradientCenter, " ").concat(centerGradientSize, ",\n      ").concat(skeletonGradientEdge, " ").concat(endEdgeGradientSize, "\n    );"),
     };
     return (_jsx(StyledSkeleton, { "$animationDuration": animationDuration, "$initialOffset": calculateOffset().startOffset, "$finalOffset": calculateOffset().finalOffset, "$CSS": skeletonCSS, ref: skeletonRef, className: className, style: styles }));
 };
-var StyledSkeleton = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n  overflow: hidden;\n  background-size: 230px;\n  background-repeat: no-repeat;\n  ", ";\n"], ["\n  position: relative;\n  overflow: hidden;\n  background-size: 230px;\n  background-repeat: no-repeat;\n  ", ";\n"])), function (_a) {
+var StyledSkeleton = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n  overflow: hidden;\n  background-size: 230px;\n  background-repeat: no-repeat;\n  background-image: linear-gradient(\n    90deg,\n    var(--color-skeleton-gradient-edge) var(--skeleton-start-edge-gradient-size),\n    var(--color-skeleton-gradient-center) var(--skeleton-center-gradient-size),\n    var(--color-skeleton-gradient-edge) var(--skeleton-end-edge-gradient-size)\n  );\n  ", ";\n"], ["\n  position: relative;\n  overflow: hidden;\n  background-size: 230px;\n  background-repeat: no-repeat;\n  background-image: linear-gradient(\n    90deg,\n    var(--color-skeleton-gradient-edge) var(--skeleton-start-edge-gradient-size),\n    var(--color-skeleton-gradient-center) var(--skeleton-center-gradient-size),\n    var(--color-skeleton-gradient-edge) var(--skeleton-end-edge-gradient-size)\n  );\n  ", ";\n"])), function (_a) {
     var $CSS = _a.$CSS, $animationDuration = _a.$animationDuration, $initialOffset = _a.$initialOffset, $finalOffset = _a.$finalOffset;
     return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    animation: ", " ", "s infinite linear;\n    ", ";\n  "], ["\n    animation: ", " ", "s infinite linear;\n    ", ";\n  "])), flash($initialOffset, $finalOffset), $animationDuration, $CSS);
 });

package/build/main//321/201omponents/Skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../../src/сomponents/Skeleton/Skeleton.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../../src/сomponents/Skeleton/Skeleton.tsx"],"names":[],"mappings":"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"}

package/build/main//321/201omponents/Stories/Stories.js

@@ -9,7 +9,9 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var _a, _b;
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable max-lines */
 import { useCallback, useEffect, useLayoutEffect, useState } from 'react';
 import classNames from 'classnames';
 import { isNull, sortBy, isEmpty } from 'lodash';
@@ -49,26 +51,53 @@ var progressStyles = {
     background: 'rgba(255, 255, 255, 1)',
 };
 var DEFAULT_STORY_DURATION = 5000;
-var IMAGE_PADDINGS = 48;
-var PERCENTAGE_OF_IMAGE_WIDTH = 82.7;
+var STORY_SIZE;
+(function (STORY_SIZE) {
+    STORY_SIZE["xs"] = "xs";
+    STORY_SIZE["sm"] = "sm";
+    STORY_SIZE["l"] = "l";
+})(STORY_SIZE || (STORY_SIZE = {}));
+var STORY_SIZE_HEIGHT = (_a = {},
+    _a[STORY_SIZE.xs] = 620,
+    _a[STORY_SIZE.sm] = 768,
+    _a[STORY_SIZE.l] = 812,
+    _a);
+var STORY_WIDTH_BREAKPOINT = (_b = {},
+    _b[STORY_SIZE.xs] = 377,
+    _b[STORY_SIZE.sm] = 399,
+    _b);
+var generateSize = function (width, height) {
+    var isSizeXS = width < STORY_WIDTH_BREAKPOINT[STORY_SIZE.xs] || height < STORY_SIZE_HEIGHT[STORY_SIZE.sm];
+    var isSizeSM = width < STORY_WIDTH_BREAKPOINT[STORY_SIZE.sm] || height < STORY_SIZE_HEIGHT[STORY_SIZE.l];
+    if (isSizeXS)
+        return STORY_SIZE.xs;
+    if (isSizeSM)
+        return STORY_SIZE.sm;
+    return STORY_SIZE.l;
+};
+var PERCENTAGE_OF_IMAGE_WIDTH = 0.827;
 var StoriesComponent = function (_a) {
-    var _b, _c;
-    var _d;
-    var _e = _a.platform, platform = _e === void 0 ? PLATFORM.web : _e, _f = _a.fontFamily, fontFamily = _f === void 0 ? DEFAULT_FONT_FAMILY : _f, contentClassName = _a.contentClassName, contentStyles = _a.contentStyles, groupStories = _a.groupStories, allGroupsStories = _a.allGroupsStories, changeStoryToViewed = _a.changeStoryToViewed, changeGroupStoriesToViewed = _a.changeGroupStoriesToViewed, handleCloseGroupStories = _a.handleCloseGroupStories;
+    var _b;
+    var _c = _a.platform, platform = _c === void 0 ? PLATFORM.web : _c, _d = _a.fontFamily, fontFamily = _d === void 0 ? DEFAULT_FONT_FAMILY : _d, contentClassName = _a.contentClassName, contentStyles = _a.contentStyles, groupStories = _a.groupStories, allGroupsStories = _a.allGroupsStories, changeStoryToViewed = _a.changeStoryToViewed, changeGroupStoriesToViewed = _a.changeGroupStoriesToViewed, handleCloseGroupStories = _a.handleCloseGroupStories;
     var sortStoriesByOrder = function (stories) { return sortBy(stories, ['order']); };
     var generateActiveGroupStoriesIndex = function () { return allGroupsStories.findIndex(function (_a) {
         var id = _a.id;
         return id === (activeGroupStories === null || activeGroupStories === void 0 ? void 0 : activeGroupStories.id);
     }); };
-    var _g = useState(groupStories), activeGroupStories = _g[0], setActiveGroupStories = _g[1];
-    var _h = useState(sortStoriesByOrder((groupStories === null || groupStories === void 0 ? void 0 : groupStories.stories) || [])), stories = _h[0], setStories = _h[1];
-    var _j = useState((_d = stories[0]) === null || _d === void 0 ? void 0 : _d.id), activeStoryId = _j[0], setActiveStoryId = _j[1];
-    var _k = useState(false), isAnimateToRight = _k[0], setIsAnimateToRight = _k[1];
-    var _l = useState(false), isAnimateToLeft = _l[0], setIsAnimateToLeft = _l[1];
+    var _e = useState(groupStories), activeGroupStories = _e[0], setActiveGroupStories = _e[1];
+    var _f = useState(sortStoriesByOrder((groupStories === null || groupStories === void 0 ? void 0 : groupStories.stories) || [])), stories = _f[0], setStories = _f[1];
+    var _g = useState((_b = stories[0]) === null || _b === void 0 ? void 0 : _b.id), activeStoryId = _g[0], setActiveStoryId = _g[1];
+    var _h = useState(false), isAnimateToRight = _h[0], setIsAnimateToRight = _h[1];
+    var _j = useState(false), isAnimateToLeft = _j[0], setIsAnimateToLeft = _j[1];
     var activeStory = stories.find(function (_a) {
         var id = _a.id;
         return id === activeStoryId;
     });
+    var popupElement = document.querySelector('.smartapp-stories-content');
+    var containerHeight = (popupElement === null || popupElement === void 0 ? void 0 : popupElement.offsetHeight) || 0;
+    var containerWidth = (popupElement === null || popupElement === void 0 ? void 0 : popupElement.offsetWidth) || 0;
+    var size = generateSize(containerWidth, containerHeight);
+    var isShowCloseIconInsideStory = STORY_SIZE_HEIGHT[size] < containerHeight;
     var isColorOnBackground = function (type) { return type === STORY_BACKGROUND_TYPES.color; };
     var isImageOnBackground = function (_a) {
         var type = _a.type;
@@ -141,15 +170,13 @@ var StoriesComponent = function (_a) {
                 var action = _a.action;
                 // eslint-disable-next-line react-hooks/rules-of-hooks
                 var _b = useState(false), isImageLoaded = _b[0], setIsImageLoaded = _b[1];
-                // eslint-disable-next-line react-hooks/rules-of-hooks
-                var _c = useState(0), storyWidth = _c[0], setStoryWidth = _c[1];
-                var imageContainerWidth = storyWidth - IMAGE_PADDINGS;
-                var imageContainerHeight = (imageContainerWidth * PERCENTAGE_OF_IMAGE_WIDTH) / 100;
                 var isLoaderVisible = image && (!isImageLoaded || isAnimateToLeft || isAnimateToRight);
+                var storyContainer = document.querySelector('.smartapp-stories');
+                var containerWidth = (storyContainer === null || storyContainer === void 0 ? void 0 : storyContainer.offsetWidth) || 0;
+                var imageContainerHeight = containerWidth * PERCENTAGE_OF_IMAGE_WIDTH;
                 // eslint-disable-next-line react-hooks/rules-of-hooks
                 useLayoutEffect(function () {
                     setActiveStoryId(id);
-                    setStoryElementWidth();
                 }, []);
                 // eslint-disable-next-line react-hooks/rules-of-hooks
                 useLayoutEffect(function () {
@@ -158,19 +185,13 @@ var StoriesComponent = function (_a) {
                     return function () { return clearTimeout(timeoutId); };
                     // eslint-disable-next-line
                 }, [isLoaderVisible]);
-                var setStoryElementWidth = function () {
-                    var storyElement = document.querySelector('.smartapp-stories__story');
-                    var storyElementWidth = (storyElement === null || storyElement === void 0 ? void 0 : storyElement.getBoundingClientRect().width) || 0;
-                    setStoryWidth(storyElementWidth);
-                };
                 var handleImageLoad = function () {
                     setTimeout(function () {
                         action('play');
                         setIsImageLoaded(true);
                     }, 0);
                 };
-                window.onresize = setStoryElementWidth;
-                return (_jsx("div", __assign({ style: generateStoryStyles(backgroundSource) }, { children: _jsxs("div", __assign({ style: __assign({ fontFamily: "".concat(fontFamily, ", sans-serif") }, contentStyles), className: classNames('smartapp-stories__story', { 'smartapp-stories__story--image-bg': isImageOnBackground(backgroundSource) }, contentClassName) }, { children: [_jsxs("div", __assign({ style: { opacity: isLoaderVisible ? '0' : '1' } }, { children: [image && (_jsx("div", __assign({ className: "smartapp-stories__story--image", style: { width: "".concat(imageContainerWidth, "px"), height: "".concat(imageContainerHeight, "px") } }, { children: _jsx("img", { src: image, alt: "", onLoad: handleImageLoad, onError: handleImageLoad }) }))), title && _jsx("div", __assign({ className: "smartapp-stories__story--title" }, { children: title })), body && _jsx("div", __assign({ className: "smartapp-stories__story--body" }, { children: body })), button && (_jsxs("div", __assign({ style: {
+                return (_jsx("div", __assign({ style: generateStoryStyles(backgroundSource) }, { children: _jsxs("div", __assign({ style: __assign({ fontFamily: "".concat(fontFamily, ", sans-serif") }, contentStyles), className: classNames('smartapp-stories__story', { 'smartapp-stories__story--image-bg': isImageOnBackground(backgroundSource) }, contentClassName) }, { children: [_jsxs("div", __assign({ style: { opacity: isLoaderVisible ? '0' : '1' } }, { children: [image && (_jsx("div", __assign({ className: "smartapp-stories__story--image", style: { maxHeight: "".concat(imageContainerHeight, "px") } }, { children: _jsx("img", { src: image, alt: "", onLoad: handleImageLoad, onError: handleImageLoad }) }))), title && _jsx("div", __assign({ className: "smartapp-stories__story--title" }, { children: title })), body && _jsx("div", __assign({ className: "smartapp-stories__story--body" }, { children: body })), button && (_jsxs("div", __assign({ style: {
                                             color: generateColor(button.textColor, COLORS.darkBlack),
                                             background: generateColor(button.backgroundColor, COLORS.white),
                                         }, className: classNames('smartapp-stories__story--button', "smartapp-stories__story--button__".concat(platform), {
@@ -264,18 +285,12 @@ var StoriesComponent = function (_a) {
     if (isNull(activeGroupStories)) {
         return null;
     }
-    return (_jsxs(Popup, __assign({ className: "smartapp-stories", open: true }, { children: [_jsx("div", __assign({ className: classNames((_b = {
-                        'smartapp-stories': true
-                    },
-                    _b["smartapp-stories__".concat(platform)] = true,
-                    _b['smartapp-stories__video'] = (activeStory === null || activeStory === void 0 ? void 0 : activeStory.type) === STORY_TYPE.video,
-                    _b['smartapp-stories__animate-right'] = isAnimateToRight,
-                    _b['smartapp-stories__animate-left'] = isAnimateToLeft,
-                    _b)) }, swipeableHandlers, { children: _jsx(Stories, { defaultInterval: 6000, width: "100%", height: "100%", stories: generateStories(), onStoryStart: onStoryStart, onPrevious: onPrevious, onNext: onNext, onAllStoriesEnd: handleNext, progressContainerStyles: progressContainerStyles(platform, stories.length), progressWrapperStyles: progressWrapperStyles, progressStyles: progressStyles }, activeGroupStories.id) })), _jsx(CloseStoriesIcon, { className: classNames((_c = {
-                        'smartapp-stories__icon': true
-                    },
-                    _c["smartapp-stories__icon--".concat(platform)] = true,
-                    _c)), onClick: handleCloseGroupStories })] })));
+    var closeIcon = (_jsx(CloseStoriesIcon, { className: classNames('smartapp-stories__icon', "smartapp-stories__icon--".concat(platform)), onClick: handleCloseGroupStories }));
+    return (_jsxs(Popup, __assign({ className: "smartapp-stories", open: true }, { children: [_jsxs("div", __assign({ className: classNames('smartapp-stories', "smartapp-stories__".concat(size), "smartapp-stories__".concat(platform), {
+                    'smartapp-stories__video': (activeStory === null || activeStory === void 0 ? void 0 : activeStory.type) === STORY_TYPE.video,
+                    'smartapp-stories__animate-right': isAnimateToRight,
+                    'smartapp-stories__animate-left': isAnimateToLeft,
+                }) }, swipeableHandlers, { children: [_jsx(Stories, { defaultInterval: 6000, width: "100%", height: "100%", stories: generateStories(), onStoryStart: onStoryStart, onPrevious: onPrevious, onNext: onNext, onAllStoriesEnd: handleNext, progressContainerStyles: progressContainerStyles(platform, stories.length), progressWrapperStyles: progressWrapperStyles, progressStyles: progressStyles }, activeGroupStories.id), isShowCloseIconInsideStory && closeIcon] })), !isShowCloseIconInsideStory && closeIcon] })));
 };
 export default StoriesComponent;
 //# sourceMappingURL=Stories.js.map