npm - @alfalab/core-components-gallery - Versions diffs - 7.2.0 → 7.2.1-alfasans - Mend

@alfalab/core-components-gallery 7.2.0 → 7.2.1-alfasans

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (90) hide show

package/esm/components/image-viewer/index.css CHANGED Viewed

@@ -24,7 +24,7 @@
 :root {
     --focus-color: var(--color-light-status-info);
 }
-.gallery__component_1ef1i {
+.gallery__component_xdq4y {
     display: flex;
     flex-grow: 1;
     justify-content: center;
@@ -92,9 +92,10 @@
         z-index: -1000;
     }
-    .gallery__swiperFrame_1ef1i {
+    .gallery__swiperFrame_xdq4y {
         display: flex;
-        width: 100%;
+        flex: 1 1 0;
+        min-width: 0;
         height: 100%;
         min-height: 0;
         max-height: calc(100vh - 168px);
@@ -103,17 +104,17 @@
         box-sizing: border-box;
     }
-        .gallery__swiperFrame_1ef1i.gallery__mobile_1ef1i {
+        .gallery__swiperFrame_xdq4y.gallery__mobile_xdq4y {
             max-height: calc(100vh - 210px);
             max-height: calc(100dvh - 210px);
         }
-        .gallery__swiperFrame_1ef1i.gallery__mobileVideo_1ef1i {
+        .gallery__swiperFrame_xdq4y.gallery__mobileVideo_xdq4y {
             max-height: 100vh;
             max-height: 100dvh;
         }
-    .gallery__fullScreenFrame_1ef1i {
+    .gallery__fullScreenFrame_xdq4y {
         display: flex;
         align-items: center;
         justify-content: center;
@@ -126,7 +127,7 @@
         overflow: hidden;
     }
-    .gallery__hiddenFrame_1ef1i {
+    .gallery__hiddenFrame_xdq4y {
         flex: 0 0 0;
         width: 0;
         height: 0;
@@ -134,16 +135,16 @@
         overflow: hidden;
     }
-    .gallery__swiper_1ef1i {
+    .gallery__swiper_xdq4y {
         width: 100%;
         height: 100%;
     }
-    .gallery__hidden_1ef1i {
+    .gallery__hidden_xdq4y {
         display: none;
     }
-    .gallery__singleSlideContainer_1ef1i {
+    .gallery__singleSlideContainer_xdq4y {
         display: flex;
         width: 100%;
         height: 100%;
@@ -155,18 +156,18 @@
         box-sizing: border-box;
     }
-        .gallery__singleSlideContainer_1ef1i.gallery__mobile_1ef1i {
+        .gallery__singleSlideContainer_xdq4y.gallery__mobile_xdq4y {
             max-height: calc(100vh - 174px);
             max-height: calc(100dvh - 174px);
             padding: 0;
         }
-        .gallery__singleSlideContainer_1ef1i.gallery__mobileVideo_1ef1i {
+        .gallery__singleSlideContainer_xdq4y.gallery__mobileVideo_xdq4y {
             max-height: 100vh;
             max-height: 100dvh;
         }
-    .gallery__slide_1ef1i {
+    .gallery__slide_xdq4y {
         position: relative;
         display: flex;
         justify-content: center;
@@ -175,17 +176,17 @@
         height: 100%;
     }
-    .gallery__slideLoading_1ef1i {
+    .gallery__slideLoading_xdq4y {
         background-color: var(--color-static-neutral-translucent-100-inverted);
         border-radius: var(--border-radius-8);
     }
-    .gallery__spinner_1ef1i {
+    .gallery__spinner_xdq4y {
         position: absolute;
         color: var(--color-static-neutral-translucent-1300-inverted);
     }
-    .gallery__image_1ef1i {
+    .gallery__image_xdq4y {
         width: auto;
         height: auto;
         max-width: 100%;
@@ -198,11 +199,11 @@
         border-radius: var(--border-radius-8);
     }
-        .gallery__image_1ef1i.gallery__mobile_1ef1i {
+        .gallery__image_xdq4y.gallery__mobile_xdq4y {
             border-radius: var(--border-radius-0);
         }
-    .gallery__smallImage_1ef1i {
+    .gallery__smallImage_xdq4y {
         position: relative;
         width: auto;
         height: auto;
@@ -215,17 +216,17 @@
                 user-select: none;
     }
-    .gallery__verticalImageFit_1ef1i {
+    .gallery__verticalImageFit_xdq4y {
         width: auto;
         height: 100%;
     }
-    .gallery__horizontalImageFit_1ef1i {
+    .gallery__horizontalImageFit_xdq4y {
         width: 100%;
         height: auto;
     }
-    .gallery__fullScreenMedia_1ef1i {
+    .gallery__fullScreenMedia_xdq4y {
         width: 100%;
         height: 100%;
         max-width: 100%;
@@ -235,7 +236,7 @@
         border-radius: var(--border-radius-0);
     }
-    .gallery__arrow_1ef1i {
+    .gallery__arrow_xdq4y {
         display: flex;
         flex-direction: column;
         justify-content: center;
@@ -249,20 +250,20 @@
         outline: none;
     }
-        .gallery__arrow_1ef1i:hover {
+        .gallery__arrow_xdq4y:hover {
             background-color: var(--color-static-neutral-0-inverted-hover);
         }
-        .gallery__arrow_1ef1i:active {
+        .gallery__arrow_xdq4y:active {
             background-color: var(--color-static-neutral-0-inverted-press);
         }
-    .gallery__focused_1ef1i {
+    .gallery__focused_xdq4y {
         outline: 2px solid var(--focus-color);
         outline-offset: 2px;
     }
-    .gallery__placeholder_1ef1i {
+    .gallery__placeholder_xdq4y {
         display: flex;
         justify-content: center;
         align-items: center;
@@ -272,7 +273,7 @@
         background-color: var(--color-static-neutral-300-inverted);
     }
-    .gallery__brokenImgWrapper_1ef1i {
+    .gallery__brokenImgWrapper_xdq4y {
         position: relative;
         display: flex;
         flex-direction: column;
@@ -281,13 +282,13 @@
         text-align: center;
     }
-    .gallery__brokenImgIcon_1ef1i {
+    .gallery__brokenImgIcon_xdq4y {
         width: 80px;
         height: 80px;
         margin-bottom: var(--gap-4);
     }
-    .gallery__fullScreenVideo_1ef1i {
+    .gallery__fullScreenVideo_xdq4y {
         width: 100%;
         height: 100%;
         max-height: none;

package/esm/components/image-viewer/index.module.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import './index.css';
-var styles = {"component":"gallery__component_1ef1i","swiperFrame":"gallery__swiperFrame_1ef1i","mobile":"gallery__mobile_1ef1i","mobileVideo":"gallery__mobileVideo_1ef1i","fullScreenFrame":"gallery__fullScreenFrame_1ef1i","hiddenFrame":"gallery__hiddenFrame_1ef1i","swiper":"gallery__swiper_1ef1i","hidden":"gallery__hidden_1ef1i","singleSlideContainer":"gallery__singleSlideContainer_1ef1i","slide":"gallery__slide_1ef1i","slideLoading":"gallery__slideLoading_1ef1i","spinner":"gallery__spinner_1ef1i","image":"gallery__image_1ef1i","smallImage":"gallery__smallImage_1ef1i","verticalImageFit":"gallery__verticalImageFit_1ef1i","horizontalImageFit":"gallery__horizontalImageFit_1ef1i","fullScreenMedia":"gallery__fullScreenMedia_1ef1i","arrow":"gallery__arrow_1ef1i","focused":"gallery__focused_1ef1i","placeholder":"gallery__placeholder_1ef1i","brokenImgWrapper":"gallery__brokenImgWrapper_1ef1i","brokenImgIcon":"gallery__brokenImgIcon_1ef1i","fullScreenVideo":"gallery__fullScreenVideo_1ef1i"};
+var styles = {"component":"gallery__component_xdq4y","swiperFrame":"gallery__swiperFrame_xdq4y","mobile":"gallery__mobile_xdq4y","mobileVideo":"gallery__mobileVideo_xdq4y","fullScreenFrame":"gallery__fullScreenFrame_xdq4y","hiddenFrame":"gallery__hiddenFrame_xdq4y","swiper":"gallery__swiper_xdq4y","hidden":"gallery__hidden_xdq4y","singleSlideContainer":"gallery__singleSlideContainer_xdq4y","slide":"gallery__slide_xdq4y","slideLoading":"gallery__slideLoading_xdq4y","spinner":"gallery__spinner_xdq4y","image":"gallery__image_xdq4y","smallImage":"gallery__smallImage_xdq4y","verticalImageFit":"gallery__verticalImageFit_xdq4y","horizontalImageFit":"gallery__horizontalImageFit_xdq4y","fullScreenMedia":"gallery__fullScreenMedia_xdq4y","arrow":"gallery__arrow_xdq4y","focused":"gallery__focused_xdq4y","placeholder":"gallery__placeholder_xdq4y","brokenImgWrapper":"gallery__brokenImgWrapper_xdq4y","brokenImgIcon":"gallery__brokenImgIcon_xdq4y","fullScreenVideo":"gallery__fullScreenVideo_xdq4y"};
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/image-viewer/index.module.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.module.css.js","sources":["../../src/components/image-viewer/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n display: flex;\n flex-grow: 1;\n justify-content: center;\n min-height: 0;\n background-color: var(--color-static-neutral-0-inverted);\n\n /* swiper/swiper.css; /\n :global(.swiper) {\n margin-left: auto;\n margin-right: auto;\n position: relative;\n overflow: hidden;\n list-style: none;\n padding: 0;\n z-index: 1;\n display: block;\n }\n :global(.swiper-wrapper) {\n position: relative;\n width: 100%;\n height: 100%;\n z-index: 1;\n display: flex;\n transition-property: transform;\n transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);\n box-sizing: content-box;\n }\n :global(.swiper-android) :global(.swiper-slide),\n :global(.swiper-ios) :global(.swiper-slide),\n :global(.swiper-wrapper) {\n transform: translate3d(0, 0, 0);\n }\n :global(.swiper-horizontal) {\n touch-action: pan-y;\n }\n :global(.swiper-slide) {\n flex-shrink: 0;\n width: 100%;\n height: 100%;\n position: relative;\n transition-property: transform;\n display: block;\n }\n :global(.swiper-slide-invisible-blank) {\n visibility: hidden;\n }\n :global(.swiper-autoheight),\n :global(.swiper-autoheight) :global(.swiper-slide) {\n height: auto;\n }\n :global(.swiper-autoheight) :global(.swiper-wrapper) {\n align-items: flex-start;\n transition-property: transform, height;\n }\n :global(.swiper-backface-hidden) :global(.swiper-slide) {\n transform: translateZ(0);\n backface-visibility: hidden;\n }\n\n / swiper/modules/a11y.css /\n :global(.swiper) :global(.swiper-notification) {\n position: absolute;\n left: 0;\n top: 0;\n pointer-events: none;\n opacity: 0;\n z-index: -1000;\n }\n\n .swiperFrame {\n display: flex;\n width: ~~100%;\~~n height: 100%;\n min-height: 0;\n\n / 168px - высота хэдера и футера */\n max-height: calc(100vh - 168px);\n max-height: calc(100dvh - 168px);\n padding: var(--gap-32) var(--gap-16);\n box-sizing: border-box;\n\n &.mobile {\n max-height: calc(100vh - 210px);\n max-height: calc(100dvh - 210px);\n }\n\n &.mobileVideo {\n max-height: 100vh;\n max-height: 100dvh;\n }\n }\n\n .fullScreenFrame {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n max-height: none;\n min-height: 0;\n padding: var(--gap-0);\n box-sizing: border-box;\n overflow: hidden;\n }\n\n .hiddenFrame {\n flex: 0 0 0;\n width: 0;\n height: 0;\n padding: var(--gap-0);\n overflow: hidden;\n }\n\n .swiper {\n width: 100%;\n height: 100%;\n }\n\n .hidden {\n display: none;\n }\n\n .singleSlideContainer {\n display: flex;\n width: 100%;\n height: 100%;\n min-height: 0;\n\n max-height: calc(100vh - 80px);\n max-height: calc(100dvh - 80px);\n padding: var(--gap-32);\n box-sizing: border-box;\n\n &.mobile {\n max-height: calc(100vh - 174px);\n max-height: calc(100dvh - 174px);\n padding: 0;\n }\n\n &.mobileVideo {\n max-height: 100vh;\n max-height: 100dvh;\n }\n }\n\n .slide {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n }\n\n .slideLoading {\n background-color: var(--color-static-neutral-translucent-100-inverted);\n border-radius: var(--border-radius-8);\n }\n\n .spinner {\n position: absolute;\n color: var(--color-static-neutral-translucent-1300-inverted);\n }\n\n .image {\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: contain;\n user-select: none;\n border-radius: var(--border-radius-8);\n\n &.mobile {\n border-radius: var(--border-radius-0);\n }\n }\n\n .smallImage {\n position: relative;\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: contain;\n user-select: none;\n }\n\n .verticalImageFit {\n width: auto;\n height: 100%;\n }\n\n .horizontalImageFit {\n width: 100%;\n height: auto;\n }\n\n .fullScreenMedia {\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n object-fit: contain;\n border-radius: var(--border-radius-0);\n }\n\n .arrow {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n width: 96px;\n height: 100%;\n cursor: pointer;\n color: var(--color-static-neutral-translucent-1300-inverted);\n transition: background-color 0.15s ease-in-out;\n outline: none;\n\n &:hover {\n background-color: var(--color-static-neutral-0-inverted-hover);\n }\n\n &:active {\n background-color: var(--color-static-neutral-0-inverted-press);\n }\n }\n\n .focused {\n @mixin focus-outline;\n }\n\n .placeholder {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n border-radius: var(--border-radius-8);\n background-color: var(--color-static-neutral-300-inverted);\n }\n\n .brokenImgWrapper {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 150px;\n text-align: center;\n }\n\n .brokenImgIcon {\n width: 80px;\n height: 80px;\n margin-bottom: var(--gap-4);\n }\n\n .fullScreenVideo {\n width: 100%;\n height: 100%;\n max-height: none;\n }\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,aAAa,CAAC,4BAA4B,CAAC,QAAQ,CAAC,uBAAuB,CAAC,aAAa,CAAC,4BAA4B,CAAC,iBAAiB,CAAC,gCAAgC,CAAC,aAAa,CAAC,4BAA4B,CAAC,QAAQ,CAAC,uBAAuB,CAAC,QAAQ,CAAC,uBAAuB,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,OAAO,CAAC,sBAAsB,CAAC,cAAc,CAAC,6BAA6B,CAAC,SAAS,CAAC,wBAAwB,CAAC,OAAO,CAAC,sBAAsB,CAAC,YAAY,CAAC,2BAA2B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,oBAAoB,CAAC,mCAAmC,CAAC,iBAAiB,CAAC,gCAAgC,CAAC,OAAO,CAAC,sBAAsB,CAAC,SAAS,CAAC,wBAAwB,CAAC,aAAa,CAAC,4BAA4B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,eAAe,CAAC,8BAA8B,CAAC,iBAAiB,CAAC,gCAAgC,CAAC;;;;"}
1	+ {"version":3,"file":"index.module.css.js","sources":["../../src/components/image-viewer/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.component {\n display: flex;\n flex-grow: 1;\n justify-content: center;\n min-height: 0;\n background-color: var(--color-static-neutral-0-inverted);\n\n /* swiper/swiper.css; /\n :global(.swiper) {\n margin-left: auto;\n margin-right: auto;\n position: relative;\n overflow: hidden;\n list-style: none;\n padding: 0;\n z-index: 1;\n display: block;\n }\n :global(.swiper-wrapper) {\n position: relative;\n width: 100%;\n height: 100%;\n z-index: 1;\n display: flex;\n transition-property: transform;\n transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);\n box-sizing: content-box;\n }\n :global(.swiper-android) :global(.swiper-slide),\n :global(.swiper-ios) :global(.swiper-slide),\n :global(.swiper-wrapper) {\n transform: translate3d(0, 0, 0);\n }\n :global(.swiper-horizontal) {\n touch-action: pan-y;\n }\n :global(.swiper-slide) {\n flex-shrink: 0;\n width: 100%;\n height: 100%;\n position: relative;\n transition-property: transform;\n display: block;\n }\n :global(.swiper-slide-invisible-blank) {\n visibility: hidden;\n }\n :global(.swiper-autoheight),\n :global(.swiper-autoheight) :global(.swiper-slide) {\n height: auto;\n }\n :global(.swiper-autoheight) :global(.swiper-wrapper) {\n align-items: flex-start;\n transition-property: transform, height;\n }\n :global(.swiper-backface-hidden) :global(.swiper-slide) {\n transform: translateZ(0);\n backface-visibility: hidden;\n }\n\n / swiper/modules/a11y.css /\n :global(.swiper) :global(.swiper-notification) {\n position: absolute;\n left: 0;\n top: 0;\n pointer-events: none;\n opacity: 0;\n z-index: -1000;\n }\n\n .swiperFrame {\n display: flex;\n flex: 1 1 0;\n min-width: 0;\n height: 100%;\n min-height: 0;\n\n / 168px - высота хэдера и футера */\n max-height: calc(100vh - 168px);\n max-height: calc(100dvh - 168px);\n padding: var(--gap-32) var(--gap-16);\n box-sizing: border-box;\n\n &.mobile {\n max-height: calc(100vh - 210px);\n max-height: calc(100dvh - 210px);\n }\n\n &.mobileVideo {\n max-height: 100vh;\n max-height: 100dvh;\n }\n }\n\n .fullScreenFrame {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n max-height: none;\n min-height: 0;\n padding: var(--gap-0);\n box-sizing: border-box;\n overflow: hidden;\n }\n\n .hiddenFrame {\n flex: 0 0 0;\n width: 0;\n height: 0;\n padding: var(--gap-0);\n overflow: hidden;\n }\n\n .swiper {\n width: 100%;\n height: 100%;\n }\n\n .hidden {\n display: none;\n }\n\n .singleSlideContainer {\n display: flex;\n width: 100%;\n height: 100%;\n min-height: 0;\n\n max-height: calc(100vh - 80px);\n max-height: calc(100dvh - 80px);\n padding: var(--gap-32);\n box-sizing: border-box;\n\n &.mobile {\n max-height: calc(100vh - 174px);\n max-height: calc(100dvh - 174px);\n padding: 0;\n }\n\n &.mobileVideo {\n max-height: 100vh;\n max-height: 100dvh;\n }\n }\n\n .slide {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n }\n\n .slideLoading {\n background-color: var(--color-static-neutral-translucent-100-inverted);\n border-radius: var(--border-radius-8);\n }\n\n .spinner {\n position: absolute;\n color: var(--color-static-neutral-translucent-1300-inverted);\n }\n\n .image {\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: contain;\n user-select: none;\n border-radius: var(--border-radius-8);\n\n &.mobile {\n border-radius: var(--border-radius-0);\n }\n }\n\n .smallImage {\n position: relative;\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 100%;\n object-fit: contain;\n user-select: none;\n }\n\n .verticalImageFit {\n width: auto;\n height: 100%;\n }\n\n .horizontalImageFit {\n width: 100%;\n height: auto;\n }\n\n .fullScreenMedia {\n width: 100%;\n height: 100%;\n max-width: 100%;\n max-height: 100%;\n object-fit: contain;\n border-radius: var(--border-radius-0);\n }\n\n .arrow {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n width: 96px;\n height: 100%;\n cursor: pointer;\n color: var(--color-static-neutral-translucent-1300-inverted);\n transition: background-color 0.15s ease-in-out;\n outline: none;\n\n &:hover {\n background-color: var(--color-static-neutral-0-inverted-hover);\n }\n\n &:active {\n background-color: var(--color-static-neutral-0-inverted-press);\n }\n }\n\n .focused {\n @mixin focus-outline;\n }\n\n .placeholder {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n border-radius: var(--border-radius-8);\n background-color: var(--color-static-neutral-300-inverted);\n }\n\n .brokenImgWrapper {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 150px;\n text-align: center;\n }\n\n .brokenImgIcon {\n width: 80px;\n height: 80px;\n margin-bottom: var(--gap-4);\n }\n\n .fullScreenVideo {\n width: 100%;\n height: 100%;\n max-height: none;\n }\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,aAAa,CAAC,4BAA4B,CAAC,QAAQ,CAAC,uBAAuB,CAAC,aAAa,CAAC,4BAA4B,CAAC,iBAAiB,CAAC,gCAAgC,CAAC,aAAa,CAAC,4BAA4B,CAAC,QAAQ,CAAC,uBAAuB,CAAC,QAAQ,CAAC,uBAAuB,CAAC,sBAAsB,CAAC,qCAAqC,CAAC,OAAO,CAAC,sBAAsB,CAAC,cAAc,CAAC,6BAA6B,CAAC,SAAS,CAAC,wBAAwB,CAAC,OAAO,CAAC,sBAAsB,CAAC,YAAY,CAAC,2BAA2B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,oBAAoB,CAAC,mCAAmC,CAAC,iBAAiB,CAAC,gCAAgC,CAAC,OAAO,CAAC,sBAAsB,CAAC,SAAS,CAAC,wBAAwB,CAAC,aAAa,CAAC,4BAA4B,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,eAAe,CAAC,8BAA8B,CAAC,iBAAiB,CAAC,gCAAgC,CAAC;;;;"}

package/esm/components/image-viewer/slide.js CHANGED Viewed

@@ -35,6 +35,7 @@ var Slide = function (_a) {
     var small = isSmallImage(meta);
     var verticalImageFit = !small && containerAspectRatio > imageAspectRatio;
     var horizontalImageFit = !small && containerAspectRatio <= imageAspectRatio;
+    var imageStyle = fullScreen || !containerHeight ? undefined : { maxHeight: "".concat(containerHeight, "px") };
     var handleImageRef = useCallback(function (node) {
         if ((node === null || node === void 0 ? void 0 : node.complete) && node.naturalWidth > 0 && !meta) {
             handleLoad({ currentTarget: node }, index);
@@ -52,7 +53,7 @@ var Slide = function (_a) {
                 _c[styles.fullScreenMedia] = fullScreen,
                 _c[styles.verticalImageFit] = verticalImageFit,
                 _c[styles.horizontalImageFit] = horizontalImageFit,
-                _c)), onLoad: function (event) { return handleLoad(event, index); }, onError: function () { return handleLoadError(index); }, style: fullScreen ? undefined : { maxHeight: "".concat(containerHeight, "px") }, "data-test-id": slideVisible ? TestIds.ACTIVE_IMAGE : undefined })));
+                _c)), onLoad: function (event) { return handleLoad(event, index); }, onError: function () { return handleLoadError(index); }, style: imageStyle, "data-test-id": slideVisible ? TestIds.ACTIVE_IMAGE : undefined })));
 };
 export { Slide };

package/esm/components/image-viewer/slide.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slide.js","sources":["../../../src/components/image-viewer/slide.tsx"],"sourcesContent":["import React, { type FC, type ReactNode, useCallback, useContext } from 'react';\nimport cn from 'classnames';\n\nimport { Spinner } from '@alfalab/core-components-spinner';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { type GalleryImage, type ImageMeta } from '../../types';\nimport { getImageAlt, isSmallImage, isVideo, TestIds } from '../../utils';\n\nimport { useHandleImageViewer } from './hooks';\nimport { NoImagePaths } from './paths';\nimport { Video } from './video';\n\nimport styles from './index.module.css';\n\ntype SlideInnerProps = {\n active: boolean;\n broken: boolean;\n loading: boolean;\n children: ReactNode;\n isVideoView?: boolean;\n};\n\nconst SlideInner: FC<SlideInnerProps> = ({ children, broken, loading, isVideoView }) => {\n const content = broken ? (\n <div className={styles.brokenImgWrapper}>\n <div className={styles.brokenImgIcon}>\n <svg\n xmlns='http://www.w3.org/2000/svg'\n width='80'\n height='80'\n viewBox='0 0 80 80'\n fill='none'\n >\n <rect width='80' height='80' fill='none' />\n <path\n fillRule='evenodd'\n clipRule='evenodd'\n d={NoImagePaths.baseImage}\n fill='#89898A'\n />\n <path d={NoImagePaths.triangleImage} fill='#89898A' />\n </svg>\n </div>\n\n <TypographyText view='primary-small' color='static-secondary-light'>\n Не удалось загрузить {isVideoView ? 'видео' : 'изображение'}\n </TypographyText>\n </div>\n ) : (\n children\n );\n\n return (\n <div className={cn(styles.slide, { [styles.slideLoading]: loading })}>\n {broken ? <div className={styles.placeholder}>{content}</div> : content}\n <Spinner className={styles.spinner} preset={48} visible={loading} />\n </div>\n );\n};\n\ntype SlideProps = {\n isActive: boolean;\n image: GalleryImage;\n meta?: ImageMeta;\n containerAspectRatio: number;\n imageAspectRatio: number;\n index: number;\n containerHeight: number;\n slideVisible: boolean;\n fullScreen?: boolean;\n};\n\nexport const Slide: FC<SlideProps> = ({\n isActive,\n meta,\n containerAspectRatio,\n imageAspectRatio,\n image,\n index,\n containerHeight,\n slideVisible,\n fullScreen,\n}) => {\n const { view } = useContext(GalleryContext);\n const { handleLoad, handleLoadError } = useHandleImageViewer();\n\n const broken = Boolean(meta?.broken);\n const small = isSmallImage(meta);\n const verticalImageFit = !small && containerAspectRatio > imageAspectRatio;\n const horizontalImageFit = !small && containerAspectRatio <= imageAspectRatio;\n\n const handleImageRef = useCallback(\n (node: HTMLImageElement \| null) => {\n if (node?.complete && node.naturalWidth > 0 && !meta) {\n handleLoad(\n { currentTarget: node } as React.SyntheticEvent<HTMLImageElement>,\n index,\n );\n }\n },\n [handleLoad, index, meta],\n );\n\n if (isVideo(image.src)) {\n return (\n <SlideInner isVideoView={true} active={isActive} broken={broken} loading={!meta}>\n <Video\n url={image.src}\n index={index}\n isActive={isActive}\n className={cn({ [styles.fullScreenMedia]: fullScreen })}\n />\n </SlideInner>\n );\n }\n\n return (\n <SlideInner active={isActive} broken={broken} loading={!meta}>\n <img\n ref={handleImageRef}\n src={image.src}\n alt={getImageAlt(image, index)}\n className={cn({\n [styles.smallImage]: small,\n [styles.image]: !small && meta,\n [styles.mobile]: view === 'mobile',\n [styles.fullScreenMedia]: fullScreen,\n [styles.verticalImageFit]: verticalImageFit,\n [styles.horizontalImageFit]: horizontalImageFit,\n })}\n onLoad={(event) => handleLoad(event, index)}\n onError={() => handleLoadError(index)}\n style={~~fullScreen ? undefined : { maxHeight: `${containerHeight~~}~~px` }}~~\n data-test-id={slideVisible ? TestIds.ACTIVE_IMAGE : undefined}\n />\n </SlideInner>\n );\n};\n"],"names":[],"mappings":"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~~AAE7E~~,IAAA,IAAM,cAAc,GAAG,WAAW,CAC9B,UAAC,IAA6B,EAAA;AAC1B,QAAA,IAAI,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAJ,MAAA,GAAA,MAAA,GAAA,IAAI,CAAE,QAAQ,KAAI,IAAI,CAAC,YAAY,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE;YAClD,UAAU,CACN,EAAE,aAAa,EAAE,IAAI,EAA4C,EACjE,KAAK,CACR;;KAER,EACD,CAAC,UAAU,EAAE,KAAK,EAAE,IAAI,CAAC,CAC5B;AAED,IAAA,IAAI,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;AACpB,QAAA,QACI,KAAC,CAAA,aAAA,CAAA,UAAU,IAAC,WAAW,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,IAAI,EAAA;AAC3E,YAAA,KAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EACF,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,EAAE,EAAG,EAAA,GAAA,EAAA,EAAA,EAAA,CAAC,MAAM,CAAC,eAAe,CAAA,GAAG,UAAU,EAAA,EAAA,EAAG,EACzD,CAAA,CACO;;AAIrB,IAAA,QACI,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,IAAI,EAAA;QACxD,KACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,cAAc,EACnB,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,GAAG,EAAE,WAAW,CAAC,KAAK,EAAE,KAAK,CAAC,EAC9B,SAAS,EAAE,EAAE,EAAA,EAAA,GAAA,EAAA;AACT,gBAAA,EAAA,CAAC,MAAM,CAAC,UAAU,CAAA,GAAG,KAAK;AAC1B,gBAAA,EAAA,CAAC,MAAM,CAAC,KAAK,IAAG,CAAC,KAAK,IAAI,IAAI;AAC9B,gBAAA,EAAA,CAAC,MAAM,CAAC,MAAM,CAAG,GAAA,IAAI,KAAK,QAAQ;AAClC,gBAAA,EAAA,CAAC,MAAM,CAAC,eAAe,CAAA,GAAG,UAAU;AACpC,gBAAA,EAAA,CAAC,MAAM,CAAC,gBAAgB,CAAA,GAAG,gBAAgB;AAC3C,gBAAA,EAAA,CAAC,MAAM,CAAC,kBAAkB,CAAA,GAAG,kBAAkB;oBACjD,EACF,MAAM,EAAE,UAAC,KAAK,~~EAAA~~,~~EAAK,~~OAAA,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC,CAAA,EAAA,EAC3C,OAAO,EAAE,YAAM,EAAA,OAAA,eAAe,CAAC,KAAK,CAAC,CAAtB,EAAsB,EACrC,KAAK,EAAE,UAAU,~~GAAG~~,~~SAAS~~,~~GAAG,EAAE,SAAS,EAAE,~~EAAA,~~CAAA,MAAA,CAAG,eAAe,EAAA,IAAA,CAAI,EAAE,EAAA,cAAA,EACvD,~~YAAY,GAAG,OAAO,CAAC,YAAY,GAAG,SAAS,~~EAAA,CAC~~/D,CACO;AAErB;;;;"}
1	+ {"version":3,"file":"slide.js","sources":["../../../src/components/image-viewer/slide.tsx"],"sourcesContent":["import React, { type FC, type ReactNode, useCallback, useContext } from 'react';\nimport cn from 'classnames';\n\nimport { Spinner } from '@alfalab/core-components-spinner';\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { type GalleryImage, type ImageMeta } from '../../types';\nimport { getImageAlt, isSmallImage, isVideo, TestIds } from '../../utils';\n\nimport { useHandleImageViewer } from './hooks';\nimport { NoImagePaths } from './paths';\nimport { Video } from './video';\n\nimport styles from './index.module.css';\n\ntype SlideInnerProps = {\n active: boolean;\n broken: boolean;\n loading: boolean;\n children: ReactNode;\n isVideoView?: boolean;\n};\n\nconst SlideInner: FC<SlideInnerProps> = ({ children, broken, loading, isVideoView }) => {\n const content = broken ? (\n <div className={styles.brokenImgWrapper}>\n <div className={styles.brokenImgIcon}>\n <svg\n xmlns='http://www.w3.org/2000/svg'\n width='80'\n height='80'\n viewBox='0 0 80 80'\n fill='none'\n >\n <rect width='80' height='80' fill='none' />\n <path\n fillRule='evenodd'\n clipRule='evenodd'\n d={NoImagePaths.baseImage}\n fill='#89898A'\n />\n <path d={NoImagePaths.triangleImage} fill='#89898A' />\n </svg>\n </div>\n\n <TypographyText view='primary-small' color='static-secondary-light'>\n Не удалось загрузить {isVideoView ? 'видео' : 'изображение'}\n </TypographyText>\n </div>\n ) : (\n children\n );\n\n return (\n <div className={cn(styles.slide, { [styles.slideLoading]: loading })}>\n {broken ? <div className={styles.placeholder}>{content}</div> : content}\n <Spinner className={styles.spinner} preset={48} visible={loading} />\n </div>\n );\n};\n\ntype SlideProps = {\n isActive: boolean;\n image: GalleryImage;\n meta?: ImageMeta;\n containerAspectRatio: number;\n imageAspectRatio: number;\n index: number;\n containerHeight: number;\n slideVisible: boolean;\n fullScreen?: boolean;\n};\n\nexport const Slide: FC<SlideProps> = ({\n isActive,\n meta,\n containerAspectRatio,\n imageAspectRatio,\n image,\n index,\n containerHeight,\n slideVisible,\n fullScreen,\n}) => {\n const { view } = useContext(GalleryContext);\n const { handleLoad, handleLoadError } = useHandleImageViewer();\n\n const broken = Boolean(meta?.broken);\n const small = isSmallImage(meta);\n const verticalImageFit = !small && containerAspectRatio > imageAspectRatio;\n const horizontalImageFit = !small && containerAspectRatio <= imageAspectRatio;\n const imageStyle =\n fullScreen \|\| !containerHeight ? undefined : { maxHeight: `${containerHeight}px` };\n\n const handleImageRef = useCallback(\n (node: HTMLImageElement \| null) => {\n if (node?.complete && node.naturalWidth > 0 && !meta) {\n handleLoad(\n { currentTarget: node } as React.SyntheticEvent<HTMLImageElement>,\n index,\n );\n }\n },\n [handleLoad, index, meta],\n );\n\n if (isVideo(image.src)) {\n return (\n <SlideInner isVideoView={true} active={isActive} broken={broken} loading={!meta}>\n <Video\n url={image.src}\n index={index}\n isActive={isActive}\n className={cn({ [styles.fullScreenMedia]: fullScreen })}\n />\n </SlideInner>\n );\n }\n\n return (\n <SlideInner active={isActive} broken={broken} loading={!meta}>\n <img\n ref={handleImageRef}\n src={image.src}\n alt={getImageAlt(image, index)}\n className={cn({\n [styles.smallImage]: small,\n [styles.image]: !small && meta,\n [styles.mobile]: view === 'mobile',\n [styles.fullScreenMedia]: fullScreen,\n [styles.verticalImageFit]: verticalImageFit,\n [styles.horizontalImageFit]: horizontalImageFit,\n })}\n onLoad={(event) => handleLoad(event, index)}\n onError={() => handleLoadError(index)}\n style={imageStyle}\n data-test-id={slideVisible ? TestIds.ACTIVE_IMAGE : undefined}\n />\n </SlideInner>\n );\n};\n"],"names":[],"mappings":"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"}

package/esm/components/image-viewer/video/index.css CHANGED Viewed

@@ -7,7 +7,7 @@
     --border-radius-0: 0;
     --border-radius-24: var(--border-radius-3xl);
 }
-.gallery__videoWrapper_1ogqj {
+.gallery__videoWrapper_1ipf9 {
     display: flex;
     align-items: center;
     justify-content: center;
@@ -17,17 +17,17 @@
     min-height: 0;
     position: relative;
 }
-.gallery__video_1ogqj {
+.gallery__video_1ipf9 {
     max-width: 100%;
     max-height: 100%;
     -o-object-fit: contain;
        object-fit: contain;
     border-radius: var(--border-radius-24);
 }
-.gallery__mobile_1ogqj {
+.gallery__mobile_1ipf9 {
     border-radius: var(--border-radius-0);
 }
-.gallery__videoButton_1ogqj {
+.gallery__videoButton_1ipf9 {
     position: absolute;
     top: 50%;
     left: 50%;
@@ -35,13 +35,13 @@
     z-index: 1;
     color: green;
 }
-.gallery__icon_1ogqj {
+.gallery__icon_1ipf9 {
     color: var(--color-static-neutral-0);
 }
-.gallery__iconShape_1ogqj {
+.gallery__iconShape_1ipf9 {
     fill: var(--color-static-neutral-translucent-700);
 }
-.gallery__bottomButton_1ogqj {
+.gallery__bottomButton_1ipf9 {
     position: absolute;
     bottom: 48px;
     left: 32px;

package/esm/components/image-viewer/video/index.module.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import './index.css';
-var styles = {"videoWrapper":"gallery__videoWrapper_1ogqj","video":"gallery__video_1ogqj","mobile":"gallery__mobile_1ogqj","videoButton":"gallery__videoButton_1ogqj","icon":"gallery__icon_1ogqj","iconShape":"gallery__iconShape_1ogqj","bottomButton":"gallery__bottomButton_1ogqj"};
+var styles = {"videoWrapper":"gallery__videoWrapper_1ipf9","video":"gallery__video_1ipf9","mobile":"gallery__mobile_1ipf9","videoButton":"gallery__videoButton_1ipf9","icon":"gallery__icon_1ipf9","iconShape":"gallery__iconShape_1ipf9","bottomButton":"gallery__bottomButton_1ipf9"};
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/info-bar/index.css CHANGED Viewed

@@ -7,10 +7,10 @@
     --gap-4: var(--gap-2xs);
     --gap-8: var(--gap-xs);
 }
-.gallery__description_kr284 {
+.gallery__description_fw1es {
     text-align: center;
 }
-.gallery__infoWrapper_kr284 {
+.gallery__infoWrapper_fw1es {
     background-color: var(--color-static-neutral-0-inverted);
     display: flex;
     align-items: center;
@@ -19,7 +19,7 @@
     position: relative;
     height: 48px;
 }
-.gallery__infoWrapper_kr284.gallery__video_kr284 {
+.gallery__infoWrapper_fw1es.gallery__video_fw1es {
         padding: 0 var(--gap-4) var(--gap-4);
         justify-content: space-between;
     }

package/esm/components/info-bar/index.module.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import './index.css';
-var styles = {"description":"gallery__description_kr284","infoWrapper":"gallery__infoWrapper_kr284","video":"gallery__video_kr284"};
+var styles = {"description":"gallery__description_fw1es","infoWrapper":"gallery__infoWrapper_fw1es","video":"gallery__video_fw1es"};
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/navigation-bar/index.css CHANGED Viewed

@@ -13,7 +13,7 @@
     --gap-12: var(--gap-s);
     --gap-24: var(--gap-xl);
 }
-.gallery__component_1roeg {
+.gallery__component_19am2 {
     display: flex;
     flex-wrap: nowrap;
     align-content: center;
@@ -25,25 +25,25 @@
     scrollbar-width: none;
     background-color: var(--color-static-neutral-0-inverted);
 }
-.gallery__component_1roeg.gallery__mobile_1roeg {
+.gallery__component_19am2.gallery__mobile_19am2 {
         padding: var(--gap-8) var(--gap-24);
     }
-.gallery__component_1roeg::-webkit-scrollbar {
+.gallery__component_19am2::-webkit-scrollbar {
         display: none;
     }
-.gallery__previews_1roeg {
+.gallery__previews_19am2 {
     display: flex;
 }
-.gallery__preview_1roeg {
+.gallery__preview_19am2 {
     flex-shrink: 0;
     margin-right: var(--gap-4);
 }
-.gallery__preview_1roeg.gallery__mobile_1roeg {
+.gallery__preview_19am2.gallery__mobile_19am2 {
         margin-right: var(--gap-2);
     }
-.gallery__preview_1roeg:first-child {
+.gallery__preview_19am2:first-child {
         margin-left: auto;
     }
-.gallery__preview_1roeg:last-child {
+.gallery__preview_19am2:last-child {
         margin-right: auto;
     }

package/esm/components/navigation-bar/index.module.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import './index.css';
-var styles = {"component":"gallery__component_1roeg","mobile":"gallery__mobile_1roeg","preview":"gallery__preview_1roeg"};
+var styles = {"component":"gallery__component_19am2","mobile":"gallery__mobile_19am2","preview":"gallery__preview_19am2"};
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/components/subtitles/index.css CHANGED Viewed

@@ -5,7 +5,7 @@
     --gap-16: var(--gap-m);
     --gap-32: var(--gap-2xl);
 }
-.gallery__subtitles_9u7yv {
+.gallery__subtitles_4cgc7 {
     position: absolute;
     align-self: flex-end;
     padding: var(--gap-0) var(--gap-32);
@@ -18,10 +18,10 @@
         opacity 500ms ease-in-out,
         margin-bottom 270ms ease-in-out;
 }
-.gallery__subtitles_9u7yv.gallery__mobile_9u7yv {
+.gallery__subtitles_4cgc7.gallery__mobile_4cgc7 {
         position: static;
         position: initial;
     }
-.gallery__hideSubtitles_9u7yv {
+.gallery__hideSubtitles_4cgc7 {
     opacity: 0;
 }

package/esm/components/subtitles/index.module.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import './index.css';
-var styles = {"subtitles":"gallery__subtitles_9u7yv","mobile":"gallery__mobile_9u7yv","hideSubtitles":"gallery__hideSubtitles_9u7yv"};
+var styles = {"subtitles":"gallery__subtitles_4cgc7","mobile":"gallery__mobile_4cgc7","hideSubtitles":"gallery__hideSubtitles_4cgc7"};
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/index.css CHANGED Viewed

@@ -13,7 +13,7 @@
     --sat: env(safe-area-inset-top, var(--gap-0));
     --sab: env(safe-area-inset-bottom, var(--gap-0));
 }
-.gallery__container_1wpb9 {
+.gallery__container_eqypj {
     position: relative;
     overflow-x: hidden;
     overflow-y: auto;
@@ -27,17 +27,17 @@
     padding-top: var(--sat);
     padding-bottom: var(--sab);
 }
-.gallery__container_1wpb9.gallery__mobile_1wpb9 {
+.gallery__container_eqypj.gallery__mobile_eqypj {
         overflow: hidden;
     }
-.gallery__modal_1wpb9 {
+.gallery__modal_eqypj {
     flex-grow: 1;
     width: 100vw;
     height: 100vh;
     height: 100dvh;
     background: transparent;
 }
-.gallery__navigationVideo_1wpb9 {
+.gallery__navigationVideo_eqypj {
     z-index: 3;
     width: 100%;
     position: absolute;
@@ -46,18 +46,18 @@
     transition: transform 0.3s ease-in-out;
     text-align: center;
 }
-.gallery__hide_1wpb9 {
+.gallery__hide_eqypj {
     transform: translateY(114px);
 }
-.gallery__hideInfo_1wpb9 {
+.gallery__hideInfo_eqypj {
     transform: translateY(48px);
 }
-.gallery__bottomButton_1wpb9 {
+.gallery__bottomButton_eqypj {
     width: calc(100% - var(--gap-32));
     margin: var(--gap-16);
     background-color: var(--color-static-neutral-translucent-500-inverted);
 }
-.gallery__subtitles_1wpb9 {
+.gallery__subtitles_eqypj {
     padding: var(--gap-0) var(--gap-32);
     margin-bottom: var(--gap-16);
     width: 100%;
@@ -68,6 +68,6 @@
         opacity 500ms ease-in-out,
         margin-bottom 270ms ease-in-out;
 }
-.gallery__hideSubtitles_1wpb9 {
+.gallery__hideSubtitles_eqypj {
     opacity: 0;
 }

package/esm/index.module.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import './index.css';
-var styles = {"container":"gallery__container_1wpb9","mobile":"gallery__mobile_1wpb9","modal":"gallery__modal_1wpb9","navigationVideo":"gallery__navigationVideo_1wpb9","hide":"gallery__hide_1wpb9","hideInfo":"gallery__hideInfo_1wpb9","bottomButton":"gallery__bottomButton_1wpb9"};
+var styles = {"container":"gallery__container_eqypj","mobile":"gallery__mobile_eqypj","modal":"gallery__modal_eqypj","navigationVideo":"gallery__navigationVideo_eqypj","hide":"gallery__hide_eqypj","hideInfo":"gallery__hideInfo_eqypj","bottomButton":"gallery__bottomButton_eqypj"};
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/index.css CHANGED Viewed

@@ -13,7 +13,7 @@
     --sat: env(safe-area-inset-top, var(--gap-0));
     --sab: env(safe-area-inset-bottom, var(--gap-0));
 }
-.gallery__container_1wpb9 {
+.gallery__container_eqypj {
     position: relative;
     overflow-x: hidden;
     overflow-y: auto;
@@ -27,17 +27,17 @@
     padding-top: var(--sat);
     padding-bottom: var(--sab);
 }
-.gallery__container_1wpb9.gallery__mobile_1wpb9 {
+.gallery__container_eqypj.gallery__mobile_eqypj {
         overflow: hidden;
     }
-.gallery__modal_1wpb9 {
+.gallery__modal_eqypj {
     flex-grow: 1;
     width: 100vw;
     height: 100vh;
     height: 100dvh;
     background: transparent;
 }
-.gallery__navigationVideo_1wpb9 {
+.gallery__navigationVideo_eqypj {
     z-index: 3;
     width: 100%;
     position: absolute;
@@ -46,18 +46,18 @@
     transition: transform 0.3s ease-in-out;
     text-align: center;
 }
-.gallery__hide_1wpb9 {
+.gallery__hide_eqypj {
     transform: translateY(114px);
 }
-.gallery__hideInfo_1wpb9 {
+.gallery__hideInfo_eqypj {
     transform: translateY(48px);
 }
-.gallery__bottomButton_1wpb9 {
+.gallery__bottomButton_eqypj {
     width: calc(100% - var(--gap-32));
     margin: var(--gap-16);
     background-color: var(--color-static-neutral-translucent-500-inverted);
 }
-.gallery__subtitles_1wpb9 {
+.gallery__subtitles_eqypj {
     padding: var(--gap-0) var(--gap-32);
     margin-bottom: var(--gap-16);
     width: 100%;
@@ -68,6 +68,6 @@
         opacity 500ms ease-in-out,
         margin-bottom 270ms ease-in-out;
 }
-.gallery__hideSubtitles_1wpb9 {
+.gallery__hideSubtitles_eqypj {
     opacity: 0;
 }

package/index.module.css.js CHANGED Viewed

@@ -2,7 +2,7 @@
 require('./index.css');
-var styles = {"container":"gallery__container_1wpb9","mobile":"gallery__mobile_1wpb9","modal":"gallery__modal_1wpb9","navigationVideo":"gallery__navigationVideo_1wpb9","hide":"gallery__hide_1wpb9","hideInfo":"gallery__hideInfo_1wpb9","bottomButton":"gallery__bottomButton_1wpb9"};
+var styles = {"container":"gallery__container_eqypj","mobile":"gallery__mobile_eqypj","modal":"gallery__modal_eqypj","navigationVideo":"gallery__navigationVideo_eqypj","hide":"gallery__hide_eqypj","hideInfo":"gallery__hideInfo_eqypj","bottomButton":"gallery__bottomButton_eqypj"};
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map