@sima-land/moleculas 16.0.0-alpha.2 → 16.0.0-alpha.21

package/desktop/components/gallery-modal/components/all-round-view.js

@@ -1,89 +1,81 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AllRoundView = void 0;
-const react_1 = __importStar(require("react"));
-const identity_1 = require("@sima-land/ui-nucleons/hooks/identity");
-const with_hint_1 = require("@sima-land/ui-nucleons/with-hint");
-const on_1 = __importDefault(require("@sima-land/ui-nucleons/helpers/on"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const hooks_1 = require("@sima-land/ui-nucleons/hooks");
+const helpers_1 = require("@sima-land/ui-nucleons/helpers");
 const utils_1 = require("../utils");
 const bind_1 = __importDefault(require("classnames/bind"));
-const all_round_view_module_scss_1 = __importDefault(require("./all-round-view.module.scss"));
-const _360_svg_1 = __importDefault(require("../icons/360.svg"));
-const pause_svg_1 = __importDefault(require("../icons/pause.svg"));
-const turn_left_svg_1 = __importDefault(require("../icons/turn-left.svg"));
-const turn_right_svg_1 = __importDefault(require("../icons/turn-right.svg"));
-const cx = bind_1.default.bind(all_round_view_module_scss_1.default);
+const all_round_view_m_scss_1 = __importDefault(require("./all-round-view.m.scss"));
+const Viewing360Perspective_1 = __importDefault(require("@sima-land/ui-quarks/icons/40x40/Filled/Viewing360Perspective"));
+const Pause_1 = __importDefault(require("@sima-land/ui-quarks/icons/40x40/Filled/Pause"));
+const ArrowTurnLeft_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/ArrowTurnLeft"));
+const ArrowTurnRight_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/ArrowTurnRight"));
+const img_stub_1 = require("../../../../common/components/img-stub");
+const hint_1 = require("@sima-land/ui-nucleons/hint");
+const cx = bind_1.default.bind(all_round_view_m_scss_1.default);
 /**
  * 3д-просмотр.
  * @param props Свойства.
  * @return Элемент.
  */
-const AllRoundView = ({ photos }) => {
+const AllRoundView = ({ photos, controls = true, state: stateProp = 'autoplay', onStateChange, }) => {
     const imageRef = (0, react_1.useRef)(null);
     const dragStartRef = (0, react_1.useRef)(null);
-    const [state, setState] = (0, react_1.useState)('autoplay');
+    const [state, setState] = (0, react_1.useState)(stateProp);
+    (0, react_1.useEffect)(() => onStateChange === null || onStateChange === void 0 ? void 0 : onStateChange(state), [state]);
+    (0, react_1.useEffect)(() => setState(stateProp), [stateProp]);
     const autoplay = state === 'autoplay';
     // eslint-disable-next-line require-jsdoc
     const ChangeState = (bindState) => () => setState(bindState);
     const [index, setIndex] = (0, react_1.useState)(0);
-    const indexRef = (0, identity_1.useIdentityRef)(index);
-    const photosReady = (0, utils_1.useImagesLoad)(photos);
+    const indexRef = (0, hooks_1.useIdentityRef)(index);
+    const imagesStatus = (0, utils_1.useImagesLoad)(photos);
+    const ready = imagesStatus === 'done';
+    const failed = imagesStatus === 'fail';
     // запуск/остановка вращения
     (0, react_1.useEffect)(() => {
-        if (state !== 'default' && photosReady) {
+        if (state !== 'default' && ready) {
             const timerId = window.setInterval(() => {
                 const increment = state === 'turn-left' ? -1 : 1;
                 setIndex((photos.length + (indexRef.current + increment)) % photos.length);
             }, 1000 / 30);
             return () => window.clearInterval(timerId);
         }
-    }, [state, photosReady]);
+    }, [state, ready]);
     // перетаскивание
     (0, react_1.useEffect)(() => {
         // переданное число всегда замениться на такое, которое будет в промежутке от 0 до количества фото
         // eslint-disable-next-line require-jsdoc
         const wrap = (value) => (photos.length + value) % photos.length;
         const image = imageRef.current;
-        const imageWidth = image.clientWidth;
-        const imageLeft = image.getBoundingClientRect().left;
+        if (!image) {
+            return;
+        }
         const offList = [
-            (0, on_1.default)(image, 'pointerdown', e => {
+            (0, helpers_1.on)(image, 'pointerdown', e => {
                 e.preventDefault();
+                e.stopPropagation();
+                // ВАЖНО: preventDefault предотвращает расфокусировку полей ввода - форсируем
+                if (document.activeElement instanceof HTMLElement) {
+                    document.activeElement.blur();
+                }
                 setState('default');
+                const imageLeft = image.getBoundingClientRect().left;
                 image.style.touchAction = 'none';
                 dragStartRef.current = {
                     position: e.clientX - imageLeft,
                     index: indexRef.current,
                 };
             }),
-            (0, on_1.default)(window, 'pointermove', e => {
+            (0, helpers_1.on)(window, 'pointermove', e => {
                 if (dragStartRef.current !== null) {
+                    const imageWidth = image.clientWidth;
+                    const imageLeft = image.getBoundingClientRect().left;
                     const startX = dragStartRef.current.position;
                     const currentX = e.clientX - imageLeft;
                     const startPos = wrap(Math.round((startX * photos.length) / imageWidth));
@@ -92,29 +84,22 @@ const AllRoundView = ({ photos }) => {
                     setIndex(nextIndex);
                 }
             }),
-            (0, on_1.default)(window, 'pointerup', () => {
+            (0, helpers_1.on)(window, 'pointerup', () => {
                 dragStartRef.current = null;
                 image.style.touchAction = '';
             }),
         ];
         return () => offList.forEach(fn => fn());
-    }, [photos.length]);
-    const HINT = (react_1.default.createElement(react_1.default.Fragment, null,
-        "\u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0432\u0440\u0430\u0449\u0430\u0442\u044C \u0442\u043E\u0432\u0430\u0440,",
-        react_1.default.createElement("br", null),
-        "\u0437\u0430\u0436\u0430\u0432 \u043B\u0435\u0432\u0443\u044E \u043A\u043D\u043E\u043F\u043A\u0443",
-        react_1.default.createElement("br", null),
-        "\u043C\u044B\u0448\u0438 \u043D\u0430 \u0444\u043E\u0442\u043E\u0433\u0440\u0430\u0444\u0438\u0438"));
-    return (react_1.default.createElement("div", { className: cx('root') },
-        react_1.default.createElement("img", { "data-testid": 'gallery-modal:360-current-photo', ref: imageRef, src: photos[index] }),
-        react_1.default.createElement("div", { className: cx('controls') },
-            react_1.default.createElement("button", { className: cx('control', 'turn'), disabled: autoplay, onPointerDown: ChangeState('turn-left'), onPointerUp: ChangeState('default'), onPointerLeave: ChangeState('default'), "data-testid": 'gallery-modal:360-turn-left-button' },
-                react_1.default.createElement(turn_right_svg_1.default, null)),
-            react_1.default.createElement(with_hint_1.WithHint, { hint: HINT }, (ref, toggleHint) => (react_1.default.createElement("button", { ref: ref, className: cx('control', 'primary', autoplay && 'pause'), onClick: () => {
-                    setState(s => (s === 'autoplay' ? 'default' : 'autoplay'));
-                    toggleHint(false);
-                }, onMouseEnter: () => autoplay && toggleHint(true), onMouseLeave: () => toggleHint(false), "data-testid": 'gallery-modal:toggle-autoplay-button' }, autoplay ? react_1.default.createElement(pause_svg_1.default, null) : react_1.default.createElement(_360_svg_1.default, null)))),
-            react_1.default.createElement("button", { className: cx('control', 'turn'), disabled: autoplay, onPointerDown: ChangeState('turn-right'), onPointerUp: ChangeState('default'), onPointerLeave: ChangeState('default'), "data-testid": 'gallery-modal:360-turn-right-button' },
-                react_1.default.createElement(turn_left_svg_1.default, null)))));
+    }, [photos.length, failed]);
+    // состояние
+    const [open, setOpen] = (0, react_1.useState)(false);
+    // позиционирование
+    const { refs, ...floating } = (0, hint_1.useHintFloating)({ open, onOpenChange: setOpen });
+    // пользовательское взаимодействие
+    const { getReferenceProps, getFloatingProps } = (0, hint_1.useHintOnHover)(floating);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: cx('root'), children: [failed && (0, jsx_runtime_1.jsx)(img_stub_1.ImgStub, { className: cx('stub') }), !failed && ((0, jsx_runtime_1.jsx)("img", { "data-testid": 'gallery-modal:360-current-photo', ref: imageRef, src: photos[index] })), !failed && controls && ((0, jsx_runtime_1.jsxs)("div", { className: cx('controls'), children: [(0, jsx_runtime_1.jsx)("button", { className: cx('control', 'turn'), disabled: autoplay, onPointerDown: ChangeState('turn-left'), onPointerUp: ChangeState('default'), onPointerLeave: ChangeState('default'), "data-testid": 'gallery-modal:360-turn-left-button', children: (0, jsx_runtime_1.jsx)(ArrowTurnRight_1.default, {}) }), (0, jsx_runtime_1.jsx)("button", { ref: refs.setReference, ...getReferenceProps(), className: cx('control', 'primary', autoplay && 'pause'), onClick: () => {
+                            setState(s => (s === 'autoplay' ? 'default' : 'autoplay'));
+                        }, "data-testid": 'gallery-modal:toggle-autoplay-button', children: autoplay ? (0, jsx_runtime_1.jsx)(Pause_1.default, {}) : (0, jsx_runtime_1.jsx)(Viewing360Perspective_1.default, {}) }), autoplay && ((0, jsx_runtime_1.jsx)(hint_1.Hint, { open: open, hintRef: refs.setFloating, arrowRef: refs.setArrow, ...getFloatingProps(), children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["\u0412\u044B \u043C\u043E\u0436\u0435\u0442\u0435 \u0432\u0440\u0430\u0449\u0430\u0442\u044C \u0442\u043E\u0432\u0430\u0440,", (0, jsx_runtime_1.jsx)("br", {}), "\u0437\u0430\u0436\u0430\u0432 \u043B\u0435\u0432\u0443\u044E \u043A\u043D\u043E\u043F\u043A\u0443", (0, jsx_runtime_1.jsx)("br", {}), "\u043C\u044B\u0448\u0438 \u043D\u0430 \u0444\u043E\u0442\u043E\u0433\u0440\u0430\u0444\u0438\u0438"] }) })), (0, jsx_runtime_1.jsx)("button", { className: cx('control', 'turn'), disabled: autoplay, onPointerDown: ChangeState('turn-right'), onPointerUp: ChangeState('default'), onPointerLeave: ChangeState('default'), "data-testid": 'gallery-modal:360-turn-right-button', children: (0, jsx_runtime_1.jsx)(ArrowTurnLeft_1.default, {}) })] }))] }));
 };
 exports.AllRoundView = AllRoundView;
+//# sourceMappingURL=all-round-view.js.map

package/desktop/components/gallery-modal/components/all-round-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"all-round-view.js","sourceRoot":"","sources":["../../../../../src/desktop/components/gallery-modal/components/all-round-view.tsx"],"names":[],"mappings":"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"}

package/desktop/components/gallery-modal/components/{all-round-view.module.scss → all-round-view.m.scss}

@@ -11,6 +11,11 @@
     width: 100%;
     height: 100%;
   }
