stream-chat-react-native-core 4.1.1-beta.1 → 4.1.2-beta.1

package/lib/commonjs/components/ImageGallery/ImageGallery.js

@@ -88,13 +88,15 @@ var ImageGallery = function ImageGallery(props) {
       imageGalleryGridHandleHeight = props.imageGalleryGridHandleHeight,
       imageGalleryGridSnapPoints = props.imageGalleryGridSnapPoints,
       numberOfImageGalleryGridColumns = props.numberOfImageGalleryGridColumns,
-      overlayOpacity = props.overlayOpacity,
-      visible = props.visible;
+      overlayOpacity = props.overlayOpacity;
 
   var _useTheme = (0, _ThemeContext.useTheme)(),
       _useTheme$theme = _useTheme.theme,
       white_snow = _useTheme$theme.colors.white_snow,
-      backgroundColor = _useTheme$theme.imageGallery.backgroundColor;
+      _useTheme$theme$image = _useTheme$theme.imageGallery,
+      backgroundColor = _useTheme$theme$image.backgroundColor,
+      pager = _useTheme$theme$image.pager,
+      slide = _useTheme$theme$image.slide;
 
   var _useState = (0, _react.useState)([]),
       _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
@@ -130,24 +132,22 @@ var ImageGallery = function ImageGallery(props) {
       setCurrentBottomSheetIndex = _useState4[1];
 
   var animatedBottomSheetIndex = (0, _reactNativeReanimated.useSharedValue)(0);
-  var showScreen = (0, _reactNativeReanimated.useSharedValue)(0);
+  var screenTranslateY = (0, _reactNativeReanimated.useSharedValue)(screenHeight);
 
-  var fadeScreen = function fadeScreen(show) {
+  var showScreen = function showScreen() {
     'worklet';
 
-    showScreen.value = (0, _reactNativeReanimated.withTiming)(show ? 1 : 0, {
+    screenTranslateY.value = (0, _reactNativeReanimated.withTiming)(0, {
       duration: 250,
       easing: _reactNativeReanimated.Easing.out(_reactNativeReanimated.Easing.ease)
     });
   };
 
   (0, _react.useEffect)(function () {
-    if (visible) {
-      _reactNative.Keyboard.dismiss();
-    }
+    _reactNative.Keyboard.dismiss();
 
-    fadeScreen(visible);
-  }, [visible]);
+    showScreen();
+  }, []);
 
   var _useState5 = (0, _react.useState)(screenHeight),
       _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
@@ -216,25 +216,6 @@ var ImageGallery = function ImageGallery(props) {
     offsetScale.value = 1;
   };
 
-  var resetVisibleValues = function resetVisibleValues() {
-    'worklet';
-
-    resetTouchValues();
-    resetMovementValues();
-    headerFooterVisible.value = 1;
-    offsetX.value = 0;
-    offsetY.value = 0;
-    adjustedFocalX.value = 0;
-    adjustedFocalY.value = 0;
-    tapX.value = 0;
-    tapY.value = 0;
-  };
-
-  (0, _react.useEffect)(function () {
-    if (!visible) {
-      resetVisibleValues();
-    }
-  }, [visible]);
   var photos = images.reduce(function (acc, cur) {
     var _cur$attachments;
 
@@ -376,7 +357,6 @@ var ImageGallery = function ImageGallery(props) {
             duration: 200,
             easing: _reactNativeReanimated.Easing.out(_reactNativeReanimated.Easing.ease)
           }, function () {
-            showScreen.value = 0;
             (0, _reactNativeReanimated.runOnJS)(setOverlay)('none');
           });
           scale.value = (0, _reactNativeReanimated.withTiming)(0.6, {
@@ -563,7 +543,7 @@ var ImageGallery = function ImageGallery(props) {
         translateX: translationX.value
       }]
     };
-  }, [visible]);
+  }, []);
   var containerBackground = (0, _reactNativeReanimated.useAnimatedStyle)(function () {
     return {
       backgroundColor: backgroundColor || white_snow,
@@ -572,9 +552,8 @@ var ImageGallery = function ImageGallery(props) {
   }, [headerFooterOpacity]);
   var showScreenStyle = (0, _reactNativeReanimated.useAnimatedStyle)(function () {
     return {
-      opacity: (0, _reactNativeReanimated.interpolate)(showScreen.value, [0, 0.01, 1], [0, 1, 1]),
       transform: [{
-        translateY: (0, _reactNativeReanimated.interpolate)(showScreen.value, [0, 1], [screenHeight, 0])
+        translateY: screenTranslateY.value
       }]
     };
   }, []);
@@ -598,12 +577,12 @@ var ImageGallery = function ImageGallery(props) {
   };
 
   return _react["default"].createElement(_reactNativeReanimated["default"].View, {
-    pointerEvents: visible ? 'auto' : 'none',
+    pointerEvents: 'auto',
     style: [_reactNative.StyleSheet.absoluteFillObject, showScreenStyle],
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1072,
+      lineNumber: 1042,
       columnNumber: 5
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -611,7 +590,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1076,
+      lineNumber: 1043,
       columnNumber: 7
     }
   }), _react["default"].createElement(_reactNativeGestureHandler.TapGestureHandler, {
@@ -623,7 +602,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1077,
+      lineNumber: 1044,
       columnNumber: 7
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -631,7 +610,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1084,
+      lineNumber: 1051,
       columnNumber: 9
     }
   }, _react["default"].createElement(_reactNativeGestureHandler.TapGestureHandler, {
@@ -645,7 +624,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1085,
+      lineNumber: 1052,
       columnNumber: 11
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -653,7 +632,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1094,
+      lineNumber: 1061,
       columnNumber: 13
     }
   }, _react["default"].createElement(_reactNativeGestureHandler.PinchGestureHandler, {
@@ -663,7 +642,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1095,
+      lineNumber: 1062,
       columnNumber: 15
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -671,7 +650,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1100,
+      lineNumber: 1067,
       columnNumber: 17
     }
   }, _react["default"].createElement(_reactNativeGestureHandler.PanGestureHandler, {
@@ -684,7 +663,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1101,
+      lineNumber: 1068,
       columnNumber: 19
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
@@ -692,11 +671,11 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1109,
+      lineNumber: 1076,
       columnNumber: 21
     }
   }, _react["default"].createElement(_reactNativeReanimated["default"].View, {
-    style: [styles.animatedContainer, pagerStyle, {
+    style: [styles.animatedContainer, pagerStyle, pager, {
       transform: [{
         scaleX: -1
       }, {
@@ -706,7 +685,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1110,
+      lineNumber: 1077,
       columnNumber: 23
     }
   }, photos.map(function (photo, i) {
@@ -720,17 +699,17 @@ var ImageGallery = function ImageGallery(props) {
       screenHeight: screenHeight,
       selected: selectedIndex === i,
       shouldRender: Math.abs(selectedIndex - i) < 4,
-      style: {
+      style: [{
         height: screenHeight * 8,
         marginRight: MARGIN,
         width: screenWidth * 8
-      },
+      }, slide],
       translateX: translateX,
       translateY: translateY,
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 1125,
+        lineNumber: 1093,
         columnNumber: 27
       }
     });
@@ -742,7 +721,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1153,
+      lineNumber: 1124,
       columnNumber: 7
     }
   })), _react["default"].createElement(_ImageGalleryFooter.ImageGalleryFooter, (0, _extends2["default"])({
@@ -756,7 +735,7 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1159,
+      lineNumber: 1130,
       columnNumber: 7
     }
   })), _react["default"].createElement(_ImageGalleryOverlay.ImageGalleryOverlay, {
@@ -766,14 +745,14 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1168,
+      lineNumber: 1139,
       columnNumber: 7
     }
   }), _react["default"].createElement(_bottomSheet.BottomSheetModalProvider, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1173,
+      lineNumber: 1144,
       columnNumber: 7
     }
   }, _react["default"].createElement(_bottomSheet.BottomSheetModal, {
@@ -786,7 +765,7 @@ var ImageGallery = function ImageGallery(props) {
         __self: _this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 1178,
+          lineNumber: 1149,
           columnNumber: 13
         }
       }));
@@ -801,20 +780,19 @@ var ImageGallery = function ImageGallery(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1174,
+      lineNumber: 1145,
       columnNumber: 9
     }
   }, _react["default"].createElement(_ImageGrid.ImageGrid, (0, _extends2["default"])({
     closeGridView: closeGridView,
     numberOfImageGalleryGridColumns: numberOfImageGalleryGridColumns,
     photos: gridPhotos,
-    resetVisibleValues: resetVisibleValues,
     setImage: setImage
   }, imageGalleryCustomComponents == null ? void 0 : imageGalleryCustomComponents.grid, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1189,
+      lineNumber: 1160,
       columnNumber: 11
     }
   })))));