@alfalab/core-components 48.23.1 → 48.25.0-beta.0

package/gallery/modern/index.css

@@ -1,7 +1,8 @@
-/* hash: 398bg */
+/* hash: 1yfgp */
 :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
-    --color-static-neutral-0-inverted: #262629; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+    --color-static-neutral-0-inverted: #262629;
+    --color-static-neutral-translucent-500-inverted: rgba(228, 228, 251, 0.28); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -14,15 +15,20 @@
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
-} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+    --gap-m: 16px; /* deprecated */ /* deprecated */ /* deprecated */
+    --gap-2xl: 32px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 
     /* новые значения, используйте их */
 
     /* no-unit может приводить к проблемам в calc (#1559) */
     /* stylelint-disable-next-line length-zero-no-unit */
+    --gap-0: 0px;
+    --gap-16: var(--gap-m);
+    --gap-32: var(--gap-2xl);
 } :root {
-} :root {
-} /* сбрасывает синюю подсветку при нажатии */ .gallery__container_14yu7 {
+} /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ /* @deprecated */ :root {
+} /* сбрасывает синюю подсветку при нажатии */ .gallery__container_xd1ps {
     position: relative;
     overflow-x: hidden;
     overflow-y: auto;
@@ -32,21 +38,39 @@
     height: 100%;
     width: 100%;
     background-color: var(--color-static-neutral-0-inverted)
-} .gallery__container_14yu7.gallery__mobile_14yu7 {
+} .gallery__container_xd1ps.gallery__mobile_xd1ps {
         overflow: hidden;
-    } .gallery__modal_14yu7 {
+    } .gallery__modal_xd1ps {
     flex-grow: 1;
     width: 100vw;
     height: 100vh;
     background: transparent;
-} .gallery__navigationVideo_14yu7 {
-    background-color: var(--color-static-neutral-0-inverted);
+    padding: env(safe-area-inset-top, var(--gap-0)) var(--gap-0),
+        env(safe-area-inset-bottom, var(--gap-0));
+} .gallery__navigationVideo_xd1ps {
     z-index: 3;
     width: 100%;
     position: absolute;
     bottom: 0;
     left: 0;
     transition: transform 0.3s ease-in-out;
-} .gallery__hideNavigation_14yu7 {
-    transform: translateY(106px);
+    text-align: center;
+} .gallery__hide_xd1ps {
+    transform: translateY(114px);
+} .gallery__hideInfo_xd1ps {
+    transform: translateY(48px);
+} .gallery__bottomButton_xd1ps {
+    width: calc(100% - var(--gap-32));
+    margin: var(--gap-16);
+    background-color: var(--color-static-neutral-translucent-500-inverted);
+} .gallery__subtitles_xd1ps {
+    padding: var(--gap-0) var(--gap-32);
+    margin-bottom: var(--gap-16);
+    width: 100%;
+    text-align: center;
+    opacity: 1;
+    z-index: 1;
+    transition: opacity 500ms ease-in-out, margin-bottom 270ms ease-in-out;
+} .gallery__hideSubtitles_xd1ps {
+    opacity: 0;
 }

package/gallery/modern/index.d.ts

@@ -1,2 +1,2 @@
 export * from "./Component";
-export { GALLERY_EVENTS, TestIds } from "./utils/index";
+export { TestIds } from "./utils/index";

package/gallery/modern/index.js

@@ -1,25 +1,31 @@
 export { Gallery } from './Component.js';
-export { GALLERY_EVENTS, TestIds } from './utils/constants.js';
+export { TestIds } from './utils/constants.js';
 import 'react';
 import 'classnames';
 import '../../base-modal/modern';
 import '../../mq/modern';
-import './components/image-viewer/single.js';
+import './components/bottom-button/Component.js';
+import '../../button/modern';
+import '../../typography/modern';
 import './context.js';
+import './components/image-viewer/single.js';
 import './utils/utils.js';
-import './hooks-96f83205.js';
+import './hooks-3938f1b1.js';
 import 'element-closest';
 import './components/image-viewer/slide.js';
 import '../../spinner/modern';