+  .stub {
+    display: block;
+    width: 100%;
+    height: 100%;
+  }
 }
 
 .controls {

package/desktop/components/gallery-modal/components/gallery-modal.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
+import { SyntheticEvent } from 'react';
 import { MediaData } from '../types';
-import { ModalProps } from '@sima-land/ui-nucleons/modal';
 import { ReviewInfoProps } from './review-info';
-export interface GalleryModalProps extends Pick<ModalProps, 'withScrollDisable' | 'scrollDisableOptions'> {
+export interface GalleryModalProps {
     /** Список медиа. */
     media: MediaData[];
     /** Индекс начального выбранного элемента из списка медиа. */
@@ -16,11 +15,11 @@ export interface GalleryModalProps extends Pick<ModalProps, 'withScrollDisable'
     /** Будет вызвана при закрытии. */
     onClose?: () => void;
     /** Будет вызвана при событиях проигрывания видео. */
-    onVideoEvent?: (event: React.SyntheticEvent<HTMLVideoElement>) => void;
+    onVideoEvent?: (event: SyntheticEvent<HTMLVideoElement>) => void;
 }
 /**
  * Полноэкранное модальное окно галереи фото/видео.
  * @param props Свойства.
  * @return Элемент.
  */
-export declare const GalleryModal: ({ media, defaultMediaIndex, review, onClose, onGoToReview, onMediaChange, withScrollDisable, scrollDisableOptions, onVideoEvent, }: GalleryModalProps) => JSX.Element;
+export declare const GalleryModal: ({ media, defaultMediaIndex, review, onClose, onGoToReview, onMediaChange, onVideoEvent, }: GalleryModalProps) => import("react/jsx-runtime").JSX.Element;

package/desktop/components/gallery-modal/components/gallery-modal.js

@@ -1,72 +1,40 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-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;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.GalleryModal = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const layout_1 = require("@sima-land/ui-nucleons/layout");
-const scroll_to_child_1 = require("@sima-land/ui-nucleons/helpers/scroll-to-child");
+const helpers_1 = require("@sima-land/ui-nucleons/helpers");
 const modal_1 = require("@sima-land/ui-nucleons/modal");
 const arrow_button_1 = require("@sima-land/ui-nucleons/arrow-button");
 const all_round_view_1 = require("./all-round-view");
 const review_info_1 = require("./review-info");
 const image_overlay_1 = require("./image-overlay");
 const thumbnail_1 = require("./thumbnail");
-const identity_1 = require("@sima-land/ui-nucleons/hooks/identity");
+const hooks_1 = require("@sima-land/ui-nucleons/hooks");
 const utils_1 = require("../utils");
 const bind_1 = __importDefault(require("classnames/bind"));
-const gallery_modal_module_scss_1 = __importDefault(require("./gallery-modal.module.scss"));
-const cx = bind_1.default.bind(gallery_modal_module_scss_1.default);
+const gallery_modal_m_scss_1 = __importDefault(require("./gallery-modal.m.scss"));
+const top_bar_1 = require("@sima-land/ui-nucleons/top-bar");
+const cx = bind_1.default.bind(gallery_modal_m_scss_1.default);
 /**
  * Полноэкранное модальное окно галереи фото/видео.
  * @param props Свойства.
  * @return Элемент.
  */
-const GalleryModal = ({ media, defaultMediaIndex = 0, review, onClose, onGoToReview, onMediaChange, withScrollDisable, scrollDisableOptions, onVideoEvent, }) => {
+const GalleryModal = ({ media, defaultMediaIndex = 0, review, onClose, onGoToReview, onMediaChange, onVideoEvent, }) => {
     const [currentIndex, setCurrent] = (0, react_1.useState)(defaultMediaIndex);
     const rootRef = (0, react_1.useRef)(null);
-    const handlerRef = (0, identity_1.useIdentityRef)(onMediaChange);
+    const handlerRef = (0, hooks_1.useIdentityRef)(onMediaChange);
     const thumbnailsRef = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(() => {
         var _a;
         (_a = handlerRef.current) === null || _a === void 0 ? void 0 : _a.call(handlerRef, media[currentIndex], currentIndex);
         thumbnailsRef.current &&
-            (0, scroll_to_child_1.scrollToChild)(thumbnailsRef.current, thumbnailsRef.current.children[currentIndex]);
+            (0, helpers_1.scrollToChild)(thumbnailsRef.current, thumbnailsRef.current.children[currentIndex]);
     }, [currentIndex]);
     const size = (0, utils_1.useSquareFit)(rootRef, { hasReview: Boolean(review) });
     const style = size
@@ -75,21 +43,10 @@ const GalleryModal = ({ media, defaultMediaIndex = 0, review, onClose, onGoToRev
             '--all-round-view-size': `${size}px`,
         }
         : {};
-    return (react_1.default.createElement(modal_1.Modal, Object.assign({ size: 'fullscreen', onClose: onClose }, { withScrollDisable, scrollDisableOptions }),
-        react_1.default.createElement(modal_1.Modal.Header, { onClose: onClose }),
-        react_1.default.createElement(modal_1.Modal.Body, null,
-            react_1.default.createElement(layout_1.DesktopLayout, { className: cx('root'), ref: rootRef, style: style },
-                react_1.default.createElement("div", { className: cx('main') },
-                    react_1.default.createElement("div", { className: cx('thumbnails'), ref: thumbnailsRef }, media.map((item, index) => (react_1.default.createElement(thumbnail_1.Thumbnail, Object.assign({ key: index, className: cx('thumbnail'), type: item.type, checked: index === currentIndex, onClick: () => setCurrent(index) }, (item.type === 'image' && {
-                        src: item.data.thumbnailSrc,
-                        alt: item.data.alt || '',
-                    })))))),
-                    react_1.default.createElement("div", { className: cx('square') },
-                        react_1.default.createElement(Media, Object.assign({}, media[currentIndex], { onVideoEvent: onVideoEvent })),
-                        media.length > 1 && (react_1.default.createElement(react_1.default.Fragment, null,
-                            react_1.default.createElement(arrow_button_1.ArrowButton, { direction: 'left', className: cx('button', 'left'), onClick: () => setCurrent((media.length + currentIndex - 1) % media.length), "data-testid": 'gallery-modal:prev-media-button' }),
-                            react_1.default.createElement(arrow_button_1.ArrowButton, { direction: 'right', className: cx('button', 'right'), onClick: () => setCurrent((currentIndex + 1) % media.length), "data-testid": 'gallery-modal:next-media-button' })))))),
-            size !== null && (react_1.default.createElement("div", { className: cx('footer'), style: style }, review && react_1.default.createElement(review_info_1.ReviewInfo, Object.assign({}, review, { onGoToReview: onGoToReview })))))));
+    return ((0, jsx_runtime_1.jsxs)(modal_1.Modal, { size: 'fullscreen', onClose: onClose, children: [(0, jsx_runtime_1.jsx)(top_bar_1.TopBar, { buttons: (0, top_bar_1.navigationButtons)({ onClose }) }), (0, jsx_runtime_1.jsxs)(modal_1.ModalBody, { style: { position: 'relative' }, children: [(0, jsx_runtime_1.jsx)(layout_1.DesktopLayout, { className: cx('root'), ref: rootRef, style: style, children: (0, jsx_runtime_1.jsxs)("div", { className: cx('main'), children: [(0, jsx_runtime_1.jsx)("div", { className: cx('thumbnails'), ref: thumbnailsRef, children: media.map((item, index) => ((0, jsx_runtime_1.jsx)(thumbnail_1.Thumbnail, { className: cx('thumbnail'), type: item.type, checked: index === currentIndex, onClick: () => setCurrent(index), ...(item.type === 'image' && {
+                                            src: item.data.thumbnailSrc,
+                                            alt: item.data.alt || '',
+                                        }) }, index))) }), (0, jsx_runtime_1.jsxs)("div", { className: cx('square'), children: [(0, jsx_runtime_1.jsx)(Media, { ...media[currentIndex], onVideoEvent: onVideoEvent }), media.length > 1 && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(arrow_button_1.ArrowButton, { direction: 'left', className: cx('button', 'left'), onClick: () => setCurrent((media.length + currentIndex - 1) % media.length), "data-testid": 'gallery-modal:prev-media-button' }), (0, jsx_runtime_1.jsx)(arrow_button_1.ArrowButton, { direction: 'right', className: cx('button', 'right'), onClick: () => setCurrent((currentIndex + 1) % media.length), "data-testid": 'gallery-modal:next-media-button' })] }))] })] }) }), size !== null && ((0, jsx_runtime_1.jsx)("div", { className: cx('footer'), style: style, children: review && (0, jsx_runtime_1.jsx)(review_info_1.ReviewInfo, { ...review, onGoToReview: onGoToReview }) }))] })] }));
 };
 exports.GalleryModal = GalleryModal;
 /**
@@ -97,12 +54,5 @@ exports.GalleryModal = GalleryModal;
  * @param props Свойства.
  * @return Элемент.
  */