-import '../../typography/modern';
 import './components/image-viewer/paths.js';
 import './components/image-viewer/video/index.js';
 import 'hls.js';
 import '../../icon-view/modern/circle';
 import '@alfalab/icons-glyph/PlayCompactMIcon';
+import './components/subtitles/index.js';
+import './hooks/use-custom-subtitles.js';
 import './components/navigation-bar/Component.js';
+import 'lodash/throttle';
 import './components/image-preview/Component.js';
 import '@alfalab/hooks';
+import './constants.js';
 import './components/image-preview/paths.js';
 import './components/header/Component.js';
 import './components/buttons/index.js';
@@ -31,6 +37,7 @@ import '@alfalab/icons-glyph/ArrowsOutwardMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';
 import '@alfalab/icons-glyph/PauseCompactMIcon';
 import '@alfalab/icons-glyph/PointerDownMIcon';
+import '@alfalab/icons-glyph/ShareMIcon';
 import '@alfalab/icons-glyph/SoundCrossMIcon';
 import '@alfalab/icons-glyph/SoundMIcon';
 import './components/header-info-block/Component.js';

package/gallery/modern/types.d.ts

@@ -1,10 +1,38 @@
-import { RefObject } from 'react';
+import { MouseEvent, RefObject } from 'react';
+type TBottomButton = {
+    text: string;
+    onClick: (e: MouseEvent) => void;
+    /**
+     * Задержка появления кнопки в s
+     */
+    timeout?: number;
+};
 type GalleryImage = {
     src: string;
     name?: string;
     previewSrc?: string;
     alt?: string;
     canDownload?: boolean;
+    /**
+     * Нижняя кнопка, есть только у видео
+     */
+    bottomButton?: TBottomButton;
+    /**
+     * Callback при нажатии на кнопку Play, есть только у видео
+     */
+    onPlay?: () => void;
+    /**
+     * Callback при нажатии на кнопку Pause, есть только у видео
+     */
+    onPause?: () => void;
+    /**
+     * Callback при нажатии на кнопку Mute, есть только у видео
+     */
+    onMute?: () => void;
+    /**
+     * Callback при нажатии на кнопку Unmute, есть только у видео
+     */
+    onUnmute?: () => void;
 };
 type ImageMeta = {
     width: number;
@@ -17,4 +45,4 @@ type ImageMeta = {
     broken?: boolean;
     player: RefObject<HTMLVideoElement>;
 };
-export { GalleryImage, ImageMeta };
+export { TBottomButton, GalleryImage, ImageMeta };

package/gallery/modern/utils/constants.d.ts

@@ -10,15 +10,4 @@ declare const TestIds: {
     MUTE_BUTTON: string;
     UNMUTE_BUTTON: string;
 };
-declare const PREVIEW_WIDTH_MOBILE = 46;
-declare const PREVIEW_HEIGHT_MOBILE = 46;
-declare const PREVIEW_WIDTH_DESKTOP = 56;
-declare const PREVIEW_HEIGHT_DESKTOP = 56;
-declare const PREVIEW_VIDEO_MULTIPLIER = 12;
-declare const GALLERY_EVENTS: {
-    ON_PLAY: string;
-    ON_PAUSE: string;
-    ON_MUTE: string;
-    ON_UNMUTE: string;
-};
-export { TestIds, PREVIEW_WIDTH_MOBILE, PREVIEW_HEIGHT_MOBILE, PREVIEW_WIDTH_DESKTOP, PREVIEW_HEIGHT_DESKTOP, PREVIEW_VIDEO_MULTIPLIER, GALLERY_EVENTS };
+export { TestIds };

package/gallery/modern/utils/constants.js

@@ -10,16 +10,5 @@ const TestIds = {
     MUTE_BUTTON: 'mute-button',
     UNMUTE_BUTTON: 'unmute-button',
 };
-const PREVIEW_WIDTH_MOBILE = 46;
-const PREVIEW_HEIGHT_MOBILE = 46;
-const PREVIEW_WIDTH_DESKTOP = 56;
-const PREVIEW_HEIGHT_DESKTOP = 56;
-const PREVIEW_VIDEO_MULTIPLIER = 12;
-const GALLERY_EVENTS = {
-    ON_PLAY: 'Gallery:OnPlay',
-    ON_PAUSE: 'Gallery:OnPause',
-    ON_MUTE: 'Gallery:OnMute',
-    ON_UNMUTE: 'Gallery:OnUnmute',
-};
 
-export { GALLERY_EVENTS, PREVIEW_HEIGHT_DESKTOP, PREVIEW_HEIGHT_MOBILE, PREVIEW_VIDEO_MULTIPLIER, PREVIEW_WIDTH_DESKTOP, PREVIEW_WIDTH_MOBILE, TestIds };
+export { TestIds };

package/gallery/modern/utils/index.js

@@ -1,3 +1,3 @@
 export { splitFilename } from './split-filename.js';
 export { PLACEHOLDER_HEIGHT, PLACEHOLDER_WIDTH, getImageAlt, getImageKey, isSmallImage, isVideo } from './utils.js';
-export { GALLERY_EVENTS, PREVIEW_HEIGHT_DESKTOP, PREVIEW_HEIGHT_MOBILE, PREVIEW_VIDEO_MULTIPLIER, PREVIEW_WIDTH_DESKTOP, PREVIEW_WIDTH_MOBILE, TestIds } from './constants.js';
+export { TestIds } from './constants.js';

package/gallery/moderncssm/Component.js

@@ -2,23 +2,28 @@ import React, { useState, useCallback, useEffect } from 'react';
 import cn from 'classnames';
 import { BaseModal } from '../../base-modal/moderncssm';
 import { useIsDesktop } from '../../mq/moderncssm';
+import { BottomButton } from './components/bottom-button/Component.js';
 import { Single } from './components/image-viewer/single.js';
+import { Subtitles } from './components/subtitles/index.js';
 import { NavigationBar } from './components/navigation-bar/Component.js';
 import { Header } from './components/header/Component.js';
 import '@alfalab/hooks';
+import { SWIPE_THRESHOLD } from './constants.js';
 import { GalleryContext } from './context.js';
 import './components/image-preview/index.module.css';
 import { ImageViewer } from './components/image-viewer/component.js';
 import { InfoBar } from './components/info-bar/Component.js';
 import { HeaderMobile } from './components/header-mobile/Component.js';
 import styles from './index.module.css';
+import '../../button/moderncssm';
+import '../../typography/moderncssm';
+import './components/bottom-button/index.module.css';
 import './utils/utils.js';
 import './components/image-viewer/hooks.js';
 import 'element-closest';
 import './components/image-viewer/index.module.css';
 import './components/image-viewer/slide.js';
 import '../../spinner/moderncssm';
-import '../../typography/moderncssm';
 import './utils/constants.js';
 import './components/image-viewer/paths.js';
 import './components/image-viewer/video/index.js';
@@ -26,6 +31,9 @@ import 'hls.js';
 import '../../icon-view/moderncssm/circle';
 import '@alfalab/icons-glyph/PlayCompactMIcon';
 import './components/image-viewer/video/index.module.css';
+import './hooks/use-custom-subtitles.js';
+import './components/subtitles/index.module.css';
+import 'lodash/throttle';
 import './components/image-preview/Component.js';
 import './components/image-preview/paths.js';
 import './components/navigation-bar/index.module.css';
@@ -38,6 +46,7 @@ import '@alfalab/icons-glyph/ArrowsOutwardMIcon';
 import '@alfalab/icons-glyph/CrossMIcon';
 import '@alfalab/icons-glyph/PauseCompactMIcon';
 import '@alfalab/icons-glyph/PointerDownMIcon';
+import '@alfalab/icons-glyph/ShareMIcon';
 import '@alfalab/icons-glyph/SoundCrossMIcon';
 import '@alfalab/icons-glyph/SoundMIcon';
 import './components/buttons/index.module.css';
@@ -72,6 +81,7 @@ const Gallery = ({ open, images, slideIndex, initialSlide = 0, loop = true, onCl
     const [hideNavigation, setHideNavigation] = useState(DEFAULT_HIDE_NAVIGATION);
     const isDesktop = useIsDesktop();
     const isCurrentVideo = !!imagesMeta[currentSlideIndex]?.player?.current;
+    const bottomButton = images[currentSlideIndex]?.bottomButton;
     const slideTo = useCallback((index) => {
         if (images[index]) {
             setCurrentSlideIndex?.(index);
@@ -101,6 +111,12 @@ const Gallery = ({ open, images, slideIndex, initialSlide = 0, loop = true, onCl
         imagesMeta[index] = meta;
         setImagesMeta(imagesMeta.slice());
     }, [imagesMeta]);
+    const handleBottomButtonClick = useCallback((e) => {
+        e.stopPropagation();
+        if (bottomButton?.onClick) {
+            bottomButton.onClick(e);
+        }
+    }, [bottomButton]);
     const handleClose = useCallback(() => {
         onClose();
         if (uncontrolled) {
@@ -144,6 +160,25 @@ const Gallery = ({ open, images, slideIndex, initialSlide = 0, loop = true, onCl
             document.removeEventListener('keydown', handleKeyDown);
         };
     }, [handleKeyDown]);
+    useEffect(() => {
+        let startY;
+        const abortController = new AbortController();
+        const { signal } = abortController;
+        document.addEventListener('touchstart', (e) => {
+            startY = e.touches[0].clientY;
+        }, { signal });
+        document.addEventListener('touchmove', (e) => {
+            const endY = e.changedTouches[0].clientY;
+            const deltaY = startY - endY;
+            // Если свайп вниз, закрываем галерею
+            if (deltaY < SWIPE_THRESHOLD) {
+                onClose();
+            }
+        }, { signal });
+        return () => {
+            abortController.abort();
+        };
+    }, [onClose]);
     const singleSlide = images.length === 1;
     const showNavigationBar = !singleSlide && !fullScreen;
     // eslint-disable-next-line react/jsx-no-constructed-context-values
@@ -182,8 +217,11 @@ const Gallery = ({ open, images, slideIndex, initialSlide = 0, loop = true, onCl
                 images.length === 1 ? React.createElement(Single, null) : React.createElement(ImageViewer, null),
                 React.createElement("nav", { className: cn({
                         [styles.navigationVideo]: isCurrentVideo && !isDesktop,
-                        [styles.hideNavigation]: hideNavigation && !isDesktop,
+                        [styles.hide]: showNavigationBar && hideNavigation && !isDesktop,
+                        [styles.hideInfo]: !showNavigationBar && hideNavigation && !isDesktop,
                     }) },
+                    !isDesktop && React.createElement(Subtitles, null),
+                    isCurrentVideo && !isDesktop && bottomButton && (React.createElement(BottomButton, { bottomButton: bottomButton, onClick: handleBottomButtonClick, className: styles.bottomButton })),
                     showNavigationBar && React.createElement(NavigationBar, null),
                     !isDesktop && React.createElement(InfoBar, null))))));
 };

package/gallery/moderncssm/components/bottom-button/Component.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import React from 'react';
+import { MouseEvent } from "react";
+import { TBottomButton } from "../../types";
+type Props = {
+    onClick: (e: MouseEvent) => void;
+    className?: string;
+    bottomButton: TBottomButton;
+};
+declare const BottomButton: ({ onClick, className, bottomButton }: Props) => React.JSX.Element;
+export { BottomButton };

package/gallery/moderncssm/components/bottom-button/Component.js

@@ -0,0 +1,27 @@
+import React, { useRef, useState, useContext, useEffect } from 'react';
+import cn from 'classnames';
+import { Button } from '../../../../button/moderncssm';
+import { Typography } from '../../../../typography/moderncssm';
+import { GalleryContext } from '../../context.js';
+import styles from './index.module.css';
+
+const BottomButton = ({ onClick, className, bottomButton }) => {
+    const timer = useRef();
+    const [visible, setVisible] = useState(false);
+    const { currentSlideIndex, getSwiper, singleSlide } = useContext(GalleryContext);
+    useEffect(() => {
+        const swiper = getSwiper();
+        if ((currentSlideIndex === swiper?.activeIndex || singleSlide) && bottomButton.timeout) {
+            if (timer.current) {
+                clearTimeout(timer.current);
+            }
+            setVisible(false);
+            timer.current = setTimeout(() => setVisible(true), bottomButton.timeout * 1000);
+        }
+        /* eslint-disable-next-line react-hooks/exhaustive-deps */
+    }, [bottomButton.timeout, currentSlideIndex, singleSlide]);
+    return (React.createElement(Button, { size: 56, className: cn(styles.component, { [styles.notVisible]: !visible && bottomButton.timeout }, className), onClick: onClick },
+        React.createElement(Typography.Text, { color: 'static-primary-light' }, bottomButton.text)));
+};
+
+export { BottomButton };

package/gallery/moderncssm/components/bottom-button/index.d.ts

@@ -0,0 +1 @@
+export { BottomButton } from "./Component";

package/gallery/moderncssm/components/bottom-button/index.js

@@ -0,0 +1,7 @@
+export { BottomButton } from './Component.js';
+import 'react';
+import 'classnames';
+import '../../../../button/moderncssm';
+import '../../../../typography/moderncssm';
+import '../../context.js';
+import './index.module.css';

package/gallery/moderncssm/components/bottom-button/index.module.css

@@ -0,0 +1,23 @@
+/* */
+
+.component {
+    background-color: var(--color-static-neutral-translucent-500-inverted);
+}
+
+.component:hover {
+        background-color: var(--color-static-neutral-translucent-500-inverted-hover);
+    }
+
+.component:active {
+        background-color: var(--color-static-neutral-translucent-500-inverted-press);
+    }
+
+.component {
+
+    transition: transform 1s ease-in-out;
+    will-change: transform;
+}
+
+.notVisible {
+    transform: translateY(250%);
+}

package/gallery/moderncssm/components/buttons/index.d.ts

@@ -12,5 +12,6 @@ declare const ExitFullscreen: FC<Props>;
 declare const MuteVideo: FC<Props>;
 declare const UnmuteVideo: FC<Props>;
 declare const Download: FC<Props>;
+declare const Share: FC<Props>;
 declare const Exit: FC<Props>;
-export { Fullscreen, BackArrow, Play, Pause, ExitFullscreen, MuteVideo, UnmuteVideo, Download, Exit };
+export { Fullscreen, BackArrow, Play, Pause, ExitFullscreen, MuteVideo, UnmuteVideo, Download, Share, Exit };

package/gallery/moderncssm/components/buttons/index.js

@@ -9,6 +9,7 @@ import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
 import { PauseCompactMIcon } from '@alfalab/icons-glyph/PauseCompactMIcon';
 import { PlayCompactMIcon } from '@alfalab/icons-glyph/PlayCompactMIcon';
 import { PointerDownMIcon } from '@alfalab/icons-glyph/PointerDownMIcon';
+import { ShareMIcon } from '@alfalab/icons-glyph/ShareMIcon';
 import { SoundCrossMIcon } from '@alfalab/icons-glyph/SoundCrossMIcon';
 import { SoundMIcon } from '@alfalab/icons-glyph/SoundMIcon';
 import styles from './index.module.css';
@@ -26,6 +27,8 @@ const UnmuteVideo = ({ buttonRef, className, ...restProps }) => (React.createEle
     React.createElement(IconButton, { ...restProps, ref: buttonRef, icon: SoundCrossMIcon, "aria-label": '\u0412\u043A\u043B\u044E\u0447\u0438\u0442\u044C \u0437\u0432\u0443\u043A', className: styles.iconButton })));
 const Download = (props) => (React.createElement(TooltipDesktop, { trigger: 'hover', position: 'bottom', content: '\u0421\u043A\u0430\u0447\u0430\u0442\u044C', fallbackPlacements: ['bottom-end'] },
     React.createElement(IconButton, { ...props, icon: PointerDownMIcon, "aria-label": '\u0421\u043A\u0430\u0447\u0430\u0442\u044C', className: styles.iconButton })));
+const Share = (props) => (React.createElement(TooltipDesktop, { trigger: 'hover', position: 'bottom', content: '\u041F\u043E\u0434\u0435\u043B\u0438\u0442\u044C\u0441\u044F', fallbackPlacements: ['bottom-end'] },
+    React.createElement(IconButton, { ...props, icon: ShareMIcon, "aria-label": '\u0421\u043A\u0430\u0447\u0430\u0442\u044C', className: styles.iconButton })));
 const Exit = (props) => (React.createElement(IconButton, { ...props, icon: CrossMIcon, "aria-label": '\u0417\u0430\u043A\u0440\u044B\u0442\u044C', className: styles.iconButton }));
 
-export { BackArrow, Download, Exit, ExitFullscreen, Fullscreen, MuteVideo, Pause, Play, UnmuteVideo };
+export { BackArrow, Download, Exit, ExitFullscreen, Fullscreen, MuteVideo, Pause, Play, Share, UnmuteVideo };

package/gallery/moderncssm/components/header/Component.js

@@ -1,7 +1,7 @@
 import React, { useContext, useRef, useEffect } from 'react';
 import { GalleryContext } from '../../context.js';
 import { isSmallImage, isVideo } from '../../utils/utils.js';
-import { TestIds, GALLERY_EVENTS } from '../../utils/constants.js';
+import { TestIds } from '../../utils/constants.js';
 import { Download, Exit, ExitFullscreen, Fullscreen, UnmuteVideo, MuteVideo } from '../buttons/index.js';
 import { HeaderInfoBlock } from '../header-info-block/Component.js';
 import styles from './index.module.css';
@@ -15,6 +15,7 @@ import '@alfalab/icons-glyph/CrossMIcon';
 import '@alfalab/icons-glyph/PauseCompactMIcon';
 import '@alfalab/icons-glyph/PlayCompactMIcon';
 import '@alfalab/icons-glyph/PointerDownMIcon';
+import '@alfalab/icons-glyph/ShareMIcon';
 import '@alfalab/icons-glyph/SoundCrossMIcon';
 import '@alfalab/icons-glyph/SoundMIcon';
 import '../buttons/index.module.css';
@@ -28,17 +29,13 @@ const Header = () => {
     const meta = getCurrentImageMeta();
     const toggleFullScreenButton = useRef(null);
     const onMuteButtonClick = () => {
-        if (mutedVideo) {
-            const customEvent = new CustomEvent(GALLERY_EVENTS.ON_UNMUTE, {
-                detail: { player: meta?.player?.current },
-            });
-            dispatchEvent(customEvent);
-        }
-        else {
-            const customEvent = new CustomEvent(GALLERY_EVENTS.ON_MUTE, {
-                detail: { player: meta?.player?.current },
-            });
-            dispatchEvent(customEvent);
+        if (currentImage) {
+            if (mutedVideo && currentImage.onUnmute) {
+                currentImage.onUnmute();
+            }
+            else if (currentImage.onMute) {
+                currentImage.onMute();
+            }
         }
         setMutedVideo(!mutedVideo);
     };

package/gallery/moderncssm/components/header/index.js

@@ -14,6 +14,7 @@ import '@alfalab/icons-glyph/CrossMIcon';
 import '@alfalab/icons-glyph/PauseCompactMIcon';
 import '@alfalab/icons-glyph/PlayCompactMIcon';
 import '@alfalab/icons-glyph/PointerDownMIcon';
+import '@alfalab/icons-glyph/ShareMIcon';
 import '@alfalab/icons-glyph/SoundCrossMIcon';
 import '@alfalab/icons-glyph/SoundMIcon';
 import '../buttons/index.module.css';

package/gallery/moderncssm/components/header/index.module.css

@@ -5,6 +5,6 @@
     justify-content: space-between;
     flex-shrink: 0;
     width: 100%;
-    padding: var(--gap-16) var(--gap-24);
+    padding: var(--gap-16) var(--gap-32);
     box-sizing: border-box;
 }

package/gallery/moderncssm/components/header-mobile/Component.js

@@ -4,7 +4,7 @@ import { Text } from '../../../../typography/moderncssm';
 import { GalleryContext } from '../../context.js';
 import { isVideo } from '../../utils/utils.js';
 import { TestIds } from '../../utils/constants.js';
-import { BackArrow, Download } from '../buttons/index.js';
+import { BackArrow, Download, Share } from '../buttons/index.js';
 import styles from './index.module.css';
 import '../../../../icon-button/moderncssm';
 import '../../../../tooltip/moderncssm/desktop';
@@ -15,6 +15,7 @@ import '@alfalab/icons-glyph/CrossMIcon';
 import '@alfalab/icons-glyph/PauseCompactMIcon';
 import '@alfalab/icons-glyph/PlayCompactMIcon';
 import '@alfalab/icons-glyph/PointerDownMIcon';
+import '@alfalab/icons-glyph/ShareMIcon';
 import '@alfalab/icons-glyph/SoundCrossMIcon';
 import '@alfalab/icons-glyph/SoundMIcon';
 import '../buttons/index.module.css';
@@ -26,13 +27,37 @@ const HeaderMobile = () => {
     const description = images.length > 1 && `${currentSlideIndex + 1} из ${images.length}`;
     const canDownload = currentImage?.canDownload ?? true;
     const showDownloadButton = !meta?.broken && canDownload;
+    const handleShareClick = async () => {
+        if (!currentImage)
+            return;
+        const title = currentImage.name ?? new Date().toISOString().split('T')[0];
+        const image = await fetch(currentImage.src);
+        const blob = await image.blob();
+        const filesArray = [
+            new File([blob], title, {
+                type: blob.type,
+                lastModified: new Date().getTime(),
+            }),
+        ];
+        const shareData = {
+            files: filesArray,
+        };
+        if (navigator.canShare(shareData) && !isVideo(currentImage.src)) {
+            await navigator.share(shareData);
+        }
+        else {
+            await navigator.share({ url: currentImage.src, title });
+        }
+    };
     return (React.createElement("div", { className: cn(styles.headerMobile, {
             [styles.video]: isVideo(currentImage?.src),
             [styles.hide]: hideNavigation,
         }) },
         React.createElement(BackArrow, { onClick: onClose }),
         React.createElement(Text, { className: styles.description, tag: 'div', view: 'component-primary', color: 'static-primary-light' }, description),
-        React.createElement("div", { className: styles.rightButtons }, showDownloadButton && (React.createElement(Download, { href: currentImage?.src, download: currentImage?.name, dataTestId: TestIds.DOWNLOAD_BUTTON })))));
+        React.createElement("div", { className: styles.rightButtons },
+            showDownloadButton && (React.createElement(Download, { href: currentImage?.src, download: currentImage?.name, dataTestId: TestIds.DOWNLOAD_BUTTON })),
+            !meta?.broken && React.createElement(Share, { onClick: handleShareClick }))));
 };
 
 export { HeaderMobile };

package/gallery/moderncssm/components/header-mobile/index.js

@@ -15,6 +15,7 @@ import '@alfalab/icons-glyph/CrossMIcon';
 import '@alfalab/icons-glyph/PauseCompactMIcon';
 import '@alfalab/icons-glyph/PlayCompactMIcon';
 import '@alfalab/icons-glyph/PointerDownMIcon';
+import '@alfalab/icons-glyph/ShareMIcon';
 import '@alfalab/icons-glyph/SoundCrossMIcon';
 import '@alfalab/icons-glyph/SoundMIcon';
 import '../buttons/index.module.css';