-const Media = (_a) => {
-    var { onVideoEvent } = _a, media = __rest(_a, ["onVideoEvent"]);
-    return (react_1.default.createElement("div", { className: cx('media') },
-        media.type === 'image' && (react_1.default.createElement(image_overlay_1.ImageOverlay, { className: cx('media-image-wrap') },
-            react_1.default.createElement("img", { src: media.data.src, alt: media.data.alt || '' }))),
-        media.type === 'video' && (react_1.default.createElement("video", { autoPlay: true, controls: true, controlsList: 'nodownload', onPlay: onVideoEvent, onPause: onVideoEvent, onEnded: onVideoEvent },
-            react_1.default.createElement("source", { src: media.data.src }))),
-        media.type === '360' && react_1.default.createElement(all_round_view_1.AllRoundView, { photos: media.data.photos })));
-};
+const Media = ({ onVideoEvent, ...media }) => ((0, jsx_runtime_1.jsxs)("div", { className: cx('media'), children: [media.type === 'image' && ((0, jsx_runtime_1.jsx)(image_overlay_1.ImageOverlay, { className: cx('media-image-wrap'), children: (0, jsx_runtime_1.jsx)("img", { src: media.data.src, alt: media.data.alt || '' }) })), media.type === 'video' && ((0, jsx_runtime_1.jsx)("video", { autoPlay: true, controls: true, controlsList: 'nodownload', onPlay: onVideoEvent, onPause: onVideoEvent, onEnded: onVideoEvent, children: (0, jsx_runtime_1.jsx)("source", { src: media.data.src }) })), media.type === '360' && (0, jsx_runtime_1.jsx)(all_round_view_1.AllRoundView, { photos: media.data.photos })] }));
+//# sourceMappingURL=gallery-modal.js.map

package/desktop/components/gallery-modal/components/gallery-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gallery-modal.js","sourceRoot":"","sources":["../../../../../src/desktop/components/gallery-modal/components/gallery-modal.tsx"],"names":[],"mappings":"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"}

package/desktop/components/gallery-modal/components/{gallery-modal.module.scss → gallery-modal.m.scss}

@@ -2,9 +2,11 @@
 @use 'node_modules/@sima-land/ui-nucleons/utils';
 
 .root {
-  --header-height: 80px;
-  position: relative;
-  height: calc(100vh - var(--header-height));
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
   display: flex;
   flex-direction: column;
 }

package/desktop/components/gallery-modal/components/image-overlay.d.ts

@@ -1,8 +1,8 @@
-import React from 'react';
-export type ImageOverlayProps = React.HTMLAttributes<HTMLDivElement>;
+import type { HTMLAttributes } from 'react';
+export type ImageOverlayProps = HTMLAttributes<HTMLDivElement>;
 /**
  * Полупрозрачный слой над картинкой по дизайн-гайдам.
  * @param props Свойства.
  * @return Элемент.
  */
-export declare const ImageOverlay: ({ className, children, ...restProps }: ImageOverlayProps) => JSX.Element;
+export declare const ImageOverlay: ({ className, children, ...restProps }: ImageOverlayProps) => import("react/jsx-runtime").JSX.Element;

package/desktop/components/gallery-modal/components/image-overlay.js

@@ -1,30 +1,17 @@
 "use strict";
-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;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ImageOverlay = void 0;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const classnames_1 = __importDefault(require("classnames"));
-const image_overlay_module_scss_1 = __importDefault(require("./image-overlay.module.scss"));
+const image_overlay_m_scss_1 = __importDefault(require("./image-overlay.m.scss"));
 /**
  * Полупрозрачный слой над картинкой по дизайн-гайдам.
  * @param props Свойства.
  * @return Элемент.
  */
-const ImageOverlay = (_a) => {
-    var { className, children } = _a, restProps = __rest(_a, ["className", "children"]);
-    return (react_1.default.createElement("div", Object.assign({ className: (0, classnames_1.default)(image_overlay_module_scss_1.default.root, className) }, restProps), children));
-};
+const ImageOverlay = ({ className, children, ...restProps }) => ((0, jsx_runtime_1.jsx)("span", { className: (0, classnames_1.default)(image_overlay_m_scss_1.default.root, className), ...restProps, children: children }));
 exports.ImageOverlay = ImageOverlay;
+//# sourceMappingURL=image-overlay.js.map

package/desktop/components/gallery-modal/components/image-overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-overlay.js","sourceRoot":"","sources":["../../../../../src/desktop/components/gallery-modal/components/image-overlay.tsx"],"names":[],"mappings":";;;;;;;AACA,4DAA4B;AAC5B,kFAA4C;AAI5C;;;;GAIG;AACI,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAqB,EAAE,EAAE,CAAC,CACxF,iCAAM,SAAS,EAAE,IAAA,oBAAE,EAAC,8BAAM,CAAC,IAAI,EAAE,SAAS,CAAC,KAAM,SAAS,YACvD,QAAQ,GACJ,CACR,CAAC;AAJW,QAAA,YAAY,gBAIvB"}

package/desktop/components/gallery-modal/components/{image-overlay.module.scss → image-overlay.m.scss}

@@ -1,4 +1,5 @@
 .root {
+  display: block;
   position: relative;
   &::after {
     content: '';

package/desktop/components/gallery-modal/components/review-info.d.ts

@@ -13,4 +13,4 @@ export interface ReviewInfoProps {
  * @param props Свойства.
  * @return Элемент.
  */
-export declare const ReviewInfo: ({ rating, author, onGoToReview, content, className, notAffectRating, loading, }: ReviewInfoProps) => JSX.Element;
+export declare const ReviewInfo: ({ rating, author, onGoToReview, content, className, notAffectRating, loading, }: ReviewInfoProps) => import("react/jsx-runtime").JSX.Element;

package/desktop/components/gallery-modal/components/review-info.js

@@ -1,41 +1,19 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ReviewInfo = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const link_1 = require("@sima-land/ui-nucleons/link");
 const rating_1 = require("@sima-land/ui-nucleons/rating");
 const bind_1 = __importDefault(require("classnames/bind"));
-const review_info_module_scss_1 = __importDefault(require("./review-info.module.scss"));
-const on_1 = __importDefault(require("@sima-land/ui-nucleons/helpers/on"));
-const shadows_1 = require("@sima-land/ui-nucleons/styling/shadows");
+const review_info_m_scss_1 = __importDefault(require("./review-info.m.scss"));
+const helpers_1 = require("@sima-land/ui-nucleons/helpers");
+const styling_1 = require("@sima-land/ui-nucleons/styling");
 const custom_scrollbar_1 = require("@sima-land/ui-nucleons/_internal/custom-scrollbar");
-const cx = bind_1.default.bind(review_info_module_scss_1.default);
+const cx = bind_1.default.bind(review_info_m_scss_1.default);
 /**
  * Отзыв.
  * @param props Свойства.
@@ -57,23 +35,8 @@ const ReviewInfo = ({ rating, author, onGoToReview, content, className, notAffec
     }, [content, author]);
     (0, react_1.useEffect)(checkClamp, [content, opened]);
     // @todo что делать если при изменении размеров изменилось состояние обрезания?
-    (0, react_1.useEffect)(() => (0, on_1.default)(window, 'resize', checkClamp), [content, checkClamp]);
-    return (react_1.default.createElement("div", { className: cx('root', className, opened && shadows_1.BoxShadow.z2straight) },
-        loading && (react_1.default.createElement(Layout, null,
-            react_1.default.createElement(LoadingView, null))),
-        !loading && (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement(Layout, { className: cx('header') },
-                react_1.default.createElement("div", { className: cx('rating') }, notAffectRating ? 'Не влияет на рейтинг' : react_1.default.createElement(rating_1.Rating, { value: rating })),
-                react_1.default.createElement("div", { className: cx('author') }, author),
-                onGoToReview && (react_1.default.createElement(link_1.Link, { className: cx('link'), pseudo: true, onClick: onGoToReview, "data-testid": 'gallery-modal:go-to-review-link' }, "\u041F\u0435\u0440\u0435\u0439\u0442\u0438 \u043A \u043E\u0442\u0437\u044B\u0432\u0443"))),
-            content && !opened && (react_1.default.createElement(Layout, null,
-                react_1.default.createElement("div", { ref: contentRef, className: cx('content'), "data-testid": 'review-info:collapsed-content' }, content))),
-            content && opened && (react_1.default.createElement(custom_scrollbar_1.CustomScrollbar, { className: cx('content', 'opened') },
-                react_1.default.createElement(Layout, null,
-                    react_1.default.createElement("div", { "data-testid": 'review-info:expanded-content' }, content),
-                    react_1.default.createElement(link_1.Link, { pseudo: true, onClick: () => setOpened(false), "data-testid": 'review-info:collapse' }, "\u0421\u043A\u0440\u044B\u0442\u044C \u043E\u0442\u0437\u044B\u0432")))),
-            content && !opened && clamped && (react_1.default.createElement(Layout, null,
-                react_1.default.createElement(link_1.Link, { pseudo: true, onClick: () => setOpened(true), "data-testid": 'review-info:expand' }, "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043F\u043E\u043B\u043D\u043E\u0441\u0442\u044C\u044E")))))));
+    (0, react_1.useEffect)(() => (0, helpers_1.on)(window, 'resize', checkClamp), [content, checkClamp]);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: cx('root', className, opened && styling_1.BoxShadow.z2straight), children: [loading && ((0, jsx_runtime_1.jsx)(Layout, { children: (0, jsx_runtime_1.jsx)(LoadingView, {}) })), !loading && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Layout, { className: cx('header'), children: [(0, jsx_runtime_1.jsx)("div", { className: cx('rating'), children: notAffectRating ? 'Не влияет на рейтинг' : (0, jsx_runtime_1.jsx)(rating_1.Rating, { value: rating }) }), (0, jsx_runtime_1.jsx)("div", { className: cx('author'), children: author }), onGoToReview && ((0, jsx_runtime_1.jsx)(link_1.Link, { className: cx('link'), pseudo: true, onClick: onGoToReview, "data-testid": 'gallery-modal:go-to-review-link', children: "\u041F\u0435\u0440\u0435\u0439\u0442\u0438 \u043A \u043E\u0442\u0437\u044B\u0432\u0443" }))] }), content && !opened && ((0, jsx_runtime_1.jsx)(Layout, { children: (0, jsx_runtime_1.jsx)("div", { ref: contentRef, className: cx('content'), "data-testid": 'review-info:collapsed-content', children: content }) })), content && opened && ((0, jsx_runtime_1.jsx)(custom_scrollbar_1.CustomScrollbar, { className: cx('content', 'opened'), children: (0, jsx_runtime_1.jsxs)(Layout, { children: [(0, jsx_runtime_1.jsx)("div", { "data-testid": 'review-info:expanded-content', children: content }), (0, jsx_runtime_1.jsx)(link_1.Link, { pseudo: true, onClick: () => setOpened(false), "data-testid": 'review-info:collapse', children: "\u0421\u043A\u0440\u044B\u0442\u044C \u043E\u0442\u0437\u044B\u0432" })] }) })), content && !opened && clamped && ((0, jsx_runtime_1.jsx)(Layout, { children: (0, jsx_runtime_1.jsx)(link_1.Link, { pseudo: true, onClick: () => setOpened(true), "data-testid": 'review-info:expand', children: "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043F\u043E\u043B\u043D\u043E\u0441\u0442\u044C\u044E" }) }))] }))] }));
 };
 exports.ReviewInfo = ReviewInfo;
 /**
@@ -82,17 +45,13 @@ exports.ReviewInfo = ReviewInfo;
  * @return Элемент.
  */
 function Layout({ className, children }) {
-    return react_1.default.createElement("div", { className: cx(className, 'layout') }, children);
+    return (0, jsx_runtime_1.jsx)("div", { className: cx(className, 'layout'), children: children });
 }
 /**
  * Отображение загрузки данных отзыва.
  * @return Элемент.
  */
 function LoadingView() {
-    return (react_1.default.createElement("div", { className: cx('loading') },
-        react_1.default.createElement("div", { className: cx('head') },
-            react_1.default.createElement("div", { className: cx('text', 'name') }),
-            react_1.default.createElement(link_1.Link, { pseudo: true, disabled: true, className: cx('button') }, "\u041F\u0435\u0440\u0435\u0439\u0442\u0438 \u043A \u043E\u0442\u0437\u044B\u0432\u0443")),
-        react_1.default.createElement("div", { className: cx('text') }),
-        react_1.default.createElement("div", { className: cx('text') })));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: cx('loading'), children: [(0, jsx_runtime_1.jsxs)("div", { className: cx('head'), children: [(0, jsx_runtime_1.jsx)("div", { className: cx('text', 'name') }), (0, jsx_runtime_1.jsx)(link_1.Link, { pseudo: true, disabled: true, className: cx('button'), children: "\u041F\u0435\u0440\u0435\u0439\u0442\u0438 \u043A \u043E\u0442\u0437\u044B\u0432\u0443" })] }), (0, jsx_runtime_1.jsx)("div", { className: cx('text') }), (0, jsx_runtime_1.jsx)("div", { className: cx('text') })] }));
 }
+//# sourceMappingURL=review-info.js.map

package/desktop/components/gallery-modal/components/review-info.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"review-info.js","sourceRoot":"","sources":["../../../../../src/desktop/components/gallery-modal/components/review-info.tsx"],"names":[],"mappings":"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"}

package/desktop/components/gallery-modal/components/thumbnail.d.ts

@@ -1,11 +1,11 @@
-import React from 'react';
+import type { MouseEventHandler } from 'react';
 import { MediaType } from '../types';
 export interface ThumbnailProps {
     type: MediaType;
     src?: string;
     alt?: string;
     checked?: boolean;
-    onClick?: React.MouseEventHandler;
+    onClick?: MouseEventHandler;
     className?: string;
 }
 /**
@@ -13,4 +13,4 @@ export interface ThumbnailProps {
  * @param props Свойства.
  * @return Элемент.
  */
-export declare const Thumbnail: ({ type, src, alt, checked, onClick, className }: ThumbnailProps) => JSX.Element;
+export declare const Thumbnail: ({ type, src, alt, checked, onClick, className }: ThumbnailProps) => import("react/jsx-runtime").JSX.Element;

package/desktop/components/gallery-modal/components/thumbnail.js

@@ -4,21 +4,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Thumbnail = void 0;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const image_overlay_1 = require("./image-overlay");
-const play_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Filled/play"));
+const Play_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Filled/Play"));
 const bind_1 = __importDefault(require("classnames/bind"));
-const thumbnail_module_scss_1 = __importDefault(require("./thumbnail.module.scss"));
-const _360_svg_1 = __importDefault(require("../icons/360.svg"));
-const cx = bind_1.default.bind(thumbnail_module_scss_1.default);
+const thumbnail_m_scss_1 = __importDefault(require("./thumbnail.m.scss"));
+const Viewing360Perspective_1 = __importDefault(require("@sima-land/ui-quarks/icons/40x40/Filled/Viewing360Perspective"));
+const cx = bind_1.default.bind(thumbnail_m_scss_1.default);
 /**
  * Превью медиа.
  * @param props Свойства.
  * @return Элемент.
  */
-const Thumbnail = ({ type, src, alt, checked, onClick, className }) => (react_1.default.createElement("button", { className: cx('root', type !== 'image' && 'iconic', checked && 'checked', className), onClick: onClick, "data-testid": 'gallery-modal:thumbnail' },
-    type === '360' && react_1.default.createElement(_360_svg_1.default, { fill: 'currentColor' }),
-    type === 'video' && react_1.default.createElement(play_1.default, { width: 32, height: 32, fill: 'currentColor' }),
-    src && (react_1.default.createElement(image_overlay_1.ImageOverlay, { className: cx('image-overlay') },
-        react_1.default.createElement("img", { src: src, alt: alt })))));
+const Thumbnail = ({ type, src, alt, checked, onClick, className }) => ((0, jsx_runtime_1.jsxs)("button", { className: cx('root', type !== 'image' && 'iconic', { checked }, className), onClick: onClick, "data-testid": 'gallery-modal:thumbnail', children: [type === '360' && (0, jsx_runtime_1.jsx)(Viewing360Perspective_1.default, { fill: 'currentColor' }), type === 'video' && (0, jsx_runtime_1.jsx)(Play_1.default, { width: 32, height: 32, fill: 'currentColor' }), src && ((0, jsx_runtime_1.jsx)(image_overlay_1.ImageOverlay, { className: cx('image-overlay'), children: (0, jsx_runtime_1.jsx)("img", { src: src, alt: alt }) }))] }));
 exports.Thumbnail = Thumbnail;
+//# sourceMappingURL=thumbnail.js.map